Logo of David Hall

Creating an onboarding experience using behavioural design

Onboarding for C2P Regulation Management platform

by Compliance & Risks

C2P is a regulations management platform, much like a news feed of global regulations. Some of the biggest multinationals use this feed to stay compliant and ship safe products. But they were suffering from an avalance of content. The question was, how do we give them only what is relevant and not drown them in the process? 😬

01. My Role

Lead product designer

My central role was lead product designer, alongside my UX colleague, Ruth and two project managers. From the beginning I was involved in customer insights, on calls with our lovely customers, planning the project and executing the vision. You could say, I was there from beginning to end.

What is behavioural design?

It‘s not a fancy new term. It has been around for a while and developed into a powerful design tool. Behavioural design uses behavioural science, psychology and motivation in the things we build to design for how users behave. We build an environment that supports whatever route the user takes, instead of forcing them to conform to how our products and services work.

I hate to say this, but our product compliance team is under enormous strain at the moment and I believe we have the hardest job in the organisation. There are too many regulations and standards from every corner of the globe to keep track of, and we make a lot of products! We can’t do anything until we have filtered out all the outdated and irrelevant regulations and standards, and that's just the beginning.
Product compliance manager, top 10 multinational
02. The challenge

Giving a relevant experience

How does the user get the relevant information without being overwhelmed and put off before they have started the experience? Removing this avalanche of content was our big challenge.

Questions we wanted to answer were

  • How might we filter down content before the user sees them?
  • How might we make the user feel familiar with their world?
  • How might we make it easier to filter through their products, content areas and regulatory world?

Our solution was to create a comprehensive and easy to use onboarding experience that would give the user relevant content when they first logged in and also get them familiar with the concepts of the platform.

The solution

Our solution was to create a comprehensive and easy to use onboarding experience that would give the user relevant content when they first logged in and also get them familiar with the concepts of the platform.

03. Research

Building job stories

Job stories focus on what the needs and motivations of the user are and what jobs they need to get done. Instead of focusing on the solution, we create these stories to guide us to a solution. They also let us concentrate on the goal, which gives us a better insight into the types of personas that are using the platform.

We began by interviewing users about their experiences and the feedback was that they faced a daily avalanche of content, with some of it being irrelevant, which added to the frustration.

Issues we discovered were

  • Overwhelming avalanche of content
  • Too many irrelevant regulations
  • Difficult to know the most important regulations to focus on

I turned these into job stories that outlined the pain points and goals really clearly.

User roles

We have four very distinct personas or user roles and are used as a starting point for our job stories.

Storymapping the user's journey

Storymapping is a powerful way to map and visualise the user's journey through your product or service, in a visual and dynamic manner. For the designer and product team, it breathes life into design challenges, opens our mind to ideas, and discovers potential obstacles to overcome.

We used principles of behavioral design, with tactics and strategies to smooth and overcome the user's crisis points.

Starter tactics to use in moments of crisis

These are just some of the non-coercive psychological tactics to support our user's actions.

Aesthetic-usability effect

This refers to users' tendency to perceive attractive products as more usable and so inspire trust.

Make it clear where to act

Tell the user what the action is in an accessible manner.

Progressive disclosure

Progressive disclosure is a design technique to ease the cognitive burden by only showing the most frequently required controls by default and making additional controls available on request.

User's journey

Below is an example of a user journey with the basic steps a user needs to take to complete their goal.

04. Exploration One

Different layouts

We experimented with different layouts for the onboarding experience. Some questions we wanted to explore were; should the stepper be on top or bottom, should the buttons be fixed on the bottom or top, what type of imagery should there be and where will it be placed?

05. Exploration Two

How many steps can there be?

In the research stage, we found our users were accustomed to dealing with large amounts of content, and they are not put off by form filling. This guided our decision to extend the onboarding experience further than normal, to get more even more preferences from the user.

Example explorations

06. Visual

Palette

I choose a muted palette, as a strong colour palette could become tiring after a few screens. I chose aqua (which is our primary brand colour) and a complimentary green, to give a balanced and calm experience. As there are only a few actions, the aqua felt appropriate to be used here.

Iconography

One of our big challenges is representing the many policy and regulatory areas that exist. Because of the complex concepts, we felt it was easier and more flexible to create icons instead of sourcing photographs that could be harder to comprehend when in a list.

07. THE SOLUTION

Bringing it all together

After more testing with hand-picked and engaged users and the internal team, we felt we had a strong user flow and end product.