Project Overview

Objective: Redesign the online mortgage application journey to improve conversion rates and user satisfaction.

About Nationwide

Nationwide is the world’s largest building society. Operated for the benefit of its members, it offers a variety of personal finance services including current accounts, mortgages, savings, and insurance products.

Project Goals

The redesign of the Mortgage Decision in Principle (DIP) journey aimed to:

This was more than a visual refresh—it was a strategic effort to elevate the product experience and support business growth through design.

Nationwide decision in principle journey screenshot
Nationwide decision in principle journey start page

Design Constraints

Nationwide decision in principle old journey
Nationwide decision in principle old journey

My Role and Team

Role: Lead UI Designer (Remote)

I led the visual and interaction design, as well as the strategic design approach. I defined and validated the design strategy based on a hypothesis-led process grounded in research, business goals, and user needs. These user needs were derived from in-depth interviews and feedback from customers who had previously used the old journey.

The design team consisted of just me and one UX Researcher. We collaborated closely with:

Our work was conducted in agile sprints, with continuous collaboration across disciplines to align design and delivery.

Project Kickoff

We began by aligning on business objectives, user pain points, and technical constraints. The kickoff involved stakeholder interviews and collaborative workshops that laid the groundwork for research and ideation. Our shared mission: to make the mortgage DIP process simpler, faster, and more intuitive.

Communication and Collaboration

Throughout the project, we maintained close communication via Slack, Miro, Jira, and Figma. We presented ideas and progress in sprint reviews, stakeholder meetings, and design critiques. Developers were involved early to surface constraints and validate feasibility.

Research & Assumptions

We hypothesised that users:

To validate these, we conducted:

These insights informed every design decision and helped us prioritise improvements that mattered most to users.

Design Solutions

Nationwide decision in principle journey outgoings loans and
Section intro page

Brand Storytelling & Visual Design

To make the journey more relatable and engaging, I crafted a visual narrative centred around Nationwide’s first-ever mortgage property in London. I created over 30 bespoke illustrations and hand-coded SVG animations to bring the story to life in a friendly, human way.

These visual elements not only enhanced the brand experience but also helped more visually minded users to quickly grasp the meaning of key content. Customers responded positively during testing, and as a playful personal touch, I included a spider plant in the house window a nod to a much-loved office plant that added warmth and charm.

Nationwide decision in principle journey outgoings loans and
Loans and Finance page

Decision Making

Key decisions were made collaboratively, grounded in:

We balanced short-term improvements with long-term sustainability to deliver a future-proof solution.

Income and deposit graph
Income and deposit graph

Measurement & Outcomes

We tracked:

Outcomes:

Annual income page
Annual income page

Reflection

This project is a clear example of how thoughtful design can drive growth. We didn’t just make the form look better—we made it work better, for everyone. By prioritising clarity, usability, and long-term flexibility, we created a mortgage journey that truly supports Nationwide’s members and the business.

Design System and Scalability

We used the Nationwide Design System to ensure consistency, accessibility and brand alignment. Using this shared system saved time and development effort. It also allowed us to build with scalability in mind so that the journey could evolve as product needs changed.

Our design decisions were informed by the need for long-term sustainability. We considered how future teams would update the interface and ensured components could be reused and adapted easily.

Animated day and night loader before decision
Animated day and night loader before bank offer I coded

Outcome: Creating Space for Growth

This project demonstrates how meaningful growth can come from good design. By addressing the details that matter to users, we created a product that is both more helpful for customers and more efficient for the business.