KAUS INSURANCE
Responsive Web Design
Role: UX/UI Designer
Timeline: 6 Weeks
Project Type: DesignLab UX Academy project
Project Background
Kaus is an insurance company with 350+ offerings - selling all their policies offline through regional agents. While this has kept them in business for 30+ years, they’ve realized the importance of establishing an online presence if they want to stay relevant and attract a younger demographic.
They need help building a responsive website to sell their insurance packages online, directly to consumers.
UX Responsiblities
- UX Research
- Feature roadmap
- Information Architecture
- Wireframing
- Task & User flows
- Branding
- Response UI Design
- Prototyping
- Usability Testing
The Challenge
Having 350+ offerings and no online experience up until now, Kaus needed to package and sell its policies in a simple, streamlined process. With so many established insurance companies online, Kaus also needed to position its brand as innovative, transparent, and customer-focused if they wanted to stand out.
High-Level Goals
- Position Kaus as an innovative solution to the challenges and frustrations people have with purchasing insurance online
- Package the various offerings into categories that felt natural to the user and were easy to filter/navigate through
- Design a responsive website to sell insurance policies, direct to consumer
Phase 1: Empathize
Research Goals
- Discover how to make the process for getting an online quote and purchasing insurance as easy and streamlined as possible
- Understand the common objections, challenges, and frustrations users face when shopping for insurance online
- Discover the best way to structure Kaus' website and how to layout/filter their content and packages in a clear, simple-to-understand way
Target Audience
The target audience for the Kaus brand includes people 21 and older, from all backgrounds, who have purchased/or plan on purchasing insurance in atleast one of these categories:
Property, Motor, Liability, Marine, Aviation, Life, Health, and Protection.
Methods
- Exploratory Research
- Competitor Analysis
- 1-on-1 Interviews
Competitor Analysis
Provisional Personas
1-on-1 Interviews
After conducting competitor research, it was time to gather insights from real people.
I interviewed four participants to get a better understanding of the goals, motivations, frustrations and needs/expectations people have when it comes to insurance.
Participant 1
Gender: Female
Occupation: UX Designer
Age Range: 40-50
Insurance: Health, Auto, Renters
Participant 2
Gender: Male
Occupation: Photographer
Age Range: 21-30
Insurance: Health, Auto, Life, Business Liability
Participant 3
Gender: Female
Occupation: Project Manager
Age Range: 21-30
Insurance: Health, Life
Participant 4
Gender: Female
Occupation: Retired Nurse
Age Range: 55+
Insurance: Disability, Life, Health, Home Insurance
A Few Interview Questions
What types of insurance do you currently have?
Walk me through the steps you took to decide which policy and company best met your needs. What was the most challenging/frustrating part of this process?
What do you do when you need help or have a question about your insurance policy?
What do you look for when shopping around and deciding which insurance company to do business with? What matters most?
What hesitations do you have before making an important purchase or entering sensitive information online?
When visiting a website for the first time, what information do you like to see to feel safe and trust the company/brand?
Interview Takeaways
Transparency, easy-of-use, and reliable support stand out as what people value the most.
Users expect the website to be simple to use and understand (no fancy jargon or overcomplicated insurance terms). To build trust, users expect an easy and simple sign-up process, quality brand visuals, and the ability to reach out reach out and get support if needed (phone number, live chat, active social channels, etc)
50% of participants prefer to get on the phone with someone during the enrollment process, while the other half felt turned off at the idea of having to speak to someone just to get the information they need.
Users highly value proof (whether through ratings, active social media, or good branding) that the company is reputable and reliable before they can trust it.
Phase 2: Define
Personas
After completing the research and observing patterns and themes from 1-on-1 interviews, I created a persona that most closely matched an important demographic Kaus wanted to reach - the younger generation.
This persona shares similar frustrations, goals, and needs as 50% of the people I interviewed.
Project Goals
The next step in the Define phase was to map out the project goals for both users and the business, and then identify common goals shared between both sides.
I also factored in technical considerations and how this would influence the overall user experience and business goals.
Sitemap
With the research and project goals complete, I then focused on the information architecture. Mapping out the pages, categories, and sub-categories needed for users to easily access the information they're searching for as they navigate the website.
User Flow
For the sake of time, I created a user flow that focused on the task of getting an insurance quote. I factored in the mindset and goals of a user as they land on the home page and all potential actions/decision points along the way as they navigate throug the quote process.
Phase 3: Ideate
Sketches, Mockups, Branding
The Ideate phase of the design process consistented of sketches that turned into Lo-Fi mockups in Figma. After creating these mockups, I chose the brand colors, typography, and UI elements to turn the pages from lo-fi to hi-fi designs.
Lo-Fi Mockups
The Ideate phase of the design process started with sketches that turned into Lo-Fi mockups in Figma.
UI Kit
With the layout structure in place, I then focused on the brand identity (creating the logo, brand colors, and typography) and then developed a more in-depth UI Kit, which also included responsive navigation and footer menus, button states, and more.
High-Fidelity Mockups
The final step in the ideate phase involved combining the wireframes and UI elements to create high-fidelity mockups - with a priority on creating pages for the "Get A Quote" user flow.
Phase 4: Prototype
High-Fidelity Prototype
Using Figma, I created a high-fidelity (limited) prototype of the “Get A Quote” user flow.
This prototype allowes users to go from the homepage to completing the quote process.
Phase 5: Test
Usability Test Planning
Test Subject:
High-Fidelity prototype of Kaus website (desktop version)
Task:
Get a car insurance quote for a 2020 Honda Accord after landing on the homepage.
Overview:
10 people in total participated in this usability test for the desktop version of Kaus’ website. Each participant was given the task of getting a car insurance quote for a 2020 Honda Accord after landing on the homepage.
4 participants were tested in-person (with audio and screen recording done through Apple’s Quicktime player).
6 participants conducted their test through an online usability testing tool (Maze.co).
Each participant was given the task beforehand and asked a series of follow-up questions to gain deeper insight into their experience with the website and quote process.
Objective:
- Gain insight into the users' first impressions of the homepage and the information/design layout (does it build trust and confidence?)
- Observe what path users prefer to take when starting the quote process
- Test how easy it is for users to select an insurance type and complete the quote process
- Observe how long it takes users to complete the quote process
- Gain insight into any areas where users feel confused or discouraged
Testing Takeaways
Overall, testers found the site to be simple, clean, and focused.
Based on feedback, one way to improve the experience is to put more focus on why users should choose Kaus - whether that’s through creating a more compelling USP or highlighting benefits and bundles/opportunities to save better.
An insight mentioned by multiple participants was an expectancy to see more info on discounts before reaching the final quote page.
I solved this problem during revisions by adding a “Discounts” section to the quote form process that updates as users input information at each step of the quote process.
Summary
Summary
During this project, Kaus gained deeper insight into their competitors and users, developed clear information architecture, established their brand identity, and now has high-fidelity mockups for their Home page & "Get A Quote" user flow.
Due to the time constraints of this project, I was only able to design a limited amount of screens and functionality within the prototype.
I used the feedback from the usability testing to make high-priority revisions which included redesigning the Car Insurance page to add more details about ways to save and why users should choose Kaus. I also added a feature that allows users to see their details and discounts they qualify for as they go through the quote process.
The next steps include continuing to test and iterate on the design, as well as build out more pages.
Deliverables
High-Fidelity Mockup and Prototype
Brand Style Guide
UI Kit
(High-Fidelity screens for the "Get A Quote" user flow)