Role: Lead Designer, Brand Management, User Interface Design, Product Design
Tool Used: Figma
Pfizer-BioNTech needed an unbranded CRM sign up form that would capture the interest of patients who were were interested in receiving updates on recent information.
Something to be solved.
The Experience Design team was asked to create an unbranded Sign Up Form. The given the potential high traffic to the site, the team UX designer and myself explored a design option that would create the best mobile experience for users while limiting the amount of survey bloat so that we could ensure the client would receive the most accurate data results.
A scaled, step-by-step, process was chosen to solve for any potential roadblocks in the user journey. Having the form content broken into sections allows for important information and other content in layout to be more consumable and limits user frustration and drop-off.
Single Column Pattern
To offer the clearest path to completion for users the CRM form was designed in a single column. This design approach would decrease the risk of users missing important information.
Form fields and labels were sized to the expected user input in order to hint towards what action is expected. As a solution for site user that may have visual impairments or prefer navigating through the "tab" button, the input labels were written to descriptive the action that will be taken after selection.
Descriptive error messages were created to help the user fix any mistake. Icons were also used in conjunction with the error message as a clue for color blind users to use in addition to decreasing frustration for those engaging with the site.
A progress tracker was included in the design of the sign up form as a way to guide users through, what could be, a complex process. Allowing users to know where they are in the process would allow the user flow to be easy and intuitive. To prevent any misguidance and keeps users informed on where they are on the completion path, the brand's blue color option highlights previous sections completed of currently being visited by the site user.
In collaboration with the UX architect, the team conducted remote and unmoderated testing on each mobile and desktop view. Responses were gathered from 40 users on each platform; a total of 80 people.
The goals for user testing was to...
• explore whether the users understood the options presented
• identify willingness to give information
• understand whether users would like to receive additional information
◆ ◆ ◆
More Case Studies...