A Scalable Finance & Conversion Component for Automotive Retail

My Role: Designer, Researcher
Team: Design, Front-end Engineer, Back-end Engineer, QA
Duration: Continuous development

01 Context

02 Problem

03 Approach

04 Solution

05 Impact

06 Reflections

07 Testing

CONTEXT

Context

This case study focuses on a ‘deal stacker’ component that sits on vehicle detail pages across multiple dealer websites. It supports high-value purchase decisions within a constrained space and serves as a key conversion point for finance, payments and enquiries.

  • Embedded on vehicle detail pages across dealer websites

  • Used by customers at different stages of the buying journey

  • Key conversion point for finance, payments and enquiries

Embedded on the vehicle details page across multiple car dealer websites today.

Desktop

Right side not static

Minimised variant beyond the fold, fixed at the top

Mobile

Full screen when active

Fixed on scroll

PROBLEM

Problem & Challenges

The core challenge was bringing multiple user needs into a single component. Users might want to customise finance options, compare against cash, adjust variables such as deposit or term or take action by applying for finance. The component needed to support these different journeys without overwhelming users.

Previous Approach

The previous solutions were full-screen experiences that varied across dealer sites. They weren't modular or reusable, making them difficult to scale and increasing development effort for every new implementation.

We wanted to move towards a single, unified solution that could adapt to dealer-specific requirements, such as which enquiry options to show, whether to include valuation journeys and how the experience integrated with their existing UI.

“My approach followed a structured design process—understanding the problem, exploring solutions, and validating through testing.”

APPROACH

Breaking Down Complexity

The goal was to simplify the experience into manageable steps, progressively revealing options and questions to avoid overwhelming users.

Previously separate journeys, including enquiry, finance customisation and taking action, were brought into a single decision space.

Unlike most projects, this became a roadmap priority through product and commercial insight rather than upfront research. Design decisions were validated through iterative design, usability testing and later A/B testing and performance data.

Supporting User & Business Needs

A key part of the challenge was balancing customer needs with dealer goals, supporting exploration, customisation and action, all within a limited space.

The solution was built as a modular design system using atoms, molecules and organisms, allowing it to scale across dealer sites without requiring bespoke designs.

It also supported dealer-specific configuration, including payment options, payment providers and finance providers, making flexibility as important as usability.

WhatsApp and live chat were integrated through third-party services.

Modular Design

Collaboration & Iteration

I worked closely with product owners, engineers and key stakeholders to balance dealer flexibility with a consistent user experience.

The component integrated with a DMS and CRM, ensuring reservations, payments and finance applications stayed in sync and adding another layer of complexity to the design.

APPROACH

Process Flow

I mapped out the full end-to-end journey for the solution. Rather than walking through everything, I’ll highlight a few key aspects.

APPROACH

Milestone 1 of 3: Exploration or Act?

I grouped the experience into two main stages, exploration and action, with exploration covering enquiry and deal customisation to simplify a complex, non-linear journey.

There are multiple entry points: users may start by customising finance and comparing it with cash, or by enquiring to show interest. For those ready to act, they can apply for finance or complete a reservation with optional payment.

Exploration

Enquire

Customise

Act

Act

APPROACH

Exploration

During exploration, users are understanding options, whether that’s sending a soft enquiry, making a reservation, calling or using one of the configurable 3rd party integrations

We kept this lightweight to reduce commitment early on.

APPROACH

Customise

Customisation is where users actively shape their deal, adjusting terms, deposit, or adding part exchange.

This is where we expose complexity, but in a controlled way.

APPROACH

Act

And finally, action, where users commit, whether that’s applying for finance, reserving and making a payment.

We made actions clear and direct to reduce friction at the point of commitment.

SOLUTION

A Unified Component Experience

The final solution combines finance exploration and key actions into a single experience.

It allows users to move from exploration to action without leaving the page.

The experience was designed to work across devices, with a mobile first approach. On mobile it remains fixed on scroll, while on desktop it scrolls initially and then transitions into a minimised fixed state after the fold.

  • Finance vs cash comparison

  • Customisable finance calculator

  • Multiple action pathways (payment, enquiry, contact)

SOLUTION

Designed with Flexibility & Scalability in Mind.

  • Modular system (atoms → molecules → organisms)

  • Configurable for different dealers (providers, rules)

  • Reusable across multiple websites

SOLUTION

Supports End-to-End Journeys

Research and A/B testing informed ongoing refinements. The mobile layout was simplified by reducing competing CTAs.

Four enquiry buttons were merged into a single ‘My Options’ CTA, based on the insight that most users know their next step after a few seconds on the page.

This reduced cognitive load while keeping the primary ‘Build Deal’ CTA prominent, which data showed was the most used option and helped increase engagement.

  • Explore → customise → act

  • A seamless transition from browsing to commitment within a constrained space.

  • Refined through research and A/B testing across devices.

DSv3 2024

DSv4 Closed 2025

DSv4 open 2025

  • Brindley Group

  • Swansway Motor Group

  • Chorley Group

  • Motor Range

  • Mitchell Group

  • Oakmere Motor Group

IMPACT

Adoption & Scale

The component was adopted across multiple dealer websites as a scalable, reusable solution.

Each dealer could configure it slightly their enquiry options, styling and payment providers, making it adaptive while reducing the need for bespoke builds.

Award Winning Dealer Websites

Several dealers using the component later received industry recognition for their websites from Motor Trader Industry Awards and AM Awards.

Its continued adoption across clients indicated value for both users and the business.

“We improved engagement and reduced reliance on bespoke builds. Websites are award winning and this conversion component was key.”