Case Study: Client App
This case study outlines the design of a client-facing mortgage application that translates complex lending requirements into a clear, guided intake experience for borrowers.
Overview
Replaces a fragmented, high-effort mortgage intake process used by thousands of brokers across Canada. The old format (a one-page form) created friction for borrowers, produced unreliable and untrustworthy data, and left brokers dealing with constant client follow-ups and manual corrections.
Challenge
The legacy intake was dated, only reliably viewed on desktop and overwhelmingly long.
Some of the main issues were:
- Pre-mobile components that barely worked on phones
- No conditional logic, forcing refinance and purchase borrowers through the same fields
- Confusing terminology written for brokers and lenders that meant nothing to the average borrower
- A single monotonous page that seemed to go on forever, leading to anxiety and a high drop-off rate
- Poor data quality, leading to significant broker cleanup and follow-up
- No analytics to understand where users struggled
Borrowers were frustrated, brokers were overloaded, and the overall process was far from ideal for all parties involved.
Approach
I shifted the experience away from “one giant form” and toward a guided conversation.
This meant:
- Reviewing every question and rebuilding the content into logical, human-friendly sections
- Designing one adaptive flow that supports all borrower scenarios, removing the need to answer irrelevant questions
- Rewriting industry-centric terminology into clear, plain language
- Rebuilding every component mobile-first to meet modern usage expectations
- Introducing helpful tooltips and guidance, particularly where borrowers typically got stuck
- Integrating Flinks to capture banking data in a secure, automated way, reducing manual document collection and improving security
- Introducing a Client Dashboard so borrowers can save progress, return anytime, and clearly understand what they have left to do
The goal was to make the process feel calm, predictable, and relevant to avoid overwhelming users.
Solution
The final experience is a clean, step-by-step flow that builds questions based on the borrower’s needs. This streamlined approach is supported by intuitive pre-filled fields, address lookup, and device-friendly inputs. Before submitting, borrowers can review their full application in one clear summary, removing the need to backtrack to check previous answers.
After submission, the Client Dashboard provides transparency into what has been completed and a clear way to track remaining steps.
On the broker side, this ease of use reduces back-and-forth to confirm data, improves accuracy, and gives brokers more confidence in the information shared with lenders and therefore supporting faster deal closings.
Process & Responsibilities
As the Product Lead I owned the project end-to-end:
- Mapped the legacy intake and interviewed high-performing brokers to surface the most common friction points
- Designed flows and questions to ensure a streamlined experience without creating unnecessary work for clients
- Created a full Figma prototype with a reusable design system for future extensions
- Built the UI directly in Angular to ensure 1:1 production parity with design concepts
- Partnered closely with backend leads to integrate Flinks and ensure returned data was presented cleanly and in line with the design system
This ensured the final, production-ready application matched both the original vision and the operational needs of brokers and borrowers.
Selected Interfaces
Landing Page
The first touchpoint for borrowers, built to establish trust and provide clear paths for both new and returning users.
- ‘Create Account’ prioritized to support dashboard adoption
- Right-side panel outlining account benefits
- Broker details available through a simple help icon
- Theming that matches each broker’s network to build confidence with prospective clients
Getting Started
Sets the tone and establishes clarity from the first step.
- Left-side flow showing all steps upfront
- Navigation dots reinforcing progress
- Friendly, conversational language
- Content adapts based on borrower type through conditional logic
- Mobile-first inputs with smart address lookup
Banking
A guided, secure way to share financial information.
- Embedded integration styled to feel fully native
- Optional path for borrowers who prefer manual uploads
- Secure login pulls verified statements instantly
- Saves borrowers and brokers significant manual effort
Dashboard
A reassuring home base where borrowers always know what’s next.
- Personalized welcome message
- Key application details with a clear progress bar
- Full breakdown of remaining steps
- Large CTA to continue where they left off on an application
- Individual progress indicators for multi-borrower applications
Outcomes & Impact
- Over 1.58M+ application entries since launch
- 111K+ dashboard signups, validating the decision to emphasize the value of account creation
- Higher-quality submissions with fewer missing or inconsistent fields, reducing broker workload and enabling faster deal submission to lenders
- Strong completion rates across all device types due to redesigned, responsive inputs
- Reduced document handling and improved security through banking integrations
Overall, the new Client Application is faster, clearer, and more predictable; improving both borrower confidence and broker efficiency.
Final Reflection
A key lesson from this project was recognizing that even helpful automation isn’t for everyone. Secure banking and CRA connections are faster and safer, but some prospective borrowers and seasoned broker professionals preferred manual processes.
Account creation was driven without pop-ups or forced flows, using strong hierarchy and visual emphasis to guide borrowers toward creating accounts.
It reinforced a principle I carry forward: good design leads people where you want them to go without forcing them.