Background
We are tracking the current onboarding and registration for new BAEMIN Users, we found out that there was a drop off of about 10% users at the first screen, which means after installing the app, users open app, see the first screen and then quit app.
The previous designs of BAEMIN onboarding flow when users dropped looks like this:
The 10% drop rate is not a big number to some stakeholders. But for some, it's quite significant. That's is the reason that I, as the designer also take this issue into consideration for improvement.
Conversion rate
Overall conversion rate from installed app to finish setting up an account is not high: only 60% to under 70% of users completed the onboarding and registration flow
Returning Users
For returning users who forgot their password, the forgot password recovery flow is not good, with around 25% users could not reset their password and quit using BAEMIN afterwards.
Heuristic Review
We've conduct a heuristic review of the current UI of registration steps, and it is considered to be low contrast and hard to read
Objectives and Goals
What we want to achieve:
- To improve the usability and heuristic of the current UI design
- To reduce (or remove) the drop rate at the first step. We want user to proceed to registration instead of dropping at the first screen
- Maintain the current Conversion rate for Registration Successfully
- Improve Recover Password rate
We've set up some key metrics:
- We will track this goal from the NPS/CSAT survey
- Reduce drop rates from 10 to 7%
- Maintain the current Conversion rate for Registration Successfully around 70%
- Improve Recover Password rate: right now drop rate is 25%, we want to reduce it to 15%
Competitive analysis
I did what we usually call "desk research"
The previous BAEMIN registration and onboarding flow:
When looking at this previous flow, there were 2 parts: the onboarding and the registration.
Where as the onboarding we tried to ask for user permission for Location and Notification, and not just asking, we also explain to users why we need these permissions.
Then for the registration, we let users go through the Phone number, OTP verification, Name, Set Password, Email and one additional step for App tracking permission for iOS. Finally users would land on the homescreen.
If we take a closer look at the first landing screen where users drops:
Our current design does not show a clear CTA or what we offer (the Tittle text does not say clearly what we have, it is said in the smaller text and users may not read this).
The first screen also have quite many elements that may confuse users as well
Let's have a look at others
Apps that are operating in Vietnam:
Now
Step 1:
Location Permission
Step 2:
Notification Permission
Step 3 (for iOS):
App tracking Permission
Step 4:
Finally get to homescreen
But yet another promotion popup
Grab
Step 1:
Registration options
Step 2:
Registration: OTP verification
Step 3:
Location Permission
Step 4:
Notification permission
Already at home screen
Gojek
Step 1:
Location Permission
Appears right on the registration options
Step 2:
Registration step, all fields combined
Step 3:
Registration: OTP verification
Step 4:
Notification options
Already at home screen
So how about apps that are not operating in Vietnam?
Deliveroo
Step 1:
Just a landing screen to welcome users
Step 2:
Explains why asking for location permission
Step 3:
Default popup for permission
Uber Eats
Step 1:
Yet another welcome screen
Step 2:
Registration with phone number
Step 3:
Continue with OTP Verification
Step 4:
Explain why asking for location access
Solution
Reverting the flow
Instead of asking for permission, BAEMIN should let user do the registration first
As you can see, I decided to not change any step inside the registration for this phase. Since we intend to not do any kind of user testing but rather to roll out patch by patch, so we keep all the steps in the previous flow, we can always make improvement later.
Then we ask for the needed permission as before
What did I change in the UI?
I decided to change the brand mint background, even though it is the brand color, but in registration, we need the design to be clear and easy to navigate. Additionally, white and small text on mint background is low contrast and hard to read as well
See the prototype here
Results for first phase
Release plan
To better tracking the results, we slowly roll out the new design:
- only 1 week for iOS
- slowly release by 10%, 30%, 50% and 100% each week for Android
Our Achievement
Our Key metrics
- Registration Successfully Conversion Rate:
Increasing from 70% to 78%
- Quit app after first screen:
From 10% drop rate to ~5% drop rate
- Improve Password Recovery by reducing drop rate:
From 25% to 10%
Other achievements
Some problems
More users dropped when they were asked for email in the iphone, comparing to android → We need to consider removing email step
More users denied location permission in iOS than before → need more in depth review, or research
Lesson Learned
Design process is important. However, in many cases, we can skip some parts of the process (research, testing) by making sure that we did the best out of the other parts. In this case, the in depth review and competitor analysis, to figure out the pattern and usual behaviors of users.
Rolling out in patches can also help you to test the water. But do it with careful measurement and tracking. Otherwise, just conduct Usability test.