Nom

A cooking mentorship program dedicated to helping cooks at home learn the skills they need through one-on-one lessons.

Role
UX/UI Designer

Team
Individual

Tools
Figma, Illustrator

Responsibilities
User Interviews, User Persona, Wireframing, Prototyping, Visual Designs, Usability Testing

Timeline
Oct 2021 - Nov 2021
(4 Weeks)

Background

In 2020, the COVID-19 pandemic turned many industries upside down, especially restaurants and the food industry. According to the New York Times, 54 percent of respondents said they cook more than before the pandemic. Interest in online cooking tutorials, recipe websites, and food blogs has surged.

What is Nom? 

  • Designed to create a space for individuals to match with a mentor who will share their knowledge and insights about cooking.
  • Mentees can chat and book meetings with their mentor, who will send out a recipe and grocery list prior to cooking together.
  • A meaningful bonding experience between two individuals where the mentee can ask questions at any time and learn a cuisine of their choosing.

Solution

Create an experience where the user applies to be a mentee and then uses their tablet to chat with their mentor and prepare themselves for the meeting.

VIEW FINAL PROTOTYPE

Nom Homepage

  • Read about the Mentorship program
  • Watch basic cooking tutorials
  • Review ingredients found in specific cuisines
  • Find out how the program works
  • Read reviews from current users

Nom Application

  • Fill out general info (i.e. name, email, time zone, etc.)
  • Answer questions regarding the users skill level, dietary needs, and kitchen supplies
  • Provide the user's availability per day
  • Check out the confirmation and download the application

Mentor Pairing and Chat

  • Click on iOS notification
  • View who you have been paired with
  • Chat with your mentor

Detailed Recipe

  • Read about the dish you're cooking
  • Change serving size based on needs
  • View each step one at a time

Shopping List and Zoom Call

  • Check off which ingredients you have purchased
  • Chat with your mentor when you're ready
  • Have a meeting with your mentor

How did I actually get there? 

Understanding the Problem Space

I conducted two folds of research, user interviews and a competitive analysis with other companies in the problem space. I started with user interviews to identify user problems and any noticeable trends. A competitive analysis was then conducted to analyze other possible competitors that offer a similar service and identify any patterns or trends.

Research Goals

User Interviews and Findings

I conducted interviews with six individuals who all have experience cooking at home. Here are some of my findings.

Better learning from videos than from cookbooks.

Learning how to cook comes in different forms, whether it be from an online video, cooking with your parents, or reading a cookbook. Several users have expressed frustration when it comes to reading cookbooks because it's harder for them to picture what they mean. Users reported that watching people cook on YouTube has helped them to visually understand the process in cooking a dish better.

"With a cookbook, it's harder for me to see what the final dish is like since some recipes don't even have pictures or step-by-step pictures. Everyone's interpretation of a 'pinch' for example is different." - Female, 25

Cooking with people is a bonding experience and reward.

Whether it be in person or through a FaceTime call, cooking has been a way for users to bond with people. Some users reported that before the pandemic, cooking with their roommates was a way for them to come together and a reward to eat a meal that they all prepared. During the pandemic, users mentioned that this bonding didn't stop because an online presence is sufficient enough.

"I feel like making the dishes together is a great experience because we get to see our hard work out on a plate and be able to enjoy it afterwards." - Male, 26

There are two main types of users, the mentee or the mentor.

From the interviews, I had users who are more interested in learning to cook because their skill levels were on the beginner side. However, I also had users who are experts in the kitchen and enjoyed sharing their insights with their friends.

"It's nice to see and learn about what other people have made and get to talk to them the entire time." - Male, 27

"I enjoy cooking a lot and find it enjoyable to share my knowledge with others, especially my friends" - Female, 24

Competitive Analysis

Many products have tried to capitalize on the growth rate of people cooking at home during the pandemic. These existing products addressed some of the pain points, but no one product did it all.  

Defining the problem

From the user interviews, I reviewed the major needs, motivations, and pain points of the participants. I saw that there was a need to learn how to cook from someone else, but there was also a motivation to teach people how to cook. I created a How Might We statement based on these.

How might we connect an expert chef with an individual who wants to learn how to cook?

Ideation

After crafting my problem statement, I generated various solutions that would resolve the needs of the users. I thought of including both a desktop and tablet portion since users reported using both to cook with. Below is one of the rounds of Crazy 8's I did.

Storyboarding

Looking back on my ideas, I created a storyboard that would include some of them. The image below depicts the idea of the user applying to be a mentee on her desktop and then switches to her tablet when she gets matched. From there, she chats with her mentor and prepares for the meeting.

Defining the Users

Personas

From the data I received during the research phase, I created two personas. Liz Kitahara is the mentee representing our users who want to learn more about cooking, while Rika Maezawa is the mentor representing our users who enjoy teaching others how to cook. For the scope of this project, we will be focusing on the Liz Kitahara when building out the designs.

Liz Kitahara Mentee Persona
Rika Maezawa Mentor Persona

User Flow

