Improving Cart Efficiency

Over the past two years, the UX team has been redesigning high traffic pages on the site. It started with the Product pages, Search results pages, and Checkout was at the end of development. Cart was next.

Problem Statement

The data was showing that the Recommendation pop-up screen before Cart was having negative effects on conversion. The issue was that stakeholders did not want to remove recommendations because increasing the average order value (AOV) was a key focus point. Cart was also not a seamless experience between the other pages due the recent updates.

Simply put, the business goal was to increase how quickly customers went from the Product Page to Cart while maintaining recommendation options. The design goal was to create a seamless experience from the Product Page to the Checkout page. I would be the one leading research and design on this project.

  • My Role

    Lead UX Designer

    Lead User Researcher

    Interaction Designer

    Visual Designer

    Prototyper

  • Platform

    Desktop

    Tablet

    Mobile

Research the Competition

The shopping cart is where most customers go before they make a final decision about their purchase (unless a Buy Now option is available on the Product page). In my research, I took 5 of our retail competitors and categorized 14 Cart components to better understand how we compared to them. The goal was to locate consistent patterns within all of the Cart experiences. Results from this breakdown created a baseline for the information architecture of Cart. See image below.

Delivery Method Breakdown

I tested how different experiences within similar components affect customer behavior. I tested the Delivery Method section for Target and Best Buy because they organized their products differently. Target categorizes there items in folders under “Order Pickup” and “Shipping” while Best Buy displays an uncategorized list where pickup and shipped items are mixed together. The results showed that customers perceived that the Cart was “cleaner” and more simplified when it was categorized for them. This became my initial design for the new Cart experience.

What Makes Customers Buy Faster

The Checkout button is arguably the most important button in Cart. During the design phase of the project I was informed that a business decision had been made to add multiple payment options to Cart.

Five payment options were required and Apple Pay was one that needed to be displayed alongside the traditional Checkout button. The stakeholders wanted to visually showcase all five of the options. I designed a sticky Checkout button with all the payment icons anchored to the top of the screen. I tested the scenario and the user’s conversion rate was slow.

The fastest conversion rate (60% faster than previous test) was the sticky button at the bottom of the screen with only the primary buttons displayed.

Final Design, Phase 1

I researched and designed the full Cart experience, but it has been divided into three phases. We are releasing phase 1 which matches the current Cart experience with a few additional features including a free shipping progress bar and a recommended item component within Cart.

In the phase 1 release, I removed a promotional credit card banner that no longer had a business goal and replaced it with the customer’s products. The design elements now match the Checkout experience for a consistent flow.