Using a user-centric approach to design a new Car Configurator for Nissan

[Scroll]

Year

2021-22

Client

Nissan

Project type

UX/UI redesign

Role

Senior UX/UI Designer

01 what we achieved

32.5%

Increase in online test drive
booking rates

18%

Reduction in offline calls

The redesigned configurator

background

The existing configurator was tested by the Nissan CX Research Team to discover how it was performing

01

User testing showed that too many of the tools in the pre-sales journey have similar features

This makes the customer journey confusing.

Market landscape

  • JEEP

    I liked the Jeep assembler better [ ] the real-time visualization of a car was fascinating. At least that's what caught my attention.”

    Research Participant, US

    VOLKSWAGEN

    The VW site broke decisions down into small bites, so I could make choices at each stage, rather than choosing a model from a range and then having no control over separate components”

    Research Participant, UK

    TOYOTA

    I liked how it walked me through the process, making it very clear what I selected on the final screen with a summary.” 

    Research Participant, US

Customers want to get excited

Customers want to feel joy, excitement and empowerment, as they see their options materialise and get one step closer to owning a new car.

I’m super excited at this stage because I like to research and delve into the product I’m looking for. That excites me a lot.”


Research Participant, Brazil

Research and searching vehicles sometimes makes me feel like I’m solving a puzzle or mystery. There’s always so much to consider and many options to review.”


Research Participant, Canada

Most participants saw the configurator as the final step of the exploration phase

The existing configurator was designed towards the beginning of the customer journey

This was an opportunity to create a simpler tool that makes configuring a car easy and exciting, and thus improve customer satisfaction and drive revenue.

04 Our Solution

Using insights from the existing research we developed a set of hypotheses and conducted three rounds of iterative design and testing to validate our conceptual models

Concept Design using insights from the existing research

Concept Testing - unmoderated testing using services from userbrain.com - 11 Participants, UK & US

Usability Testing - unmoderated testing using services from userbrain.com - 8 Participants, UK

Preference testing, 180 participants, UK, US & Canada - Single Scroll vs Tray layout

initial concept

Hypothesis 1
A lighter configurator

A lighter configurator, which is focused on customer delight and meets customer expectations

Hypothesis 2
A single-scroll approach

A single-scroll approach that would create an immersive experience by reducing the users' cognitive load compared to a complex, tray based approach

Hypothesis 3
Better accessory cards

Including more details about how the accessory fits with the selected version would ease
decision-making

Hypothesis 4
Detailed financial information

A detailed breakdown of costs would help in the decision making process

first round of testing

We tested our hypotheses with 11 participants from the US & UK.

test plan summary

User testing was performed remotely and unmoderated through the service Userbrain.


Test participants screens and microphone audio were recorded whilst being asked to complete a series of tasks using Figma prototypes. All the time, thinking out loud and talking us through their thought process so we could analyse their results at a later time.

In total, we tested with 11 participants (4 female, 7 male) with an age range between 26 - 45, from the UK & US

Only desktop prototypes were used.

results

proved

Hypothesis 1
A lighter configurator

further Testing required

Hypothesis 2
Single-scroll approach

Overall, the experience felt more immersive, but participants expected to see bigger images, including of the interior of the car, even when they had seen them in the vehicle landing page.

further testing required

Hypothesis 3
Better accessory cards

Participants experienced less frustration when adding accessories, but it was still unclear how to add an item and how much it would cost to add it.

further testing required

Hypothesis 4
Detailed financial information

Participants appreciated the clear financial information, but they felt that a breakdown of dealership-specific costs was missing from the summary.

73%

of users’ expectations matched the functionality.

concept evolution

After testing the initial conceptual model, we created a new iteration based on the findings.

redesign - KEY Considerations

second round of testing

To further refine our designs and continue to test our hypotheses, we tested the new iteration with 8 participants from the UK

FIRST IMPRESSIONS

The information, appearance and flow of the configurator was very well received.

The flow of the page is really nice."

Participant 3

My first impression is very slick, very professional."

Participant 5

There is an opportunity to learn more before committing to adding it, which is good”

Participant 1

Maybe a checkbox somewhere to show it’s been selected (is necessary)"

Participant 7

7/8

Participants noticed colour and price changed.

I understood that the vehicle specs were changing. Not just the colour.”

Participant 3

third round of testing

We showed 180 participants from the US, UK and Canada the NNA configurator, which uses a tray based approach

tray based - NNA Configurator

The users clicks through different pages to configure their car.

...and compared it to our approach,
which uses a single-scroll

SINGLE SCROLL - our approach

The users scrolls down the same page to configure their car.

results

Overall, customers preferred the single-scroll configurator

65%

Participants preferred the single-scroll option


CAN 73% | US 60% | UK 52%

86%

Strongly agree that completing this process would make them comfortable continuing their purchase with Nissan


CAN 87% | US 88% | UK 83%

65%

Strongly agree that this experience makes them feel excited about buying a car with Nissan


CAN 73% | US 80% | UK 70%




However…

The tray based configurator rated higher in terms of progress indication.

OUTCOME

The Nissan Configurator - Reimagined

01

Single-scroll experience - with progress indicators

A progress tracker & a progress bar that fills as the customer scrolls

Numbered labels for each step

You did not have to think, it just flowed along to the next option and was so easy.”

Research Participant

A prominent, sticky image carousel

Real-time visualisation of the configuration is key to creating an immersive experience. It also allows customers to immediately see the impact of their choices

[It’s] easy and very enjoyable! I would thoroughly enjoy configuring any car with this feature”

Research Participant

Improved accessory cards and version conflicts

By adding more information to the packs and accessory cards, we made sure customers have what they need to make an informed decision

[The] information in [the] overlay was very good. It explained the packs very well.”

Research Participant

Clear summary section

The summary section was simplified with a better hierarchy of information, relevant CTAs and a detailed breakdown of the price.

in closing

Following a customer-centric approach, we created a lighter configurator that makes Nissan customers excited about their future new car.

To find the best solution, we did three rounds of testing, including concept testing, usability testing and a preference test between single-scroll vs. tray based.

After several iterations and rounds of testing, we arrived at a new and lighter configurator that works in tandem with the other tools.

PROJECT IS LIVE

Experience the reimagined Nissan Configurator at
Nissan.co.uk/vehicles/car-configurator

Explore other Case Studies

Using strategic UX methodologies to design a Back Office Application for Unisys Digital Bank

Using insights from user research to redesign the website for The University of Law, UK

Let's Build

Something Awesome!

anurag.tx@outlook.com

+91 73886 27774

Create a free website with Framer, the website builder loved by startups, designers and agencies.