Shop Right, from Home

ShopRite of Lake Ronkonkoma
ShopRite of Lake Ronkonkoma | Greater Port Jeff

Some of my earliest childhood memories of growing up in northern New Jersey are of being dragged to the local ShopRite to “help” my mom grocery shop. As I’ve grown, so has ShopRite’s reach, I’ve shopped in locations across New Jersey, New York, and Delaware as well as online. Additionally, shopping at ShopRite can be associated with a few milestones in my life. In high school, I was given the responsibility to use my new driver’s license to go to ShopRite for our family’s weekly groceries. I discovered ShopRite from Home, their online grocery ordering service, just as I was starting my first full time job and didn’t have time to spend on weekly trips to the store. More recently, ShopRite was my only destination when leaving the house while social distancing was implemented.

Home Page | ShopRite

2020 and 2021 saw an increase of visitors to online retailers due to the global Covid-19 pandemic. People were avoiding going out into public places, but their needs for products and services had not lessened. This change to the norm had more people trying out online grocery shopping services for the first time. According to Morgan Wilde, a counselor with Morgan Meyers,

“20% of shoppers said they tried online shopping for the very first time or tried something new when it came to their online grocery shopping habits.”

Now is a great opportunity for grocery retailers, such as ShopRite, to welcome new online shoppers. In order to do so successfully, they need to consider what is lost in online shopping, compared to in person. Users who rely on interaction and routine during their weekly grocery runs need to be embraced. The usability heuristics of matching and recall can be applied to achieve this. By presenting online shoppers with more life-like interactions and recreating the steps they take while shopping, ShopRite can provide a more effective and enjoyable online shopping experience.


What Was Lost
The online shopping experience is preferred by many because of the efficiency and convenience of being able to search for exactly what you need. From there, users will glance through images, read product descriptions and reviews before making the decision to purchase. In this context, users are limited by how much they are able to interact with the item. On your weekly shopping trip, you might squeeze an avocado, compare the sizes of two boxes of crackers in your hands, or feel how much air is in a bag of chips before adding it to your cart. These interactions help users feel more connected to their items and confidence about their decisions.

Produce Shopping
Photo by Raquel Martínez | Unsplash

Shopping using the ShopRite app relies on static imagery and text to represent a product. Users get to see the front of the packaging and can read through the product’s main details and talking points. From there, they can choose to add to cart, save to a list, favorite, or leave. The limited sensory experience this offers affects users’ ability to match these products to their environment or to form emotional connections.

Milk Product Feature Page
Product Feature Screen | ShopRite

Why Interaction Matters
The interactions we have with the physical world shape us. One of the 10 usability heuristics for interface design, provided by the Nielsen Norman Group, is matching between a design system and the real world. “The design should speak the users’ language… Follow real-world conventions, making information appear in a natural and logical order.” Users want to conduct a process in the same way they already have in their day to day life.

The ability to physically interact with an item also may affect a user’s emotions toward that item. According to the study Suzanne Overmars and Karolien Poels published in the Journal of international Design, participants were asked about their feelings of joy and desire after interacting with static or interactive imagery of a scarf. Participants who were able to click and drag the interactive scarf reported higher levels of desire and joy compared to those who looked at static images of the same scarf.

“The more attention designers and marketers devote to emphasizing the feelings and experience of the product (“tactile” web design), the more likely it is that consumers who have a higher need for affective touch (will) take part in online shopping”.

Stronger positive emotions can be elicited when users are able to interact with something, even if they are not physically touching it.

How to Get More Interactive
In order to better reach users who are more accustomed to shopping in person, ShopRite needs to make their online shopping experience more interactive and similar to the real world. Currently, when a user wants to look at a product’s details, they click on it and are brought to a new page dedicated to the item. Instead, the app should mirror the action of picking it up, much like video games do when a player picks up a new item. Clicking on the item brings it to the forefront of the page with a movement effect, as if you plucked it off the shelf and held it out in front of you. The other items on the digital shelf would still be present in the background, allowing users to still browse through the range of product offerings while holding one.

Product Feature Page Sketch
Product features brought to the foreground while other products are visible in the background.

According to the findings of Overmars and Poels, interactive imagery should be included so users can click, drag, spin around, and flip over the product. Instead of only being able to see the front of the packaging, the user can have a better sense of what they would be getting. Manufacturers put a lot of work into marketing and designing the packaging for their products, let them do the selling, just as they do on shelves in stores. Home Depot is an example of an online retailer who is already employing this technique.

Home Depot Product Feature Page
This wrench is interactive with its 360 Degree View, try it yourself here | The Home Depot

By making these changes, ShopRite will be able to better match the shopper’s in person experience, making the process more smooth and emotive.


What Was Lost
Shopping for groceries is a weekly errand that, for most people, becomes routine. Shoppers follow their regular route to pick up their staples or may spot something new they want to try when walking down the aisle for something else. Some people can walk into the store without a list and walk out with everything they need. Others bring a list and can never quite stick to it.

