Seduction at first glance: onboarding app design

Reading time: 7 minutes

The importance of onboarding app design

Nowadays, to get your users to sign up in your application is not something easy. This post that deals with onboarding app design, Andrew Cheng comments that 80 % of those who find the login page as soon as they open the application, abandon the app before the registration because they feel forced to create an account before testing it (or at least part of it). In another study by Cheng, the percentage of user abandonment in the first 3 days after installing an app is 77 %. For this reason, a lot of effort is invested not only in user downloads or registrations, but also in get recurring users.

Designers will try to show user from the beginning that the application will have value, will be easy to use, that he/she will have a good experience using it and its design and interaction will be attractive.

A widely used resource to improve the experience of introducing the app from minute 0 and guide user to the registration process, is to start with an onboarding. Let’s see everything related to the onboarding app design!

 

What is an onboarding?

It is like the business card for our company, the stairway to our palace or the entrance where we get the first impression to our guest.

It is a process through new users are led to the goal set by the designer (such as registration, product consumption, or merely use the app). Therefore it is very important that before starting with the design we plan the purpose of our onboarding app design and the tactics that we will use.

We must keep in mind that users should not feel pressured or they could leave the app. Otherwise, if they have a positive experience, the user will successfully achieve our goal and we will also improve the retention rate of our application.

To achieve our goal, the onboarding app design should seduce user by showing him how useful the app is, how easy is to handle it and the good results we get from it.

Also in this process we have the chance to get feedback from user and customize the content of the app with his tastes and needs. It is also a good opportunity to ask permits such the camera, micro, location, etc. Therefore, we must be very careful and show up everything properly. All the details are important, from the tone used, the colors, the images, the number of steps, the copy… there is a lot of information to keep in mind but we will see it little by little!

 

What kind of onboardings exist?

We could say that there are two types of onboarding, with static or dynamic screens. The static views are composed with images or illustrations and the dynamics one with videos or animations. All of them are show up with texts explaining the functionalities or steps to follow.

 

What purposes could the onboardings have?

We have slightly commented above what objectives are mostly used in onboardings but we going to see now four examples that clearly focus in their mission:

 

To show up content according to our user’s preferences

These onboardings are the ones that during the process ask users about their preferences to show personalized content. Thus, the feedback received is appropriate to their needs. Let’s see GasAll app.

This app locates the gas stations near user or within an introduced route to show them ordered by price or distance. This onboarding asks user some questions to configure the parameters and show the personalized information, such as:

  • Access your location: to show the gas stations around you.
  • Type of fuel in your vehicle: to show prices of your type of fuel.
  • Capacity of your deposit: because Gasall calculates how much it cost to fill the deposit in each gas station, it helps you to compare.
  • Fuel consumption: it calculates how much the vehicle would consume to get the service station.
  • Accept notifications: to receive discounts from nearby gas stations.

To inform user about the app or an specific task

Tutorial type onboarding, depending of the goal, can vary from explaining how the application works, describing its functionalities, or showing the steps to follow to perform a task.

For instance BBN. This is an app that allows health and beauty professionals to be in contact with users who need some home delivery services. This onboarding inform users how to request a service and also asks for permits notifications. It is organized in this way:

  • First a welcome plus a description of what is the app, just in a view.
  • In three steps it explains how to select a service, how to submit a proposal and how to select a professional for the service.
  • The last view asks to accept notifications to know when the professionals accept the requests.

 

To expedite user registration process

An easier way to guide user to the registration page would be to conquering him little by little through questions about his personal preferences during the onboarding. See below an example with several goals mixed.

Kidü is an app to guide parents for educate their children. It offers tips, courses, games to do with your kids, etc.

  • In the first screens it shows what you can do in the application: Learn, play and take care (tutorial screens):
  • In the second row we find the views that ask you about your role with the child, your personal data, and information about your children (registration + user preferences).
  • In the third row we see the screens that show you where to find the content of the application and the option to invite other users to connect (tutorial + refer application).
  • And the last views inform you why you will need the push notifications and ask you its permit.

 

