Turners
Car Insurance Redesign
Duration
Three weeks
(August 15th - 2nd September)
Project Context
Collaborative Project
(Two UX + Three Developers)
My role : UX Designer
Collaboration!
For this project, I collaborated with another UX Designer as well as three Developers. We attended daily standups and gave each other updates on our task as well as impediments in our way.
The Problem
Many customers who purchase a car through Turners, find the process of adding on the in-house insurance difficult.
This is a problem because Turners loses that opportunity to cross-sell when frustrated customers take their business elsewhere.
​
The process of purchasing Turner's car insurance is poorly optimized and inaccessible to customers, resulting in a loss of revenue. Customers have a negative experience and are less likely to recommend using Turner's service.
​
This sparked the question – How might we redesign the website to make important information more accessible, understandable, and transparent, in order to increase customer satisfaction?
User Interviews
During the discovery phase of this project, my partner and I conducted user interviews with a Turners customer and manager in order to get a better understanding of the problem. We asked them questions for the pre-purchase, during, and future state of Turners summarizing their main needs, frustrations, goals, and motivations.
Insights
Based on interviews we gathered key insights
Turners Customer
Finding relevant information is difficult
The user is frustrated as she has difficulty getting through on the phone, leaving her with multiple missed calls
User is unable to pay online using her credit card
Turners Manager
Maintain the Turners Brand (They do not specialize in car insurance)
Reduce the number of calls they are getting
Provide service to keep customer data as many customers try to talk to someone after work hours
Empathy Map
To understand our user, I created an empathy map for a Turners customer.
Personas
Based on the insights gathered from user interviews and an empathy map, we created three personas.
However, we referred to our main user throughout the entire product development process
Main User Persona
Our main user sits in the most common age bracket of Turner's car customers.
Empathy Map & Venn Diagram
We created another empathy map and a Venn diagram to compare our main user's needs with the sales manager at Turners in order to find comparisons.
Customer Journey Map
To understand how our users find and interact with the service, we created a customer journey map.
Main pain points identified
Consideration Stage - The user struggles to find relevant information on the website. She also can't get through to them on the phone.
Purchase stage - The user has to physically go into the local Turners store to pay for her insurance.
Advocacy stage - Turners do not follow up with their customers.
Possible solutions
Include a chatbot to help answer the FAQ and help direct the user to important information
Include an online payment option
Useful CTA buttons
Follow up with customers (send emails)
As a loyal Turners customer, I want to quickly access information on the Turners website, so that I can purchase insurance hassle-free.
User Story
User Flow
We created user flows showing the path our users would take to complete the task of getting a quote from the Turners website. We created a loop to ensure our user would not get lost on their journey
Main User Flow
Main user flow for the purchase process
Includes:
Opportunities to Upsell
Different login points
Areas where user may want to access information
Sketches
Using the Crazy 8 Method we sketched out different steps in the critical path from our user flow and selected our best ideas.
Why these ideas?
Insurance Page
We wanted to incorporate different aspects from each screen, these include
Chart to compare types of insurance
Customer reviews
CTA buttons which include get a quote
Get a quote - Fill in a form
We wanted to include a progress bar to let users see their process
Users won't feel overwhelmed seeing what they would have to fill out
Receive a quote
We want to give the users an option to adjust their quote and add on coverage
Save a quote for later option
Change insurance type
Summary
We wanted to include a summary page so users can review their insurance type and make sure details are correct
Terms and conditions included
Payment
We wanted to give users a range of payment methods
Confirmation button rather than next button to make it clear for users that they're paying
Payment confirmation pop up
Low-fi Wireframes
Low-Fi wireframes for the purchasing insurance experience
User Testing
We conducted a usability test with 5 participants. Our goal was to see if customers are able to quickly access the information they need to make a purchase decision using our wireframe.
​
​
​
Next, we used Jakob Nielson's Severity Rating to help us identify our priorities.
​
​
​
Observations
CTA Buttons
- User's did not notice CTA Buttons
Saving User Information
- Users want an options to email/download a quote so they can compare providers
- Users did not notice save a quote option
-No need for users to select get a quote for a comprehensive plan as they would need to enter details and decide again
Payment Issues
- Users wanted more information on the payment page to confirm that their details are correct
- Users were confused by the type of payment (automatic or one-off payment)
Web Footer
- Users looked confused while staring at web footer
Nav Bar
- All users are overwhelmed by the navigation bar as there are too many areas to click
Recommendations for Reiteration
- Use or colour to highlight buttons
- Simplify CTA buttons
- Have the option to email or download as PDF
- Make important text clear
- When users select "Get a quote" under a particular type of insurance, make users "remember" their choice later in the process.
- Add a summary of quote to the payment page
- Add payment option type.
- Remove unnecessary information
- Remove irrelevant links
- Declutter by using icons
Reiterations
CTA Buttons
​
Some users didn't know which CTA buttons to select so we reduced the number of CTA buttons to help users decide.
At the bottom of each insurance type column, we included CTA buttons but did not consider the user's path if they clicked on them to get a quote. The user would be directed to another page to fill out a form, again giving them the option to select another type of insurance.
​
This step was confusing so we removed it entirely.
Saving User Information
​
40% of our participants wanted the option to download the quote as a PDF so they are able to compare it against other companies.
Payment Issues
​
80% of our participants had issues with the payment section.
​
One participant wanted to see the summary on this page so he wouldn't have to go back and forth between pages. We gave this a severity rating of 3 as this slows down their process.
​
​
Issue Five
Navigation Bar
Users feel overwhelmed as there are too many areas to select. We removed distracting and irrelevant links.
High-Fi Prototype
