Savr Recipes

Savr Recipes is a startup that aims to make cooking at home easier and engaging through hundreds of recipes and cooking tips. This solo project is a modified GV design sprint that took place over the course of a week. I was given the necessary research materials to hit the ground running.

Themes

Mobile UX/UI
Interaction design
Design sprint

Team

Myself

Tools

Figma

Timeline

5 days

The Problem

Despite its success, Savr has received negative reviews regarding recipes that involve many steps or more advanced techniques. Users who were excited about a certain recipe end up disappointed with the outcome, because they didn’t feel the instructions were clear, or easy to execute.

The Solution

Using the provided research, I created a mobile app by analyzing data, sketching rough solutions to the problem and creating a simple prototype. I then used this prototype to undergo usability testing to find out if my solution answered the initial problem Savr was facing.

The design sprint process consists of five days, each with a different task to quickly produce a variety of ideas, aiming to find the solution to the initial problem.

Research recap

Reviews and Interviews

I was provided with several user reviews about how Savr may have impeded the cooking process, a one-on-one audio interview with a Savr user, and finally a persona with behaviors and frustrations.

User Frustrations

Hearing from users helped me understand pain points in the cooking process. From these frustrations, I was able to start thinking critically about the users' journey and begin working to solve the problem at hand.

Research Synthesis

I had the information all laid out, but without the proper synthesis I could not move forward. By converting my research into user needs, it created a much more concrete path to understanding the problem and finding a solution.

Need 01

User needs to follow recipes easily and confidently

Cooking can be intimidating, especially if it’s a new dish. Creating a process that doesn’t assume any skill or knowledge from the user invites both new and seasoned cooks

Need 02

Dish should come out as expected

Users seemed to be getting lost in the details and ended up with something that looked entirely different than what the app was showing. I wanted to emphasize images/videos to act as a visual guide for users

Need 03

No unexpected steps or ingredients

There shouldn’t be any surprises when cooking food. Laying out the entire recipe on a mobile device can be overwhelming to scroll back and forth, and you can lose where you are. Keeping each step contained and involving amounts of ingredients will neutralize user confusion.

Competitor Research

I researched multiple mobile recipe apps to look into how competitors solved a similar problem. Based on my defined user needs, I focused on how each product led the user through a number of steps with visuals and easy to follow instructions.

User Map

It took me a few tries to solidify the user map. Through a few iterations, I landed on something that fulfilled user needs properly.

The end-to-end experience that the user would go through when completing a recipe. This allowed me to visualize the foundation of the user experience based on my research analysis.

Ideate

Crazy 8's

Using the crazy 8’s exercise is an easy way to come up with multiple rough ideas for my solution. I made sure to include plenty of visuals for the user to be able to follow the recipe and compare what they had made at each step.

8 different designs, 1 minute each. These are ideas for a recipe step screen, which would be the primary screens users interact with.

Solution Sketch

I used the ideas I had come up with from the crazy 8 sketches to keep inching towards a final solution. This includes the beginning, middle and end of the process a user would go through when using Savr. Continuing to sketch out my ideas on paper saved time that might have been wasted on trying to strive for perfection too early in the process through hi-fidelity mockups.

My “3 panel storyboard” below includes a food prep step, a basic layout of how each step page would look, and the final cooked dish page.

Storyboard

To avoid users feeling lost or unprepared, I wanted to include interactive checkmarks into the step process of each recipe. This allows users to check off everything that they have done, so there isn’t any second guessing or backtracking. This user flow also includes an ingredients list, overview page and prepping list with checkboxes as well. The user can make sure they have everything ready before they start to cook to maximize time and keep everything in order.

The storyboard sketch of each screen in my solution. Building upon each prior step in my process led me to a detailed look on the recipe experience.

Prototype

A few screens from a clickable prototype created for user testing. From left to right, home screen, preview screen, ingredients list, and the recipe step screen.

Using my storyboard as a starting point, I created a very simple prototype that would allow me to start some usability tests. This isn’t meant to be flashy by any means, just trying to solve the initial problem while saving a lot of time. While the checkboxes are interactive, they are not necessary to moving forward with a recipe. Before going into testing, I had this in mind to see if users would find them useful or not.

Usability Tests

I conducted 5 usability tests with users who were tasked with “making” chicken carbonara using the Savr app’s recipe. The testing revealed small vulnerabilities in some of the overall structure, but nothing too detrimental that would consider this idea a failure.

Final designs

Because of time constraints, I only identified the changes in design I would make if I were to pursue the project further. The results would be minimally different than what you see here.

Home Menu and Recipe Preview

Ingredients List

Food Prep

Recipe Steps

Summary

While users were able to easily navigate and follow the recipe in my prototype, there is always room for improvement. Design sprints are a great way to test an idea in very little time. 

The most valuable lesson I learned from this project was to never become too attached to an idea. The Crazy 8’s exercise definitely helped me with this way of thinking. Coming up with a new idea each minute really pushes your creative thinking and encourages you to find an idea that solves the problem rather than trying to come up with “the one right” solution. 

Get to the point where you are comfortable throwing each of your ideas away, so you ultimately become flexible enough to constantly shape ideas into something that will solve the problem.

Discus
Visual Design