Cerity raises sales by 300%
from improving their UX/UI
Cerity is an insurance company that specializes in workers’ comp insurance, which can be purchased online. I was brought on for a contract to improve the design flow of their online form, whereby users receive an insurance quote and option to purchase. I was asked to do a complete redesign of their form.
My Role: Lead UX Designer
Tools: Sketch, Invision, Photoshop, Jira
My Contributions:
- Detailed competitor research
- Tested the sites form with heatmaps
- Created online user interview questions
- Utilized Helio to receive feedback from 8K people
- Stripped back design to basic and clean elements
- Sketched 20+ individual pages
- Created high-fidelity wireframes
- Delivered details specs for developers
- Provided framework for future changes
Methods used:
Heuristic analysis
User interviews
User testing
Affinity mapping
Customer journey
Scenarios/user flows
Sketch
Wireframes
Usability testing
What i’m solving
The problem
While Cerity is backed by a 100-year-old insurance company, it’s still new on the market and not well known. In addition, the insurance form to receive a quote online lacked in any UI consistency. The language used for each question was unclear, the screen was very cluttered, and the inputs changed visually from step to step.
Approach
Research: Here I'll learn how the current Cerity form flows, and compare to its competitors. I'll get to know its content, and try to better grasp Workers' Comp Insurance, and those tasked with purchasing it.
Define: Questions that pop up during the analysis are pushed into user interviews- where I'll poke, prod and gain insight to define how people currently purchase workers' comp insurance, and what are their hesitations with purchasing after receiving an online quote.
Ideate: Once I'm clear on the problem, I'll use the design method to kick things off. I'll sketch out an amalgamation of Cerity and its competitors for purchasing insurance online.
Test: Based on the previous steps, I'll create my first attempt at Cerity's new form. I'll then user test to establish a foundation.
Iterate: With the recent findings, I'll start the process over again for the ideate phase.
Research
Original insurance quote form
The first thing I did was print out a page of every step of the form, and circle/highlight cross out what needed to be re-worked, and what needed to be cut out.
Backend data analysis
I pulled reports through Hotjar to see which of the steps in the form presented the biggest blockers for users.
Comparative Analysis
I researched 5 companies that would be either direct competitors or had the type of User Experience to aspire to, like TurboTax & Lemonade.
I started by recording a walk-through of each companies insurance form and took notes from there.
Below are the competitors listed, and a SWOT Analysis I compiled (strengths, weakness, opportunities, threats).
Strengths
- 100-factor algorithm makes them accurate and competitive
- Price transparency
- Backed by a 100-year-old insurance company
- Landing pages are unique to each state
- Startup that is still creating who they are
Weaknesses
- No brand recognition
- The UI/UX was very overwhelming
- The "next" button was rarely visible on each step of the form
- Lacking in UI consistency
Opportunities
- The market is still new and open for a top dog
- Piggyback on the audience for its parent company
- Create a new exciting and current brand
- Show pricing transparency calculated in live-time
Threats
- Their competitors are expanding to offer services in new states daily
- People prefer to speak with an agent when purchasing
- Each state has its own complex requirements
User testing on the current product
I used the company Helio, which offers assistance in finding users to test and survey. With Helios help, I was able to reach thousands of users to test and survey. Below is a sample of the questions I asked.
How were you first educated about workers’ comp?
What is usually the impetus for getting workers’ comp set up?
Have you purchased insurance online before?
When you purchased insurance online, what kind of research did you do beforehand if any?
What do you think is the most important detail of your business to determine workers’ comp
How long do you expect this form to take in order to receive an accurate quote for your business?
DEFINE
User testing findings
I tested users with surveys and a clickable prototype that had task prompts. Below is a sample map that was pulled from asking users where they would click first.
Aside from maps like above, below are a few sample findings I received from my survey questions:
42% of small business owners believed there are 4 steps in Ceritys quote flow, and on average would take around 5 minutes.
50% of small business owners who have purchased workers’ comp before needed help when purchasing
“I’m afraid of being miscategorized, and charged too much”
Overall research conclusions
Overall a lack of visual UI consistency. While watching recordings of users through Helio & Hotjar, each question took a considerable amount of time longer to accomplish than previously anticipated.
The language used for the questions was often confusing or generally misunderstood by users.
The clutter of information and distractions on every page was a culprit for why most users were not reaching the end of the form. Only half the users clicked the correct box or button the first time around.
Goals
- Raise the number of users making it through the quote form by 10%
- Raise sales
- Completely clean up the UI in terms of consistency
- Re-write questions where users drop off
- Remove extraneous or distracting material
Challenges
This massive makeover was a lot of changes for the Dev team, there had to be an agile-paced approach
Not all users had the same understanding of questions or terminology in Workers' Comp Insurance
Users highlighted their lack of knowledge, would stripping out most help and resources empower them to continue, or hinder their understanding and thus progress.
IDEATE
SKetching
After doing extensive research on competitors, I decided to strip out all non-essential content.
I started with a hand sketch mix on my iPad.
Wireframes
I transferred my designs to Sketch, starting with a low-fidelity version.
TEST
User Testing
By implementing this entirely new form into action, Cerity saw a:
50% increase in users making it through to the end of the form
300% increase in sales
150% increase in purchases to insurance quotes ratio.
CHanges Made
With the research and feedback provided, I made the following changes.
Stripped out all extraneous distraction, the multiple help options, etc
Changed the progress indicator, one simple smooth bar that isn’t showing the number of steps, but still shows they are making progress.
Keeping the next button, and all text in same consistent placement
Fixed/streamlined alignment issues
Streamlined font
Streamlined text/answer inputs
Re-worded confusing questions
All created with a framework for a style guide, which did not exist prior
Want to see it in action?
Check out my Invision prototype
