Wellio - Shopping List
Opportunity: Research, UX/UI Design
Challenge: Redesign the Shopping List Experience
Duration: Jun 2020 - Feb 2021
Overview
Background
Wellio’s app - Meal Hero helps home chefs to manage their meal experience in one place. It offers recipe discovery, meal planning, shopping list management, and ingredient purchase. For this project, we will be focusing the shopping list management. What is Wellio
Problem Statement
The current return user engagement is low on the Shopping List. We want to understand our user pain points, goals, and motivations on the shopping list, so we can increase return user retention.
My role
I was an active contributor and leader of this project. Following the double diamond framework, I was the main contributor to the problem discovery and concept validation phases, while I led the design sprint effort for problem definition and solution discovery phases.
Result
Return users perform significant interaction increased 260% in 10 months.
Design Process
I used the double diamond design process to discover problems, articulate design challenges, generate ideas, and refine solutions. Here are the shortcut links to each section.
Problem Discovery
Analytics
Average ~3% of returning users who engaged on the Shopping List as of June 2020.
Market Trends
How we shop
4/6 shopping modes involves pre-store activities
26% of shopping trips influenced by recommendations or connections
63%say generic products taste just as good as brand name products
How we shop
62% of consumers buy the same thing each week
Covid behavior change
Since covid on March 2020, people are going to fewer stores and spend more money per visit
Shop and spend more online, but on a narrow range of items.
How we plan - Online Shoppers
78% check what they have in the pantry and fridge
55% check recipes
44% plan out their meal
81% make a shopping list
User Insight
I want to get quality feedback fom home chef based on their experience on our Meal Hero app and a competitor ( Cooklist). I picked Cooklist because we share similar target audiences, solve the same user problem, and they are considered one of the best mealplanning app in the market. In this research, I will uncover
Mealhero user insights on frustrations, delights, and observation
Cooklist user insights on frustrations, delights, and observation
User expectation on Shopping list app capabilities
Why do users write down shopping list
Problem Definition
User Profile
Based on the market trends and user research. We concluded this is our target user profile.
User Journey
There are two goals users want to achieve
Write down the list so they can remember what to buy
Use the list when they are purchasing the items
HMW
This section was part of the design sprint brainstorm. While I was a facilitator, it was a group effort with the product manager, data scientists, and engineers. We:
Converted user pain points to HMW opportunities
Prioritize opportunities based on values v.s. effort
Dot vote on the opportunities we should look into in the near term
HMW Prioritization
Based on the dot voting, we decided the following are design challenges we would like to solve in the near
Solution Discovery
For clarity and conciseness, the rest of the presentation I will be only focusing on one challenge - HMW make it easier for users to enter ingredients.
Competitor Research
We did research on competitors as well as apps that are best in class on how might they solve the user problems we are looking to solve. Here are some of the competitors we looked at
Cooklist
Whisk
Instacart
Shipt
Yummly
Solution Ideation
Next, we had a sketch section where we brainstorm did ways to solve the problem.
Solution Prioritization
As a team, we walk through sketches together, and write down all of the ideas that came up on the sketch session. Afterwards, the product manager and I came up with the metric and prioritize solutions based on impact. We decided to focus on the ideas that have the biggest impact.
Updated Information Architecture
With the proposed solutions, we analyze and look into where to fit the new solution would fit into the existing information architecture. The lavender color is the future pages. As for the “HMW make it easier for user to enter ingredient”, it fits right on the add item page.
Concept Validation
Usability Test - Part 1
Situation
This usability test is run for the shopping list page, but the finding can also apply to the recommendation feature. My goal was to figure out how the location of CTA, and image size would affect the user’s completion time on a task. Four versions are presented with various combinations.
Task
40 people are asked to check off cheese from the list
Result
No image yield is the slowest task completion - 15 second
Bigger images and CTA on right yielded the quickest time completion ( 7 seconds)
Usability Test - Part 2
Situation
I want to figure out users preference on the design in terms of - Visual appeal, easy of use, and usefulness
Task
50 people pick which design they prefer between A, B and C
Result
Overwhelmed majority pick version C where the CTA clearly stated
Hifi Mockup
The hifi flow:
Home chef select “+”
A drawer is presented with a list of recommendations and a search bar. It is defaulted to search.
Once an item has been selected from the list. The plus icon turns into a check icon, and a toast notification confirms the action as well.
As soon as the home chef starts to scroll, the keyboard disappears, and more recommendations would appear.
Result
Based on our analytics, Our active users who engaged increased from 3% to 8%, which 2.5 times, in a matter of 10 months.
