INGREDIENTS

END-TO-END PANTRY RECIPES APP

OVERVIEW

ROLE

  • UX Researcher

  • Product Designer

TOOLS

  • Figma

  • Miro

  • Loom

  • G-Suite

TIMELINE

  • 80 hours

  • 2 weeks

Problem

Everyday, we cycle through food. We stock our kitchens with various items but often times we forget what we have or we don’t always know what to cook with what’s already in our pantry. People often go out for a meal, spend more money, and waste resources they have at home.

Solution

What if there was an app that took the ingredients readily available in your kitchen and provided you a list of recipes from just those items?

This is why I created the Ingredients app. Not only does it keep track of your pantry items and provides you recipes, it also helps reduce food waste, and promotes sustainability and creativity.

RESEARCH

Competitor Analysis

Prior to this project, I wasn’t aware of any similar apps that existed. Upon research, I found 3 apps with similar goals. I studied each of these apps and assessed their strengths i.e., how they made adding ingredients efficient and intuitive. I also noted where they needed improvement i.e., disorganized sections.

User Interviews

After studying competitors, I wanted to have a discussion with people who could benefit from an app like this. I conducted 6 in-person interviews with those who cook for themselves and/or for their families between the ages of 25-35.

I wanted to understand how people currently utilize their kitchen - more specifically their habits with cooking, stocking the fridge, and how often they deal with food waste.

Synthesis

To help me breakdown the insights from these interviews, I added my findings into an Affinity Map. From there, I organized my key takeaways into three buckets: Needs, Pains, and Wants:

NEEDS

  • Motivation/ideas to cook

  • Dietary preferences

  • Not waste food

  • Simple, quick options

PAINS

  • Frequent expired foods

  • Wasting money, buying more

  • Lack of recipe ideas

  • Repetitive meals

WANTS

  • Shopping planner

  • Food expiration reminders

  • Share recipes with friends

  • Recipe videos

“I face this issue all the time. This is such a good idea!”

“I always get stuck on what to cook next. I love how this app will solve that!”

DEFINE

User Persona

After researching similar apps and chatting with 6 different perspectives, the conclusion for Ingredient’s persona would be a casual home cook, Tanya.

Tanya has the traits of an average Ingredient’s user: gets groceries weekly, cooks with her partner, and wants to be more creative in the kitchen.

Feature Roadmap

By analyzing similar apps and gathering the insights from my research, I produced this Feature Roadmap.

I prioritized the P1 features because they were present across each competing app and addressed the needs gathered from user interviews. They cover Tanya’s main goals:

1) Add ingredients to app (in a simple, organized way)

2) Find and save recipes

The P2 features were essentially “nice to haves” that would enhance the user experience, but not needed right away to get the app functioning as an MVP.

Sitemap

One of the main insights I learned from the interviews: users want simplicity. They don’t need any difficulty or more decisions added to their day. I also gathered from auditing competitors that there can be too much happening within a mobile page.

From this, Ingredient’s navigation was focused on being extremely straightforward with 3 main screens: Pantry, Recipes, and Saved.

From these primary pages, an intuitive path was built to execute the 3 main tasks: adding ingredients to your pantry, finding a recipe, and/or saving a recipe.

User Flow

This user flow is a visual map of how a user like Tanya will typically move through the app. This flow includes all the P2 features which I realized really makes this product worthwhile for users. The recipe filters, like Meal Time (breakfast/lunch/dinner) allows users to get much more catered results.

DESIGN

Style Guide

Before making this style guide, I decided that Ingredient’s brand values would be around creativity, sustainability, efficiency, and waste reduction.

I then designed the logo and curated the color palette capturing the essence of how I envisioned these values.

Low Fidelity Wireframe

After diving into competitors and other popular apps, I drafted the lofi wireframes with the familiarity heuristic in mind.

I wanted Ingredients to be intuitive, so I gave it a very familiar framework with the rows of categories that can be scrolled through, search bar, filter tabs, favorite button - similar to the competing apps and also Netflix, Spotify, etc.

TEST

Prototypes

After adding in the UI components and the other features planned in the roadmap, these mid fidelity wireframes were ready to be put to the test.

Click image for prototype

Usability Tests

The tasks below cover the primary actions an average user would take. With these tests, I’ll be able to observe the steps the users take to accomplish these goals, find issues they might face to completion, and gain overall feedback to validate or refine the prototypes.

  1. Add milk to your pantry in 2 ways

  2. Filter by American cuisine

  3. Find chicken noodle soup directions

  4. Save chicken noodle soup

Test Results

Positive Insights

6/6

completed all 4 tasks 100% successfully without roadblocks

6/6

complimented the color palette, reminding them of food

6/6

found the features and overall flow clear and intuitive

Critical Insights

  • 5/6 noted that the Recipe results were too segmented, which does not accomplish the app’s main goal

  • 4/6 felt that the “Missing 1 ingredient” filter was clever, but there are more sought after filters

  • 3/6 found “My Pantry” redundant, as the ingredients are also right below this list

Iterations

With the feedback I received from the usability tests, I prioritized the following iterations based on which features I thought the users would use most often.

FINAL DESIGN

KEY TAKEAWAYS

WHAT I LEARNED

I gained insights into how to better prioritize the feature roadmap. I had a big vision for this app with a list of features I wanted to include, however there is always a timeline constraint. To stay on top of schedule, I needed to prioritize which features to build first. Based on user interviews and competitor analysis, I built what would make the biggest impact on users first.

By identifying a genuine and common pain point first, designing a solution to tackle this problem was worthwhile and validating. Backed by numerous similar experiences, the request of an app like Ingredients proved to be very sought after. Through user interviews, prototyping, and iterative testing - I have so far built an MVP where users stated they wish this was a real app they could use today!

Future Design Considerations

I’d love to expand this app and add the P3 features from my Feature Roadmap. This includes:

  • Shopping purchases integration with grocery stores

  • Planner/reminder page to organize, save, and prep your meals

  • Social networking to share recipes with friends