Vehicle Search; Price details

carvana website • section re-design

Updated price details designs, implemented May 2021, resulting in a 25.5% uplift in loan applications.

Updated price details designs, implemented May 2021, resulting in a 25.5% uplift in loan applications.


What is Carvana?

• Carvana.com is an e-commerce platform that allows users to purchase a used vehicle directly on the site, and have it delivered directly to them.

• Users can either pay cash, or finance (through Carvana directly, or through a third party bank).


The Previous Design

The Problem

 

Problems with the design discovered through qualitative & quantitative data

  • Loading times are causing engaged users to drop out of the flow

  • Competing CTA’s lack hierarchy

  • Customizable drop-downs and sliders can be helpful, but aren’t necessarily accurate until a user is pre-qualified for a loan

  • Protection plans are out of context and are not added to the price at this point in the journey, causing confusion


Objectives

  • Help the user understand possible payment options

  • Provide the user with the information they need in order confidently move forward the next step in their purchase process, which could be one of the below:

    1. Signing up for an account

    2. Filling out a pre-qualification form

    3. Starting the trade-in process

  • Once a user is pre-qualified, clarify the price breakdown and allow them to customize their payments

*The design would be A/B tested against the previous design to see how much engagement increases or decreases.


Role

As the lead UX architect, I was in charge of identifying problems of the current design and delivering a new design that is applicable to all scenarios, and falls within the technical constraints. I worked with a product owner, UI designer, and the finance team.


Getting there through research

  1. Determining our Language

The challenge

To present 3 possible payment options that all have different price breakdowns and next steps associated with it.

Additionally, with finance-specific terms like APR, first-time buyers could feel easily overwhelmed, and it was our job to make them feel confident and excited to move forward.

What we tested

We user-tested two different price details options with different language to represent the payment options.

(A) “Pay Once” & “Pay Monthly”

vs.

(B) “Pay Cash” & “Finance with us”

What we learned

Users knew what to expect from both sections, and easily understood their payment options.

However, there was a preference for “Pay once” / “Pay monthly over “Pay cash” / “Finance with us”. The timeline format was helpful for users, and some felt that “paying cash” wasn’t seen as a necessarily accurate (since a bank account is still required).

See all test results here.

Screen Shot 2021-06-02 at 8.23.36 AM.png

Determining the Price Display

The challenge

The monthly price estimate will always be an estimation until the user pre-qualifies for a loan. With a new design, we wanted to make sure the user understood:

  1. This was an estimate

  2. How to use the estimate to gauge their price.

WHAT WE TESTED

What we learned

• A- SET PRICE: It was clear that this option was an estimate, and users were able to use the estimate details to gage their price.

• B- CHIPS TO ADJUST PRICE: Most users didn’t have an interest in adjusting the cash down, focused on the monthly payment number and the estimate details associated with it.

• C- RANGE PRICE (WINNER): Users were most easily able to gauge their personal price details based on the estimate, and were also encouraged to select “Get your terms” to validate where they lie within the range. The range felt most “real” to them.

Determining the Range

The challenge

Our users varied in all the things that determine their monthly price— credit score, required cash down, loan length terms, income, and more. This meant the price range estimate required something universal enough to speak to a broad range of customer.

How we solved it

The range option helped us avoid displaying rosy and unrealistic price, or a high and unrealistic price that would deter the user. I worked closely with the finance team, utilizing our customer database. We were able to display estimates based on our averages.

 
Screen Shot 2021-06-01 at 6.02.05 PM.png

updated designs

Scenario 1: default

1-A_ No Trade-in

Desktop

Desktop

Mobile

Mobile

1-B_With trade-in

Desktop

Desktop

3- mobile.png
 



Scenario 2: I have pre-qualified for a loan

2-A: No trade-in

Desktop

Desktop

Mobile

Mobile

 

> Price Calculator

Desktop

Desktop

Mobile

Mobile

> “Pay once” Tab

Desktop

Desktop

Mobile

Mobile

 

With Trade-in

Desktop

Desktop

4- mobile.png
 

See all design scenarios here.


Learnings

In just one week, there was a significant increase in account creations and loan applications. Account creations increased by 26%. Details of the experiment are still being gathered.