Background
Project Details
It came to my attention that our household food wastage has significantly increased due to excess food shopping and expiring food that has to be thrown away and leftover yet to be consumed. This has made me realize that food wastage and money spending have become a problem, not only for the household but also for the environment. It has inspired me to look deeper into the problem space and see how it can be addressed.
Role: Product Designer, UX/UI Designer, UX Researcher, Branding
Tools: Figma, Photoshop, Microsoft Survey, FIGJAM, Huion
Timeline: 6 months
DESIGN MISSION
FoodKarma's mission is to equip households with the tools and knowledge to combat food waste
We will help households prolong their food inventory through food visibility and accurate inventory tracking.
We will help households save time and encourage home cooking by timely revealing dynamically curated recipes.
We will help households master food efficiency through education and awareness.
We will help households conceptualize their financial impact when they waste food.
THE PROBLEM
Designing for food efficiency & control
Food waste is a prevalent issue with economic, social, and enviromental implications as the leading contributor to Methane gas. In developing countries like North America, 61% is wasted at the household level, and about 2/3 of this food is due to food not being used before it goes bad. This amounts to 140 Kilograms of wasted food per year for the average Canadian household, carrying a price tag of more than $1,100 annually! Often this is because of improper storage, poor planning, and lack of food visibility at the household level.
THE CHALLENGE
Invent a solution to help households be food efficient and prevent food waste.
UNDERSTAND & DEFINE
User & Market Research
User Surveys and User Interviews
To gain a better understanding and perspective of household food waste, I dove deeper into the underlying issues. I started out by doing user research, where I conducted surveys to get analytical data and interviewed potential users to uncover their pain points, motivations, behaviours, and goals. I interviewed five people; two were male, and three were female between the age of 24 to 40.
PAIN POINTS
Can't remember everything we have in the household kitchen.
Hard to get motivated to cook at home.
Buying ingredients you thought you didn't have.
BEHAVIOURS
Feel less guilty throwing out food purchased at a discount
Food that is still good gets wasted, if it looks bad thrown it's out for cosmetic reasons.
Under estimate how much food gets wasted in their household waste
GOALS / MOTIVATIONS
Accurately track their food inventory
Variety of curated recipes
Save money by being food efficient
Key Insights
IMPROPER STORAGE
Food spoilage at home often occurs due to improper storage, which could have easily been prevented if stored correctly and in an easy-to-find location
LACK OF VISIBILITY
Food is frequently wasted at home because people forget about the food they have in their kitchen, including leftovers, and cannot track their condition effectively.
MISJUDGED FOOD NEEDS
A good portion of household food waste results from bulk food purchases and cooking or serving too much food.
POOR PLANNING
Without shopping lists or meal plans, people often make inaccurate estimates of how many ingredients they will use during the week.
Hybrid Card Sorting & Dot voting
Participants were given a list of cards and limited to only using the cards provided, where they were asked to sort them into categories. I used the hybrid approach, where participants were offered the opportunity to suggest missing terms or categories to not excluded possible relevant concepts. This allowed me to discover and compare how participants think about my content and organize it in a way that better suits the mental modal of my target user. After this, I took all the information, scored and ranked it and measured it against my goals.
IDEATION
From Data to Display
Sketches & Wireframes
The initial sketch started in Photoshop using the Huion sketch pad. This allowed me to express my ideas quickly and explore potential forms the ultimate design could take. Once I had the basic concepts, I moved into greyscale wireframes to help test and validate my ideas. Below are some of the early iterations that contributed to the final designs.
Home Version 1
Home Version 2
Inventory Version 1
Inventory Version 2
PROTOTYPE & TEST
Execution
Walkthrough
When conducting usability tests, some users would go through the prototype and not fully utilize some of the key features of FoodKarman and bounce. In the activation phase of the product funnel - users must have an excellent first experience. To ensure this, I introduced a product walk-through to help highlight some of the key features. I showcased only the main features to improve learnability without adding unnecessary noise.
Squint Test
I did a squint test to get a high-level view of the visual hierarchy of my work and tested to see what elements stood out and were the primary focus. Performing this test allowed me to quickly see which elements appear connected based on their proximity and remove some visual clutter. In conclusion, the elements not intended to be the primary focus were too distracting due to their vibrant colours. Therefore, I reduced the brightness and saturation.
Home Screen_Blur(6)
Home Screen_Blur(20)
Recipes Screen_Blur(6)
Recipes Screen_Blur(20)
Design Metric & KPI
The KPI is Usability and the UX metric used is time on task. The numbers below are measured in seconds and are the average of all 10 participants.
"Save time on finding ingredients and recipes that will reduce food waste"
TIME ON TASK #1
Find (2) item’s in your kitchen inventory that is expiring soon (expiring in 1-2 days).
Results: 45 seconds | 7 seconds Using FoodKarma
542% Improvement
Using FoodKarma vs Conventional methods
TIME ON TASK #2
Find a recipe that uses two or more items in your kitchen inventory that will expire soon (1-2 days).
Results: 1800 seconds | 10 seconds Using FoodKarma
17,900% Improvement
Using FoodKarma vs Conventional methods
The result
3,251% Improvement
In task time using FoodKarma
Conclusion: I used geometric mean rather than arithmetic mean because I didn't want a single big number to skew the results. Second, it helped me to account for negative metrics if there were some. It may not be a fair test because FoodKarma is using algorithms to help do a lot of the work, but that's the power of the App. By reducing the time for the task and improving usability we can help encourage homecoming and reduce food waste in households.
A & B Testing
To get an idea of which navigation I should go with for the recipes page, I conducted a series of A and B tests where I showed both design variants to different users to determine which one is the most effective. This test helped me stop making design decisions based on my personal preferences and biases and let the users vote via their behaviour.
Version #1: The call to action wasn't very clear and left them guessing what the action would do untell they tapped it.
Version #2: This version was more effective for the users in achieving their goals while providing them with all the primary actions and what to expect when they tap them. This version removed a lot of friction and reduced the pogo effect. I also added the CTA (I made this) to the top as it's the primary action once someone has finished cooking the recipe.
Version 1
Version 2
Revisions
Navigation Bar | List layout | Storage tips: Through my research and the feedback I received, I learned that a list layout for items that you might want to use soon were more effective as opposed to having the content displayed on cards. I also learned that it would beneficial to have storage tips for some of the items on the list. So what I did was make it more scannable and something that was easier to build and maintain. Added storage tips to the list layout where it was difficult to do using the card layout when trying to fit all the information and maintain a minimal design. I also changed the navigation bar to outlined with 2px radius to match existing icons adding more harmony to the overall design.
Before
After
THE EXECUTION
It helps you never let food go bad in your kitchen
Food karma helps households track and monitor their food inventory and be food efficient while saving time and encouraging home cooking. Providing curated recipes and just-in-time push notifications when their food is about to expire or needs their attention, Food Karma helps households reduce their food waste.
FoodKarma's mission is to equip households with the tools and knowledge to combat food waste
This mission statement constantly served as FoodKarma's north star while proving boundaries and guardrails to ensure everything was aligned. At the same time, the goals were the compass that always pointed north and tied back to the mission statement. FoodKarma was also a timeboxed effort, so when it came to building and implementing different features, I only focused on the ones that I felt best fulfilled the goals set forward.
Permissions
For some additional work, I created a permissions onboarding flow that would be used to help address some privacy concerns and provide reassurance.
Let me introduce you to Carmichael, our logo and mascot, and he is on a mission to help you be a food-efficient hero!
Retrospective
The timing of the project during the pandemic has made it a little more challenging to go out and collect user-tested data and conduct in-person user interviews. I had to get creative when conducting surveys and some user interviews using Skype, Google meets and SurveyMonkey to get my data. One of the main lessons l took away from this project was the importance of outlining a UX strategy early and that not every feature has to make it into the final design.
Let's connect & chat!
© 2019 Michal Domanski