Nora Molnar-Ercsei
UX designer

The redesigned Turners Cars' MV insurance purchasing experience

An online insurance purchasing process

Project background

Turners Car buys used motor vehicles in New Zealand as well as imports used vehicles from overseas. They make a profit by adding a margin on the vehicles and sell to customers and also provide car insurance. In this project, my role was to re-design the motor vehicle insurance purchasing experience.

I worked in a team of four, two UX Designers and two Developers. The goal was to create a quick and easy insurance buying experience for modern customers who don't have time to call or visit a car dealership in person just to buy insurance but also want a personalized experience.

My role in the project

I was one of the two UX designers on the project. I participated in the UX research phase, where we conducted ideation sessions and user interviews to understand business and user needs and wants.

I created empathy maps, did the card sorting process, and then came up with personas, a problem statement, and a user story. We then together created a user flow and I created a customer journey map.

After this, both UX designers separately drew sketches. Based on the sketches I came up with a wireframe. This process was followed by separate user testings. I conducted a user testing session in person that I based on my user testing plan. We then compared our findings by using Jakob Nielsen’s error severity rating scale.

Based on the severity rating, I revised the wireframe and had another round of testing.
Then I created a high fidelity prototype, so developers could test the interaction and could see the possible visuals of the redesigned site. I also added an extra admin user dashboard page to the project.

Discover

Interviews

At the discovery phase of this project, we conducted two user interviews in order to get a better understanding of the problem.

We first interviewed a stakeholder, the Insurance Specialist, in order to understand the pain points that Turners' employees face both in using the current systems in place, as well as ideas on how things could be improved.

The second interview was with a former user/customer, and we wanted to find out why he decided to purchase insurance from Turners in the first place, how was the process and why did he leave.

Main Insights

From the stakeholders' standpoint:

  • Slow selling process, long waiting time

  • The website is not useful

  • Separate CRM system for sales and insurance

  • No current process to attract new only insurance customers

From the customers/users standpoint:

  • No online process to purchase insurance

  • Confusing website

  • No personalization/perks

  • No proper customer service online

Card sorting process

Card sorting process

The card sorting process

In order to create personas, we wrote down and organized all the important information we learned from the interview into categories. It helped to create a more in-depth understanding of the different aspects of the user journey and helped to interpret the empathy map as well.

Define
Personas

Personas

Personas

Based on the interviews/card sorting we set up two personas. We referred to them throughout the entire product development process.

Personas are important because they define expectations, pain points, and goals, helping us to understand how to design a product that will satisfy users' needs and therefore be a success.

Based on our findings the common motivations were convenience, personalization, and affordability.

The goals are to get things done quickly and easily but also be able to find options that work within their budget.

Customer Journey

To understand and demonstrate how customers find and interact with the service now and in the future, I created two Customer Journey Maps.

Steps of the customer journey:

Awareness, Consideration, Purchase, Onboarding, Advocacy

The current car insurance buying process is the following:

Most customers find Turners by looking for used cars. They check out the website and then go to one of the dealerships. The salespeople inform them there that they can also purchase car insurance, even for their existing car.
Then they refer the customer to the Insurance Specialist on-site and he has to go through all the details again with the customer as the company does not have an integrated system for the employees.

The waiting time is usually long as well, and the Specialist has to print out everything which also takes time. The process is long and tiring and their online presence in terms of insurance is really weak. There's no option to get a quote online, and their insurance and finance sections are joined together so it's hard for people to find the proper information about car insurance.

The proposed and improved car insurance buying process:

When customers visit the website they find information about the car insurance on the homepage, as well as a separate insurance menu. A search bar is added to the top navigation to enable people to search freely on the site. A Quote or Buy Insurance button is also added to the main banner on the homepage. Either one of those options leads the customers to the insurance page where they can start the quotation process right away or retrieve their previous quote by using the new retrieve quote button on the top of the page. It only takes 3 steps to buy insurance online.

First, the users have to fill out a quotation form where the quote will be dynamically generated, real-time, so they can select different variations of payment options, access amounts, etc.
If they don't want to go further they can send the quote to themselves by email or print it out, and we introduced a chatbot option as well, that is there 24/7 to answer relevant questions. In the next step, they have to fill out their personal details, and lastly, they can review the quote details and make a secure payment.
From here they will be redirected to a Thank you/ Confirmation page where we display all the information about what happened and their insurance is in force right away. They can navigate back to whichever page they'd like to from here.

Customer Journey Maps

Customer Journey Maps

User Flow

User Flow

User Flow

This is the user flow of the proposed new insurance buying process.
Starting at the newly created separate Insurance page. It only takes 3 steps to buy insurance, and the user doesn't have to leave the page to do that.
The first step is the quotation. It's dynamically generated so the process is quick and effective, with many different options to choose from, to make it more personalized and convinient. In the next step, the user can add their personal details, and lastly, the user can review the quote details and make a payment. Then the user lands on a Thank you/Confirmation page where we display all the necessary information.

First sketches / Crazy Eights method

First sketches / Crazy Eights method

Sketches

I started the design process with low-fidelity wireframes. This is the way I iterate through many design options quickly. First I draw the sketches on paper using the crazy eights method, then I created them in Figma as well.

I reiterated a few things on my wireframe before I started the user testing process. I considered the information that I discovered while conducted competitor research and I discussed the findings and options with my teammate as well.

Develop
Lo-Fi Wireframe

Lo-Fi Wireframe

Wireframes

I created the low-fidelity wireframes in Figma for testing purposes. It's easier to collaborate and make the testing option available for people who we couldn't meet in person.

User Testing

User Testing

User Testing

Before coming up with the final product, we did several testing rounds in order to reveal possible usability problems.

I conducted the test in person with a user who was part of the target group. I wrote down notes based on my observation and the feedback from the user.

After testing the Lo-Fi Wireframe, we discussed our findings, rated them based on Jakob Nielsen's severity rating system, came up with recommendations and then reiterated the design, and tested again, and finally came up with an interactive prototype we were satisfied with.

I conducted the test in person with a user who was part of the target group. I wrote down notes based on my observation and the feedback from the user.

3 step insurance buying process

3 step insurance buying process

Insurance page UI

Insurance page UI

UI Design

Once I tested out all usability mistakes, I started designing the final screens in Figma.

My goal was to refresh the Turners' website's current UI with a bolder, more modern look while keeping it true to the brand. Simple, fresh, and clean. Professional but playful.
I used their brand colors with a twist on the CTA buttons, as I introduced a new brighter blue color to make them distinguishable. I also added a dark, almost black color to the navigation sections for the modern look and feel. I created a brand new profile page that looks up-to-date and easy to navigate and a new thank you page, admin dashboard, and quotation form.

What did I learn from this project?

I've learned that every step of the process is really important and taking the time to be thorough, even if you have to start from scratch sometimes, well worth it in the end.

It's a never-ending process, as users' wants and needs and the market as well are constantly changing, so it's crucial to stay updated and able to make the necessary changes from time to time.