Kaus Insurance
Responsive Web & Re-Brand
Project Overview
Kaus is an insurance company looking to sell policies directly to customers and tap into a younger target audience
Role
UX/UI Designer
Tools
Sketch
Miro
InVision
Optimal Sort
Timeline
4 Weeks
Challenges
  • Creating an easy and efficient process for buying insurance directly online
  • Catering to the younger target markets needs
Solutions
  • Designing a responsive e-commerce website with a simple checkout process
  • Re-brand to capture the younger more digital target audience

Design Process

1. Research

The focus of research is to better understand the market for selling insurance policies directly to younger individuals who are more digital.

I started by writing a research plan and listing the goals/questions that should be answered:

1. Who are Kaus’ competitors?
2. Who are the potential users looking for insurance policies?
3.  What insurance policies are the potential users looking for?
4. When choosing insurance, what impacts users decisions?
5.  What factors influence a users decision to choose one insurance over another?

Market Research

I began by doing secondary research about the insurance industry to gain a better understanding of the field. When choosing insurance, the most important factors are recommendations, consumer reviews, digital capabilities, personalization, insurance on demand, price, quality of service, and company reputation. Companies are focusing their target demographic to younger tech savvy individuals because of their customer lifetime value. This research helped me identify Kaus' competitors and the demographic of people that I will interview.

Then, I created a competitor analysis and listed the strengths and weaknesses of each company. Most competitors don't list their insurance offerings and force the user to start a quote first. Once the user fills out their information, they are given recommended options for the user to choose from. This helped me understand why the quote process was important because insurance can be different for each person. After getting quotes from many different insurance companies, I realized the form sheets are simple with 1-3 questions per page. This prevented user errors and created a delightful user experience rather than users scrolling through a one page from with multiple questions. These insights were useful when designing the quote form for Kaus.

User Research

I started by listing questions that would reveal insights to target users pains and gains.

I interviewed 4 participants who were tech savvy millennials to gain an understanding of their experience when buying insurance. When buying insurance, most users avoid speaking to agents and want to do most of the steps online to save time and make the process as efficient as possible. They avoid speaking to agents because of the long wait times and all the information they must give at once. Most participants must find a convenient time to research different insurance companies and speak to agents.

User Persona & Empathy Map

Based on market and user research, I listed the key insights to create an empathy map listing what I know about the target user and gain deeper insights.

Then, I consolidated the insights to create a user persona that addresses the major needs, experiences, behaviors, and goals of the target user. This helped me empathize with the users and understand what problems I need to create solutions for when designing.

Here is Bianca who is an embodiment of my interviews. She wants to find an insurance company that she can trust has her back. Her frustrations arise when she can't find information online and must rely on speaking to an agent. Having Bianca as my persona helped me hone on my target audience.

Key Takeaways

During the research phase, I was able to learn about insurance and the process users go through to request a quote. During user interviews, I learned the frustrations users come across when choosing insurance such as going through the quote process. Those insights helped me create a user persona and empathy map that forced me to think like the user. The competitor analysis allowed me to uncover various solutions to user problems and quote process flows that could be explored in my design. Having no experience with insurance, the research phase was the most intricate part of this design process.

2. Define

During the define phase, I synthesized all the data I have collected during the research phase to define the core problems that were identified up to this point.

Card Sort

The research showed that users have difficulty finding information on insurance websites. Understanding how users would find information was vital for this project. I created a card sort using OptimalSort to get a sense of how users think about categories and find patterns on how users group and label those categories.

I was able to use the similarity matrix and dendrogram to reveal powerful insights to organize and label content correctly. This would help with the information architecture when creating the sitemap and organizing the navigation.

Site Map

Based on the finding of my card sort, I created a sitemap to show the different categories in the website.

The goal was a simple navigation with the main categories of insurance offerings and relevant sub-categories that are placed into drawers. The difficult part was deciding where to place sub-categories in a way users would understand where to find. The four main categories for Kaus' insurance offerings are Life, Home, Health, and Vehicle. Each category would have a set of sub-categories and their list of coverage options.

Task Flow & User Flow

Using the sitemap for reference, I created a task flow to show a single task of how a user could move through the website. Then, I designed a user flow to focus on the different pathways that the user could move through the website and potential roadblocks.

The user flow helped me address all possible "dead ends" that may occur when the user goes through the site. Then, I was able to create the task flow which identified the key pages that would need to be designed before continuing to the next steps.

