Revamping the Registration and Onboarding flow without UX research and User Testing

Revamping the Registration and Onboarding flow without UX research and User Testing

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:

image

10 percent of users dropped after the first welcome screen
10 percent of users dropped after the first welcome screen

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

image

Objectives and Goals

What we want to achieve:

  1. To improve the usability and heuristic of the current UI design
  2. 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
  3. Maintain the current Conversion rate for Registration Successfully
  4. Improve Recover Password rate

We've set up some key metrics:

  1. We will track this goal from the NPS/CSAT survey
  2. Reduce drop rates from 10 to 7%
  3. Maintain the current Conversion rate for Registration Successfully around 70%
  4. Improve Recover Password rate: right now drop rate is 25%, we want to reduce it to 15%

💭

About the design process: Usually the design process is: doing some user researches first then come up with the design solution. However for this project at the time I handled it, there was no resource for user research. We decided to do some "expert reviews" and "competitors analysis", then provide a solution based mostly on our experience. After that we rolled out by patches of users (30%, 50%, 70% and 100%) to track any problems or issues.

Competitive analysis

I did what we usually call "desk research"

The previous BAEMIN registration and onboarding flow:

image

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

image

Let's have a look at others

Apps that are operating in Vietnam:

Now

Step 1:

Location Permission

image

Step 2:

Notification Permission

image

Step 3 (for iOS):

App tracking Permission

image

Step 4:

Finally get to homescreen

image

But yet another promotion popup

Grab

Step 1:

Registration options

image

Step 2:

Registration: OTP verification

image

Step 3:

Location Permission

image

Step 4:

Notification permission

image

Already at home screen

Gojek

Step 1:

Location Permission

image

Appears right on the registration options

Step 2:

Registration step, all fields combined

image

Step 3:

Registration: OTP verification

image

Step 4:

Notification options

image

Already at home screen

🤔

Most apps in Vietnam don't explain why they need the permission, and most of the time the way they asked for it is intruding by using popups.

So how about apps that are not operating in Vietnam?

Deliveroo

Step 1:

Just a landing screen to welcome users

image

Step 2:

Explains why asking for location permission

image

Step 3:

Default popup for permission

image

Uber Eats

Step 1:

Yet another welcome screen

image

Step 2:

Registration with phone number

image

Step 3:

Continue with OTP Verification

image

Step 4:

Explain why asking for location access

image

🤔

Without further showing the next steps, we can clearly see that apps that are operating outside of Vietnam have the different approach: they tend to be more patient in explaining and welcoming users first open their apps.

💡

This is similar with the BAEMIN onboarding flow, where we were trying to explain why we need any certain permission

image

Solution

💡

I understand that the previous flow of BAEMIN was following some practices from other apps that are not operating in Vietnam. However, most users in Vietnam are well trained and familiar with the experience of other apss (Now, Grab, Gojek). BAEMIN should change this practice

Reverting the flow

Instead of asking for permission, BAEMIN should let user do the registration first

image

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

image

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

image

image

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

  1. Registration Successfully Conversion Rate:
  2. Increasing from 70% to 78%

image

  1. Quit app after first screen:
  2. From 10% drop rate to ~5% drop rate

  1. Improve Password Recovery by reducing drop rate:
  2. From 25% to 10%

Other achievements

We got more users signed up +20% new users comparing to previous version

image

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.