chef's helper
The Brief
I was responsible for all phases of the UX process and the design.
The Deliverable
The background
Problem Statement: A family-owned restaurant has unique issues in the kitchen. Recipes are stored in several places, sometimes even experienced cooks forget an ingredient, and the varied skill level of people in the kitchen leads to inconsistent dishes coming out of the kitchen.
The Goal: An app that assists on the kitchen with a set of accessibility functions like a built-in screen reader, scalable text, step-by-step cook along screens with photos, and visual cues that ensure the cook doesn’t miss a step or an ingredient.
Hypothesis: A tablet-based, voice-activated cooking assistant with built-in alarms and step-by-step instructions would help a small, family-run kitchen a great deal. It would help younger cooks learn recipes, would ensure no ingredient gets missed, serve as a repository for new and cherished dishes, and would standardize dishes exiting the kitchen.
Constraints: Since this product was commissioned by the restaurant, it will not be made available in the App Store (so there were no business concerns).
People with disabilities were not included in either research study because they would not be working in a commercial restaurant kitchen and are, therefore, not in our targeted group of users.
The research
The information gathered in the foundational research allowed me to create...
personas
I referred to the personas and used them as a compass at all phases of the design.
empathy maps
These give a very thorough look at the issue from many people's eyes.
User journey maps
Another way of parsing the information to glean insights.
User Stories, Problem Statements and Goal Statements too
Shown here are the problem statements and the User Task Map which I was able to whip up because of the research I'd done.
pain points
In order to understand the needs and pain points of a diverse group of users, I joined several Facebook groups for chefs and, in those groups, posted an in-depth, online survey.
I also sent surveys out to friends and family who are the primary cooks in their homes. The results of the surveys gave me a great amount of information to work with.
I also did an extensive Competitive Analysis and prepared a Competitive Analysis Report. To ensure I had a more well-rounded analysis, I dug around the net to find any bad reviews of these apps and took notes of the complaints. Once those things were done, I could create the Value Proposition.
varying skill levels
Even experienced cooks sometimes miss an ingredient.
consistency
Inconsistent quality of dishes leaving the kitchen because each cook works from a different recipe.
needs to stay fresh
Recipe app must allow comments and customization so the dishes stay relevant.
no single source of truth
Recipes are in various places which makes finding the needed recipe difficult in the moment.
The design process
Initially, I thought the app would be on the mobile, but after the first usability test, I moved the design to a tablet.
Paper wireframes
I did several rounds of paper wireframes before creating composites of the best ideas.
storyboards
Next, I sketched Big-Picture and Close-Up Storyboards to show how Chef's Helper would be used in context.
Information architecture
Then, I jumped into Figma and did a very simple illustration of the Information Architecture
wireframes
The lo-fi wireframes show the two main user flows: choosing a recipe and cooking it to the end, and adding a new recipe. These wireframes were made into an interactive prototype.
Affinity map
The Usability Test provided a great deal of information and suggestions for how the app could be improved.
I also created a Usability Research Presentation to share the insights received by the study participants.
First Usability test
Before creating the high-fidelity mock-ups and after the designs were done, I did a round of usability testing to find out what people felt about the design and to discover ways I could improve the user journey. When the mock-ups were done, I did a second round of testing.
For the first Usability Study, I conducted five online interviews in which the person was asked to complete three specific user journeys to see how they managed and what they felt about the process. For the second Study, I gathered information from anyone who was willing to click through the mock-ups and give me feedback. Five people participated.
The Usability Research Study Plan outlined the questions the study needed to answer, the KPIs, the methodology, and the script. It also provides information about the project, the participants, and the study itself.
5 out of 5 participants were confused by the icons in the Meal Planner. This means that the icons in the Meal Planner are unclear to all users and need to be changed.
2 out of 5 people spoke in an annoyed way about the How-To videos in the Steps, which means that some people would prefer for video tutorials to be de-emphasized and relocated.
2 out of 5 participants wanted to be able to connect entire recipes to the Shopping List. This means that the recipe ingredients of an entire recipe can be added to the Shopping List in one click.
Second usability test
The second usability test provided these key findings.
5 out of 5 participants made unflattering remarks about the fonts. This means that the fonts must be changed and perhaps unified into a single font.
4 out of 5 participants said that the page is overwhelming, that there is too much going on. This means the page needs to be redesigned and simplified.
2 out of 5 people said that the Set-Up page is weirdly empty, especially coming right after the over-crowded Summary page. This means the distribution of information across those two pages needs to be re-thought and re-designed.
The design
Since the Chef's Helper app will be used on tablets in the context of a commercial kitchen, I kept the design very simple, made clickable areas large, and provided several ways to move through the pages (e.g. by voice, tapping, swiping).
Features include:
- built-in alarms
- a 6 page process to input new recipes
- a page showing status of every receipe being cooked in the kitchen
- a shopping list
- a calendar-based Meal Plan that cooks can reference to know what to cook that day
- step-by-step, voice-assisted cooking process
wrap up
How Chef's Helper addresses the four Challenges:
Chef's Helper was an excellent first project. I purposely created some constraints (no business considerations; no onboarding; would be used in a single kitchen on one type of device) because I didn't want to be overwhelmed the first time I went through the UX Design process. I'm very pleased with how it all turned out. Several people told me they'd use it if it were a real product, which is really the only KPI I could apply to this project.
varying skill levels
Forgetting an ingredient. By stating the scaled ingredients in the cooking steps, Chef's Helper ensures no ingredient is left behind.
consistency
Inconsistent dishes. Having every cook using the same recipe and having the amounts of ingredients scaled by the app, dishes leaving the kitchen will be consistent.
needs to stay fresh
Keep dishes relevant with comments/updates. The ability to customize the recipes and add comments or updates to a recipe keeps the dish modern and fresh.
single source of truth
Recipes in various places. Chef's Helper is the repository of all the family's beloved recipes. New recipes are easy to input.
