Better Mortgage
Making homeownership more accessible for first-time home buyers
Project Scope
Product Design
User Research
Time Duration
2 Months
1 Product Manager
2 UX Designer
1 UX Researcher 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 to upload the quote. Often times, users become frustrated by the lengthy process and do not return to

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’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.

Easy readability
Using visual icons and short paragraphs to make insurance content easy to understand

Vertical price chart
Enables apples to apples, direct comparison of multiple quotes in one screen

Customer support
Agent contact information with an agent's headshot and a chatbot to keep customer support extremely accessible

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 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 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 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.

Agent Chatbot
We captured Lemonade's agent headshot design to create a human-like feel for chatbots

Visual Icons
We took a note of Liberty Mutual's use of icons that replaced text explanation

Comparison Chart
Users appreciated the vertical chart design  to compare multiple options apples to apples

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


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:




Increase in click rate

Easier to complete task

Increase in overall user satisfaction

What did I learn?

Team Communication
One of the biggest challenges was leading the design team and balancing communication. I ran scrum team meeting everyday for team update and task delegation. Especially when working in a high-stress, fast-paced environment, I learned it was crucial to connect with my teammates both on a professional and personal level. Respect for each person's work and adapting to different communication style helped produce the best outcome as a team.

Respect the System
In this project, it was easy to fall into the trap of making one-off changes and tweaks everywhere in the platform. Stepping back in these moments and realigning myself with the already existing design system guidelines was key towards producing a high quality product in the end.

Communicate Early
I was afraid to show the design to users when it was still work in progress. However, because of the time constraint, I had to move fast to gather user feedback. I showed the draft to people and asked for suggestions. Later on, I realized this practice helped me create a more user-centric design from the beginning.