Project Outline

The goal for this project is to create a modern, responsive e-commerce website that allows potential customers to research, identify and choose a comprehensive insurance plan that fits their individual needs. The secondary goal will bring a fresh, vibrant feel to the website experience that caters to a younger demographic.

Insurance UX/UI

Case Study

Role

Art/Creative Direction
Visual Design
UX/UI Design

Tools

Figma | Miro | UserTesting

Discovery

Scanning the Landscape

The first step in understanding what Kaus would need to do in order to stand out in the online space was to perform competitive analysis on the marketplace to see what was working for other insurance providers. By gaining a deeper understanding of where their competitors were succeeding, this allowed Kaus to take an intelligent approach to their experience.

Users Needs

A series of 5 user interviews were conducted to a broad base of potential customers that provided insight into what current insurance subscribers and customers expected of an online insurance purchase. The questions were tailored to provide useful information around website features that people expected, task flows that were most commonly performed and overall aesthetic appeal when browsing an insurance website.

“I prefer to be presented with the information I need most, and not a lot of other sales language that distracts me from the task I set out to complete.”

— Participant 1

What Comes Next?

Having established the problem and narrowed the focus to two feature requests, the work began to rework the website to function more appropriately for users.

Key Findings

There were several points of emphasis based on the user interviews that offered valuable context into how users preferred to use an insurance website, and where they felt things fell short of their expectations. This was important to factor into the plan for rebuilding their website as it allowed Kaus to begin from a baseline that would provide a solid user experience based on data collected from real customers.

Pain Points

  • Confusing marketing language that prevents completing a designated task

  • Lack of context when performing a task, such as requesting a quote (not using breadcrumbs)

  • No chat feature or option to connect with a human

Wants/Desires

  • Clear pricing, with an emphasis on affordability and value

  • Clear flow of requested information on features and pricing

Explore + Define

Capturing the End User

The next stage was to articulate user personas for perspective clients. By building comprehensive personas based on user interests and desires, this allowed Kaus to better understand what service offerings would be most beneficial to their users. Actionable insight was gained in this exercise that helped form the basis for the functions that would be included in their new website.

Information Architecture

Several methods were used when structuring the IA of the site, including a card sorting exercise that allowed users to categorize the site map links into appropriate categories based on naming and use. This provided an important understanding of how to structure the links that would guide users through the various flows that would be included, and highlighted, when using the site.

Data Analysis

The dendrogram and similarity matrix charts showed how users expected the site to function based on the tasks that are most commonly performed. This data was crucial when building the overall site map, allowing certain tasks to be consolidated into singular flows while providing valuable insight into the links that could be shown in less prominent areas, such as the footer.

Initial Sketches

Based on the research data that was captured in the user interviews and card sorting exercises, the next step was to conceptualize initial site sketches for a prospective design and layout. These sketches placed emphasis in the areas that were mentioned in user interviews including a callout for initiating an online quote and offering chat support.

Primary Sitemap

With sketches in place for design direction the site map was built again using data captured from the research exercises that outlined the importance of structuring the navigation elements into groups that would make sense to potential users. The card sorting process allowed for insight into what groups made the most sense when visiting the site and allowed for prioritization of top-level elements.

Develop + Test

Considering Flow Paths

The task and user flows helped identify key points in the process that needed particular guidance mechanisms to help funnel the user toward the end goal. These iterative mapping tools allowed for a high-level look at how a user might proceed through the designated tasks that will measure successful metrics on the website. This also provided insight into how/where certain navigation items were placed or handled from a design perspective.

Building the Initial Structure

Low-fidelity, responsive wireframes were created to establish a design direction for the layout. The homepage was created in both desktop and mobile sizes to explore how content would align and how various calls to action would be handled. This clean approach to layout design helps with the structure of the content and keeps the focus on how alignment and spacing can affect how a page flows from one section to the next.

Brand and UI

This exploration of brand ideas helped narrow the focus of what the brand should signify. By applying key identifiers, the style of the brand began to take shape and an overall identity came into focus.

High-Fidelity Thinking

With a brand in place and a clear focus on the task execution, the prototype was built to allow for usability testing. This was a crucial step in understanding how users will interact with the website and perform basic functions. The high-fidelity prototype was used for the user testing phase and offered 3 paths for task completion which highlighted top level functions of the website that were major goals set at the beginning of the project.

User Testing

The user testing phase provided deep insight into how the website functioned for basic tasks. This was a very useful method of finding ways to improve the user experience based on the site goals. Some findings included:

  • Users appreciated the clean aesthetic and unobtrusive layout

  • The use of color and type size for visual hierarchy was important

  • Tasks were easy and intuitive

  • Some of the design/style elements needed to be increased for effectiveness

  • Certain task flows could be consolidated

Deliver

Learning Outcomes

Coupled with a comprehensive project brief, the research involved in understanding Kaus’s target demographic was immensely helpful towards building a website experience that works for their needs. Beginning with competitive analysis to establish a baseline, the creation of user personas and conducting user interviews was essential to understand how the site would need to function. Based on those results, a clear path was laid out for how to prioritize key features and functions that would need to be included in the user experience.

Overall, the results present a clean, aesthetically pleasing website design that caters to the needs of target users while allowing core functions to be performed efficiently. The end product is based on research and analysis and matches up well with the initial design brief in terms of goals and metrics.