top of page
Savr Thumbnail

Savr Recipes

Savr Recipes is a fictional product that makes it easier for people to follow new recipes and cook great meals at home.

My Role

Tools

Timeline

Figma, Miro

UX/UI Designer

5-Day Google Venture's Design Sprint

The Challenge

Savr Recipe's original mobile design received negative reviews due to unclear instructions, especially for more advanced techniques and dishes.

The Outcome

Based on the user research in the Savr design brief, I revamped the mobile app recipe feature by creating easy-to-follow cooking guidance that outlined the steps from start to finish.

Savr GIF

Day 1: Map

Mapping Potential Solutions

With my focus on the users' needs, I began mapping some potential solutions. First, I focused on the end-state and then brainstormed what Savr could provide to bring the user to that end-state.

Map of Potential Solutions

Identifying User Needs

I synthesized the raw user research data that was provided in the design brief using an affinity mapping process. The core user needs that required solving were:

01.

More guidance when new advanced techniques are introduced.

04.

Accurate and clear length of cooking time estimates

02.

Upfront instructions for which cooking tools to have ready.

05.

Visuals as to how the dish should look at every step in the recipe.

03.

Instructions on which ingredients to prepare in advance.

06.

A way to advance the recipe with minimal touching of the phone.

Day 2: Sketch

Lightning Demos

At the beginning of day two, I immersed myself in a round of lightning demos by researching other competitors to understand how other companies addressed similar needs as Savr. 

Tasty

Tasty is well-known for its engaging video content that guides users step-by-step with a heavy focus on visuals.

 

The elements that I found most intriguing about Tasty were:

  • Large videos and text instructions

  • Full video upfront so users know what to expect

  • Total cook time and a step-by-step overview

Tasty Screens
Kitchen Stories Screens

Kitchen Stories

Kitchen Stories uses helpful images and videos throughout its app to guide users while cooking.

 

The details that I found inspiring about Kitchen Stories were:

  • Upfront guidance on necessary ingredients and kitchenware

  • How-to videos

  • Pictures at every step in the recipe

  • Ingredients and kitchenware at every step

  • Timer feature

  • Progress bar

HelloFresh

As a user of HelloFresh, I've always found their recipes to be quite intuitive to follow. I referenced a previous recipe that I had received in a meal kit and found a few inspiring design components:

  • Clear tools and ingredients

  • Easy to scan the entire recipe upfront

  • Pictures for how every step should look

  • Bolded text to highlight key ingredients in the recipe

  • A recipe step for ingredients prep

Hello Fresh Example

Brainstorming Savr's Solution

Now that I had a sense of other solutions, I brainstormed the unique Savr experience. First, I selected the screen from my mapping exercise focused on the actual step-by-step cooking process as this is where things tend to get stressful for users. Next, I sketched out what eight different visual representations of that experience could be.

Crazy 8's Sketches

Day 3: Decide

Storyboard

From the initial brainstorm, I focused on one solution with a few factors that I believed would best address Savr's users' needs. Next, I storyboarded what the user flow would be for this design.

 

Storyboard of Savr Solution

Day 4: Prototype

Refining the Solution

On day four, I created a realistic prototype of the Savr Recipe's solution in Figma that addressed the pain points identified in the user research data.

Savr Solution

Figma Prototype

Here you can access Savr Recipe's interactive prototype. Tap on the prototype to get started.

Day 5: Test

Usability Testing

At this point, I conducted 5 usability tests with individuals who all like to find new recipes and cook. Based on the valuable insights from these tests, I would integrate the following learnings and suggestions for future iterations.

Design Updates

Retrospective

The design sprint format is a fun and engaging way to ideate and test a potential solution quickly, and I really enjoyed this concentrated way to brainstorm and explore. Since this was a design challenge, I look forward to conducting design sprints in the future with colleagues and on existing products.

bottom of page