MARBLE
Insurance Shopping Made Easy
Evaluated, then redesigned, Marble's new feature to provide its members with an informed insurance shopping experience.
Who is Marble?
Having insurance is a way of managing risks; yet, it’s also one of the least understood legally necessary services to this day. Marble seeks to change that by giving members the tools to consolidate their independent insurance policies in a digital wallet to easily compare rates and coverage with a beta feature, Shopping Cart.
Because the designs were completed without user research, they needed evaluative and generative research to support the design decisions prior to the feature release.
Project type
Contract work
Team of 4 designers
My role
UX Research
Prototyping
Usability Testing
Tools
Figma
FigJam
Otter
Maze
What we did
We delivered major changes to Marble's website to aid users in their insurance online shopping experience, key features include:
1. Focusing on the most important customer needs – searching speed
To ensure users could quickly find and compare insurance options, we ruthlessly prioritized and created a new user flow to increase searchability. With the new filter & sort systems, shoppers can shop and compare insurance options to make an informed decision that best suits their needs in just under 60 seconds.
2. Never miss a plan opt-in/out day
We created a Shopping Reminder so that users never miss a policy renewal deadline. They could start looking for insurance options at work and finish buying a policy literally anywhere, as well as send a reminder to themselves for a policy that's expiring soon.
.png)
3. Anticipating users needs – Help shoppers to pick up right where they left off
We streamlined quote search with the new saved quote searches, so now users can see the search/insurance personalization feature front and center. The new quote compares also allow browsers to quickly add any quote information they gather externally and compare quotes.
4. Taking the guesswork out for users
We do the math for you. A guided quote comparison pathway with contextual and digestible diagrams that illustrates the user's quote. In addition, the new filter system + a rating system of the major insurance carriers on each insurance card help users access the information they care about the most immediately.
Our Impact
We tested a variety of screen flows that met the goals and needs of the users.
-
Increased users' focus and engagement usability scores jumped from 30% to 100%
-
Increased the product impression on users, 150% more clicks
In addition, compared to the original design, here's how the new design performs:
37 seconds faster
Users completed the test flows 37 seconds faster
42 % more direct completions
Users completed the flows with an avg. of 80% directness
4.5/5 easiness rating
Compared to 3/5 easiness rating before the redesign
My team and I were able to help insurance shoppers make informed decisions and eliminate time spent on browsing insurance options. Read more about the research and design process below ⬇️
BUSINESS RESEARCH
What did business stakeholders think about “Shopping Cart"?
Before jumping into the design sprint, we chatted with business stakeholders to flesh out product complexities.
Key takeaways:
-
We needed to investigate if members would know to use the "shopping cart" concept to browse for insurance.
-
We needed to eliminate flow distractions and encourage more clicks on the "Get Quote" buttons, an integral aspect of Marble's revenue stream.
-
We needed to evaluate if Shopping Cart, the taxonomy, resonates with users.
-
We needed to uncover trends in shoppers' mental models, and make adjustments to Marble’s pages and user flows accordingly.
-
We needed to revise UX copy to improve clarity.
BASELINE USABILITY
🔍 How was Marble's existing design performing?
Because the design was completed without any user research prior, we decided to the most important first step is to evaluate and support the design decisions to see if it resonates with Marble's members. We conducted 15 usability tests to see what’s currently working and not working for users, as well as a heuristic evaluation to assess its compliance with recognized usability principles.
SYNTHESIS
What did users really think and need?
With a clear sense of the business needs and current website performances, we then interviewed 5 prospective users and 5 existing Marble members to learn how they would go about shopping for insurance.
Key takeaways:
-
We needed to provide convenient ways of shopping that save time.
-
We needed to find ways to educate policyholders about their coverage.
-
We needed to provide better diagrams and data visualization.
-
We needed to create an easier way to compare policies and quotes.
-
We needed to limit communications — insurance shoppers don’t want to be unnecessarily contacted by carriers.
USER JOURNEY MAP
How can we best support insurance online shoppers?
We summarized our research and the needs, challenges, and goals of our target audience by mapping out the process that our archetype would go through as a new Marble user. We considered the steps and emotions that would likely occur, such as, how the users would go about shopping and managing insurance, how they feel, and what they looking forward to, in order to find opportunities for new features and modifications to existing features.
Key takeaways:
Picking the right insurance policy is a lengthy process and many are unsure if the time they spend researching correlates to how satisfied they feel with what they are shopping for. Shoppers need a way to understand the differences between what various insurance companies are offering to purchase an affordable policy.
How might we provide researching shoppers a way to compare insurance quotes between different companies so they can save time and make informed decisions on the best policy for their needs?
IDEATIONS
Our early design concepts
With our persona and her journey in mind, we proceeded to understand the process of how users go about finding and purchasing insurance using a sitemap and user flows.
Key takeaways:
Based on the core insights we discovered in business research, user research, and usability testing of the existing site, we know that the must-have features we needed to deliver are:
-
Overhaul the user flow of the Shopping Cart
-
Create taxonomy system that meets the user’s mental model
-
Provide easy access to Shopping Reminder
-
Add a filter/sort system for
-
Create a digestible quote compare view
EXISTING DESIGN→ HI-FIDELITY DESIGN REITERATION
What did users think about the proposed solution?
In order to see if the reiterations were helpful to users, we went through 3 rounds of unmoderated usability testing with a total of 35 users., each round of test informed our proposed solutions. Here are the major improvements we accomplished:
A more intuitive shopping flow
Previously, users had a hard time using the shopping cart to compare quotes because the UX label, “shopping cart”, was not an intuitive term for them when shopping for insurance.
To solve the problem, we overhauled the "Shopping Cart" concept by updating the UX copy to “Saved Quote Comparision” and utilizing a sticky navigation bar with drop-down tools.
Meeting user's mental model
Users had a hard time leveraging the "Shopping Reminder" tool because the feature was not accessible on the member's home page, Insurance Wallet, where users intuitively looked for.
We added the Reminder tool to the member's home page, where they managed all insurance policies. In addition, we created a reminder tool sticky menu on all shopping routes so that users can still access the tool regardless of their location on site.
Incorporating user's feedback and preferences
In our tests, we learned that participants enjoyed using the filter/sort system to browse insurance by categories, and they would love to have a similar capability to compare quotes more efficiently. As a result, we created a filtering system by making the product category dominate the home page so users can see it first thing. In addition, we added Insurance Insider Ratings in individual insurance cards to allow users to find the insurance option they needed as soon as possible.
Introducing... Marble Marketplace
We created the visual system by following Marble's existing brand characters as well as incorporating some honest and playful senses. The reusable assets and subtle interactions were then designed to reflect the core identity.
NEXT STEPS & REFLECTION
In the rearview
If I had the opportunity to continue working on this project, I'd focus on:
-
Conduct another round of moderated testing to further understand the usability of the new design.
-
Explore a Marble browser extension — an AI-powered extension that auto-fills insurance information on forms, as well as automatically sends quotes back to Marble's quote compare.
What I learned
-
Product designs <> Business outcomes are two-way streets: This was the first UX project I picked up after pivoting my career from being a marketing professional to a UX-er and working directly with the business stakeholders, I was able to gain an immediate understanding of how design directions impact a business's needs and outcomes tremendously.
@ Peggy Lu 2023