SAVR RECIPES

AN APP FOR AT-HOME CHEFS

My Role • Researcher, UX/UI Designer, Interaction Designer

Duration • August (1 week - Design Sprint)

Tools • Figma

About Savr Recipes

Savr is a startup curated for at-home chefs who are looking for savoury recipes and ways to improve their cooking skills. Savr has an active community of users who enjoy rating and reviewing others' recipes. 

The Problem

Recently, Savr has been receiving negative reviews regarding its complex recipes that involve multiple steps and advanced cooking techniques. The intricate user interface is causing users to have a stressful experience in the kitchen since some recipes are inaccurate and difficult to understand.

The Solution

To help foster an enjoyable and stress-free at-home cooking experience I adopted a visual approach. The ingredients lists were converted into images and the recipe directions were adapted into step-by-step videos. A new feature called "learn" was added to the app so at-home chefs can learn and improve their cooking skills.

The Solution - Features

A Detailed Visual Recipe Information Page 

At-home chefs will be able to successfully cook any dish with the detailed information provided on this screen. Sometimes ingredients and cookware may not be easily recognizable or known to the user, so every item needed for the recipe is clearly identified with labelled images. 

Step-By-Step Video Directions

Each step is accompanied with video instructions. Each video is timed based on how long the step should take to keep at-home chefs on track. Also, users can pause the video and rewind if they need to watch a step again. Users also have the ability to read the instructions if they wish. 

Learn Cooking Skills To Feel More Comfortable and Confident In the Kitchen

Have you ever wanted to learn or improve your cooking skills? With the Learn feature, users can learn from hundreds of easy to follow videos that will help users improve their cooking skills and techniques. 

Lessons Learned

It is possible to design and test a solution in 5 days. 

The design sprint was an effective way to test multiple designs in a short amount of time to find a suitable solution. The sprint showed me the importance of understanding a problem and designing a solution in a short amount of time. Since I was given 5 days it was essential to stay on track with the problem in mind to come up with the best possible solution

It is essential to clearly label each item. 

When conducting user testing, the majority of users did not understand what specific buttons and labels signified. This inhibited the user experience since users did not know what to select when I asked them to do various tasks. This exercise showed me the importance of taking extra time to ensure each label is written. This design sprint also reinforced the importance of user testing because something obvious to me, may not make sense for the use

The Process

Day 1: Map

I began the design sprint by analyzing the research that was previously conducted by Savr Recipes regarding users' needs, wants, and pain points to understand the problem. It was also important to understand how the product is used by users, so I mapped out the product's most important user flow. 

UNDERSTANDING THE USER

I began the sprint by learning user pain points to understand the problem at-hand 

USER PERSONA

To gain a full understanding of Savr's targeted audience, I developed a user persona.

DEFINING THE PROBLEM

I turned the user pain points I uncovered into opportunities by developing 3 How Might We statements.  

• How Might We... make cooking less stressful

• How Might We...make it easier for users to follow recipes

• How Might We...make it easier for users to learn new cooking skills

USER JOURNEY MAPPING

After identifying the problem, I planned a user journey map to outline and identify common actions surrounding the app 

Day 2: Sketch

I began day 2 of the Sprint by analyzing Savr's competitors to gain inspiration and identify successful features that help users effectively follow recipes. I then began to sketch ideas by using the Crazy 8's Design Sprint method as a way to generate possible solutions. 

COMPETITIVE ANALYSIS

I analyzed direct competitors of Savr recipes to learn more about common practices and areas of opportunity.

Tasty

#20 on food and drink apps
4.9 stars 
41,000 ratings

Pro: Each recipe includes easy to follow clips that are broken down into small steps (easy to follow)

Needs Improvement: A lot of scrolling required to get to the recipe's directions

Mealime

#32 on food and drink apps
4.7 stars
4,800 ratings

Pro: Easy to read the cookware and ingredients list need for the recipe

Needs Improvement: The recipe is not presented visually, making it difficult for users to accurately follow the recipe

Yummily

#55 on food and drink apps 
4.7 stars  
7,800 ratings

Pro: The layout of the ingredients & basic information about the recipe is effective and easy to read

Needs Improvement: A lot of ads & the recipe is written in long paragraphs, which makes it difficult to follow 

Jamie Oliver

#86 on food and drink apps 
4.2 stars
62 ratings

Pro: List of ingredients and equipment needed for the recipe. Each step is paired with a big image, making it easy to follow the recipe 

Needs Improvement: Some of the language used is complex, and not beginner-friendly 

CRAZY 8's EXERCISE

Based on users pain points, I thought it was critical to focus on designing the "Recipe Instructions" screen during the Crazy 8's exercise 

My sketches after completing the Crazy 8's Design Spring Exercise 

SOLUTION SKETCH

I created a solution sketch to determine how a user would interact with the recipe instructions screen

Before the critical screen: Users will see an overview outlining all the information needed before users are ready to cook the meal. 

Critical screen: Once users have gathered all the necessary materials, they will tap on the "directions" button at the bottom of the screen to follow the step by step video directions. 

After the critical screen: Any time during or after the cooking process, users can click on the "learn" tab to learn new cooking techniques.

Day 3: Decide

After selecting the solution sketch I created a storyboard demonstrating how the new critical screens would be integrated into the user experience.

STORYBOARDING

I sketched a holistic storyboard that captures the main route a user would take when using the app

The storyboard represents the journey a typical user would take when using the app.

Day 4: Prototype

My goal was to create a realistic prototype so users would have an idea of how the app will look and function. While keeping the app's design brief and goals in mind, I created a functional prototype of the app's critical screens using Figma. 

PROTOTYPE

The Prototype Reveal!

Day 5: Testing

To ensure my designs are intuitive and user friendly, but also solves Savr's main problem, I tested the app with 5 users. Users were recruited by word-of-mouth, and the testing was conducted in person.

USABILITY TESTING

I tested the prototype with 5 users, and I discovered minor issues regarding button labelling

Main Learnings:

• 5/5 users easily found the "spaghetti" recipe
  

• 3/5 users did not recognize the word "preparation."  Users thought that the preparation tab was the instructions. 
  

• 5/5 users did not select "how-to" when I asked, "if you wanted to learn how to perfectly cook a chicken what would you do?" 

FINAL ITERATIONS

Minor changes were made based on user testing results.  

HI-FI PROTOTYPE

The Final Screens

Click Here To Try Out The Prototype

IMPROVEMENTS AND NEXT STEPS

Personalized Experience

The future of Savr will provide users with a personalized experience. Savr will suggest recipes based on the ingredients the user has on hand. With this feature, there will be no need to go to the grocery store last minute for a single ingredient to complete the recipe. 

Voice Assist - Accessibility

To help users with visual impairment Savr will develop a voice assist system so anyone will be able to follow the recipes and cook delicious meals. 

If you're all the way down here already, thank you for reading! Please email me at amandafarber@rogers.com if you have any questions!