Flavorful
Mobile app
A cooking app that personalizes meal planning for an adaptive cooking experience and helps users discover how to use what ingredients they have
In this case study:
Competitor analysis
Primary interviews
Personas
User flows and task flows
Wireframing
User testing
Role: UX researcher, UI designer, UX designer
Overview
Cooking at home can feel daunting when approaching the several steps of preparation, including meal planning, grocery shopping, and finding recipes. These challenges can lead to unintentional food waste and reliance on less healthy alternatives. Flavorful is an app that aims to reduce the mental load from meal prep and cooking, making it easier for people to discover new recipes and create delicious meals with what they already have in their kitchen.
Research
To start, I had to understand the challenges people were facing when cooking at home. What motivates people, what deters them, what were their goals. How were their pain points currently being addressed, if at all? I conducted a competitor analysis of other cooking apps and primary interviews to gain these insights.
What competitors are doing
Home page builds interest before exploring the app further. Mix of articles and recipes helps address multiple user goals.
Search and find recipes by category- each card quickly shows essential information for efficient exploration.
Meal plan organized by day, week, and “unscheduled” for saved meals that aren’t added to a day. Hierarchy of having the weekly view first promotes planning ahead and makes organizing several liked meals more efficient.
Begins with brief quiz-- allows more personalized experience. Gives insight to what level of customization is offered.
Landing immediately advertises AI chat feature. Uses hierarchy to direct users to “hero” feature, leans on the trendiness of AI
Pre-made meal plans recommended and can be edited -- can increase efficiency for users who aren’t picky/have fewer restrictions. Also provides starting point, increasing learnability of meal plan tool
Discover page recommends recipes broken in different categories -- builds off familiarity of social media “discover” scrolling, news apps, etc.
Website navigation includes pages that would also be categories and filters while searching -- increases efficiency of navigation and layout of the navigation shows the site’s primary service is sorting through recipes over other services such as “kitchen tips”
Search through ingredients based off one key ingredient -- serves audiences who are trying to use one ingredient in particular
Cannot filter out ingredients -- creates pain points for people with dietary restrictions.
What people are saying
Conducting interviews allowed me to dive deeper into the personal experiences and context behind people’s decisions. People tended to stay within familiar flavor profiles, yet recognized cooking as an opportunity for creative exploration. Participants expressed difficulty with tracking what they need and what they have when planning meals, and a lack of mental energy resulted in quick, easy meals instead.
“ I don’t know what to make or what to buy and it feels overwhelming to figure out.”
“Sometimes I’ll branch out and try something new and the ingredient ends up going bad because I never take the step to use it. I’m staying with the ingredients I’m comfortable with.”
“It’s the sauces that’s a little harder. I don’t use those frequently enough. it’s only when I make something with them that I’ll check the expiration date.”
For beginners and beyond
To help dive deeper and summarize the needs and preferences identified from the research, we crafted two personas that represent user experiences within the realm of home cooking: the Beginner and the Amateur Cook. These personas shed light on the different ways people may approach a lifestyle cooking app.
Whether a beginner who doesn’t know where to begin, or an experienced cook who wants to try something new, the personas reveal a direction to take the app’s design and key features. We can refine our focus into two questions:
How might we encourage home cooks to experiment with and explore flavor pairings and ingredients, enhancing their culinary creativity?
How might we assist home cooks in effectively utilizing all their purchased ingredients, therefore reducing food waste?
Next, we plan how someone like Georgia or Andy might use Flavorful. Keeping her goals in mind, how would Georgia want to travel through the app to accomplish them? What would be beneficial for her to see and how do we design the app so that she does so easily?
Using AI to reduce mental loads
More than a chatbot, I wanted to show how AI could be incorporated throughout an app to personalize and adapt the user experience. Flavorful users will not need to regularly update the app with their preferences, their grocery lists, or any other invisible tasks that lead to a cooking app ultimately being left behind. Flavorful learns all these patterns to reduce the mental load that comes with meal prep.
Problem: Users want to be able to be more creative and explore more flavor combinations
Solution: AI powered recipe recommendations, adapting based on shared preferences and previously saved recipes. The recommendations will offer new ways to use ingredients the user already has, catered to their tastes and dietary restrictions.
Problem: Users want to better plan meals to utilize all their ingredients to reduce food waste and save money
Solution: An AI created meal plan organized weekly that accounts for not only user preferences, but also user’s fridge and pantry item freshness. Partnered with an automated grocery list that learns your shopping patterns and planned meals to regularly update.
Problem: Users want to reduce the mental load of tracking their available ingredients and freshness
Solution: AI photo recognition that scans items in a user’s fridge or pantry, logging all available ingredients and approximate expiration dates. After the initial upload from the onboarding survey, users may upload photos of their grocery receipts and items will be automatically added to the Fridge — additionally updated what recipes may be recommended.
UI and Branding
Brand values: creative, fresh, vibrant, adaptable, and tasty
With the key features mapped out to provide solutions to the cooking conundrums faced by our users, there’s now the vital role that design consistency plays in delivering a seamless and delightful user experience.
Enter the Flavorful UI Kit - each element selected to build upon the brand values that represent Flavorful and leaves users hungry for more.
Testing the usability
I completed two rounds of usability tests for the app. The low-fidelity users tests helped identify broader issues with the app and the solution being presented in its entirety. This allowed me to move invest time in the high-fidelity wireframes with confidence and understanding of the user needs.
Low-fidelity usability test:
Test participants were asked to explore the app with the following scenario in mind:
Imagine you are a user that downloads this app because you want to explore more dishes and flavor pairings that use the same ingredients you already have/regularly buy. Complete the onboarding process and explore the app with this in mind.
Low-fidelity iterations:
Explore different button labels to improve learnability -- lofi testing revealed users navigated away from features where the function was not self-explanatory. ex: "Make it for me” button confused testers.
Low-fidelity iterations:
Improve navigation -- lofi testing revealed for pages like the Recipe Page, users did not notice all the offered features and required facilitator intervention, including the option to change serving size.
Low-fidelity iterations:
Adjusted organization of onboarding survey -- lofi testing revealed inconsistency in the survey answer formats, which required additional effort from users when alternating between drop-down menus and multiple choice.
High-fidelity usability test:
Test participants were presented the scenario and observed on how they completed the following tasks:
Complete onboarding process
Engage with Meal Calendar AI create
Upload photo to update My Fridge
Check grocery list
High-fidelity iterations:
Improve learnability by incorporating help feature and adjusting hierarchy of onboarding survey -- user tests revealed low comprehension of key app features, despite context clues in the onboarding survey and home page.
High-fidelity iterations:
Explore different button labels, particularly the photo feature -- user tests revealed need for labels that better fit user expectations to understand a feature.
Take out and take aways
Crafting an end-to-end app design offers an valuable opportunity to immerse myself in every facet of the design process, from conception to fruition. What truly excites me was the chance to push boundaries by integrating AI into the experience. As AI is rapidly shaping various industries, exploring its potential within UX design is not just innovative but essential.
Leveraging AI opens doors to personalized interactions, predictive insights, and streamlined processes, all of which can contribute to creating the most seamless and intuitive user experiences possible. Embracing this intersection of UX design and AI will undoubtedly propel future projects towards new heights of effectiveness and user satisfaction.
Like a seasoned chef refining a beloved recipe, I recognize the importance of continuous improvement. Next steps involve conducting another round of user testing to refine elements that were iterated in the previous test. Additionally, I would continue branching out to design additional wireframes that explore additional user flows, including updating user profile preferences.