
Framer Project Brief: 2-Step Interactive Review Funnel
- or -
Post a project like this£80(approx. $107)
- Posted:
- Proposals: 11
- Remote
- #4412660
- Expired
♛ Most Trusted #1 Team |19+ years of expertise in Website, Mobile Apps, Desktop & Console Games. Wordpress, ReactJS, Shopify, Laravel, Python, React Native, Flutter, Unity, Unreal Engine and AR/VR




⭐ TOP CERT Graphic Designer ⭐| Expert 2D/3D Render | Video Animator | Web Developer |Logo Designer |Graphic Animations | Video Editor ||Illustration.

122165951209823612834212095091120978432499006948732412291526105831141041024011822128





Description
Experience Level: Expert
Project Brief: 2-Step Interactive Review Funnel
Project Goal:
To build a 2-step interactive funnel on a single Framer page. The goal is to guide a user through leaving feedback and then present them with options to post that feedback on Google and claim their coupon reward. The transition between the two steps should be smooth.
Key Technology:
This will be built in Framer, using its interactive component capabilities to manage the two views.
Visual Reference
Please use the approved design mockups for all styling, colors, and layout decisions for both steps of the process.
Functional Breakdown: The 2 Steps
The entire funnel will be managed by showing and hiding two main views or "steps" on a single page.
Step 1: The Feedback Hub View
Initial State: This is the first view the user sees on page load. It should display:
The headline (Leave a quick review...)
The sub-headline (First, how was your visit?)
The five interactive stars.
Interaction Logic:
When a user clicks on any star, the section containing the textarea (comment box) and the Submit Feedback & Continue button must appear with a smooth animation (e.g., "fade in" or "slide down").
The textarea should be empty, ready for user input.
Data Capture:
The text the user types into the textarea must be stored in a variable so it can be used in the next step.
Action:
When the user clicks the Submit Feedback & Continue button, the system must hide this "Step 1" view and show the "Step 2" view.
Step 2: The Amplify & Reward View
Initial State: This view is hidden until the user submits Step 1. This is the final screen.
Displaying the User's Comment:
The "review preview" text box on this page must dynamically display the text that was captured from the textarea in Step 1.
Button Functionality:
Step 1: Copy My Review Button:
This button must trigger a "Copy to Clipboard" action.
It should copy the stored user comment (from the variable) to the device's clipboard.
UX Feedback: After clicking, the button text should change to "Copied!" for 2 seconds, then revert back to the original text.
Step 2: Share on Google Button:
This is a simple link button. It must open the business's Google review page URL in a new browser tab.
Claim My Coupon Button:
This is also a simple link button. It will link directly to the coupon registration page URL that will be provided. It can open in the same tab or a new tab, as preferred.
Project Goal:
To build a 2-step interactive funnel on a single Framer page. The goal is to guide a user through leaving feedback and then present them with options to post that feedback on Google and claim their coupon reward. The transition between the two steps should be smooth.
Key Technology:
This will be built in Framer, using its interactive component capabilities to manage the two views.
Visual Reference
Please use the approved design mockups for all styling, colors, and layout decisions for both steps of the process.
Functional Breakdown: The 2 Steps
The entire funnel will be managed by showing and hiding two main views or "steps" on a single page.
Step 1: The Feedback Hub View
Initial State: This is the first view the user sees on page load. It should display:
The headline (Leave a quick review...)
The sub-headline (First, how was your visit?)
The five interactive stars.
Interaction Logic:
When a user clicks on any star, the section containing the textarea (comment box) and the Submit Feedback & Continue button must appear with a smooth animation (e.g., "fade in" or "slide down").
The textarea should be empty, ready for user input.
Data Capture:
The text the user types into the textarea must be stored in a variable so it can be used in the next step.
Action:
When the user clicks the Submit Feedback & Continue button, the system must hide this "Step 1" view and show the "Step 2" view.
Step 2: The Amplify & Reward View
Initial State: This view is hidden until the user submits Step 1. This is the final screen.
Displaying the User's Comment:
The "review preview" text box on this page must dynamically display the text that was captured from the textarea in Step 1.
Button Functionality:
Step 1: Copy My Review Button:
This button must trigger a "Copy to Clipboard" action.
It should copy the stored user comment (from the variable) to the device's clipboard.
UX Feedback: After clicking, the button text should change to "Copied!" for 2 seconds, then revert back to the original text.
Step 2: Share on Google Button:
This is a simple link button. It must open the business's Google review page URL in a new browser tab.
Claim My Coupon Button:
This is also a simple link button. It will link directly to the coupon registration page URL that will be provided. It can open in the same tab or a new tab, as preferred.

Michael F.
99% (72)Projects Completed
54
Freelancers worked with
28
Projects awarded
13%
Last project
7 Sep 2023
United Kingdom
New Proposal
Login to your account and send a proposal now to get this project.
Log inClarification Board Ask a Question
-
Hi Michael,
Here are a few questions:
+ Can you please provide the approved design mockups?
+ What is the Google review URL?
+ What is the coupon link URL?
+ Should the coupon link open in the same tab or a new tab?
Thank you!
1136763
We collect cookies to enable the proper functioning and security of our website, and to enhance your experience. By clicking on 'Accept All Cookies', you consent to the use of these cookies. You can change your 'Cookies Settings' at any time. For more information, please read ourCookie Policy
Cookie Settings
Accept All Cookies