WEBSITE & APP

Carvana

Helping the first 100% online, auto e-commerce company become the new way to buy a used car.

Who is Carvana?

Established in 2012, Carvana was the first auto e-commerce company to be 100% online. It started as a disrupter by offering lower than dealership prices, a 7-day “love it, or return it” policy, vehicle home delivery, and more famously, their larger-than-life car vending machines.

In 2021 Carvana made the Fortune 500 list as one of the youngest and fastest-growing tech companies in the United States.


Strategy

Challenge

Carvana’s original intention for its website was to prove the hypothesis that cars can be sold 100% online. It proved successful, but the site was not built for the level of growth that Carvana would eventually reach. In 2016 when Carvana reached 7,000 cars in its inventory and started to offer more services and features it was clear that its main platform, Carvana.com, did not have the systematic foundations or ability to scale at the pace of the company’s ambition. So in 2017, it was time for a complete overhaul which included a new platform rebuild as well as a new look-and-feel to help elevate the brand.

And this is where I come in.

As lead designer, I worked closely with the UX team and was tasked with setting the tone and visual design system for the entirety of the site. At the same time creating engaging and visually clear user experiences to maximize conversion.

Old Carvana.com designs

Approach

Due to the size and complexity of a total code and design overhaul of the carvana.com platform, I, alongside our lead UX designer developed a strategy that would break our process down into three phases.

Phase 1: Design the main user flow (home, search, and vehicle detail pages), global site structure, and change our codebase from Angular -> React.

Phase 2: Design the ancillary pages and features (finance, sell/trade, emails, about, careers, etc.,).

Phase 3: Design and build the purchase process.

The work in this case study focuses on what was created for “Phase 1”.

Phase one’s UX/UI objectives were to produce an MVP that gives our users a simple, clear experience while creating opportunities to instill brand loyalty through basic design principles, and where applicable, delightful engagements. To do that we decided to focus on three brand attributes that we wanted our site to reflect to our users.

Our three brand attributes:

Design Research

The fun part of my job is getting inspired and the discovery of what can be. For the design research portion, we collected reference material that ranged from best-in-class websites to magazine layouts, to freeform sketches and prototypes. All of this helped us get a better understanding and head start on the design challenges that lay ahead of us.

Slide We don’t know where we’re going if we don’t know where we’ve been. Brand Audit Slide How can we set ourselves apart? Competitor Audit Slide We scoured the web and Barnes and Noble to find any inspiration that could help spark ideas for the elements we knew we would be encountering for the Carvana redesign.
Web & Print Inspiration
Slide After being completely immersed in looking for design inspiration we started to create our own ideas. For this session we got off the computer and used pencil and paper to draw out our ideas. Anything goes. Freeform Ideation / Sketches Slide Let’s bring our ideas to life by any means neccessary. Prototyping Slide Type and color are crucial design elements that make up the majority of our UI decisions. They also have a huge impact on user experience when it comes to scale and contrast. Getting these right is critical. Typography and Color Slide Working with the engineering team I helped research basic bootstrap grid systems that we could use to make a cohesive responsive template for the entire site. Responsiveness

Wireframes

The UX team developed an extensive set of wireframes, states, and scenarios. Here’s a high-level snapshot of just a small amount of them.

Opportunities

Home Page

The home page offers a lot of opportunities to really try and engage the user to make a choice to move forward. It is also used to set the tone of the brand. Here are just a few of the ideas that I designed for the team.

Hero Concepts

The question I asked myself: How do we make ourselves feel bigger than just a used car dealer? Answer: We show the distances we will go to deliver your car to you.

Or do users convert better if we make ourselves feel more specific to a location?

Lifestyle Categories

Does anyone search for a car by lifestyle?

Educate with Interaction

Does interaction increase engagement and education? For this concept, I shot a toy car in various positions and built a fully working html prototype. 

Search Page

With the search page being such a detailed and action-heavy page we wanted to explore opportunities for more efficient UI experiences.

Applied Filters

Applied filters can take up a lot of real estate on the page so how do we find room for them?

Education

We get a handful of new users coming directly to the search page through SEO, so how do we inform them of our services.

Attraction & Efficiency

What are some different ways that a user might be attracted to a vehicle from the search page? Would they prefer a different size of the vehicle? How about a different angle?

What if there was no back button after you viewed a vehicle? How can we get you back to your search results seamlessly?

Vehicle Detail Page

The vehicle detail page has a lot of opportunities to not only present the content of the vehicle efficiently but can also create moments of delight and immersive experiences when called for.

Explore

Do they want to see the car in night mode? Do they care about the spinner and want to explore just the images? How about spaciousness? AR?

Prototype by Kirsten M.

Prototype by Kirsten M.

Prototype by Kirsten M.

Final Designs (MVP)

Carvana App

I was tasked with making a lightweight parity app of Carvana’s website. 

UI Kit & Style Guides

Our design system language started as an easy sticker sheet UI kit that is still evolving to this day, as are our style guides.

The End

Return back to my work?

Back

justingrahamiam@gmail.com

Share
Privacy Settings
We use cookies to enhance your experience while using our website. If you are using our Services via a browser you can restrict, block or remove cookies through your web browser settings. We also use content and scripts from third parties that may use tracking technologies. You can selectively provide your consent below to allow such third party embeds. For complete information about the cookies we use, data we collect and how we process them, please check our Privacy Policy
Youtube
Consent to display content from Youtube
Vimeo
Consent to display content from Vimeo
Google Maps
Consent to display content from Google