Converted users with a newly designed onboarding experience

Drink Perfect was an early-stage startup which offered exclusive discounts at local bars and restaurants through their mobile “happy hour app”. It was previously designed by their founder and had already launched, but they had trouble getting new users. The founder wanted the app redesigned because he thought it was a UI issue, so asked me to help. I led and collaborated with a junior designer to conduct user testing of the existing app and discovered that it was actually a UX problem. As a result, we iterated on the redesign of the onboarding flow, which made a significant increase in user conversion.
Role:
Team:
2 Product Designers
1 Founder
IC Product Designer
Platform:
Mobile App
Tools:
Figma
Zoom

Users appreciated more context and the ability to explore with the redesign

Final validation testing was conducted with 6 potential users, either in person or remotely via video chat. There were 3 main areas we focused on to improve the redesign of the onboarding: sign-up, premium info, and discount redemption. By providing more context and information, this helped users to move smoothly and confidently through the app. The before-and-after results speak for themselves (pictured above).

Diagrammed the user flow of the existing app to guide discussions

To start the project, the junior designer and I downloaded the app onto our phones, created a new account, and explored it like a new user. Our goal was to understand how the product worked, how the app flowed, note questions for the founder, empathize with the user, and identify user pain points.
After exploring the apps individually, we met to discuss our findings. To make sure that we were talking about the same things, we diagrammed the user flow of the existing app (as pictured above). This made it easier to help guide our discussion, ensure that our redesign would flow cohesively with the existing app, and determine how to conduct user testing with the existing app.

User tested the existing app with 6 potential users

Next, we conducted user testing of the existing app to set a baseline and help us guide our redesign. We believed it was quicker to improve on it, rather than starting from zero, and it helped us understand what would best improve user conversion. The founder didn’t want us to contact actual users, nor did we have a budget, so we did the next best thing: asked our friends whom we believed were potential users. 
For user testing, we conducted a hybrid test in which we allowed users to freely explore the app as a new user and asked open-ended questions. Our goal was to observe and hear directly from the user without bias. We started by asking basic questions to get users comfortable speaking out loud:
  • What food or drink apps do you currently use?
  • Where do you find these food and drink apps?
  • What makes you want to download the app?
Then we asked the user to imagine and walk through the steps of downloading the Drink Perfect app. From there, we handed them our phone with the pre-downloaded app, asked them to explore the app as a new user, and to talk through their thinking process. Only when they got stuck, did we ask open-ended tasks to be able to observe their thoughts and actions through the entire onboarding flow.
  • How would you create an account?
  • What makes you want to download the app?
  • How would you redeem a discount?

Discovered it was a UX problem, not a UI problem

In conducting the user testing, we found that the problem was not necessarily a UI problem but a UX problem. We identified 3 areas that caused user friction and to which we focused our redesign:
  1. Sign up - 0 out of 6 users created an account within 10 seconds. In other words, every user failed to sign up, because they confused the login screen (the first screen presented in the app)  with the sign up screen.
  2. Premium info - 2 out of 6 users signed up for a free trial. Users were not convinced nor trusted the app to sign up for a premium account, even with the free trial.
  3. Discount redemption - 0 out of 6 users redeemed a discount. Every user got stuck in a cycle of trying to redeem a discount, got frustrated, and gave up. They didn’t know that they needed to become a premium member.

Iterated designs based on feedback from design reviews and user testing

Next, we moved into the ideation and design phase. We went through many design iterations using feedback from our group design reviews and user testing.

Designed and presented the "Sign Up" screen first to new users

In the redesign, we presented the "Sign Up" screen first to new users, so that they would immediately create an account. Parts of the UI were redesigned to be open and inviting, like the white background and single-line field. Additionally, we improved the copy so that it was concise.

Showcased Design Progression

Designed a premium feel, explained benefits, and allowed app exploration

We designed a more premium-feeling, neutral illustration that’s more representative of the app which included both food and drinks. The copy was expanded with more information to explain the benefits, designed relevant icons and grouped bullet points to help users quickly scan. Users were now allowed to skip the premium subscription briefly and jump directly into the app to explore it.

Showcased Design Progression

Designed timely context to explain how to redeem a discount, exclusive to premium members

While the “Premium Benefits” explained that only premium members could redeem a discount, it’s reiterated in context while a user is exploring menu items in the app. We introduced a pop-up modal which provided timely context, which explained that to claim the deal, they must upgrade to premium. Then gave the user another chance to sign up for the premium account, which again includes details to all of the benefits and highlights the free trial to improve conversion.

Showcased Design Progression

New users were happy to join with the redesigned onboarding flow

New users wanted to browse and explore the app, often clicking through different sections. The design changes focused on context and ease of navigation, so the redesign helped users flow through the app and want to become premium members.

Next Case Study

Back to Top