20% more leads for CarFinance 247

Application Form Prototype mockup.

When performing usability testing sessions with the help of CodeComputerLove in Manchester. We noticed that our single page application form had its fair share of problems.

Using the browser back button would clear the form, there was a lot presented up front to a user, and there were some really unhelpful validation messages.

We wanted to fix these problems to increase the number of users that made it through the funnel.

Team

Owned by the UX and Web team, our responsibility is to make sure the website is performant and converts well.

In the team we have:

  • Product Manager
  • Data Analyst
  • 2 Front End Developers
  • 2 Full Stack Developers
  • 2 UX Designers

My role is to help the team solve the problems. I spoke to customers, participated in our workshops, and took the lead on prioritising solutions.

Research

Working with our data analyst and the product owner we wired up every part of the form with Google Tag Manager to gather data.

We also invested in and deployed SessionCam, a product that uses machine learning to identify pain points in a user journey.

To get a baseline metric, we ran the tools for 2 weeks with no changes in production.

Workshop at CodeComputerLove

For ideating solutions we took our baseline findings, and usability testing qualitative data into a team workshop.

Pain Points

We identified that our users biggest pain points were with the usability and daunting nature of the application form.

Product Ideas

We came up with a few hypotheses that we wanted to experiment with to increase conversions:

By asking the questions over a number of screens we might reduce cognitive load.

By saving input data locally we can ensure that if a user clicks back or refreshes they can continue their application.

By using conversational questions, and clear information at key points.

Validation

To validate our solutions we built an Invision prototype and tested that in a lab setting with 5 users to see if they felt that spreading out the form over multiple pages made it feel easier.

We used the positive feedback from our user testing sessions to green light the more complex build.

For the more technical solutions we used Vue to scaffold the experience quickly and with enough control to test it properly.

The live demo works best in it's own browser tab: https://priceless-jang-b73b28.netlify.com/

We deployed the new application form that includes saving data in session storage using Google Optimize to just 15% of our users.

As we grew in confidence and iterated on our solutions we had we ramped up the percentage of users we were testing with.

Design

Application Form Design

Results

Every hypothesis we experimented with had a positive uplift on conversions. Spreading out the questions accounted for an 11%.

Making the application more conversational 5%, and making the application more user friendly and accessible 4%.

The grand total of our iterative changes was a 20% increase in conversions for users going through the application form.

And not only that but we'd also increased performance dramatically. Our Google Lighthouse scores at the time of writing are 99 Performance, 100 Accessibility, 100 Best Practice and 100 SEO.

Google Lighthouse scores