An app that enables you to get the most out of your ingredients, minimize waste, and help you tap into your resourcefulness.
Role
UX Designer
UX Researcher
Branding Designer
Timeline
100 hours
Project Type
End-to-end mobile application
Tools Used
Project Background
If you were to open most people’s pantries on any given day, you’re likely to find a store of ingredients that are rarely touched. If you were to open your own pantry, how many ingredients would you find that have been sitting there for months? How often does the fresh food in your fridge go bad? How often do you come home after a day of work, walk straight past the pantry and fridge, and open Uber Eats? How often does figuring out what to cook stress you out, rather than get your creative juices flowing?
Turns out, you’re not alone. 100% of the users I interviewed couldn’t utilise their pantry and fridge ingredients in an effective way. 80% of users admitted to throwing out food because they didn’t have the time or confidence to make something tasty out of it.
Every year, Americans waste:
80 million tons of food
149 billion meals
$444 billion dollars’ worth of food
Before touching anything related to design, I wanted to understand how food waste affects more than just the people I interviewed.
Feeding America tells us that in the United States, a massive 80 million tons of food is wasted every year, which equates to 149 billion meals. Putting this into more tangible numbers, they throw away over 444 billion dollars’ worth of food annually. That’s 38% of all the food in America.
While a large percentage of that wastage (46%) comes from the food industry, that means an even larger amount is wasted by individuals.
How can we fix this?
How might we provide a service that gives meal suggestions based on users’ available ingredients and dietary requirements?
How might we make the suggested recipes easy to understand, navigate, and follow?
How might we make it easy to navigate the app, add preferences, find and save recipes, and add items to a shopping list?
Working toward a goal
Reduce food waste
Inspire users to be more creative in the kitchen
Save users time and money by giving them the tools to be more resourceful
Understanding the user... everyone?
To better understand how people utilise their ingredients at home, I conducted 5 user interviews with home cooks of varying abilities and time constraints.
During this research phase, I also tried to understand:
Challenges people face when cooking at home
How often people find themselves with ingredients they don’t know how to use
How people typically find recipes
Biggest pain points when using existing recipe sources
Key frustrations
Food waste due to a lack of inspiration in the kitchen
Difficulty finding recipes for specific ingredients
Too many ads, difficult navigation, too much scrolling
Struggling to find time to cook
Not knowing how to use leftover ingredients
Dietary preferences and needs that need to be accounted for
If only there were- Solutions!
A way for the user to input their available ingredients, so they can choose a recipe that is personalised.
Filters so the user can search by cuisine or meal type.
A simple way to find and save recipes, and add items to a shopping list.
The ability for the user to input their dietary preferences.
Recipes that are easy to understand, navigate, and follow.
A way to collaborate with people in their household by introducing a joint shopping list and a shared recipe folder.
Mapping out the user’s journey
Key
Add ingredients to Pantry
Final Designs
Onboarding process and pantry population
During onboarding the user can enter their favourite cuisines, dietary preferences, and allergies. This ensures that their recommended recipes are always personalised.
It also became clear to me that adding all of the user’s available ingredients manually can be long-winded and tedious, so I included a feature where the user selects the cuisines they normally cook, and Pantry suggests ingredients based on the selection. That way, the user just has to go through and remove the ingredients they do not have in stock.
Add ingredients to Pantry
An essential part of this app is a smooth and seamless way to add ingredients. There are two ways in which the user can do this.
The first is by browsing ingredients similarly to a grocery shopping app, where everything is organised like the aisles in a supermarket.
Another way is for the user to take a photo of the item they would like to add.
In further iterations, I would like to implement the option for the user to take a photo of their grocery shopping receipt so multiple items can be added at once.
Suggested recipes and shopping list
The priority here is to show recipes that don’t require the user to buy any extra ingredients, but in the case that they don’t have everything they need, they have the option to add the missing ingredients to a shopping list.
The user can also filter the recipes by cuisine, ratings, and diet.
Within the individual recipe pages, the user will be able to see an overview, the ingredients, directions, utensils, reviews, and add their own notes.
Challenge-Driven Design
Breaking it down
Problem 1
Food waste due to a lack of inspiration in the kitchen
Solution 1
Users can prioritise the food they might end up wasting by searching for recipes that use those ingredients.
Search Bar
Easily search for specific ingredients to add to My Pantry.
Product Types
Browse items similarly to how you would a supermarket app.
Scanner
Add items to My Pantry by scanning a barcode or taking a photo of the item.
Search Bar
Easily search for recipes that use specific ingredients.
Suggested Recipes
Users are shown recipes that use the ingredients that they have entered into their pantry.
Problem 2
Online recipes have a lot of ads, can be difficult to navigate, and require too much scrolling
Solution 2
The recipe page is divided into separate tabs for ingredients, utensils, directions, nutrition facts, notes, and reviews to reduce the amount of scrolling necessary.
Tabs
Reduce the amount of scrolling by accessing different elements of the recipe through tabs.
Reviews
Read and leave reviews
Problem 3
Users have dietary preferences that need to be accounted for when choosing a recipe
Solution 3
Users can input their dietary preferences during onboarding.
Dietary Restrictions / Allergies
Users can select their dietary restrictions and allergies during onboarding.
Disliked Food Entry
Users can enter the food they don’t like to make suggestions more personalised.
Usability Test Findings
After conducting a usability test with 9 participants, the results were largely consistent.
Key Finding 1
“The only thing I might suggest is potentially having a search available in the section where you filter what ingredients you do or do not have in stock”
“With the pantry list, it was a lot to scroll through and if I were using this app, I don't think I'd read through all of the items”
“I think the ingredients list is rather long to scroll through”
“I would have appreciated a shortcut, such as a search function, that would allow me to quickly find these ingredients by inputting a search term”
Version 1
Version 2
Search Bar & Filters
Users can search through the suggested ingredients without needing to scroll so much.
Key Finding 2
"On the home screen, I didn't immediately realize that the cuisine types were scrollable horizontally since there wasn't a partial icon visible or something that indicated I could do that"
"I didn’t realize I could scroll horizontally to filter my search results, such as for the Indian cuisine icon"
Version 1
Version 2
Reduced padding on cuisine icons
I reduced the padding here to make it more obvious that the cuisines are scrollable.
Key Finding 3
“Perhaps the option to add all of the missing ingredients to the shopping list could have been higher up on the screen. I didn't expect to have to scroll down so far to find it”
“The screen where I can find all the missing ingredients from the recipe and add them to my basket was a bit confusing for me. I wish there was a prominent call-to-action button, such as ‘Buy Ingredients’”
“’Add to shopping list’ text was very small and hard to notice at the first glance.”
“It felt a bit repetitive to have the ingredients show that they're missing, and then at the bottom provide the recap.”
“With the recipe, I would've wanted my don't have list at the top since I would make the decision to continue reading the recipe or skipping to a different one depending on how many ingredients I needed to get”
Version 1
Version 2
Missing ingredients moved to top
This makes it easier for the user to see what they need to buy before making the recipe.
Larger CTA
Reduces confusion. CTA is also now more consistent with the rest of the app.
What folks like:
“I love this!! very cool concept and can see myself using this. it would come in handy. I like the name and ui, it felt fun using.”
“This was so cool! I loved how clear and intuitive everything is.”
“Overall, I found most things to be straightforward, and I like the icons.”
“I liked your designs! Very pretty. All seemed very intuitive to use and I liked the various filters and tabs”
“My experience with the app was overall successful and straightforward, I really enjoyed its UI and how organized everything looked.”
“I found this very easy to understand, very intuitive.”
Key Learnings
Working on this app helped me realise that food waste is more of an issue in the United States than I originally thought. It has inspired me to be more conscious of how resourceful I personally am in the kitchen.
What’s Next?
Integrate online shopping so that users can order the ingredients they need directly through the app.
Introduce shared recipe folders for easier collaboration and idea sharing.
Consider free vs premium business models: Introduce video tutorials and lessons for paying users.
Like what you see?
Let’s chat
chelchadesign@gmail.com