Create two design options to increase the conversion rate for the create account flow
Project Overview
I worked with a fellow design intern to create two design options that explored how to reduce the number of user drop-offs on The Pill Club's Create Account page. We each came up with a user flow that incorporated branding and usability improvements. I was responsible for conducting a competitive analysis, a UX review of our existing “create account” flow, and development of a high-fidelity interactive prototype using Figma.
Problem Space
Based on user observations conducted through FullStory, we found that several customers were leaving the create account flow to navigate over to our brand's page.
Hypothesis
By informing users before they go into the flow of what they can do and by mentioning our brand selection, we can...
- Reduce the concerns users have and build trust with them before entering the flow
- Increase the conversion rate for “create account”
Review of The Pill Club UX
First, my team reviewed the current “create account” page and listed a couple of pain points that we identified to support our design process. This is what we observed in product as of 8/13/21
→ Current create account has one visual aid (hand emoji)
→ Colors are mostly greyscale and nothing particularly stands out
→ Multiple input fields can increase cognitive load
→ Users are told that their information will be stored, but not enough trust is created between the company and the consumer
Competitive Analysis
Our team identified a few direct and indirect competitors. We analyzed these companies' onboarding flows and noted a few key insights from each user experience.
SIMPLE HEALTH
- A new question appears after completion of the previous input
- Sign up completion after telemed questions
HERS
- Modal with list of brands eliminates the need to click out of the onboarding flow
- Eligibility questions are spaced out
CUROLOGY
- Use product images on create account page
- Conversational language is used throughout the copy on create account screens
User Flow
After completing the competitive analysis, our team moved on to thinking through possible “create account” user flows. We mapped out two different flows to go through A/B testing. Here is a diagram of the user flow I worked on for my solution:
Solution
The solution's aim is to make the “create account” process more seamless and intuitive for users. We decided to tackle this by spreading out the screens to ease the cognitive load for the user. With this flow, the user can focus on one task at a time like the phone entry, zip code, and a separate brand page. In this solution, we also incorporate branding early on to engage the user and establish reputability by showing that we are FDA approved. These were the three main features incorporated in my solution.
BRANDING PAGE
The branding page eases the user into the flow. Presenting a brand page prevents the user from feeling overwhelmed by having to provide their information right away. The purpose of this page is to foster brand attachment early, which we hypothesize would improve conversion on the “create account” page.
MODAL COMPONENT
The modal presents a centralized way to show our birth control brands within the flow. Users can easily click out to continue through the funnel.
DOCTOR CHAT BUBBLE
The chat bubble graphic provides transparency and context for our users. The copy inside the chat bubble explains more clearly to the user where their phone number is going and why we collect this information. The image of the doctor establishes trust through presenting a face to familiarize patients with the brand and those that work at the Pill Club.
Outcomes
The current design in product as of 11/29/21 for the “create account flow”. A/B testing is still in the process of being conducted for the flow that I designed. The end goal of the redesign is to space out the signup process and to incorporate more branded elements early on in the flow to increase customer attachment.
Takeaways
This project was a great learning experience because I was able to work collaboratively with a fellow intern but also worked on aspects of the project by myself. I was exposed to UX research methods and practices and learned how to design for A/B testing.
What I Learned
- Design options should be distinctive from each other for the purpose of an A/B test
- Document everything and take notes at every step of the design process
- Take a step back and remind yourself that you're designing for the user
→ My teammate and I had to frequently discuss our design approaches with each other so that our designs didn't overlap. That way we could properly test and compare different user flows.
→ We had to prepare our design files to make sure they were ready to hand over to engineers and to do that we had to arrange the Figma file so that anyone from the team could understand our thought process and the functions for different features that we designed.
→ Because this project was given to us with business requirements, at times we had to pull back and remember that the user's concerns also needed to be prioritized in our design thinking.