Mortgage Brain: Unifying a Suite of Mortgage Products.
When I joined Mortgage Brain, design was largely handled by engineers, resulting in inconsistent user experiences across the product suite. As the company's first Product Designer, I was responsible for introducing product design practices while creating a scalable Design System that could be adopted across multiple applications.
Working closely with Product Owners, developers and stakeholders, I designed a shared component library and established consistent design principles that improved collaboration, accelerated development and created a more cohesive experience for brokers and lenders.
The project transformed not only the products themselves, but the way teams designed and built them.
Mortgage Brain's products had evolved independently over many years.
Without a dedicated design function, interfaces varied between products, similar interactions behaved differently and development teams often recreated components from scratch.
This inconsistency created challenges for both users and developers.
As a result:
User experiences differed across the product suite.
Design decisions were inconsistent.
Components were repeatedly recreated.
Development became slower and less efficient.
Design lacked a clear voice within the organisation.
The Problem
The first step was understanding how each product had evolved and identifying common patterns that could be standardised.
Working with Product Owners and engineering teams, I audited the existing interfaces, mapped recurring components and identified inconsistencies in layouts, navigation and interaction patterns.
Alongside the interface audit, I worked with stakeholders to understand business priorities and establish where a shared Design System could create the greatest value.
This discovery phase helped define the principles that would guide both the Design System and future product development.
Understanding the Problem
Before
After
Rather than redesigning every screen individually, I focused on creating reusable foundations that could support the entire product suite.
The Design System included:
Reusable UI components.
Typography and colour standards.
Grid and spacing principles.
Form patterns.
Navigation components.
Interaction guidelines.
Documentation for developers.
Designing at a systems level allowed teams to solve problems once and reuse those solutions across multiple products, improving both consistency and efficiency.
Designing the Solution
Creating the Design System was only part of the challenge. Encouraging teams to adopt it was equally important.
Initially, uptake was slow as engineers and stakeholders were accustomed to existing ways of working.
To encourage adoption, I presented the Design System across the business, demonstrated the benefits of reusable components and worked closely with development teams to integrate it into their everyday workflow.
Within three months, the Design System had achieved full adoption across the organisation.
This project highlighted that successful Design Systems rely as much on communication and collaboration as they do on component libraries.
Driving Adoption
The Design System evolved through continuous collaboration with Product Owners and developers.
Components were reviewed as they were introduced into products, allowing patterns to be refined through real implementation rather than theoretical documentation.
Testing focused on questions such as:
Could components be reused across multiple products?
Were interaction patterns consistent?
Did developers find components straightforward to implement?
Did the system reduce unnecessary design and development effort?
Regular feedback helped improve documentation, refine components and increase confidence across teams.
Testing
The completed Design System became the foundation for every new product and feature developed within Mortgage Brain.
Key improvements included:
Shared component library.
Consistent interaction patterns.
Unified visual language.
Faster design-to-development handover.
Improved collaboration between Product and Engineering.
A scalable foundation for future product development.
The system established a consistent experience across the Mortgage Brain Suite while making future product work significantly more efficient.
Final Product
The Design System delivered measurable improvements for both the business and development teams.
The project achieved:
100% Design System adoption within three months.
Consistent user experiences across multiple products.
Reduced duplication of design and development effort.
Faster implementation through reusable components.
Improved collaboration between Product and Engineering.
The project demonstrated how introducing design as a strategic capability can improve both products and the way teams work together.
Measuring Success
Being Mortgage Brain's first Product Designer meant influencing not only the products but also the organisation's approach to design.
This project reinforced that Design Systems are ultimately about people rather than components. Success came from building relationships, demonstrating value and supporting teams through change as much as creating reusable UI patterns.
Looking back, it's one of the projects that best demonstrates my ability to combine design craft with strategic thinking, helping establish processes that continued to deliver value long after the initial work was complete.
Reflection
