Get in touch

Mortgage Hub

Disrupting a 250-year-old industry

The Mortgage Hub web app inside a smartphone and a tablet computer

Duration: 9 months

My scope of work

What is Mortgage Hub?

A white-label mortgage origination service which enables brokers to input customer data quickly and obtain instant lending decisions. The whole process is made faster with Open Banking, as well as the powerful Decision Engine and OCR software under the hood.

Team performance

Throughout my contract

Customer satisfaction

25%

Team efficiency

25%

Timeline reduction

30%

User errors

40%

Design: Broker view

A design of the Mortgage Hub cases page

Managing cases

A design of the Mortgage Hub financial products page

Switching financial products

A design of the Mortgage Hub financial products page

Case timeline

A design of the Mortgage Hub document upload screen

Uploading documents

Mobile designs

Mobile designs

Entering loan requirements

A design of the Mortgage Hub decision processing screen

Decision engine processing

A design of the Mortgage Hub lending decision approved screen

Instant lending decisions

My role

Senior Product Designer

As the Senior Product Designer, I jumped on to Mortgage Hub when it was well on its way to the first release to help nurture and grow the design team, as well as refine the design system, key templates and user journey.

I had to rapidly understand user needs and business requirements through stakeholder interviews while rigorously critiquing the current designs through regular design team reviews, audits and usability studies.

Meet the design team

Who I worked with

A profile picture of Adam
Adam Tannous

Senior UX/UI Designer

A profile picture of Holley
Rucha Pande

UX/UI Designer

A profile picture of Holley
Tanu Sharma

UX/UI Designer

user journey mapping

Mortgage Hub user journey map

A small part of the wider user journey

Insight: Interviews / Recurring stakeholder themes

Sticky notes with user pains written on them

Pains

Sticky notes with user needs written on them

Needs

Sticky notes with user gains written on them

Gains

usability study / Key broker insights

Matt

Task: Change loan amount, resubmit DIP

I need warnings. Where to now?

Mia

Task: Submit FMA

Where's my offer?

Mary

Task: Add extra FMA details

I didn’t know I had to go to fees first!

Morgan

Task: Invite customers to Open Banking

What do the green bars mean?

Recurring themes

Our users

Gaining confidence

Much of the primary and secondary research had been conducted long before my arrival, however, a thorough round of usability studies needed to be actioned to gain confidence in what had already been built.

We discovered that the case navigation was one of the most prevalent pain points and decided to take the necessary steps to develop solutions without scope creep. We actually removed a lot of unnecessary development effort and made the user experience better at the same time.

case navigation / updates from testing

A side by side comparison of the Mortgage Hub navigation before and after user testing

Recurring themes

components

A screen shot of typography

Typography

A screen shot of colour swatches

Colour

A screen shot of Figma text properties

Body text properties

A screen shot of Figma button text properties

Button text proerties

A screen shot of Figma colour styles

Primary colour styles

A screen shot of more Figma colour styles

Secondary colour styles

A screen shot of buttons from the design system

Buttons

A screen shot of the alert components from the design system

Alerts

A screen shot of the main navigation from the design system

Primary navigation

A screen shot of the input and select components from the design system

Input and select

Want to see more?