Don’t judge a book by its cover! That quote is often heard, but we still do that. We naturally see the cover first, leading to our first impression. In the app, after we decide to install, we see the onboarding page first before all. Therefore, this onboarding page is very important. Being the first thing that appears, they must have a “wow” effect but inform the user of the key features enough and tell them how to navigate, making it easier to use the app and reducing frustration.

So, my goal here is to make a great first impression and set the vibe for the whole user experience with onboarding. Good onboarding engages users right away, shows the app’s value, and increases the chances they will keep using it. It also collects important user data for personalization and explains privacy policies and security measures, building trust. In short, a good onboarding experience is essential for a positive and engaging introduction to an app or website.

Previously, Liputan6 faced a problem where users directly uninstalled the app after downloading, and the number was quite significant. What was the issue? Let’s look at the onboarding process at that time.

old version onboarding

How I reviewed this old onboarding:

1. The colors are very contrasting,

2. There is no skip button at the beginning, so the user has to click continue until the end before they can proceed to the login step or skip

3. The wording is too long, making it not easy to scan. The user has to invest time to stop and read

4. The navigation is not direct and clear, what does it mean

5. there is no button hierarchy, there is no color difference between the start button and the later button which will make it difficult for the user to determine which decision is better to choose or which one makes it easier for the user to access the app faster

How I revamp the onboarding:

1. Discussion with the team on which key features will be displayed

2. Set the illustrations to be used, because we have previously decided on the illustration kit, it will be easier to just add icons or components that depict the features available in the app.

3. Set the next navigation and placement of the skip button

4. Start crafting