Happy Tummy
An end-to-end project from ideation to interaction and prototyping
Project Overview
Happy Tummy provides various cooking recipes and tutorials to any audience who loves to cook or try to cook for the first time. Happy Tummy is not only offering recipes and tutorials but also offers basic cooking like how to use each piece of equipment and function to plan your own plan with a recipe and ingredients list.
Project Details
Role: UX/UI Designer
Clients: Google UX Design Professional
Timeframe: 2 weeks, March 2022
Tools: Adobe XD
Problem
The entire cooking skill level needs a website that is able to provide recipes, tutorials and included basic knowledge, nutrition, and rating.
Goal
Designing Happy Tummy will allow users to be able to view recipes and tutorials with images along and provided beginner knowledge for cooking which will benefit entire cooking skill level users to be able to understand cooking steps and cooking terms.
User Journey Map
Two out of five users’ journey maps with user interview data. It defines the user’s flow and user experience.
User Summary
Conducting interviews and creating empathy maps helped the designer to understand the needs of users. The majority of research results from a group of users show that they have a hard time understanding some steps and terms in the recipes due to their experience of cooking and finding optional ingredients. The research also reveals that users experience a long story before the author introduces the recipe. They have to take some time to find the recipe on the page. They are also unable to save the recipes and tutorials for later use.
Pain Points
Understanding
Most beginners are having a hard to understanding some terms, methods, and the usage of equipment.
Accessibility
Not offering optional of equipments / ingredients
Wasteful
Users have a difficult time finding other recipes or tutorials to be able to use the same previous dish they cooked.
Time
Not provided save recipes and tutorials for later function which will help the user save time to look for it in the future use.
What People Are Saying
“I have a hard time finding the ingredients for my dish. It would be nice if there is an optional choice for me”
— Thunradee
“As a chef, I still need some basic skills that might help me with cooking.”
— Jerry
Competitive Audit
Wireframe
Research Study
Research Question
Is it easy to find what you looking for?
Is there any process we can make better? (design and function)
Are there any functions or features that users would like to have on the website?
How do users feel/react from starting the task to finishing the task?
Is any user having a long pause during the process or step?
Methodology
Moderated usability study
KPIs
Drop-off rates
System Usability scale
Time on task
Affinity Diagramming
Findings
Typography is too big
Need a responsive website
Unecceray content on the menu bar
The link should be able to select from the topic as well.
Need to add a “Rating” for each Recipe which helps the user make their decision.
Icons should be small which helps the visualize
Mockup v1
Mockup revise version
Adjusting theme color
Rearranging information
Takeaways
Impact:
The website provided a cooking 101 section which includes an article that could help the user learn more about cooking basics.
“It would be nice if there is a section to teach me the basics of prepping food”
“Even Though I’m a chef, I still want to know some basics that I might learn from other people's experiences.
What I learned:
After the usability research, I found something that I had never considered before. Since I know how to cook, I have no idea there are other people who want to learn the cooking basics and need optional ingredients provided in case they could not find one in the recipe. The more research I did the more functions I know that I need to add to the website to benefit users when they are using or browsing the website. Most of the users access on mobile phones than on desktops. Also color, I have to be more considering what color I will use which relies on the category of the website I am working on.
Questions for Future Iterations:
How might we..add a feature topic with restaurant and/or celebrity chefs’ recipes.
It should draw user attention to the website
How might we..adding a meal-planning function
It should help the user plan their shopping list better to prevent wasting food.
