Onboarding for a B2B e-commerce shipping application
Launched 2019 – Last updated May 2021
1-step Onboarding: connect a store to add orders that need to be shipped.
The Problem
New users that signed up for ShippingEasy were struggling to get their accounts set up and start using the app because the UI was busy, settings were difficult to navigate, and general setup was difficult.
A new user had to get orders into the system, and configure at least one carrier account to start buying shipping labels. The current solution required a member of the sales team to call new sign ups who would be passed to an onboarding specialist – that’s all assuming the customer actually picked up the phone.
After sign up, new users were taken directly into the application.
If a new sign up was never in contact with a member of the ShippingEasy team, they were not likely convert to a paid account because they would be unable to set up their account to buy labels.
After signing up for a trial, a new user would see a screen that looked like this. (March 2018)
Research
We spoke to our onboarding team to identify how they work through the new user set up process when the have a customer on the phone. If we took their steps and created a setup-wizard style UI, it would have looked something like the slides below.
This would clearly be too many steps for a user who just wanted to start their trial and learn about the value that ShippingEasy was able to provide.
What was the minimal amount of steps needed for a customer to the a-ha moment and buy a shipping label?
We set up an internal team with members from product management, sales, onboarding, engineering, and management to brainstorm and break down the setup workflow into the pure essentials. This whiteboard outlined the direction we wanted to pursue: a three step process with only the minimum setup needed to get a label out of the system.
Hypothesis
If we can create a focused onboarding work flow, then new users who do not get contacted by our sales team will be able to onboard themselves and convert to a paid account.
Design Concepts
First we mapped out the ideal workflow:
A linear, three step workflow will get more accounts set up without the need for a human onboarding team.
Next I started creating quick low fidelity wireframes that would show page layout and interaction details.
First drafts of a high fidelity mockups:
Finally, these high-fidelity mockups were deployed for our first onboarding workflow in the Fall of 2018:
Post launch user testing
We wanted to find out more about how real users were responding to the new workflow, so we began testing our new onboarding approach in two design validation sessions.
Group 1 – existing users:
Current ShippingEasy customers
Users of another shipping application in our company portfolio
Group 2 – New users:
eCommerce merchants recruited from Craigslist in the local area
Attendees at a “User Test Fest” event that I attended
What we learned:
Users had data concerns around connecting a store up front– if they didn’t end up using the app, what would happen to their customer data?
There were questions as to why a credit card required during the first carrier setup step – there were questions about whether the trial was actually free.
Completion page had way too much content and things to do next – felt too daunting
Minor adjustments and adding a little user delight :
Welcome message with animation to orient a user as to what is about to happen
Store sync messaging added to the side bar indicating orders were being downloaded
Completion step including a celebratory gif letting a user know their account is ready to create labels
Onboarding Version 2
This user flow diagram more accurately depicts what the version 1 onboarding workflow looked like after deployment and a few rounds of updates.
Users could leave the workflow whenever they wanted to go into the app and start exploring.
We started to wonder if this was the best approach and furthermore, if our workflow had steps that were unnecessary or caused people to leave the workflow – or the app altogether.
Based on our research from the first version of onboarding, changes to the business, and general assumptions we had about the workflow, we decided to think differently about our onboarding workflow.
Since ShippingEasy had a much greater rate at converting multi-channel merchants, we wanted to focus more on store connections.
The label setup step was redundant as 9/10 merchants utilized the default
As part of the carrier account setup, we required a credit card to pay for label related costs. We wondered if we could move this to the point just before a label is purchased.
Hypothesis
If we move the payment step out of onboarding and put it right after a new user clicks “buy label” for the first time, we will see an increase in conversion rates for paid accounts.
Design Concepts
Design goals
Focus the workflow on a more valuable user segment: the multi-channel merchant that has a reasonable volume of orders per month.
Remove unnecessary steps so that a user can begin processing orders more quickly – we assume this will lead to a user recognizing the value the app is able to provide.
Ask for a credit card at the moment a credit card becomes a requirement: time of label purchase, or when the trial is complete. Our assumption is that asking for a credit card too early in the workflow results in abandonment.
Wireframe concepts outlining the new flow – which focuses more on identifying (not necessarily connecting) the merchants first store.
Early design concepts based more closely on the wireframes.
Final design concepts
Version 2 Variant Testing
Our version 2 onboarding approach is being tested while running parallel to our version 1. 50% We plan to monitor a lot of metrics around connected stores, payments, and conversion rates to determine which approach is better for our customers and the business.