Create Levia’s first direct-to-consumer website for insurance sales and structure the user experience and branding to appeal to a younger clientele.
Purchasing insurance can be overwhelming, confusing and create a lack of trust between the customer and the company. Creating a friendly and easy-to-use website can combat some of these pain points.
A fully responsive and friendly website that appeals to Levia’s target market, while showcasing their insurance offerings in a welcoming and approachable way. Prototype available here.
UX/UI Design, Branding
Concept project
Levia is a concept insurance site that has over 30 years of experience selling insurance but is transitioning to direct-to-consumer sales for the first time. Therefore, they needed a well-designed, responsive site that conveys their brand goals of “clean”, “modern” and “trustworthy”. The company is specifically interested in targeting younger customers as they believe that’s where they are lacking in recognition, even though they have well-priced products that are specifically designed for younger consumers.
Levia’s new site will appeal to a younger audience and present their insurance offerings in a clear, easy-to-use way.
There are many insurance companies out there and I had to find out what the landscape was in order to know how to set Levia apart. I created a research plan in order to outline the goals and strategy for tackling this project.
The market for insurance is filled with competitors offering similar products. It was important to do an in-depth competitive analysis to understand the insurance landscape, identify useful patterns to replicate, and where to step outside the patterns and differentiate Levia. I rounded up information and got quotes from Geico, Lemonade, Clearcover, Oscar Health and Progressive.
These companies were chosen because they were direct competitors and/or provided inspiration for the design. From the landscape analysis, I learned about the organizational hierarchy needed for a complex insurance site with many offerings (Progressive and Geico) as well as the delightful experience of using a well-designed site (Lemonade, Oscar Health). I wanted to combine both of these aspects into the design of the Levia site. I created this matrix to organize the findings from the competitive analysis.
The next step was talking to insurance-buying customers in Levia’s target demographic (younger customers). I created an interview guide with open-ended questions about the participants’ experience researching and purchasing insurance online and conducted five telephone interviews with people ages 26-37.
I created the following empathy map to organize the findings from the interviews.
I looked for themes within the empathy map and four main themes emerged fairly quickly: Ease of use, Complexity/Confusion, Distrust and Price.
From the insights within the four main themes, I constructed various “how might we” statements to brainstorm how to turn the insights from the interviews into opportunities for the design of the Levia site. I based my site features directly on these insights pulled from the user interviews.
Customers aren’t sure exactly what they need, so they want to be able to tweak and configure their plans to compare options.
A website that is slow or hard to use is off-putting.
Customers want to know that their specific needs are being considered.
How might we allow customers to configure plans as they shop?
How might we build a site that functions smoothly?
How might we provide opportunity for users to convey their specific needs?
How might we guide users through the shopping process?
The density of information presented on insurance websites can feel complex and confusing.
The barrier to entry in understanding insurance as a whole is so high that it feels overwhelming and off-putting.
How might we clearly provide explanations of our products?
How might we introduce users to complex terms?
How might we provide support for users who are confused?
Customers don’t trust the insurance industry as a whole.
Customers are wary of insurance companies trying to swindle them.
How might we increase transparency in our explanations of our company and products?
How might we organize information to build a sense of clarity?
How might we leverage longevity in the industry to create trust?
How might we build trust through typography and color?
Customers are very motivated by price.
Price is the number one thing that customers look for when shopping around for insurance.
How might we ensure our prices are competitive?
How might we ensure users find the information they want quickly and easily?
Based on the “how might we” statements, I developed these goals for the site that are shared between the business and the consumer:
From these goals, I developed a set of product features, supported by both the competitive analysis and the user interviews, that began to help the site take shape.
In laying out the content for the Levia site, I wanted to make sure that it was easy to navigate and users could quickly find the information they were looking for. I paid close attention to categories that would help both beginner and advanced users.
I conducted a card sorting exercise with six users to hone in on the information architecture of the site.
I found that the main site categories that emerged were: Plans, Questions and Definitions, My Account, and Starting a Quote, which I used to create the basic framework for the site. I created a sitemap with details about each page and subpages to map things out.
With these categories in mind, I sketched out a few versions of the desktop landing page to get a sense of the hierarchy of content and the navigation categories.
Next, I mapped out a user flow. I wanted to plan out these flows so I could practice walking through the site and make sure that the content flow was intuitive. As the main flow of the site, I chose the process of getting a quote. From the user interviews, it was clear that anyone interested in purchasing insurance from Levia would most likely go through this flow, as this is the best way to assess the offerings and most importantly, check the price.
With the user flow mapped out and the information architecture taking form, I went back to my competitive analysis and looked for any design patterns that were particularly successful on the competitor sites. I drew inspiration from care/of, TurboTax and Lemonade for the wizard portion of the site. I also looked at Progressive Insurance, Oscar Health, Parsley Health, and Pipette for inspiration related to the subnavigation experience, testimonials, and other sections of the landing page.
From there, I designed my responsive wireframes for the landing page, sub navigation and quote wizard. In putting together my wireframes, I focused on the information architecture and the hierarchy of content presented. I combined elements from all three of my landing page sketches to create the best layout.
I also focused on the design of the wireframes to get a visual sense of the design patterns. An important lesson from this process was that in making pixel perfect and well-designed wireframes, I had to work a little harder to break out of this box when designing the actual UI. There is a balance in wireframes between designing useful mockups but not boxing yourself in to certain patterns or structures when going from wireframes to UI. This was an important lesson to take forward into future design projects.
Find the desktop wireframe prototype here and the mobile wireframe prototype here.
My next task was to venture fully into the UI for the Levia site. From the user interviews, it was clear that customers wanted an easy-to-use site that looked trustworthy and professional. I used Pinterest to collect inspiration and settled on two main directions for the Levia brand. The first, a calm, clean and caring vibe; and the second, a bold fun and energetic vibe.
I played around with designing certain portions of the site in each style and it became quite clear that the calm, clean and caring version of the brand was much more successful and fit better with the user research results.
I then developed the logo for the Levia brand. I decided to go with a clean wordmark for the brand, rather than a more complex logo. My competitor research showed that most companies have a wordmark logo to distinguish their brand. I browsed typefaces and assessed their compatibility with the brand in three different type styles: levia, Levia, and LEVIA. My final pick, Ennore, conveyed the right combination of friendliness and professionalism.
I chose the colors of the site to convey a calm and caring vibe, while appealing to millennial users. I chose the Tiempos typeface to convey a professional aesthetic, as I didn’t want the site to come off too cutesy with the combination of color and type. I chose Ginger Pro as a clean, neutral but modern typeface for the body text. I used this typography style guide as I was designing my screens, but found that the colors I had initially chosen didn’t work well for the style I was going for. The process of laying out the content in this style told me that something was a bit off with the feel of the site. I played around with color until I found better alternatives. For the final site, I also added photography instead of just illustrations. It felt nice to see human faces on a site for something that can be as cold as insurance. See below for the full UI kit in the final style!
Here are my final screens from the desktop version of the Levia site. I also designed key responsive screens so that users could be sure to have a great experience with the site, no matter what device they are using.
Check out the full desktop prototype here.
After finalizing the responsive designs, I created a UI kit to map out all the design patterns and styles for a future developer who would build this site.
I conducted user testing with the Figma prototype to test whether the Levia site is friendly, approachable and easy to use. I wanted to know whether the users felt that they could get the information they came to the site for and whether they would consider purchasing insurance from Levia.
I conducted the testing with three participants ages 31-37. The testing was conducted over Zoom, using a split screen. I was able to see the participants faces at the same time as viewing their mouse on the screen, clicking through the site.
I created an affinity map to collect and organize all the insights from the testing interviews.
Overall, my findings from the user testing were as follows:
I made a few changes to the prototype, including on the coverage details page, changing the text of “Activate my coverage” to something less intimidating and including a link to full coverage details. I also changed the image on the final purchase complete screen to differentiate it from the homepage, as one participant was confused by that.
No major usability issues emerged from the testing. I am confident in my designs; however, I do think it is important to conduct testing with more people in the future to have a greater chance of finding patterns in their experiences.
Overall, I am happy with how the Levia site turned out. I managed to take the goals of the client and results of the research process to turn it into a usable and friendly site. It was validating to know that a younger audience responded to the look and feel of the site, which was exactly Levia’s target demographic with the design of their new site.
Through the research process, it was clear that users are very skeptical of insurance companies and will do their own research to assess the trustworthiness of the site. There is only so much that the user experience and user interface design could help with that. In the future, I think adding a landing page section for third-party reviews would have been helpful in conveying trust.
Especially for millennials, though, good design can convey a trustworthy company or generally a company that the user wants to engage with. So, I did indeed focus my design on that.
Overall, this concept insurance site provided a good challenge and set of lessons to take with me to my next projects.
