Online Shopping Made Easy

Role

UX Designer
UI Designer

Duration

1 Month
(Nov 2021 - Dec 2021)

Team

5 UXD + PM

Tools

Figma
Photoshop
Illustrator

Background

Walmart is an American multinational retail company that operates a chain of hypermarkets, discount department stores and grocery shops.

For its online shopping application, it offers its customers 3 ways to get their orders: pickup, delivery and shipping. These 3 ways make online shopping more organized and clear on the one hand, but on the other hand they also create some confusion and inconvenience for the customer, which was the main problem our team had to solve.

Initial Problem Statement

How might we improve customers' online shopping experience so that they can shop in a fast way without getting frustrated?

Research

Desktop Research

Based on customer reviews of Walmart's mobile shopping app, there has been a notable increase in the number of complaints expressed by users.

Interviews

Through 12 user interviews, we gained valuable insights into users' shopping experiences, including their interactions with delivery and pick up processes, as well as the challenges they encountered during these stages within the Walmart mobile app.

Compititors

The competitive analysis from Target, Costco, and Weee's mobile versions provides valuable insights and benchmarks for improving Walmart's mobile app.

Synthesis/data anaylsiis

Through the collection of data from desktop research, user interviews, and competitor analysis, I employed an affinity diagram to effectively synthesize the key insights.

The affinity diagram served as a foundation for informed design decisions, ensuring a user-centered approach in developing impactful solutions.

key insight

Discovery

The first challenge customers are facing is based on the pain point that users couldn't filter out products that were not available for their selected delivery method.

Shopping

User have difficulty differentiating between products that were available for different shopping methods or pickup locations once they were in their shopping cart.

Check Out

Users highlighted during our interviews was the frustration of not being able to purchase a specific product because it wasn't available for their preferred shopping method or pickup location.

User Journey

Walmart Mobile App User Journey Map

How Might We

How might we resolve the confusion of mixing in store & delivery for Walmart customers' online shopping experience through clear visual affordance and organization to expedite shopping speed?

Design Principle

Based on customer reviews of their mobile shopping app, Walmart has been receiving a significant number of client complaints.

Discovery

we are considering redesigning our navigation bar to make it clearer for users to filter items that are available for their shopping list.

Shopping

we are considering grouping products together in the shopping cart based on their availability for each shopping method or pickup location.

Check Out

we have reorganized the "edit cart" function and “out of stock” within the shopping cart to make it easier for users to switch between different shopping methods or pickup locations.

Design

Site map

Happy Path Flow

Wireframe

Testing

Recruitment/ testing plan

Tested with 10 existing Walmart app user

Goal

Evaluate usability of new wire frames (check out speed)

Control Group

Time 50s (3 users could not complete the flow)

Testing highlight

Shopping filter experience A/B test

What is the most important information for the user to filter for a quicker shopping experinceWe wanted to compare between

A/B test learning

  •       Top accordion should be expanded by default learning
  •      Although shipping time is very important, most users are filtering by price first

Gambit test

Vague scenario, such as if you are trying to pick up your groceries two days in advance/during checkout, what would you do?

Gambit test learning

  •      UX writing is not clear, unify terms such as clear all vs delete all
  •      Need to address use case of changing time to an earlier date
  •      All users really liked the two category view

Final Deliverable

Shopping Experience

  •       Set Up Pick Up Time
  •       Apply Filter (see items out of stock)

Check Out Experience

  •       Shopping Cart: change pick up date
  •       Shopping Cart: delete all

Design System