UX Design and Accessibility fanatic.
BackgroundKrogerSquarespace.png

User Experience & Research: Kroger Case Study

Class: GIT 340 InfoDesign/Usability
Description: Design and technology solutions for increasing website usability and methods of organizing information to improve the user experience.


Research and Usability Testing

In this class our group collected data from 12 people who filled out our survey and answered questions on their age, gender, and overall experience using Kroger’s ClickList service*. We then individually formulated our own heuristics evaluation on Kroger’s website. We also performed usability tests and gave specific activities to 8 participants.

*This evaluation was conducted in Spring of 2018 and many of the issues found have since been resolved, which is exciting to see!

persona-halima.jpg

Persona From Data

We created a persona from the preliminary survey of 12 Kroger users. We created two in total and used the most common and diverse answers from the data.

If needed, a detailed view of the project and its data can be seen as our Google Slide presentation.

 

Results

Issues found by users

6 out of 12 users had some issues, ranging from minor to catastrophic, with the Kroger website.

The shopping list on the app is confusing.
— Female, Married, Age 25-34, Uses Kroger.com 3-4 times a week
The Kroger ClickList checkout is the most frustrating thing about Kroger.com
— Female, Married, 35-64, shops at Kroger 1-2 times a week
Navigation between the Kroger site and ClickList is not fluid.
— Male, Married, Age 25-34, Uses Kroger.com 1-2 a week

Issues found in heuristics evaluation

For each issue found, they are sorted, explained, and compared to Molich and Jeffries’ severity scale:

  1. Positive: positive experiences were also tracked (there are probably many more, but these ones stood out).

  2. Minor: briefly delays the user (could be as simple as a cosmetic issue).

  3. Serious: delays the user; however, they are still able to figure it out with difficulty.

  4. Catastrophic: prevents the user from completing a task and cannot figure it out.

HeuristicStatistics-positive.png
HeuristicStatistics-minor.png
HeuristicStatisticsSerious.png
HeuristicStatisticsCata.png

Catastrophic issues found:

  1. No “clear all” in the list section - users will need to manually delete each item (could possibly have to delete over 50 items, individually).

  2. No clear purpose for the “list” section as they are not added into your cart and have to individually be added to the cart (again, there could be over 50 items in a list). Possible solution: add a “save for later” button in the checkout process rather than having all items in a “save for later” stage and having to add them to a cart manually.

  3. The “Order Online” drop-down menu shows a very illogical set of options and does not link to the ClickList feature.

  4. Adding to the issue above, the solution could be simply to remove the drop-down and have the user be redirected to the ClickList tool by clicking “Order Online.” The other information on the drop-down could easily be added to the navigation and others to a “My Account” drop-down such as “My Purchases” and “My Prescriptions.”

  5. The 404 error page tells the user to use the back button and gives the user a list of affiliated brands to choose from. Since the issue was on the Kroger site, there should be no need for the user to see a list of links or be told to “go back.” Here, the user experience could greatly be improved by offering common pages. Below is a screenshot of the site’s 404 page (which still has not been updated).

  6. Kroger offers access to a recipes section on the website and at first glance this seems like a powerful marketing tool. However, when viewing a recipe, each ingredient cannot be added to the cart. This is a resource that could prove valuable to customers if Kroger added an “Add to Cart” beside the recipe or beside each ingredient. This is not only a user experience issue but also a very expensive marketing mistake. UPDATE: This feature has been added to their website.

Dropdown for “Order Online” shows: My Purchases, Deli & Bakery, Mobile Top-Ups, Floral, Fred Meyers Jewelers, Gift Card Mall.

Dropdown for “Order Online” shows: My Purchases, Deli & Bakery, Mobile Top-Ups, Floral, Fred Meyers Jewelers, Gift Card Mall.

Kroger’s 404 Page shows a list of Kroger’s partners and provides no tools for the user to helps resolve the error. This page is still the same today (2020): www.kroger.com/alkfhdak

Kroger’s 404 Page shows a list of Kroger’s partners and provides no tools for the user to helps resolve the error.
This page is still the same today (2020): www.kroger.com/alkfhdak

Kroger’s recipes do not have a feature to add ingredients to the cart.

Kroger’s recipes do not have a feature to add ingredients to the cart.

Overview and Conclusion

Overall, it was surprising how many issues I found while doing testing and research in such a short amount of time. In this evolution, we found user experience and interface issues with the design, user control and freedom, consistency and standards, flexibility of use, error recognition, and error prevention.

It was eye-opening to spend 6 weeks on an in-depth project that dealt with a real-world, practical example such as Kroger’s website. It seemed as though such a large company with such a large audience would have fixed these issues long ago. However, I have noticed Kroger’s new branding and motivation to solve their user experience issues; it is encouraging to see change happening. I look forward to helping companies solve problems with the goal of helping thousands of people complete tasks such as grocery shopping.

Further Research and Testing

In our team of five people, we each asked two people to follow a set of steps and prompts while navigating the Kroger website. We took notes of how long it took each person to complete their tasks, levels of success or failure, and overall demeanor.

We asked each person to complete 14 tasks. As there was too much qualitative and quantitative data to sum here, below is our favorite discovery during the testing:

What is the ClickList then? Oh, the cart!
— One user exclaimed. Note: We found this very interesting as none of us realized the name ClickList was actually a misnomer. Thankfully, Kroger has appropriately updated its name to: "Grocery Pickup"