Savr:

Feature Design

Context

A design sprint is a 5-day process for answering critical business questions through design, as well as prototyping and testing ideas with customers.

This project was a modified Design Sprint. Typically conducted by a team to promote collaboration, but for this project, I conducted it solo. The design brief and research data were provided by Bitesize UX via Springboard UX Career Track course.

Constraints

Currently, recipes are written as text, in ordered steps from start to finish.

Solution should be designed as a feature for the Savr Recipes native mobile app.

Users have expressed positive feedback about the finding quality recipe. - Focus on creating a better experience for users when its actually time to cook!-

  • Savr is a new startup that shows hundreds of recipes, and cooking tips for at-home chefs. They have an active community of users who rate and review recipes for other users

  • Savr has seen some negative reviews about recipes that involve many steps, or more advanced techniques. Users who had been excited ended up disappointed because they didn’t feel the instructions were clear, or easy to execute.

  • Savr gets a lot of positive feedback on the quality of their recipes- but now they need to help users accurately, and easily follow the cooking instructions

  • As a solo UX designer, I focused on the following:

    • Synthesizing research

    • Establishing goals

    • Ideating solutions

    • Storyboarding

    • Wire framing

    • Creating high fidelity prototypes using Figma

    • Usability Testing.

Day 1: Understand and Map

I started Design Sprint day one by reviewing the available research data (user research highlights, persona, and interview audio) about Savr to understand their needs.

Nick is the persona given by Bitesize UX. He consolidates the frustrations, goals, and the experience of most users.

  • How might we give the user all the information they need to be prepared when they start cooking?

  • How might we make instructions clear and easy to execute?

  • How might the phone be easier to use while cooking/looking at instructions?

How Might We?

Customer Journey

The last part of Day One, I drew up a couple of potential experiences for this problem

Day 2: Sketching Solutions

Lightning Demo

I spent 20 minutes looking at cooking blogs and two cooking apps - Kitchen Stories and Tasty - I took notes on the delivery of information and features these companies were using, to take away the inconvenience of touching a phone while cooking. These observations were the inspiration for the solutions I implemented.

Crazy 8 exercise

Sketching out the step-by-step cooking feature, the layout, and navigation of ingredients, directions, timers, etc.

Solution Sketch

From the Crazy 8 exercise I was able to choose my solutions, and sketched out those screens

DAY 3: Create a Storyboard

Using my solution sketch as a guide, I began making low-fidelity screens in Figma.

Day 3 was all about making decisions of how my user would navigate the recipe to have an organized experience.

Day 4: Prototyping solution

One of Savr’s problems was that they had all the instructions in order from start to finish.

This lead to the user not being prepared and scrambling around their kitchen for what was required in each step.

To prepare the user, Savr now includes estimated time for each step, cooking tools needed, instructional videos, ingredients (scaling option available), and preparation steps to make cooking - just cooking.

Savr has great recipes, they just needed to deliver the recipes in bite size pieces.

Another issue users had was referencing back to their phone while cooking. In the Customer Journey I chose “cooking mode” where screen darkening is disabled. After more observations, I chose to use step-by-step instructions. Just one tap to the next step. No more scrolling or squinting to view small text in long recipes.

Timers are often needed while cooking. Before, users would have to navigate to their phones timer or use the microwave/oven timer. Now, there is a timer built-in to necessary steps that is preloaded with the recommended time.

Low Fidelity

High Fidelity