Ollie Onboarding Refresh

Background

Ollie is a dog food D2C subscription ecommerce company. Ollie needed to replatform the entirety of both their FE and BE code. There was quite a bit of tech debt and there were big changes coming our way, such as a rebrand and new subscription models to be sold.

Problem

Technology’s plan was to replatform the FE starting at the beginning of the customer funnel. I had approximately 3 weeks to identify the current problems with the onboarding flow and do a “refresh” of the design.

Goal

To build a new onboarding flow in React utilizing new design system foundations and components. UX improvements would increase current onboarding conversion (measured as initiated onboarding to plan page).

Team

My role was senior product designer. The rest of the team consisted of a product manager and 4 FE developers. Our key partners were marketing, CX, and strategy.

Supporting Data

I focused on onboarding funnel conversion data in order to learn where in the flow visitors were dropping off. This data was split a few different ways such as mobile vs desktop. I also looked into how many visitors drop off from onboarding and then return and complete onboarding at a later time.

Below shows overall onboarding funnel conversion step by step. The majority of drop off happens at the time of email collection.

User Research

Besides looking at available data, I also observed users interacting with the current onboarding flow experience. I paid close attention to any questions users seemed to get stuck on or weren’t comprehending, as well as how they interacted with the prototype. Participans had the oportunity to give open feedback at the end and were asked questions on how long they perceived the onboaarding flow to be.

Focus Areas

Synthesizing the data and user research, I defined the areas of improvement into different themes and began thinking through solutions to the main problems.

Marketing

Future marketing moments

While looking at competitors such as Farmer’s Dog and Nom Nom Now, I noticed that that some asked for dogs age and others for birth date. Ollie was currently asking for age, but I realized that knowing birth date could lead to future marketing moments. I brought this to the marketing director who loved the idea.

But, this is also a question that could stump a customer. While some dog owners know their dog’s birthday as if they were their child, others did not. For that reason, day was kept optioal and through messaging, we reassured the customere that they could take their best guess.

Less is more

Knowing that the largest area of drop-off in onboarding was during the first couple steps, I combined the intro page and email capture. The hope was that this would make the user feel like they’re getting into the experience sooner, with less time to decide they want to leave.

Also, the current experience had a % savings banner on every screen. When bombarded with the same message over and over again you can stop seeing it. Instead, our new stragey was to put the savings message in key areas of the experience, the first step and interstital loading page at the end.

Branding opportunity

Who doesn’t love a cute dog photo? During user research, participants would commonly say they’d love to see more photos of dogs. Ollie was also going through a rebrand and was starting to lean away from illustrations and more towards photos.

While it was important to not inundate the experience with photos, there were areas where photos could reinforce the brand.

Increased Context

Combining like questions

The current flow has a single focused question on each page. There could be a good argument for asking one question at a time, but there are also questions that relate closely to each other. Having these related questions come one after the other or combining them on a page could make the quiz feel shorter than it is.

Activity level clarification

One of product's partners at Ollie was strategy. Before I started working on onboarding, I spoke to our strategist who sent me past research comparing AKC's definition of active breeds vs what Ollie customers were saying about their dog's activity level. This showed that people could be interpreting activity level wrong.

Activitity level is an attribute that affects how much food Ollie calculates for your dog so it's important that customer's understand the question and answers.

Quiz progress

In the current experience the quiz was considered the first step in signing up for Ollie with the second being meal selection, and the third, checkout. Even though the quiz was 12 steps, there was a progress indicator saying 1/3 for the entire 12 steps.

This was easy to identify as a problem. The approach I went with was to forgo the full onboarding progress indicator and focus on quiz progression. There were other indicators after the quiz such as a “continue to checkout” button that signaled to the user what was up next and that they were almost done.

Improved Interactions

Allergies

The last question we ask in the quiz is around food allergies. Instead of an input field I was curious to see if there was an easier way for customers to select allergies, but first I needed to learn more about dog food allergies.

I spoke with our head of food to learn what commen allergens will never be in our food, CX to learn what allergens customers call in about, and I took a looks at data to see what allergens customers select the most.

I was able to learn there were a few allergies which were often selected by customers so I updated the design to make it easy for a customer to select a top allergy, but still search for other allergies.

Buttons

There a few questions that can be skipped if the answer was no. It wasn't always obvious to the customer on how to do this. I created dynamic buttons that updated with copy depending on if the user had made a selection or not.

Design System Components

The FE lead and I had been in discussions about desinging and developing a design system for Ollie. There were foundation styles I had been using in designs for a couple months and a FE intern had added them into Storybook. The replatfrom of onboarding provided the perfect reason to build out additional components that could be used throughout the experience.

Results

After a week of going live conversion from onboarding to the next step (meal plan selection) increased by 10%.
9 new common components were designed and developed including a primary button, chip, input, select, progress indicator, and banner.
The onboarding flow was decreased from 12–13 steps to 8 steps, getting visitors through the flow faster, without losing any critical information.

Reflection

This initiative was timeboxed to be 3 weeks for design work. If I had more time I may have looked into conducting competitive usability testing and/or explored alternative ways to gather information from from visitors outside of the quiz format.

Technology and product waited to discuss how we were going to tackle building the new onboarding, resulting in design having to scramble to get the details of the components together and ready for engineering to build.

In the month prior to this work, product had made the case of needing a usability testing tool to leadership. I would not have been able to move as quickly or with as much confidence if I didn't have a usability testing tool to utilize.