Pregnancy+ Onboarding

We had an issue at Philips where we were getting huge numbers of downloads for the Pregnancy+ app on both iOS and Android but conversions from guest to registered users were really low despite it being free to register and the additional features that came with signing up for an account.

We needed to address this so decided to create a step-by-step onboarding process that not only explained to users how the app worked, customised it to their preferences but also got them to register and unlock the full potential of the app.

My Design Process

Here is a brief summary of my design process for the Pregnancy+ app onboarding.

The Pregnancy+ app was designed in Sketch and we had created an extensive design system using the Atomic Design Structure enabling us to conceptulise, prototype and test high fidelity assets really quickly.

We also used a software called Abstract which not only worked as a source control system for all our design files but also enabled multiple designers work on one sketch file simultaneously.

Abstract could also be used for design handover to development as it had a built inspector allowing the developers to easily access the code snippets, assets and pixel-perfect design files.

I wanted to add additional polish to this onboarding feature. Not only to improve aesthetics but through research and testing, I had proven that contextual images had a positive effect on conversion and animated illustrations had an even more positive impact.

The risk would be that animations would add additional complexity to the app, increase load times, the application file size and worst of all negatively impact the user experience by slowing down the user journey through the onboarding.

To solve this issue and reap the benefits of using contextual animated illustrations in our onboarding I turned to Airbnb’s Lottie. You can read more about the animated illustrations using the button below.

Testing an app or a new feature is an incredibly important part of the design process.

To test the new onboarding feature we did a lot of quantitive and qualitative testing. Luckily being a Pregnancy and child care app team we had easy access to pregnant users through both our app and staff. We were able to test our app both internally with team members as well as inviting some app users into the office.

Testing the app internally we wouldn’t give any context as to what the new feature was and recorded our testers both on screen and with a camera as well as asking them to think out loud as they went through the process. This is known as qualitative testing and it was really valuable data as it quickly became apparent what features worked and which needed adjusting.

We also did external testing using more quantitive methods such as A/B testing designs to our live user base which we had access to millions of people globally.

Due to the nature of our team setup, we could create new features in our live app quickly and efficiently so would often test new features in the actual app as well as testing with prototypes.

We could test different designs and see which converted better as well as loading surveys that users could opt in to answer. Another method I used was to do heatmap analysis to see where our users were actually interacting and if that matched our intentions.