Key Takeaways

‍During the define phase, I created a card sort to figure out how I would apply information architecture to the design flow. I was also able to learn how users label and group insurance categories that made sense to them. The card sort insights helped me design the sitemap. Then, I was able to use the sitemap to design the user flow showing different ways the user could go through the quote process. After, I designed a task flow to prioritize which pages need to be designed.

3. Design

After the define phase, I integrated my findings and designed wireframes and started re-branding.

Mid-Fidelity Responsive Wireframes

I created mid-fidelity wireframes and used InVision to test out the design.

These wireframes helped me lay out the important pieces I wanted to organize my content for the user. Based on research, I organized the pages from most important to least. Users who want to start a quote fast can use the main CTA. Others who aren't familiar with Kaus, may want to know what they offer before starting a quote. Then, finding out about Kaus and their simple and minimal contact with agent would be listed underneath and so on. I also added a hover button where users can speak to agents if they need help without calling them directly.

During user testing, I asked users to find Auto Insurance and start a quote. I realized the users were using the main CTA to start a quote instead of using the navigation. Therefore, I had to design the drop down function for the main CTA to start quote.

Branding

After researching more about the target audience, I designed the new logo, brand style tile and UI kit.

The goal of the logo was to be simple and easy to remember, while also incorporating the feel of security. I chose the color palette, imagery, and typography based on the companies values which were trustworthy, honest, clean, and secure.
"I want my insurance provider to be honest and trustworthy, I want to feel secure and protected if anything were to happen to me and my family" - Bianca Padilla

Responsive UI Design

After designing the new logo, brand style tile and UI kit, I incorporated all my research and design to create the final UI design

Creating a responsive design was crucial for Kaus because their target audience uses their phone for almost everything. I wanted the design to be consistent and easily accessible for users. I made the input boxes and buttons larger, while keeping the rest of the design the same.

For the quote process, I added a progress bar with labels describing next steps. This would help the user identify where they are in the process and how much more information they must input before receiving a quote. I added a quote summary that would be updated with the users information during each step of the quote process. This would remind the user the information they have already given and allow the user to see if they had made any mistakes.
Responsive homepage (left), Responsive product page (right)
preview of quote process

Key Takeaways

During the design phase, I started by sketching each page of the task flow. I sketched many different designs to let out all my ideas and ensure the best result. Then, I designed mid-fidelity wireframes that would be used to develop the prototype for testing. After getting feedback, I was able to uncover any pain points users had while going through the flow. After, I started the branding based on the companies values and user goals. This helped me finalize the UI design for further testing.

4. Test

Prototype

After designing the responsive UI design, I used InVision to develop the prototype for testing.

Usability Test Plan

I interviewed 5 participants who fit Kaus' target audience to find insights and pain points to improve the usability of the design.
Insights:
  • The users went through the prototype with little to no errors
  • Most users mentioned that they found the quote and checkout process easy and simplified into steps, with a clear indicator of where they were in the process
  • Users took time going through the main navigation to find all the insurance offerings
  • During the quote and checkout process, users mentioned the summary of their quote was important for them to see throughout the process, but some users found the summary too small
Next Steps:
  • Redesign the main navigation showing the main insurance options for a simplified process
  • Redesign the quote and checkout summary section to make it appear more prominent
  • Redesign the testimonials section where it can display more than three quotes
  • Add more iconography to text which will help users understand content

Affinity Map

Based off the usability test results, I created an affinity map to sort, prioritize, and rank user testing feedback and list the potential solutions and next steps.

I used these insights to update and enhance my designs usability.

Final UI Design

After testing the design and focusing on user errors, I used all my findings to improve the designs usability. Then, I updated the prototype for further testing.
Homepage (left), Product page (middle), Single product page (right)
Preview of the quote process

Key Takeaways

During the testing phase, I was able to test the design for its usability. The tests allowed me to watch the user go through the design flow to find any errors that were made that could be fixed. I created an affinity map, based on the feedback I received from the usability tests. I was able to prioritize any pain points the users had and list the next steps to further improve the design.

Conclusion

Throughout the Kaus case study, I learned to dive deep into research to find key insights that would help improve the insurance quote and checkout process. Referring back to research helped me align my goals and solidify next steps. I found that research about the industry was crucial to understanding the flow of buying insurance. Although I have never experienced buying insurance personally, I was able to empathize with the target users to design a simple and usable interface that incorporated the business and user goals.
Preview of Prototype