Mortgage application

Mortgage application

Mortgage application

How I led the design process of digitalizing Ratehub's mortgage application from concept to ship.

Overview

Overview

For years, Ratehub.ca has been a marketplace where users can compare mortgage rates from many providers in one place. However, once users are ready to apply, they get directed to Ratehub's brokerage partner. This resulted in a fragmented user experience.


Ratehub.ca wanted to invest in a one-stop experience that enable users to research, compare and apply for a mortgage. I was part of the core team to deliver this vision.


The result was an MVP that tied together Ratehub.ca's mortgage rates comparison experience and its brokerage services from start to approval.


When the MVP flow went live to 2,000 users in the first month, stakeholders were delighted that we delivered an on-par completion rate and did not receive any bad customer reviews. Since then, the flow has helped over 11,000 Canadians secure their mortgages since 2022.


With such a huge undertaking, the work began with understanding what we knew so that we could find out what we didn't know. It involved the following research process across teams:


  • Competitive analysis - Myself & PM

  • Business and technology audit - Myself, PM, Brokerage team, Developers, CEO, CTO

  • User research - Myself & Mortgage team designer

  • Extensive test plan to ensure minimal funnel drop off - PM & Dev with Design support

Gathering requirements & constraints

Gathering requirements & constraints

Gathering requirements & constraints

Learning from competitors

Learning from competitors

Learning from competitors

I analyzed and took inspiration from 5 other mortgage brokerages to understand how did they structure their question flows. In particular:


  • How did they convey trust and security during personal info collections?

  • How are questions of different types presented?


I presented the following flow comparison to the project team to prep them with what I will be taking inspiration from.

I analyzed and took inspiration from 5 other mortgage brokerages to understand how they structured their question flows. In particular:


  • How did they convey trust and security during personal info collections?

  • How are questions of different types presented?


I presented the following flow comparison to the project team to prep them with what I will be taking inspiration from.

I analyzed and took inspiration from 5 other mortgage brokerages to understand how they structured their question flows. In particular:


  • How did they convey trust and security during personal info collections?

  • How are questions of different types presented?


I presented the following flow comparison to the project team to prep them with what I will be taking inspiration from.

Gathering our constraints with a brokerage tech audit

I worked closely with the product manager and the brokerage team to document the user information we need for an agent to determine what kind of mortgage a user is qualified for and what is needed to complete an application to close the deal.

Gathering our constraints with a brokerage tech audit

Gathering our constraints with a brokerage tech audit

I worked closely with the product manager and the brokerage agents to document all the user information we needed for an agent to determine what kind of mortgage a user is qualified for and what is needed to close the deal.

Interviewing our core persona group to get more insights

Interviewing our core persona group to get more insights

Interviewing our core persona group to get more insights

As we identified that the Core Persona is more likely to use a broker, we decided to choose that as our main persona to design for.

Our Core Persona is thorough in their research and likes to compare options. They have very little affinity to one financial organization and values convenience over loyalty. They like to be known as savvy and resourceful when it comes to financial decisions.

Our Core Persona is thorough in their research and would like to compare options. They have very little affinity to one financial organization and values convenience over loyalty. They like to be known as savvy and resourceful when it comes to financial decisions.

Using a low-fi prototype to get some feedback


We recruited 5 users who fit our core persona profile and set up interviews to learn more about their existing research process and pain points.


I created a low-fi prototype based on business and technical requirements and asked them to walk through the prototype while thinking out loud.

Using a low-fi prototype to get some feedback


We recruited 5 users who fit our core persona profile and set up interviews to learn more about their existing research process and pain points.


I created a low-fi prototype based on business and technical requirements and asked them to walk through the prototype while thinking out loud.

Using a low-fi prototype to get some feedback


We recruited 5 users who fit our core persona profile and set up interviews to learn more about their existing research process and pain points.


I created a low-fi prototype based on business and technical requirements and asked them to walk through the prototype while thinking out loud.

The user needs we've identified:


  1. Users seek a balance of convenience and security: Buying a home is possibly the biggest financial undertaking anyone can make in their life time. Users want to get this process over with quickly but also want to feel safe as they share very personal information online.


  2. Users need a way to return to where they left off. The mortgage application form is long and may require digging up some documents or consulting with their spouses.


  3. Users want a human touch: The convenience of being able to "get an approved mortgage online" does not trump the feeling of security that comes with human contact even for our core persona.

The user needs we've identified:


  1. Users seek a balance of convenience and security: Buying a home is possibly the biggest financial undertaking anyone can make in their life time. Users want to get this process over with quickly but also want to feel safe as they share very personal information online.


  2. Users need a way to return to where they left off. The mortgage application form is long and may require digging up some documents or consulting with their spouses.


  3. Users want a human touch: The convenience of being able to "get an approved mortgage online" does not trump the feeling of security that comes with human contact even for our core persona.

Ideating solutions…

Ideating solutions…

Ideating solutions…

We prioritized the user needs above and started ideating for some solutions.

How might we provide a sense of security throughout the process so users can trust us with their personal details?

How might we provide a sense of security throughout the process so users can trust us with their personal details?

We added trust messages at key steps of the flow to reassure users that their personal data are safe.


When we collect contact information, only the email was asked at account creation and support text was added to explain why.


After user selected a rate, we clearly laid out the value proposition to start an application.

How might we make a long form filling process less overwhelming so that users can fill in their application with ease and at their own time?

How might we make a long form filling process less overwhelming so that users can fill in their application with ease and at their own time?

We sectioned out the questions by type and users could navigate back and forth with a menu on the side.


Answers were automatically saved even if the user did not completely filled out the whole page.

If users needed to get back to it, they could access in-progress applications via a dashboard.


They could always get back to the last place they left off.

How might we provide a human touch throughout the process so that users feel just as reassured as if they were at their home bank?

How might we provide a human touch throughout the process so that users feel just as reassured as if they were at their home bank?

Once an account was created, the agent would reach out via a personal email to help the user complete the application.

Users were not required to provide any documents until they'd been contacted by an agent so they could be sure that their most personal data was handled by a real human instead of just being fed into a machine.

Once an account is created, the agent also reaches out via a personal email to help the user complete the application.

Users are not required to provide any documents until they've been contacted by an agent so they can be sure that their most personal data is handled by a real human instead of just being fed into a machine.

Users could book a meeting with agent at any point in the flow

Results & takeaways

Results & takeaways

We launched the MVP with 2,000 users in the first month, stakeholders were delighted that we delivered an on-par completion rate and did not receive any bad customer reviews.

The mortgage web app has helped over 11,000 Canadians secure their mortgages.

The mortgage web app has helped over 11,000 Canadians secure their mortgage.

As the funnel analysis came in after the launch, we continued to improve Completion and Conversion metrics at every drop off points. Building trust and reducing friction were the continuous themes for our iteration cycles.

My takeaway


User emotions must be handled with care

Of all the product offerings on Ratehub.ca, mortgages application is the most emotional triggering. It's important for design to handle every moment of anxiety with care in order to deliver the best user experience and business results.


Holistic UX-human touch is more important than ever in today's world full of artificial interactions

Technology is taking over a lot of our real world interactions, but the human need for connection will not change even with the advance of AI. None of these features would matter had it not been for our broker agents' impeccable customer service. They were the real MVPs in this MVP.

Haze Kwok | hazehei@gmail.com | 647.739.3834

Haze Kwok | hazehei@gmail.com | 647.739.3834

Haze Kwok | hazehei@gmail.com | 647.739.3834