wayfair

Redesigning the mWeb cart experience


00

In Spring 2023, I joined Wayfair as a Product Design Co-op, where I worked on two impactful projects that addressed both enterprise tools and customer-facing experiences. One project involved creating a mobile portal for warehouse staff, aimed at simplifying tasks like managing time-off requests, accessing benefits, and tracking hours. The other focused on redesigning Wayfair’s mobile web cart—a crucial part of the online shopping experience.

Both projects presented exciting challenges, but for this case study, I’m focusing on the cart redesign. The cart plays a pivotal role for millions of shoppers, and my goal was to streamline the checkout process to make it smoother, more intuitive, and engaging. By leveraging competitive analysis, user research, and iterative design, I crafted solutions that aligned user needs with business objectives, contributing to Wayfair’s mission of enhancing the overall shopping journey.

timeframe

6 months (Jan - Jun 2023)

timeframe

6 months (Jan - Jun 2023)

timeframe

6 months (Jan - Jun 2023)

timeframe

6 months (Jan - Jun 2023)

role

Product Designer, User Researcher, Product Strategist

role

Product Designer, User Researcher, Product Strategist

role

Product Designer, User Researcher, Product Strategist

role

Product Designer, User Researcher, Product Strategist

tools

Figma, Airtable, Miro

tools

Figma, Airtable, Miro

tools

Figma, Airtable, Miro

tools

Figma, Airtable, Miro

01

Problem Statement

The checkout process is the heart of online shopping. At Wayfair, I redesigned this critical touchpoint, simplifying product selection, optimizing the experience to boost conversion rates, and ensuring customers feel supported every step of the way.

at a quick glance

Current state

Redesign

Shoppers faced a fragmented checkout experience due to inconsistent design and unclear actions, hindering usability and overall satisfaction. 

The goal was to identify best practices and key areas for improvement, ensuring an enhanced and competitive cart experience for our customers.

02

Impact

Streamlining the checkout process drove a

6% increase in cart conversion rates

6% increase in cart conversion rates

6% increase in cart conversion rates

improving the overall shopping experience

Improved navigation and design efficiency led to a

12% decrease in checkout completion time

12% decrease in checkout completion time

12% decrease in checkout completion time

making the process faster for users

Feedback highlighted that the redesign made the cart easier to manage, with

grouped items and clear actions simplifying decision-making

grouped items and clear actions simplifying decision-making

grouped items and clear actions simplifying decision-making

03

Competitive Analysis

discovery

I looked at 10 leading e-commerce players (direct and indirect), some of which include Amazon, Target, Home Depot, Ikea, Walmart, Nike, Apple, Zara, and Gymshark.

key takeaways

04

Design Iterations

Exploration

The cart was deconstructed into several key components: 

  • Header (item count, price information, and "Proceed to Checkout" CTA) 

  • Product cards

  • Recommended items carousels, and the saved items section. 

I created multiple design variants to explore layouts, visuals, and information hierarchies, testing their impact on usability, engagement, and conversion. By embracing an iterative approach, we pushed the boundaries of the cart design to uncover innovative solutions and elevate the overall shopping journey.

Designs User Tested

UI Inconsistency

UI Inconsistency

UI Inconsistency

UI Inconsistency

CTA Accessibility

CTA Accessibility

CTA Accessibility

CTA Accessibility

Value Propositions

Value Propositions

Value Propositions

Value Propositions

Design Opportunities

Design Opportunities

Design Opportunities

Design Opportunities

Intuitive Quantity Stepper

Intuitive Quantity Stepper

Intuitive Quantity Stepper

Intuitive Quantity Stepper

04

Design Iterations

Exploration

The cart was deconstructed into several key components: 

  • Header (item count, price information, and "Proceed to Checkout" CTA) 

  • Product cards

  • Recommended items carousels, and the saved items section. 

I created multiple design variants to explore layouts, visuals, and information hierarchies, testing their impact on usability, engagement, and conversion. By embracing an iterative approach, we pushed the boundaries of the cart design to uncover innovative solutions and elevate the overall shopping journey.

Designs User Tested

05

User Testing Feedback

Validation

