Insider Onboarding

ILLUSTRATION • MOTION DESIGN • UI DESIGN

One of the most recent things I worked on at Insider was redoing the onboarding for the consumer apps. Over the last year, Insider has evolved considerably in its value proposition and the app onboarding needed to reflect the product offering in the best way possible.

INTRODUCTION

Onboarding is a critical step in setting users up for success with your app, because good onboarding increases the likelihood that first-time users become full-time users.

Some stats that prove how crucial a product's onboarding experience can be:
One in four mobile apps are abandoned after the first launch. (source)
77% of users drop an app just 72 hours after download. (source)
72% of users say completing the app onboarding process in less than a minute is an important factor in their decision to keep using an app. (source)
 

Because more than 20% of users who download an app only use it once, it’s important to design an engaging onboarding process that encourages them to return to your app again. Insider underwent some significant changes in its product offering over the past year and it was necessary for the onboarding to reflect them. 

OLD ONBOARDING

old screens

WHY A CHANGE WAS NEEDED

1. Stay In was retired: Stay In was deemed as the go-to place on the app to discover content (movies, books, music etc.) to consume while being in the comfort of your home. As the product evolved to lean more towards the idea of getting out and doing things, the focus shifted towards helping the user discover and explore things to do in your city based on his/her interests. 

2. Change in the visual style: The tone of the graphics changed focus from objects to people as did the visual style in the way the graphics manifested. Thus, the onboarding needed to reflect Insider's personality and the duotones didn't fit anymore. 

3. Need to simplify: We felt the need to reduce the number of screens to make the onboarding experience as frictionless as possible. The idea was to have a focused set of screens by following a simple rule: “show less, provide more.”

4. Account setup approach: With the introduction of new features like distance (sorting events by proximity), it was necessary to ask the user to enable location permissions. Also, with the introduction of favourites (bookmarking an event you're interested in) that required the user to be logged in, we decided to prompt the login/signup screen at the end of the onboarding with an option to skip. Thus, the onboarding saw a shift from the 'benefits approach' to a combination approach of benefits and account setup to simplify the user's experience while using the app later.

USER FLOW

userflow

WIREFRAMES

wireframe

TOOLS USED

• Adobe Illustrator 
• Adobe AfterEffects
• Lottie by Airbnb
• Sketch 

SCREENS

0
3
6
1
4
7
2
5
8

ANIMATION EXPLORATIONS

3
1
2

FINAL ANIMATION & ONBOARDING

Other projects

NH7 Weekender AppMobile App Design

Asian Paints Book DesignPublication Design

Icon Usability TestingDesign Research

Eye Tracking Interface for ALS PatientsHuman Computer Interaction

Project MudraVisual Design

© Apoorva Savant 2018