Case Study | App that suggests recipes based on the customers’ calorie needs and availability of ingredients at home
Design Context
Lois Lane is a fitness freak. She manages to cook by herself within her busy schedule. She shops for groceries once or twice a month, hence sometimes runs out of certain ingredients.
Design an app that would suggest Lois Lane a list of healthy calorie focused recipes based on the ingredients that she has at home.
Identifying User Problem
Based on the above requirement, I have listed down the problem Lois Lane is facing.
- Searching new recipe on internet is time-consuming and difficult to do it based on my busy schedule.
- Often in situations when doesn’t know what to cook.
- Finding a healthy recipe relevant to my calorie intake is not easy.
- She runs out of ingredients sometimes.
- Don’t have enough time to cook and healthy too.
- Don’t know what to make healthy out of ingredient available at home.
- Cannot comprise of the high-calorie recipe.
- Half of the ingredients won’t be available at home.
- Cooking takes a lot of time
- The most recipe is for a family of 4, not for one person.
Let’s understand the user for better Experience
Brainstorming and Ideation
Why Mobile Application
Lois is a busy person and it would make sense for her if she could plan her meals/recipe on the go. The application will also send her notifications when her ingredients are running out or going to expire. Notifications will also keep her motivated so that she will follow through and emerge successful on this journey towards becoming healthier.
Simple, Light and Clean UI
Provide clear visibility of adding ingredients and select ingredients to make the customize recipe based on the ingredient selected. Since recipe bottom tab will provide direct access to all the recipes available with all ingredients available in Lois’s home.
LATCH method
According to the LATCH method information can be organized in 5 ways — Location, Alphabet, Time, Category, and Hierarchy. In our case we can organize ingredients by Category (Vegetables, Fruits, Meat, Fish) and Hierarchy — the most popular and widely used ingredients to go first in the list. Users can also use the search bar with autosuggestion and autocomplete for fast and relevant search. Recipes also can be grouped by Categories (Breakfast, Dinner, Salads, Gluten-free, Dessert, Easy dishes, etc) and Hierarchy (by rating, time of cooking).
Add a clear relationship between ingredient and recipe available. Also clear understanding of editing the ingredients.
User Flow
The way how the content is organized is as important as the content itself. In my case user’s success with finding an interesting recipe depends on a fast and easy selection.
Paper Wireframe
I created a paper prototype to test my design ideas. I have created the rough layout, which brought a few ideas and points to the paper mockups.
Visual Design
My focus was to create a light and clean UI that will not distract user and provide clear navigation and user experience
Main Screen
The main screen provides Lois with a clear view of Ingredients available at her home. She can add new ingredients, search ingredients available at home, filter and select provided tag to see the ingredient available in that category only.
Make your own recipe
You can decide what to cook starting with ingredients. Combine ingredients you have in your home and see what you can cook with them.
Update Ingredients
Update ingredient quantity from ingredient page or upload or scan big basket, a super market bill to update.
Recipe Page and Recipe Detail Page
Search for recipes quickly and easily. Use a sorting tag, filter to find your right recipe based on your calorie need and cooking time.
Learning
It was a great experience to solve this problem although it was challenging. It gave the opportunity to dive into unexplored areas of solving a problem with clean and great UI.
Stay Home Save Lives
