Better.com is a digital mortgage lender that aims to elevate the outdated insurance market by providing a 100% digital experience. After users lock down their mortgage on Better, they can also browse insurance carrier quotes.

However, in order to check out the final price, users need to visit each carrier website to customize and pay for the quote. After this step, they need to return to Better.com to upload the quote. Often times, users become frustrated by the lengthy process and do not return to Better.com.

How can we create a one-stop shop for homeownership? Can we make the process more accessible and hassle-free?

The goal was to create easy access to gain homeownership. The new feature provided a win-win solution both to the user and company; from a user standpoint, it was possible to  complete the entire process from a single platform; from a company standpoint, the chance of losing users could be reduced.

As a freelance designer, I collaborated with Better.com’s  product team, composed of 1 Product Manager, 1 Data Scientist, 1 Marketer and 1 Customer Service Associate, to design the final solution, which resulted in 80% increase in user click.

Design Preview

Here are the highlights of the final solution that I created as a final deliverable for the Better Mortgage team.

Understanding the Market

Because I was completely new to the insurance market, I first decided to kickstart the proejct by getting myself familiar with the market. Since there was a bunch of insurance companies out there, I conducted competitive research to understand the overall insurance industry and the unique value proposition that Better.com could provide to users.

For my research, I created a list of insurance companies and sorted them based on the two criteria:

• Is the service based on digital service or brick-and-mortar shops?
  
• Does it provide a general insurance service or more specific ones (i.e. homeownership, automobiles, etc)?

In order to visualize the degree to which each company positions and differs itself in the market, I created the competitive matrix. From this exercise, I defined the unique value of Better.com as a '100% digital insurance service specifically for homeownership.'

User Interviews & Surveys

Once I had a clear understanding of the product, my next priority was to understand the user experience. I reached out to users through 30 Google forms surveys and 7 in-depth qualitative interviews.

The goal was to understand the usability and navigation challenges with Better.com. While I asked key questions, such as 'how did you do your research?,' I mainly let the conversation free flow to collect unbiased responses.

After collecting user research data, I went through the process of affinity mapping to identify my users' wants, needs and goals. Among those who participated in the research,

85% Want Apples to Apples Comparison
Users want to compare different options all at once instead of visiting insurance websites and ending up with multiple Chrome tabs open on their browser. They want to save up their time and energy on research.

90% Value Quality Over Quantity
Users consider insurance as long-term financial investment. If they can get more value (i.e. better coverage, higher rewards, etc), they do not mind spending extra money.

100% Require Agent Support
Users want to feel confident about their choice. They want to talk to agents for advice and assurance. However, they want agent phone calls only when they need, not every single time. While they look out for agent support, they want to have control over the communication.

Honing in on User Experience

I created a fictional character, Frank, whose goal, pain points, and needs aligned with those of our target users’.  I referred back to him throughout the project to stay focused on the audience I was designing for.

I created a fictional character, Frank, whose goal, pain points, and needs aligned with those of our target users’.  I referred back to him throughout the project to stay focused on the audience I was designing for.

Based on what I learned from research, I narrowed down the problem space by developing the problem statement.

How might we help users save time on searching for homeowners insurance policies and receive help from agents only when they want?

Design Studio

Now that I had a clear understanding of the user experience, I arranged an in-person meeting with Better Mortgage's Product team. The purpose was to brief research findings to non-designers and spearhead the product strategy as a team. I wanted to ensure that the entire team was aware of the user experience and that nothing came as a surprise after handing over the final deliverables. The face-to-face meeting helped ensure that everyone was all on the same page.

Exploring Design Treatments

Once we knew which features to focus on, I collaborated with my design partner to examine the competitive websites for design inspirations. This exercise gave us specific examples for turning the 'must' features into visual design.

Design Sketches

After the group meeting with the entire product team, my design team quickly jumped into producing basic sketches.

I facilitated another round of design studio only with the design team this time to figure out how to integrate the new 'must' features into design. Here is the layout we created for the price comparison screen.

1. Agent Contact Info for users to reach out for help anytime, anywhere
‍
2. Vertical Display of insurance quotes so that users can compare each option directly from a single page

3. AI Chatbot for users to get quick assistance

Wireframes

Now, it was time to elevate the basic sketches to medium and high fidelity screens. I divided up the screen design with my designer, while my ux researcher oversaw the entire process to ensure the design stayed within the research insights.

For each screen and flow, we based our decision by balancing the users’ need for simple research and the company’s goal to increase user conversion.

Interactive Prototype

Here is the live interactive prototype that I created using Invision. The video captures the key user flow of the solution.

Before and After

Here is the direct comparison of the old and new designs to help understand how design improved.

Design Impact

We ran usability test to understand how successful the final solution was in addressing the key metrics. Here were the results: