Redesigning the Loan Estimator
Lead UX Designer | Enterprise Lending Platform
UX
Visual / Interaction Design
Wireframes
Prototyping
Mentorship
Overview
The Loan Estimator was a critical broker-facing tool used to generate and communicate loan scenarios to borrowers. While heavily relied upon, the experience lived within a legacy system and was difficult to use, slow to adjust, and inconsistent with modern enterprise standards.
I led the redesign of the Loan Estimator to simplify complex inputs, improve clarity and speed for brokers, and create a scalable foundation aligned to a broader design system transition. In parallel, I mentored a junior designer on the project, balancing hands-on design work with guidance, review, and shared problem-solving.
My Role
As the lead designer, I owned the end-to-end UX strategy and execution for the Loan Estimator. This included defining the problem, shaping the approach, driving key design decisions, and ensuring the work met both user and business needs.
I worked closely with product, engineering, and stakeholders, while also mentoring a junior designer through flow mapping, design iteration, and delivery. I led by example, designing critical parts of the experience myself while using working sessions and review cycles to level up the designer alongside me.
Responsibilities included:
UX strategy and design direction
Discovery and flow definition
Critical screen design and interaction decisions
Mentorship, design reviews, and delivery oversight
Overview
The Loan Estimator was a critical broker-facing tool used to generate and communicate loan scenarios to borrowers. While heavily relied upon, the experience lived within a legacy system and was difficult to use, slow to adjust, and inconsistent with modern enterprise standards.
I led the redesign of the Loan Estimator to simplify complex inputs, improve clarity and speed for brokers, and create a scalable foundation aligned to a broader design system transition. In parallel, I mentored a junior designer on the project, balancing hands-on design work with guidance, review, and shared problem-solving.
My Role
As the lead designer, I owned the end-to-end UX strategy and execution for the Loan Estimator. This included defining the problem, shaping the approach, driving key design decisions, and ensuring the work met both user and business needs.
I worked closely with product, engineering, and stakeholders, while also mentoring a junior designer through flow mapping, design iteration, and delivery. I led by example, designing critical parts of the experience myself while using working sessions and review cycles to level up the designer alongside me.
Responsibilities included:
UX strategy and design direction
Discovery and flow definition
Critical screen design and interaction decisions
Mentorship, design reviews, and delivery oversight
Overview
The Loan Estimator was a critical broker-facing tool used to generate and communicate loan scenarios to borrowers. While heavily relied upon, the experience lived within a legacy system and was difficult to use, slow to adjust, and inconsistent with modern enterprise standards.
I led the redesign of the Loan Estimator to simplify complex inputs, improve clarity and speed for brokers, and create a scalable foundation aligned to a broader design system transition. In parallel, I mentored a junior designer on the project, balancing hands-on design work with guidance, review, and shared problem-solving.
My Role
As the lead designer, I owned the end-to-end UX strategy and execution for the Loan Estimator. This included defining the problem, shaping the approach, driving key design decisions, and ensuring the work met both user and business needs.
I worked closely with product, engineering, and stakeholders, while also mentoring a junior designer through flow mapping, design iteration, and delivery. I led by example, designing critical parts of the experience myself while using working sessions and review cycles to level up the designer alongside me.
Responsibilities included:
UX strategy and design direction
Discovery and flow definition
Critical screen design and interaction decisions
Mentorship, design reviews, and delivery oversight
Defining What Was Broken
1
Contextual Observations & Broker Feedback
I conducted a full usability audit of the existing CaliberLE workflow in H2O: screen-capturing every step, documenting pain points, and testing interactions to understand how users navigated the system and where errors or friction occurred.
Legacy estimator required scattered inputs across multiple screens
1
Contextual Observations & Broker Feedback
I conducted a full usability audit of the existing CaliberLE workflow in H2O: screen-capturing every step, documenting pain points, and testing interactions to understand how users navigated the system and where errors or friction occurred.
Legacy estimator required scattered inputs across multiple screens
1
Contextual Observations & Broker Feedback
I conducted a full usability audit of the existing CaliberLE workflow in H2O: screen-capturing every step, documenting pain points, and testing interactions to understand how users navigated the system and where errors or friction occurred.
Legacy estimator required scattered inputs across multiple screens
2
Contextual Observations & Broker Feedback
Next, I facilitated working sessions to map the end-to-end broker workflow. Together with the junior designer, we diagrammed the current state and proposed a simplified flow that reduced redundancy and clarified intent at each step.
I guided the overall structure and decision points, while encouraging the designer to contribute alternatives and rationale, using flowcharts as a teaching and alignment tool.
Quick journey map of the current LE flow
Architecture of legacy Fees / Disclosures
2
Contextual Observations & Broker Feedback
Next, I facilitated working sessions to map the end-to-end broker workflow. Together with the junior designer, we diagrammed the current state and proposed a simplified flow that reduced redundancy and clarified intent at each step.
I guided the overall structure and decision points, while encouraging the designer to contribute alternatives and rationale, using flowcharts as a teaching and alignment tool.
Quick journey map of the current LE flow
Caption
2
Contextual Observations & Broker Feedback
Next, I facilitated working sessions to map the end-to-end broker workflow. Together with the junior designer, we diagrammed the current state and proposed a simplified flow that reduced redundancy and clarified intent at each step.
I guided the overall structure and decision points, while encouraging the designer to contribute alternatives and rationale, using flowcharts as a teaching and alignment tool.
Quick journey map of the current LE flow
Caption
Designing a Faster, Clearer Broker Workflow
3
Early Concepts
With the flow defined, we moved into early design exploration. I designed core layouts and interaction patterns, then collaborated with the junior designer to explore variations in input grouping, terminology, and hierarchy.
These early designs focused on:
Reducing cognitive load
Making cost drivers more visible
Supporting quick scenario changesconstraints.
New flow centralizes inputs and surfaces real-time calculations
3
Early Concepts
With the flow defined, we moved into early design exploration. I designed core layouts and interaction patterns, then collaborated with the junior designer to explore variations in input grouping, terminology, and hierarchy.
These early designs focused on:
Reducing cognitive load
Making cost drivers more visible
Supporting quick scenario changesconstraints.
New flow centralizes inputs and surfaces real-time calculations
3
Early Concepts
With the flow defined, we moved into early design exploration. I designed core layouts and interaction patterns, then collaborated with the junior designer to explore variations in input grouping, terminology, and hierarchy.
These early designs focused on:
Reducing cognitive load
Making cost drivers more visible
Supporting quick scenario changesconstraints.
New flow centralizes inputs and surfaces real-time calculations
4
Refinement & System Alignment
As designs matured, I led refinement efforts to align the experience with the emerging design system, ensuring consistency without sacrificing usability. I provided detailed feedback and direction to the junior designer, while continuing to design complex states myself.
Decisions were reviewed with product and engineering to balance usability, feasibility, and delivery timelines.
4
Refinement & System Alignment
As designs matured, I led refinement efforts to align the experience with the emerging design system, ensuring consistency without sacrificing usability. I provided detailed feedback and direction to the junior designer, while continuing to design complex states myself.
Decisions were reviewed with product and engineering to balance usability, feasibility, and delivery timelines.
4
Refinement & System Alignment
As designs matured, I led refinement efforts to align the experience with the emerging design system, ensuring consistency without sacrificing usability. I provided detailed feedback and direction to the junior designer, while continuing to design complex states myself.
Decisions were reviewed with product and engineering to balance usability, feasibility, and delivery timelines.
Validating Usability With Brokers and SMEs
4
Prototyping & Validation
I worked with the junior designer to assemble an interactive prototype that simulated real broker workflows. This allowed us to pressure-test complex scenarios and ensure the experience behaved intuitively before development.
I led prototype reviews, coached improvements, and ensured feedback was translated into concrete design changes.
5
User Feedback & Key Insights
Feedback from brokers and internal stakeholders reinforced several key themes:
Brokers needed faster iteration on loan scenarios
Language and grouping needed to better match how brokers think
Visibility into how changes affected estimates was critical
These insights informed final adjustments and reinforced the value of simplifying without removing control.
Synthesized results with rainbow spreadsheet
5
User Feedback & Key Insights
Feedback from brokers and internal stakeholders reinforced several key themes:
Brokers needed faster iteration on loan scenarios
Language and grouping needed to better match how brokers think
Visibility into how changes affected estimates was critical
These insights informed final adjustments and reinforced the value of simplifying without removing control.
Synthesized results with rainbow spreadsheet
5
User Feedback & Key Insights
Feedback from brokers and internal stakeholders reinforced several key themes:
Brokers needed faster iteration on loan scenarios
Language and grouping needed to better match how brokers think
Visibility into how changes affected estimates was critical
These insights informed final adjustments and reinforced the value of simplifying without removing control.
Synthesized results with rainbow spreadsheet
On a scale of 1 (very easy) to 5 (very heard), how would you rate the ease of using this product?
Think about the length of time you spent going through the steps. How would you rate the length of time it took to complete? 1-very short, 5-very long
Final Designs for a More Useful Broker Portal
6
Final Design & Delivery
The final Loan Estimator delivered a clearer, faster, and more flexible experience for brokers. Inputs were organized around decision-making, outputs were easier to explain to borrowers, and the overall flow supported real-world conversations.
I led final design reviews, ensured the work was developer-ready, and supported clean handoff. The junior designer contributed confidently at this stage, having been gradually handed ownership throughout the process.
6
Final Design & Delivery
The final Loan Estimator delivered a clearer, faster, and more flexible experience for brokers. Inputs were organized around decision-making, outputs were easier to explain to borrowers, and the overall flow supported real-world conversations.
I led final design reviews, ensured the work was developer-ready, and supported clean handoff. The junior designer contributed confidently at this stage, having been gradually handed ownership throughout the process.
6
Final Design & Delivery
The final Loan Estimator delivered a clearer, faster, and more flexible experience for brokers. Inputs were organized around decision-making, outputs were easier to explain to borrowers, and the overall flow supported real-world conversations.
I led final design reviews, ensured the work was developer-ready, and supported clean handoff. The junior designer contributed confidently at this stage, having been gradually handed ownership throughout the process.
Broker Efficiency
Faster creation and iteration of loan scenarios, enabling brokers to adjust terms in real time.
Scalable Design Foundation
Established a reusable estimator pattern aligned with modern design system standards.
Clearer Borrower Conversations
Reduced friction during borrower-facing discussions by making estimates easier to explain and compare.
Team Growth & Delivery
Strengthened team output through hands-on mentorship and shared ownership throughout delivery.
"
I could trust Zach to dive into any challenge, investigate and understand how and why things worked and collaborate with people across different business channels. He was always methodical and thoughtful in his approach and willing to iterate and adapt leveraging feedback from anyone.”
- John Burrows, VP of Product Design
Let’s make something great.
linkedin.com/in/zachandwhite
zachandwhite@gmail.com
Let’s make something great.
linkedin.com/in/zachandwhite
zachandwhite@gmail.com