/Insights/5 UX considerations for grocery store eCommerce

5UXconsiderationsforgrocerystoreeCommerce

Aug 7, 2017

1 min. read

We’ve seen eCommerce invade industry after industry, and nowadays you’d be hard-pressed to find a product that you can’t purchase online.

We’ve seen eCommerce invade industry after industry, and nowadays you’d be hard-pressed to find a product that you can’t purchase online. While some sectors have remained resistant to the eCommerce wave, it’s only a matter of time before they too are ushered into the digital realm.

Chief of these is the grocery industry, whose digitization hasn’t quite been accepted into the mainstream as standard online retail shopping has, but is certainly undergoing a period of rapid, tech-driven change.

Grocery eCommerce could soon be standard as more Gen-Zers millennials log on to shop (Source)

We’ve seen the establishment of online grocery services from major players in the industry, such as Walmart and Royal Ahold (Giant and Stop subscription services like Blue Apron HelloFresh.

And, of course, if there’s been one sign heralding the transition of grocery shopping to the online retail landscape, it’s Amazon’s blockbuster buyout of Whole Foods Market.

As more online grocery platforms arise, it’s crucial for a UX design agency to map guidelines specific to their needs. We shop differently for groceries than we do other products, so the UX principles of these platforms will contrast those that shape standard retail eCommerce.

We’ve compiled a brief list of these special UX considerations you need to take when designing for grocery eCommerce platforms.

Emphasizing the shopping cart

While online grocery shopping obviously isn’t going to abandon eCommerce’s cornerstone design feature, the shopping cart should take on a more pronounced role when designing for e-grocery platforms.

For typical online retailers, the shopping cart should be noticeable and recognizable, but ultimately take a backseat to the actual products. For grocery eCommerce, the cart should mirror how we shop for food in real life—a centerpiece of the experience.

(Source)

Take Walmart’s online grocery platform—their cart has expanded from its usual position in the top-right corner and now inherits the screen real estate usually occupied by the sidebar. Walmart’s UX designers understand their users need to be able to quickly review their cart’s contents at a single glance.

A how-to

As UX practitioners, most of us are naturally averse to how-to’s and tutorials, the logic being that if the platform needs a hand-holding walkthrough, it’s not user-friendly enough. Having said that, most grocery eCommerce platforms are a blend between normal online retailer and delivery service.

(Source)

Prominent categories & organization

Every retail site should have a way for users to easily navigate their products through proper organization, using intuitive categories and filters that allow consumers to find what they need as quickly as possible.

In grocery applications, these categories have to be even more well-defined and accessible. Navigation should mirror the experience of shopping in a brick-and-mortar store. So what are aisles, the primary organizational unit of food shopping, if not categories and filters?

Referring back to the Peapod example used above, you see they even use the same terminology, including a “Browse Aisles” option in the toolbar. I’d actually argue Peapod doesn’t go far enough here—the Browse Aisles feature should be much more prominent on the page.

Customer Vetting

At first, this sounds completely counter-intuitive. What retailer would want to discriminate against their consumer base, only allowing a limited selection to shop?

Consider logging into an online grocery retailer, browsing their products, loading up your cart, filling in your payment and shipping information, and just as you’re ready to check out, you get an error message: this grocery service can’t deliver to your address.

It doesn’t matter if the service later expands to cover that user’s region or not—their business is long gone. First things first—confirm the user is eligible for your grocery delivery service.

Multi-channel offering

Most online retailers recognize the importance of a mobile presence, whether that’s a native app or mobile-responsive site. For grocery shopping, I’d argue it’s even more imperative. Grocery lists are usually lengthy and fluid, always changing as we add or change items last-minute.

Consumers should be able to fill up their cart on their desktop computer at work, then make changes on-the-fly with their smartphone as they cook dinner that evening, perhaps realizing they’re running low on cooking supplies or other culinary products.

Consistency across the two platform versions is key—users shouldn’t just be able to update their cart from their phone and desktop, but how they complete that task, and other tasks as well, should be about the same.

Conclusion

To summarize, the best online grocery user experiences digitize the characteristics unique to shopping at brick-and-mortar food stores, while also leveraging standard online retail conventions.

The blend promotes familiarity in two ways: how we shop in both the physical world and the digital one.

A grocery eCommerce company that partners with a user experience design agency can ensure their platform is a cut above the competition. Online grocery shopping may be wide open now, but it won’t stay that way for long. Make no mistake, grocery eCommerce is the future of how we shop for food, and taking advantage of UX design services is just the way to prepare yourself.

Topic

Unified commerce

Experience design

Related Insights

eBook

Manufacturing

Modernizing manufacturing commerce: 5 real problems and how we solved them

13 min. read

Article

Experience design

UX localization: Expanding your eCommerce experience to new cultures

6 min. read

Article

Unified commerce

Why you should implement a product finder or product quiz for your eCommerce store

5 min. read

Article

Performance Optimization

Woman having second thoughts about shopping online

Shopping cart abandonment: How UX design can improve conversions

3 min. read

Article

Unified commerce

eCommerce SEO visualization showing keyword analysis, AI insights, and organic traffic growth with structured data for improved search visibility.

eCommerce SEO in the Age of AI and LLM Search

8 min. read

Article

Events

Collage of event photos including conference signs, team happy hour, and outdoor scenes.

June events recap: A month of innovation and connection

5 min. read

Article

Experience design

Woman working on a laptop surrounded by floating UI elements, representing intuitive digital experiences and human-centered design in modern web development.

Why tree testing and card sorting are essential for UX success

3 min. read

Article

BigCommerce

Photo grid highlighting Codal's eCommerce development projects

Rapid online store growth with Codal's eCommerce Accelerators

5 min. read

Want more insights to fuel your digital strategy?

Explore our latest expertise on innovation, design, and technology, or connect with us directly to see how we can help accelerate your digital transformation.