Case Study 4
A responsive website that gives you a quote easily and targets younger audience
Role: UX Researcher, Product Designer
Project Deliverables: Responsive website, Branding, Easy Quote Flow
Tools Used: Figma, Miro, OptimalSort, Maze
Project Duration: 4 weeks, 20 hours/week
This was a project to deliver a modern, transparent experience for people to shop for insurance products online. I started this project with very little knowledge in this industry so I knew research would be critical for this project. It was exciting to complete this challenging project and to learn and to see how it all comes together at the end.
Brief
Kaus has been in the business for over 30 years. They provide all types of insurance for individuals: property, motor, liability, marine, aviation, life, health, and protection. They have been working through regional agents, selling the policies to them instead of directly to customers. However, with the rise of the internet and personal devices, Kaus has been losing ground. They want to create a responsive e-commerce website for them to sell insurance online, directly to consumers. They also want to provide a good user experience to their customers. They know insurance is not easy and they are open to breaking industry standards in favor of a good and easy experience, for example, by innovating the Information Architecture with new categories and grouping of elements that makes more sense to the potential customers.
Since up until now they have worked only on a B2B environment (Business to Business), they’d like to also refresh their brand but preferably keep their name.
Goals
Overview
Create a responsive e-commerce website that makes it easy for people to shop for insurance online, easily and affordable anywhere.
The website should be responsive, user-friendly, and flexible for future roadmap.
The brand needs to be trustworthy, modern, and clean and fresh.
Research
Research was critical in this project. I needed to empathize with users and learn what users go through when making insurance choices. Therefore, I needed to learn current state of the industry to move forward to design getting insurance quote online fast and easy.
I started my research with several goals in mind:
Learn about why people purchase insurances
Understand pain points about shopping for insurance and identify how it can be improved
Determine the factors that make user’s experience enjoyable
Competitor’s Analysis
To understand current state of insurance industry, I researched on direct and indirect competitors. I used google to search on most popular insurance companies in United States and searched on highest customer satisfactory for the top companies.
Direct competitors are StateFarm, Progrssive, and Allstate.
Indirect competitor is Lemonade.
Provisional Personas
Creating a provisional persona was very important step to understand insurance shoppers. This research allowed me to understand what insurance shoppers are looking for at different stages of life.
User Interviews
After understanding different types of personas, I started to prepare for the user interview. It was important for me to plan out what needed to be accomplished and think about any assumptions that I would need to make ahead of time. For instance, I assumed getting an online quote isn’t as easy as it should be. Therefore, when I was developing questions, I made sure to include detailed questions about what the user is thinking and feeling as the user is attempting to get an online quote.
followed my three step process:
Step 1
Organize Participants
Find participants who have shopped for insurance or have interest in shopping of insurance online.
Step 2
Develop Interview Guide
Create a guide to help during interview process. Write a script and to make sure right questions are asked appropriately.
Step 3
Conduct Interview
Use the interview guide to help direct the interview in the right direction. The interview process should be fluid and the guide is only there to help.
Key Takeaway: After conducting several interviews, I was able to understand what users are looking for when purchasing insurance. From this research I found out some of the popular insurance companies, what causes insurance shoppers to shop and some of the pain points of insurance shopping
Popular insurance websites:
State Farm
Geico
Liberty Mutual
Main Inspiration:
Unfortunate event happens where they need to rely on insurance coverage
Friends telling them they saved money by changing insurance
Pain Points:
Difficulty in comparing prices
Hard to speak to an agent or to request to chat as necessary
Difficult to see all the insurance policies hassle free
Persona
After conducting user interviews, I started to create a persona to use as a reference to represent a target customer for Kaus. This persona will help me focus on the target audience and what they are looking for. My persona is knowledgeable in computers and is insurance shopper. She doesn’t want to spend a lot of time shopping for insurance. She prefers to shop online and wishes to consolidate all her insurances into one place.
Project Goals
After conducting interviews, I thought about what goals each category would want to achieve. Then it was visually easy to see what I need to achieve. The common goal among the users, business side, and technical side is to provide good customer service and to provide fast web service.
Feature Roadmap
Feature roadmap was a good brainstorm session to go through. There are three categories: Must Have, Nice to Have, and Surprising and Delightful. By studying competitors’ websites and using my interview feedback, I put together a list of features that Kaus website should have.
Information Architecture
Research made me understand what the pain points are. It seemed like the users want shopping for online quote to be done fast and easy. They also expect to see standard functions within the website. Therefore it was important to identify all the content an insurance website is expected to have, sort them, and map them out to make the decision process familiar to the users.
To get standard insurance menu, I looked at competitor’s websites and tried to find patterns. I identified consistencies throughout insurance navigation models. Then I developed a list of navigation menu and categories that I thought would be helpful to the users.
Card Sorting
I used OptimalSort to do the sorting exercise for the users. I used this because I wanted the user to sort by categories on their own without feeling pressure from me looking over their shoulder. This exercise made me understand how to group certain features.
For this exercise, I provided categories: Homepage, Navigation, Member Page, and Footer. I also had it hybrid for the users to add any categories, but none of my users did that.
From this exercise, I realized that there were two types of sorters. One group, wants to see bulk of the information under member page and the other group wants to see it on the landing page.
Site Map
Card sorting helped me to see how users want to information. Then, I developed sitemap for each content category to organize information on the web.
Initial Sketch
After understanding how to structure Site Map, I sketched my initial version based on my research. I sketched three versions of the landing page.
Interaction Design
Now that I have full grasp of what the user is looking for it was time to develop the way users will interact with it. To start out, I developed task and user flows.
Task Flow
Main task for the user was to get an auto quote online. Task flow allowed me to see the process the user would take to get to the end goal of getting an auto quote.
User Flow
After completing Task Flow, it was necessary to check how the users would make decisions. User flow allowed me to understand their thinking process.
Wireframe
After understanding users better, I designed several wireframes: landing page, select a quote page, and detailed product page as an example.
Responsive Wireframes
Once I understood the user better, I designed responsive wireframes in desktop, tablet, and mobile.
UI Design
Now that key features are defined and researched, it was time to design the look and feel and how I want the users to interact with the product.
Mood Board
Before designing anything, I researched online to gather what I think works for an insurance website. Since Kaus is looking to redesign to give a fresher look to the younger crowd, I selected some that could work.
UI Kit
Once I finalized on the style of Kaus website, I worked on designing UI Kit.
UI Design
Mood Board and UI Kit helped me to put together Kaus website. These steps were necessary to determine what works and what doesn’t.
Iteration & Implementation
Now that the wireframes were completed, I wanted to test it with user to make sure that they ca use it.
To achieve this, I developed a usability testing plan.
Usability Test Plan
In this plan, I established clear goals of what I want the users achieve. I want to know what works well and what doesn’t and make changes accordingly.
Test Objectives
Test the overall impression, quality, and use of the navigation and flow of the design
Test how users are getting quotes online and if they are able to complete the process easily without much frustration.
Test how easily the user can find help when needed
Test the look and feel of the landing page to provide modern, young look that Kaus is looking for
Observe any areas of frustration, confusion, hesitation, etc. during the user’s navigation
After performing my usability test, it allowed me to understand the behavior of the users.
Affinity Map
I had six users test my prototype and here are my findings:
Key Takeaway: Usability Test takers had many good feedbacks. However, there were two that stood out : add FAQ page and add another menu for Select a Quote
Iterate
My first iteration was adding another menu for “Start a Quote”
Before: After:
My next iteration was adding a FAQ page.
By adding FAQ under Contact, users can have access to any general questions online.
By having “Start a Quote” in the top menu, the users will have anther access to start their quote.
Next Steps
Perform another usability test to see if the new added features help the user navigate better
Add more pages
Test and iterate as necessary
What I learned
This was my first comprehensive project. Each stage of the project was exciting because I really wanted to solve their problem of gaining younger customers. I get very excited when solving business related problems that I really enjoyed planning out the research plan and later conducting usability plan was very intriguing. It was interesting to find out how users felt about my prototype and their feedback were valuable. I learned the importance of color and research. Picking the right color can make your website look younger or older. The feedback from the usability test were valuable in making my design and usability work better.