Happy Chef

Role UX Designer (Individual Project)

Duration June 2021 (1 week)

Project Background & Goal

Happy Chef is an organization focused on teaching children about healthy food. Healthy eating is essential for the child’s good health, growth, and development. In addition, healthy eating in childhood means they will have less chance of developing chronic diseases and ensures that they enjoy life more. Happy Chef wants to encourage children to be knowledgeable about healthy eating from a young age, so it can help prepare them to make good decisions on their own about the foods they want to eat as they grow up. Our goal is to design a tool that creates an interactive way for children to learn how to cook healthy meals. This tool will provide healthy, nutritious meals and give them step-by-step instructions on how to cook them.

Understanding the User

Target Audience

Happy Chef’s target audience are adults with children between the ages of 8 and 12 who want to encourage their children to cook healthy meals with them. These users are individuals who reside in urban, suburban, and rural areas.

Persona

I conducted user research and received feedback from users that we incorporated into user personas. For example, our user persona, Tara is a 44-year old single mother, who works a full-time job. The research revealed that Tara was frustrated by online recipes that weren’t kid-friendly or kid-safe. I also learned that Tara was frustrated by online resources that offer too many recipe suggestions at once. Tara would like for her kids to be able to cook fun and easy healthy food in a safe environment.

Challenges

Based on the user research conducted, I found 3 main pain points for users: 

  1. Kid-Friendly - Many online recipe resources are difficult for children to navigate through

  2. Simple - Users want their resources to not be cluttered

  3. Educational - Users want a source that's educational yet fun for their child

Kid-Friendly

Simple

Educational

Starting the Design

UI Ideation

I sketched out some concepts for the app’s design on what I learned about our users in the empathize stage using the Crazy Eights approach. I rapidly brainstormed multiple solutions based on what I learned from our research to identify various ways I could begin designing.

Wireframes

In this stage, we created the first levels of the design using what we knew about our users and their needs. The headings are clearly listed and separated by categories. There are buttons and icons to represent clearly defined sections, and there is a place for carousels that can slide to display more recipes and tips without including too many on-screen at one time. All of these provide a simplified and intuitive means of navigation for the user.

Low-fidelity Prototype

In this version, the digital wireframes from the previous step were connected together into a working prototype. This meant users were able to interact with each part of the design and test the way it worked. In this example, we demonstrate how the various wireframes that make up the pages of our design fit together when each element becomes interactive.

View Happy Chef's low-fidelity prototype

Research Plan

My goal was to figure out what difficulties users encountered when trying to complete core tasks in the Happy Chef app, such as finding recipes and navigating through a recipe.

 

I conducted a remote, unmoderated usability study. I asked 5 participants with finding a recipe and going through the steps of making that meal. Each session lasted for 30-60 minutes, including the test and interview questions.

3 participants were children between the ages of 8-12 who were interested in cooking but have never tried. All children participants had parental/guardian supervision during the usability study. 2 participants were parents with children between the ages of 8-12 who are passionate about instilling healthy food choices to their children. Participants were from urban, suburban, and rural areas. I included a balanced number or male, female, and nonbinary participants. 

Usability Study Findings

Based on the data from the study, I identified three areas that needed to be addressed:

  1. Users were confused with the end of the user journey, therefore we needed better cues to know when they have completed making the meal.

  2. Users wanted a way to see nutritional information and description of the recipe, therefore they needed more nutritional facts and information prior to the recipe

    instructions.

  3. Users were confused with the timer function, therefore users needed a more intuitive way and better cues to be able to utilize the timer function.

Revised Wireframes

In the revised version, improvements were made to the design based on insights identified from usability test feedback. Design additions include text that clearly states the completion of cooking, more nutritional information and description prior to the instructions, and text that says “set timer” next to the timer icon.

Before usability study

After usability study

Before usability study

After usability study

Before usability study

After usability study

Refining the Design

Mockups

At this point in the design cycle, I began to add colors, images, and icons to our designs. I updated the shape, size, and structure of content borders and sections to high-fidelity versions. 

High-Fidelity Prototype

I transitioned from designing to prototyping to create our high-fidelity prototype. I connected all of our screens together into a working version. Each page of the design reflected the changes I made as a result of usability testing and worked exactly like the real app would. 

View Happy Chef's high-fidelity prototype

Accessibility Considerations

To ensure that our app was accessible, I included users of assistive technologies such as keyboards and screen readers throughout all stages of the design cycle, including interviews and usability testing. I took their needs and their feedback and incorporated what I learned into our designs in order to provide an inclusive and accessible experience for all.

Takeaways

What I Learned

With Happy Chef, it was my first time designing for a children's app. This presented to be a challenge for me and required me to do a lot of research on different children's apps. This was a lot of fun for me because I got to think of needs of a user that I have never interacted with before. Next steps are to create desktop and tablet website.