6 weeks
UX/ UI Design
Research
Branding
Figma
Whimsical
Photoshop
Kaus is a big insurance company with 30+ years of experience. They sell insurance to agents (B2B), who then sells to customers.
Its current B2B business model has hindered the growth of a younger customer base. They want to get into the digital market by selling insurance directly to young people through an e-commerce website (B2C).
Design an e-commerce website with an easy insurance quote and purchase process.
Insurance is a complex industry. I don’t know much about insurance when I started this project. I conducted research to understand the market place and the decision making process of users.
I started off my research with competitive analysis. It helped me understand the current market space, the strength and weakness of competitors, and opportunities and limits.
• Product focus: most direct competitors focus on health & life insurance while indirect competitors (bank) focus on other areas
• Not all competitors provides online quotes
• Information amount is important: some had too much info and some had too little
• Transparency is important: users might leave if they cannot find the information they want
I wanted to hear from users about their insurance purchasing experience, including their goals and needs, their purchase decision criteria, the process & pain points.
My assumption: users who are/ aren’t working have different financial capcity to purchase insurance.
I interviewed 5 participants in person and learned the following:
It turns out that my assumption was wrong. Both working and non-working groups have similar price sensitivity. They all want a cheap price, BUT they are not digging for the cheapest price. They don’t want to do more work if the price difference is little.
I created a persona, empathy map, and story board so I can reference Sharon later.
Now that I have empathized with users, I need to define the real problem. As a UX designer, my goal is to make sure I solve for the right problem.
I conducted open card sorting with 3 participants to help me understand what users expect in terms of organization. I then created a sitemap based on the result.
Based on my persona, I defined the task of buying an auto insurance, which involves filling forms and getting a quote. From what I’ve learned, users are mostly frustrated here because of the long process. This will be important for Kaus to pivot their B2C service.
In our young target audience, there are first time buyers and experienced buyers. One of the challenges was to balance these 2 groups. How can I design the website in a way that satisfy both novice and expert users?
I did different sketches and then wireframes to ideate the structure of the website.
Keywords: trustworthy, modern, friendly
I made 3 final designs for Kaus. I decided to go with Design 2 because:
• It preserves the implicit element of a key and an arrow
• Its readability is not affected when zoomed out
→ Design 3 has readability issue when zoomed out
• It is simple, and simple is the hardest sometimes.
I was inspired by sunflower, which gives a bright mood, just like how happy insurance can be. I also picked amber as the main colour, as it's associated with with energy and happiness,
1. Finding the right image & treatment
2. Recall vs recognition
I realized my original design was problematic and old-fashioned. I decided to flesh out the coverage terms with explanations and icons to help users recognize than recall. This piece of info is important to users and therefore deserves more space and higher hierarchy.
It’s time to test how users would react to my product and find out my blind spots! I recruited 6 participants for usability testing. I wanted to test the effectiveness and easiness of the quote form and checkout flow, and if there’s any confusion or difficulty.
All participants successfully completed the task given.
What they liked:
• Image was fun and happy
• quote process was quick and simple
• the grid/ list view toggle feature
What didn't work:
• Confusing question: All participants were confused by the question ‘when did you get your driver’s license’. They did not know if it was asking about G or G1 or G2.
• When a participant wants to browse to auto insurance, I noticed that he was confused if he should click on the icon or ‘learn more’.
With these valuable insights from usability testing, I created an affinity map to help me organize feedback. With time constraint on my mind, I created a priority matrix to guide me on which iterations I should make.
1. where to click?
2. Chat box discoverability
• simplified quote form that only asks for info required to calculate a quote
→ name and address detail will be filled if users decide to purchase
• gives users the flexibility to choose seeing coverage terms in list view or grid view
• fits the needs when doing on different devices (laptop, phone, tablet)
• Create screens for other flows: claims, account creation, other insurance products
• Hand-off
• Insurance is a REALLY complex industry.
• Take the time to really understand and immerse myself in the industry in the beginning.
• Testing allowed me to learn quick and get insights that I have not thought about.
• When getting feedback, it’s hard to change everything and accommodate everyone. It can also be hard to decide if it’s the participant’s individual preference, or if it’s a user problem. Priority matrix can help with the decision to identify the more impactful issues.