Walmart Grocery's Page
Simplifying the online grocery experience
01. Project Objective
This project set out to fix the common struggles of grocery shopping online. The design focused on easy browsing, smart filtering, and helpful meal planning.
02. Research
Methodology
To understand user pain points, we sent a quantitative survey to Walmart Grocery shoppers. We focused on how they felt about site navigation, search tools, and filtering options.
Key Pain Points
-
47.1% find the web page/app overwhelming.
​
​
-
35.3% struggle to locate product categories.
​
​
-
29.4% find filters hard to use.
​
​
-
23.5% describe the layout as cluttered and confusing.​
​
-
11.8% have difficulty finding discounts.
Problem Statements
-
Overwhelming Layout – A busy and cluttered layout makes it hard for users to browse and find what they need.
​
-
Category Confusion – Too many similar categories cause confusion and slow down product discovery.
​
-
Ineffective Filtering – Filters don’t work well, making it hard for users to narrow down their choices.
​
-
Information Overload – Product pages show too much detail at once, which overwhelms users and causes fatigue.
​
-
Hidden Discounts – Deals and discounts are hard to spot, so users often miss out on savings.
03. Ideation
To solve the problems we found in our research, we created How Might We questions. These kept us focused on user needs and guided us to better design ideas for a smoother shopping experience.
Prioritized Solutions
HMW create a more intuitive navigation system to simplify browsing?
HMW refine product categories for clarity and efficiency?
HMW simplify product information while keeping essential details accessible?
HMW improve the visibility of discounts to boost engagement?
04. Solution
Based on our research findings and HMW statements, we redesign the shopping experience. Now, it’s simpler and easier to use. We worked on fixing messy navigation, improving filters, and making product info clearer.
Design Principles
-
User-Centric Design – Simple layouts that put user needs first.
​
-
Accessibility & Inclusivity – Features such as voice search and rich imagery for better usability.​​
​
​
-
Streamlined Navigation – Removed repeated categories and used clearer labels.
​
-
Simplified Product Pages – The system shows key info right away, with extra details just one click away.
What Guided This Choice
Shopping online for groceries shouldn’t feel like a chore. Users told us the site was cluttered and hard to filter. So we focused on clarity—cutting noise, cleaning up categories, and simplifying how people find what they need. The goal: fewer clicks, better flow.
05. Solution Implementation
For the prototype, we focused on cleaner navigation and fewer categories. Filters became easier to use, product pages showed the most important info first, and we added side-by-side comparisons. All discounts were moved to one clear section.
Wireframe Low-Fidelity
We made low-fi wireframes to test layout, navigation, and filters. This helped us find problems early and improve the design based on user feedback.
Grocerys' Page
Products' Page
06. Prototyping
