Grocery Gateway
Project Type:
Industry collaboration
Project Length:
12 weeks
How can we help the Grocery Gateway company improve their online grocery shopping experience and successfully triple the size of their business by 2022?
Focus Question
TEAM:
Shareeza Hussain
Jennifer Ma
Saba Samizadehyazd
Elizabeth Duong
MY ROLE:
User Experience Researcher
Facilitating group meetings
Writing user interview discussion guide
Moderating the usability testing session
METHODS & ACTIVITIES
Empathising; Understanding Food Shopping Experiences.
Stakeholder presentation
Setting goals and objectives
Establishing key audiences
Building personas
Conducting semi-structured user interviews
Usability testing of the company’s existing mobile app.
Affinity Diagramming
Value Proposition Canvas
Customer Journey Map
Creating wireframes
High fidelity prototypes
BACKGROUND:
Grocery Gateway is one of North America’s first and Canada’s largest online grocery delivery service. Longo’s acquired Grocery Gateway in 2004 and since then the company’s service area has grown to cover Greater Toronto Area and beyond to Hamilton, Guelph and Stouffville.
As part of Humber College User Experience Design program graduating class of 2018, we collaborated with Grocery Gateway to help them improve their online grocery shopping experience. My team primarily focused on researching the Empty Nesters as our main target group. By utilizing different UX research methodologies, we could develop a greater understanding of our target users needs and goals, identified problems with existing service and uncovered new opportunities.
TIMELINE
OBSERVATION
Each one of us spent a few hours inside a grocery store to understand how people shop for grocery in a physical space. We documented our observations of people's experiences in writing and visually by taking photographs.
We conducted a thorough sensory observation making note of everything we could see, hear, feel, taste and smell. This gave us an understanding of the type of sensory experiences people go through when grocery shopping.
How people choose what to buy when shopping for grocery in a physical store? We made note of people's decision-making process. We were curious to learn about the factors that impact people's thinking process when shopping.
VALUE PROPOSITION
PERSONA
USABILITY TESTING
SEMI-STRUCTURED USER INTERVIEW:
During two semi-structured in-person interviews, we closely observed an existing and a potential future Grocery Gateway client as they tried to place, modify and cancel an order using Grocery Gateway application on their smartphones. Each session took about an hour and we used Mr. Tappy camera kit to film our participants' interactions with Grocery Gateway app on their mobile device.
“If you go to the grocery store, you don’t know what fruits you want you’ll see what looks best.”
“First of all, I want to tell you this is too small font.”
“I am just looking for the place where it says Add it to your Cart.”
JOURNEY MAP
Grocery Gateway
Project Type:
Industry collaboration
Project Length:
12 weeks
How can we help the Grocery Gateway company improve their online grocery shopping experience and successfully triple the size of their business by 2022?
Focus Question
TEAM:
Shareeza Hussain
Jennifer Ma
Saba Samizadehyazd
Elizabeth Duong
MY ROLE:
User Experience Researcher
Facilitating group meetings
Writing user interview discussion guide
Moderating the usability testing session
METHODS & ACTIVITIES
Empathising; Understanding Food Shopping Experiences.
Stakeholder presentation
Setting goals and objectives
Establishing key audiences
Building personas
Conducting semi-structured user interviews
Usability testing of the company’s existing mobile app.
Affinity Diagramming
Value Proposition Canvas
Customer Journey Map
Creating wireframes
High fidelity prototypes
BACKGROUND:
Grocery Gateway is one of North America’s first and Canada’s largest online grocery delivery service. Longo’s acquired Grocery Gateway in 2004 and since then the company’s service area has grown to cover Greater Toronto Area and beyond to Hamilton, Guelph and Stouffville.
As part of Humber College User Experience Design program graduating class of 2018, we collaborated with Grocery Gateway to help them improve their online grocery shopping experience. My team primarily focused on researching the Empty Nesters as our main target group. By utilizing different UX research methodologies, we could develop a greater understanding of our target users needs and goals, identified problems with existing service and uncovered new opportunities.
TIMELINE
OBSERVATION
Each one of us spent a few hours inside a grocery store to understand how people shop for grocery in a physical space. We documented our observations of people's experiences in writing and visually by taking photographs.
We conducted a thorough sensory observation making note of everything we could see, hear, feel, taste and smell. This gave us an understanding of the type of sensory experiences people go through when grocery shopping.
How people choose what to buy when shopping for grocery in a physical store? We made note of people's decision-making process. We were curious to learn about the factors that impact people's thinking process when shopping.
VALUE PROPOSITION
PERSONA
USABILITY TESTING
SEMI-STRUCTURED USER INTERVIEW:
During two semi-structured in-person interviews, we closely observed an existing and a potential future Grocery Gateway client as they tried to place, modify and cancel an order using Grocery Gateway application on their smartphones. Each session took about an hour and we used Mr. Tappy camera kit to film our participants' interactions with Grocery Gateway app on their mobile device.
“If you go to the grocery store, you don’t know what fruits you want you’ll see what looks best.”
“First of all, I want to tell you this is too small font.”
“I am just looking for the place where it says Add it to your Cart.”
JOURNEY MAP
SCENARIO
Sharon is organizing a community event and is thinking to use an online grocery delivery service to save time. She’s heard about Grocery Gateway from one of her friends and decides to try it for the first time; ordering groceries using Grocery Gateway app on her smartphone.
GOALS AND EXPECTATIONS
See the same selection she finds at the grocery store
Cancel or edit her virtual grocery cart anytime, anywhere
Easily navigate through the app and complete tasks
Trust the people who select and deliver her Groceries
Friendly and helpful customer support
RESEARCH OUTCOME
INSIGHTS
Lack of product information
Users like to see a vast amount of details about the items before deciding what to purchase. Hence, this is a motivation to shop at physical grocery stores since they can see the items.
Help users recognize, diagnose and recover the errors
In the case there was no internet connection, the notification needs to be more visible to the user. Otherwise, the user might oversee it and encounter problems with logging in.
Interface design
Especially for main functions: Small fonts, low contrast, and lack of graphic and audio feedback. This affects the accessibility of the
app.
Mobile friendliness
Interface and functionality are not optimized for mobile devices.
Flexibility and efficiency of use
Frustrating because the app is hard to navigate, the user interface of the app does not follow standard app conventions and it is not intuitive to use. For example, “adding items to cart” and “back button”doesn’t work like other similar apps.
Error preventions
There is lack of feedback for each task completed.
Wasting time
Due to excessive swiping and clicking.
RECOMMENDATIONS
Use standards and conventions used in other e-commerce mobile apps.
Feedback
Add audio and visual feedback so that users know when they have accomplished a task.
Improve search filter and sorting options
user currently cannot customize search page results. Helps prevent time and effort needed to scroll through irrelevant results.
Implement a multi-tier navigation menu
Instead of the user having to scroll all the way down to access items on the menu, the menu should have more subcategories.
WIREFRAME
Navigation Menu
PROTOTYPE
Navigation Menu