After creating my personas, I moved on to creating the user flows for both the mentee and mentor. Seeing the flows laid out, I was able to better understand how a user might navigate through the application, and with that knowledge help with the design and create a seamless experience for the user. As the designs progressed, I constantly came back to the user flow to make the necessary changes. I also used to help visualize how each page should look.

Low-Fidelity to Mid-Fidelity Wireframes

Using the storyboard as a rough sketch, I started building out key pages from the user flow. Based on my research, users are applying and reading about things on their desktop/laptop. However, when they go to cook in the kitchen, users often bring a tablet to cook with. Below I detail why each screen is important.

  1. Desktop screens detailing the user going through the specific cuisine and mentorship application
  2. Tablet screens where she is messaging her mentor, getting ready to cook, and has that cooking session with her mentor
Homepage: Allows the user to get a sense of the program and see who is featured as a mentor. But also get the opportunity to learn from the videos.
Japanese Cuisine Page: Users can learn more about a specific cuisine and its history, mentors that excel in that specific cuisine, and ingredients commonly used.
Mentorship Page: User learns what the mentorship program is about, steps taken for the application, and can read reviews from past/current users.
Application General Page: Contains general questions that would be asked during an application (i.e. name, email, etc.)
Pairing Questions Page: Contains questions regarding what cuisine the user wants to learn, what their learning style is, and specific questions regarding the diet and tools at home to help in providing an excellent match.
Confirmation + Download Page: Confirming that the application has been accepted and a section promoting to download the app on a mobile device so that users can get a notification there when paired.

Branding

Logo Designs

For the logo design of Nom, I wanted to create something that's food-related combined with mentorship. The logo needed to feel approachable and friendly. I focused on the idea of stack bowls symbolizing shared dishes. Another idea was the use of blobs to mimic eggs to symbolize the beginning of something. The final design I went with (located on the top left) is a bowl with a spoon. The larger bowl is meant to symbolize the mentor and the spoon the mentee "taking bits of knowledge" from the mentor over time.

Style Guide

For the color palette of the site, I wanted to use the color yellow to spark feelings of warmth and happiness. While the secondary, I went for a light brown to represent the feelings of home and dependability. I wanted this app to be a comfort zone for users, where they can rely on their mentor for help at any time. For typography, I picked League Spartan, a rounded sans serif, as my main typeface to convey friendliness and approachability.

High-Fidelity Wireframes

After an initial round of usability testing off of the mid-fidelity wireframes, changes were made to accommodate the major issues with the current design. Building off of the mid-fidelity wireframe, I built the high fidelity wireframe and the first iteration prototype. Below is a video of the final design, but notes regarding the usability testing are included below.

VIEW FINAL PROTOTYPE

User Feedback and Testing

Usability Testing

After creating the high-fidelity designs, I conducted a second round of usability testing to see how potential users would use the application and learn about areas that may be confusing or cause frustration. I gathered 5 users to test the prototype through Zoom. I had them perform two tasks:

  1. You are a user looking to apply for the mentorship program to learn more about Japanese Cuisine.
  2. On the tablet screens message your mentor, study the recipe she sent, and check off your shopping list, and have a Zoom call with her.

Findings and Iterations

There was a 100% completion rate, all participants were able to successfully apply for a mentor and have a call with them. However, there were changes to be made based on the usability testing. Below, I detail out each one.

Mentor Card

Users found that the original mentor card had too thick of a border and too bright of a yellow that it made it seem like an interactive component. They also stated that the hierarchy in the text was confusing with all text in black.

"I am confused on the mentor cards on the homepage because I thought I was able to read more about them if I clicked on it?? but I guess not lol" - Female, 27

Basics Tutorial Video to "Learn the Basics"

The idea of the Basics Tutorial section was to have quick pre-recorded videos produced by Nom to offer some tutorials on general skills for the user to learn without a mentor. Users felt that the styling resembled the call-to-actions and confused it that.

"The look of the tutorial video looks like an active state button but also just off in feel" - Male, 24
VIEW FINAL PROTOTYPE

Learning and Takeaways

When brainstorming an issue that I wanted to solve, I kept thinking about fields that I personally am interested in. Cooking and food are some of my passions. When I left home for college, I learned to cook through watching my parents and watching Youtubers, such as Maangchi and the cast of Bon Appétit. I felt that because this project was something that I could relate to and had a deep passion for, I was able to put a lot of thought into building it.

What went well?

  1. Participants from the usability testing and group critiques enjoyed the app and would use it.
  2. Incredible feedback from testing that allowed me to make multiple iterations from beginning to end.
  3. Being to be creative with the design and have a passion for it!

Areas for improvements

  1. Questions for the application could be better in assisting a team match mentees and mentors.
  2. No swiping motion on the tablet screens that make it feel not realistic.

What is the plan moving forward?

  1. More usability testing and feedback for Nom.
  2. Talk with teams that deal with match-pairing in order to ask the right questions.
  3. Implement an option for a small party to have a cooking class with a mentor as an activity.
  4. Bridge more people together!