We conducted unmoderated mobile user tests with 8 participants to evaluate updates to the header, footer, and product cards. The testing also focused on the "My Saved Lists" and "You May Also Need" carousel features, aiming to identify their impact on user engagement and ease of navigation.

On a scale of 1-5, how likely are you to purchase home related items on your mobile device?

General Takeaways

Overall, users felt that the redesigned cart was informative and concise.

Most users prioritized final price, taxes, shipping, delivery date, product details, returns, and quantity. Only 2/8 users felt the inclusion of Home Services information was necessary. 6/8 found the redesigned saved items section intuitive and successfully completed tasks, while 7/8 didn’t consider product IDs or ratings essential for making purchase decisions.

High Level Takeaways

Product Cards

Current state

Redesign

  • What worked: Users valued delivery dates, price clarity, and visual organization.

  • Pain Points: Bulk savings and product codes felt unnecessary and cluttered. Grouping items by delivery dates was suggested for better tracking.

Save for Later

Current state

Redesign

  • Redesign Impact: The updated section felt more intuitive, with improved item organization and a clear distinction between lists and saved items.

  • Key Insights: Users appreciated the carousel for its ease of navigation, aiding in item tracking without disrupting the checkout flow.

Proceed to Checkout

Current state

Redesign

  • Current State: The header CTA and subtotal placement caused redundancy and confusion.

  • Redesign Feedback: Users preferred a sticky footer with a unified subtotal and checkout button for better accessibility.

Variation A (Current)

Words used to describe current Cart page

Variation B (Redesign)

Words used to describe redesigned Cart page

What Users Said

"The layout isn’t aggressive—it’s easy to follow, with only the necessary info. Totally on board with this."

Participant 1

"I really like the free shipping message and knowing how much I’m saving—it makes me feel like I’m getting a better deal."

Participant 2

"The saved lists section feels misplaced; it should be higher up. Also, I’m not a fan of the horizontal scrolling."

Participant 3

"I like how prices and additional services are displayed on Variation B—it’s clearer with better sectioning."

Participant 4

05

Next steps

Refining Post-Launch

  • Incorporate user feedback to improve the "Save for Later" interaction.

  • Explore alternate carousel controls and delivery grouping methods.

  • Reevaluate the inclusion of SKU codes and prototype horizontal scroll behavior.

Further Validation

  • Conduct additional user testing to validate recent updates.

Potential Future Features

  • Introduce "Compare with Similar Items" in the cart.

  • Develop a price tracker for better purchase planning.

05

Reflections + Learnings

Wayfair was an incredible learning experience in designing with real-world constraints. The ESP project taught me to adapt to business needs and create something functional yet intuitive for warehouse employees, balancing usability with operational goals. Working closely with PMs and engineers, I learned how collaborative problem-solving can push a project forward, even with limited resources.

Redesigning the mWeb cart showed me the impact of data-driven decisions on customer retention. Using A/B testing and user feedback, I crafted a more seamless checkout experience that directly boosted conversions. Through both projects, I gained practical insights into navigating design systems, understanding user needs, and making a measurable impact—skills that will stick with me as I grow!

03

My Performance

  • "Naief achieved in a few weeks what most designers can't do in months. His fresh insights and strong usability tests revolutionized our Cart experience, enhancing it for millions of Wayfair customers."

    Norman Wozniak

    Associate director Product Design

    "Naief's research skills and focus group work impressed me. His data analysis and use of Miro added value to Wayfair. I encourage him to stay curious and keep asking questions. He has a bright future ahead."

    Anthony Marra

    Senior product design manager

    "Your quick learning, initiative, and strong research skills drive results. Your work on the ESP project earned team recognition. You communicate proactively, meet deadlines, and contribute positively to the team."

    Ann Dang

    Senior Product Manager

.say hello

let's build something impactful.

.say hello

let's build something impactful.

.say hello

let's build something impactful.

.say hello

let's build something impactful.

.say hello

let's build something impactful.

Impact

Warehouse supervisors reported a

20% decrease in HR inquiries

during peak hours, indicating employees were able to address many questions independently through the kiosk.

Through a follow-up survey,

85% of respondents rated the kiosk as "easy to use"

and noted that it made accessing HR resources less stressful.

Anecdotal feedback from focus groups conducted post-implementation showed that

employees felt more in control of their schedules and requests