Kroger Product Finder

Shoppers often struggle to locate products in grocery stores like Kroger, leading to frustration and waste of time. This problem result in a less efficient and more stressful shopping experience. The lack of an effective in-store navigation solution makes it challenging for shoppers to quickly find what they need.

Aisle signs at Kroger - Are they really that useful?

Kroger has its website for users to look up for the location information of specified products. However:

• Complicated user actions are needed to reach the location info of products
• Overwhelming UI elements
• Many products are missing location info

Help shoppers to easily find the the products they are looking for.

My goal for this project is to create an effective digital solution that enables grocery shoppers to efficiently search and locate products in-store, allowing them to save time and reduce frustration to improve their overall shopping experience.

Key data gathered from second-round on-site usability tests:

I brainstormed 8 digital solutions that might improve shoppers' product location and in-store navigation experience. There is a 5-frame storyboard for each solution to visualize user interactions. I aimed to determine which solutions are the most efficient and effective to be deployed.
‍
Among the 8 ideas, I believe the self-service kiosks will be the best solution, considering its ease of deployment, cost-effectiveness, and efficient user flow.

I conducted a QOC (Questions, Options, and Criteria) analysis to help brainstorm design solutions and assess some trade-offs for certain design choices.

(Click to enlarge)

The user flow diagram helps visualize key interactions. I want to ensure that the item-searching and locating process on the kiosk app is simple and efficient, minimizing the time and effort users spend finding items.

Kroger stores use a two-level location system on its products: aisle numbers (first level) and section names within each aisle (second level). While this system helps shoppers find products, they still struggle to find specific items because they may not know which category a product falls under.

To address this, I leverage the system as a indicator of product location rather than relying on category knowledge. When users search for a product on the Product Locator Kiosk, it displays both the aisle number and the section name. It provides more accurate location details and making in-store navigation easier.

Aisle signs at Kroger

The sections within each aisle

Deployment Strategy

This product search application will be carried on light-weighted floor stand kiosks. The stands will be evenly distributed in the store every 2-3 aisles, on both sides. I want to ensure shoppers to easily access a device from any corner of the store, while minimize the risk of obstructing foot traffic.

Bosstab Elite Evo Floor Stand

Visualization of Distribution in store

I sketched wireframes to quickly visualize and test different design layouts of the product search kiosk's user interface. Then, they were transformed into digital low-fidelity and high-fidelity prototypes to test key user interactions on the product search process of the kiosk.

(Click to enlarge)

Results show that the paging group find their desired product quicker and more accurate. This method provides less cognitive load by limiting the number of choices at a time, and allows users to keep track of their position while browsing.

• The paging group locate the target product 33% faster than the scrolling group.
• Both scrolling group participants attempted to scroll back to check whether they had missed something
• Both groups had no problem understanding the interaction method

This final design flow is dedicated to simplifying user interactions. It ensures the user reaches the endpoint (the product page) within a few steps. The design strictly follows these principles:

• Prioritize simple tap interactions; avoid complex gestures such as swiping or pinching
• Ensure content is large enough to be easily read or recognized
• Minimize cognitive load by avoiding cluttered or complicated UI elements

To test the outcome of this project, I conducted a on-site usability testing with 4 participants at a Kroger grocery store. The test result of using the kiosk app is compared to the existing Kroger website. Some outstanding data are as follows: