Date: Nov 2018 - Jan 2019
Client: Longo Brothers Fruit Markets Inc.
My contributions: User Interviews, Usability Test, Task Flow and Wireframe Creation, Digital Prototype, UX Design
Final prototype regarding Out of stock items for Grocery Gateway's responsive website
Background
Grocery Gateway
When Longo’s acquired Grocery Gateway in 2004, it was a natural extension of the personalized service that they had built their reputation on. Today, Grocery Gateway is Canada’s largest online grocery delivery service. As one of the first online grocers in North America, opening in 1997, they’re also the most experienced. Their goal is innovative, friendly service that brings you good food and makes your weekly shopping easy.
Project Brief
How might we reimagine My Lists in a way that allows users to shop in an efficient manner while exposing them to new products and moments of inspiration leading to increased incremental sales and brand loyalty?
Research Question
What are the pain points or frustrations of making lists?
My Lists at a glance (Desktop version)
Overview of the process
Our research objective was to explore insights regarding user experience towards My Lists. The project was divided into main two stages. However, the focus of this report is "Out of stock" items. (To get further information, please click on yellow subheadings.)
1. Research
Interviews were conducted on the same day with three different participants, all of whom are users of the My List function on the Grocery Gateway website. The interview consisted of a series of formal questions and was followed by observations.
After the interviews, we coded the transcriptions by putting the different data points into different categories. This was an important first step in putting the information into an affinity diagram.
Coding names to cluster main theme from the interview transcriptions
The users we interviewed fit into two of the Grocery Gateway personas, Morgan (PT01 & PT02), Charlie (PT03).
We took all the data points we coded and put them up as sticky notes on a board. We then grouped similar ones to identify several overarching themes. These themes then helped inform our insight statement.
Pain points gathered from conducting user interviews
Our recommendation regarding out of stock items
2. Prototype
A useful step before developing the first wireframes, this allowed us to work out what process would need to be followed in each new design for the prototype to work as intended. The reason why I chose hi-res wireframe to start at this point was all the materials and brand guideline were provided.
Developed in Sketch, once we were happy with the hi-res wireframes, the more time consuming hi-res prototypes were put together with the intent that these are what we would test with. I developed prototypes for "out of stock" items on Website/Tablet/Mobile.
We were able to run through scenarios for different prototypes we developed with two different participants. This was done in the Humber mobility lab, using Tobii eye-tracking devices and software.
Using our notes, videos, and gaze plots from the Tobii eye-tracker, we put together a feedback grid and developed insights about the prototypes.
Humber Usability Lab using Tobii Eye Tracker
Our initial prototype for Out of stock items on Website version
Heat Map after testing with our initial prototype for Out of stock items
Reflection
I feel that more user testing would be useful to determine what parts of the process could be better optimized for clarity and simplicity. For out-of-stock substitutions prototype, re-develop to show all the potential substitutions on a different page.
Through this project, I could review design process and apply all UX methods into the retail industry. Conducting user interviews enriched and set goals for the whole process, some ideas stemming from power users were practical and valuable than we had expected, which amazingly contributed to the quality of the research.
Looking forward, I hope that we could have opportunities to work with developers and IT team to optimize all UX design skill set and bring our prototypes into life.