Onboarding with personalized welcome

If the app has been shared by a friend, it is possible to create an exclusive welcome view showing you such friend (with his name and profile picture). It has been shown that more than 75% of users with this personalized welcome view continue with the registration process. This screen makes your experience more enjoyable and makes you more active and satisfied. It provides trust and a social proof that your friend is using the application. These links for share the app are called deep links and there are tools that can provide them you, such as Branch. Let’s see two examples:

  • The first example is a bit more complex, it shows the profile picture and the name of your friend. Also, it recommends you to sign up in order to share your favorite places with your friend.
  • In the second one it only mentions your friend’s name but also prompts the registration so both can earn points.

 

But should all the apps have an onboarding?

Not actually. There are applications that because of its simplicity, onboarding would not be necessary, moreover, it would be a waste of time for users to go through these screens.

However, if users do not understand the concept of an application or its key features in the first use, they will not return. A rational way to define when to use onboarding would be:

  • The application is empty of content and requires user input for the first use.
  • The application requires the input of user needs for the experience.
  • The application has complex functionalities.
  • The application needs to teach user fundamental new gestures for a proper use.
  • The application was updated with new features.

 

How can I make my onboarding app design effective?

Onboarding app design tips – There are many details to keep in mind when you going to design it. We going to see a couple of tips:

1- Set a goal.

All onboarding must fulfill an objective. Some onboardings can be didactic others focused on conversion or maybe collect some information about user. Each app is a world and each one has its own goals.

2- Few steps, only the necessary ones.

It is recommended not to make it very extensive, between 2 and 5 steps (maximum). It is important not to get user bored so you just have to tell the essentials in concise way. Descriptions should be short and only one action per view.

3- Show how many steps the onboarding has.

If your onboarding has more than two steps, inform user about it. It improves the user experience when you know how long this process will take. Show a pager or X steps of Y.

4- Make it fun.

Whether static or dynamic, it always shows images, illustrations or animations. It is proven that users like more the dynamic ones. Use bright colors and always show the most important features at the beginning.

5- Just ask for permissions if it is necessary.

Many applications require access to user data, open the gallery, use the camera, the location, etc for a better experience using the app. It is required to request users the permits.

When certain data is essential for the key functionality of the application, be sure to request the access. However, it is very important not to bombard users with permission requests at the beginning of the app. Many users leave the application after discovering how many personal information the application requests. It is normal to generate distrust with a lot of permits at the same time or without explaining the reasons.

The best way to prevent users from getting nervous is to asking for the essential permissions to continue handling the application at the beginning (always explaining why) and leave the rest of the secondary permissions for later, when users are more committed to the application and these permissions are needed to perform the action in that moment.

6- Give the option to skip the onboarding.

You must permit users to skip the onboarding. Majority they are impatient and prefer to navigate theirselves to discover the app. They could be also an old user so they won’t need your explanations. Add a Skip button on each screen except the last one.

 

And … How do I know if my onboarding is being effective?

For this reason we recommend you to measure the user’s behavior during the onboarding. With the results you can see if users are interested on it or not. To study if the onboarding really works we should measure the following:

  • Percentage of users who complete the onboarding..
  • Percentage of users who choose to skip onboarding.
  • Average time used in each view.

You must use analytics from day one to improve the onboarding experience and increase the percentage of user retention. If you discover that the flow is not working, remove it, redesign it again or consider yourself if it is really necessary for users.

 

Conclusion

It is very important that before we start designing the onboarding we set a goal to not lose focus. The flow must be brief, enjoyable and it should add value to the app. In addition, the user must know how many steps it has and the option to skip it if he wishes. If we get a positive experience, user will return and we will improve the retention rate of our app. In the other hand, if our onboarding is not effective, the user will not return and probably will abandon it forever … To know if it is being effective always measure it and contrast statistics!

 

If you liked this post about onboarding app design, you maybe like this one which can help you to define a good copy in your onboarding.

Thank you!

Blog

Other articles