Savr Recipes
A Google Venture's design sprint challenge to improve the in-app cooking experience for a fictional iOS app.
My Role
Product Designer
Tools
Figma, Miro
Timeline
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.
Day 1 - Map
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:
1.
More guidance when new advanced techniques are introduced.
2.
Upfront instructions for which cooking tools to have ready.
3.
Instructions on which ingredients to prepare in advance.
4.
Accurate and clear length of cooking time estimates
5.
Visuals as to how the dish should look at every step in the recipe.
6.
A way to advance the recipe with minimal touching of the phone.
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.
Day 2 - Sketch
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
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
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.
Day 3 - Decide
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.
Day 4 - Prototype
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.
Day 5 - Test
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.
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.