Click Here, Here and Here to Sign Up
At Unbounce, we get to work with thought leaders in marketing. When Michael Aagaard, our Conversion Rate Optimization expert, approached the team for a project, I jumped to that opportunity.
ORGANIZATION
Unbounce
RELEASE
March 2016
SKILLS
Design Experiment
User Research
UX and UI Design
How many steps does it take to sign up?
Goal
The goal of this experiment is to increase the number of new trial sign-ups by improving user experience of the sign-up process.
On the surface level, there’s not much of a difference between the two.
Problems
Michael gathered these information by observing visitors go through the existing sign-up funnel:
High drop-off rate at more than 70%.
Intrusive, inconsistent and sometimes misleading error feedback.
Thirteen hidden fields within the sign-up funnel.
The form didn’t mention that it took three steps to complete the sign-up process. Most potential customers dropped off when they discover these hidden steps. There was also no validation feedback. Visitors were left in the dark when an error like invalid email address or declined transaction occurred.
We further validated the issues by looking at analytics data as well as combing through community feedback and watching session recordings.
Solution
We kicked off the experiment by mapping all the areas that were mentioned in Michael’s research of the sign-up funnel.
By making small UX improvements, we might be able to reduce form abandonment and improve registration completion.
In the new sign-up flow, an account is created when the user finishes the first step of the process.
The solutions we included were the following:
Manage user expectation by adding a progress bar.
Add a confirmation page when visitor successfully signs up for an account.
Use Google Maps API to speed up address input.
Better system feedback with concise guidance and error messaging.
Bonus: Optimize mobile responsive experience despite low mobile traffic to account for the rising usage of smartphones.
Making it easy to add the address using Google’s autocomplete API
Process
The first step was to verify the purpose of each section and field. The sign-up process hasn’t been updated in a while so we had to make sure we were still capturing the right and necessary information.
I took a lean approach when redesigning the interface. By working directly with a UI developer, we were able to quickly bring the designs to a functional prototype. We also collaborated in defining the form feedback states and wayfinding.
I ran usability testing sessions following the RITE method. Since we were using a functional prototype, we were able to implement changes quickly before starting each session. I tested with a variety of in-house stakeholders ranging from marketers to department leaders to match Unbounce’s buyer personas. These participants verified the effectiveness of each iteration by not reporting previously logged issues. We kept on reiterating until they stopped reporting issues.
Outcome
Working with a smaller team, we were able to ship this experiment within a month. Two weeks after launching the new sign-up funnel, trial sign-ups were up by 13%. We closely monitored how the visitors were interacting with the new form and made tweaks based on that data.