ShopRite from Home gives users multiple options for navigating their product inventory: a robust, filtered search, sub menus categorized by type or department, and special offerings landing pages. Although these features may be helpful for users who already have a particular list (down to the brand and net weight), it does not help shoppers who recognize what to get when they see it in front of them. Online grocery shopping interfaces should continue the users’ physical routine as closely as possible.

Why Routine Matters
Writing a grocery list at home every week can be a difficult task. Recognition rather than recall, another of the 10 Usability Heuristics, can explain why. According to this heuristic, people are more likely to recognize something than they are to recall it without any sort of sensory prompt.

“Humans have limited short-term memories. Interfaces that promote recognition reduce the amount of cognitive effort required from users.”

Because of the fallibility of the human memory, associations need to be coaxed out.

In the case of grocery shopping, a user is able to go on auto pilot and pick up their weekly staples because as they are walking their usual path, they look over and recognize the box of oatmeal that was sitting in their pantry, until it ran out a few days ago. They weren’t able to remember they needed it as they were writing their list earlier, but walking down the aisle gave them the reminder that they needed.

Currently, ShopRite from home requires users to recall what they need before they can find it on the site and add it to their carts. After they have their comprehensive lists written, they can use the search function or navigate “shop aisles” > category > product type > product type > search results to find what they are looking for. This kind navigation is expected in most online retail environments, categorization is even recommended by web hosts like SiteGator.

Adding Milk to Cart, 5 Steps
User’s path to add milk to cart

According to Don Norman, in his book Emotional Design, “Usable designs are not necessarily enjoyable to use.” Just because their site functions like a conventional online store, does not mean it is what the user needs. ShopRite should strive to create an enjoyable online experience for users, rooted in their recollection of the physical space.

Stocked Grocery Store Shelves
Photo by Bernard Hermant | Unsplash

How to Recreate Routine
To serve users’ who are reliant on their weekly, physical routine to fill their cart, ShopRite needs to recreate how users move throughout the store and what they see. But when it comes to browsing, users can’t just casually stroll down the aisles and scan the shelves on an online platform…can they?

Virtual reality is a tool that may help bring audio, visual, and spatial experiences into the home. With VR, a user can browse through a virtual copy of their grocery store, walk around, pick up items, listen to specials announced over the intercom and more. With a one to one recreation of their familiar store, they can follow their usual routine with all the benefits of shopping from home such as avoiding crowds and the delivery service. Megan Higgins talks on how augmented reality can be used as a tool to provide users with immersive experiences.

“Once consumers make their way to your online store, they expect to have the same experience as if they were in a physical store. The expectation is that retailers will virtually provide a mirror of in-store shopping experiences by incorporating adaptive and interactive technologies into their online storefronts. To do so, retailers must leverage technologies that can provide lifelike interactions online.”

With a full 3D immersive environment, users new to online shopping don’t have to adjust to a different approach to how they fulfill their weekly shopping needs.

Man Using Virtual Reality
Photo by Laurens Derks | Unsplash

VR technology is developing quickly, but some users and retailers may not be quite ready for that leap yet. Luckily, there are other ways to emulate the physical properties of navigating your local sales floor. It could be as simple as creating a flow to the aisle category pages that matches the flow of traffic in store. The website can provide users with a low fidelity floor map of the store and enable them to click on a location and then provide them with the item categories that are in the vicinity. Additionally, each aisle or category landing page can come with a panorama or interactive 360 image that allows users to recognize where they are and what products are available to them.

By providing immersive 3D environments or adding spatial wayfinding to their inventory navigation, ShopRite can enable their users to recognize what they need in the same manner they would if they were standing in store.

Shopping Category Page Sketch
This navigation mimics the flow of traffic in a physical store

In Conclusion

ShopRite from Home has designed it’s online shopping experience with principles that can be found in other online stores. Given the rise in interest for online grocery shopping, ShopRite needs to pursue users who would be slow to adopt because they rely on physical interaction and routine. Users who are provided with interactive product imagery will have more positive feelings toward their choices. Additionally, 3D immersive shopping environments will help users to follow their current routines to find what they need in the vast inventory. Some online grocery retailers may pass up the opportunity to explore how to recapture the shoppers’ physical experience in favor of following standards set for online shopping, regardless of how well it fits with their industry. However, innovating this virtual experience will set retailers apart to their consumers.


ShopRite | Website

Evolution of the 2020 Shopper: Online Shopping Behavior | Morgan Wilde

10 Usability Heuristics for User Interface Design | Nielsen Norman Group

A Touching Experience: Designing for Touch Sensations in Online Retail Environments | Suzanne Overmars, Karolien Poels

The Home Depot | Website

Emotional Design | Don Norman

How to Improve Your Online Store Navigation for a Better Customer Experience | Casey Kelly-Barton

How Retailers Can Navigate the New Digital Commerce Paradigm | Megan Higgins