Savr RecipesSavr Recipes is a new startup that wants to make it easier for people to follow new recipes and cook great meals at home. Their library of great recipes and active community of at-home chefs really bring value to Savr. For this modified Google Ventures design sprint, I will be exploring improving the user experience for a user who has chosen a new recipe and is ready to start cooking and following instructions on the app Savr Recipes. Savr users expressed wanting to improve this process on the app due to features that were causing them to feel stressed, seemed a bit chaotic, and they felt needed to be simplified.
|
Day 1 - Understand
For my role as UX designer for this project, the very first and perhaps most important step of the user experience process is understand the problem. This requires quantitative and qualitative research to ensure that the time spent to come up with a solution that will actually satisfy Savr users’ needs. Here is what I have so far:
Challenge Goal Help users accurately and easily follow cooking instructions for new recipes Pain Points
Constraints
Research
User Interview Maria, interviewee, Cooks 3-4 times a week Joe, lead researcher, interviewer Question: Walk through a recipe you cooked for the first time
To help me process the information from these many users, I compiled my notes from each thought and copied them onto sticky notes. I just wanted to get everything down so that I can physically sort through them and prioritize the most important pain points in order to best serve my users. Above is the affinity map with my sticky notes categorized into the 5 categories that I created from themes coming up in the user research interviews. The biggest problem area is definitely the prep stages of the recipe process. |
Based on the information gathered so far, I created a fictional person that embodies the common pain points of the users. Meet Nick.
Nick, 29 years old, lives in L.A.
Persona Goals: wants to be able to confidently follow a recipe so his dish comes out as expected and wants to the experience to be enjoyable and challenging without the chaos and stress. |
Using the information from research and keeping our new friend Nick in mind, I created a few variations of a user’s experience and mapped what his journey will be like if he were to user Savr Recipes app to cook a new recipe.
Day 2 - Sketch
In order to find leading competing food apps, I sought to the internet in search of recipe app reviews. I went through 7 review sites that rated the best recipe apps and noted the apps that most frequently appeared. In order of most used and highest-rated app, I looked at these apps for inspiration:
Allrecipes
In the Allrecipes app, there are advertisements in the free version that tend to break up space. That was the first thing that I noticed. Other than that, I wanted to capture the main elements of the design. There is a picture to give the user an idea of what they are cooking. There is a rating system for the recipe, three times (prep, cook, and total), ingredients needed, and the directions. The directions have multiple steps in one “step,” which I thought might be confusing similar to the current problems that Savr users are experiencing. |
Competitive Summary
After reviewing competitive apps for Savr, I found that there are the following elements that the competitors featured that also meet the pain points of Savr users.
Crazy Eights Next, I spent 1 minute on 8 quick iterations of the most critical screen. I wanted to include the features from competitors but also ensure that Savr users’ pain points are being met. Here are my sketches: |
After reviewing the 8 sketches, I ended up going with the 8th iteration. I enjoy the text over the full-width photography of the dish with the name of the dish, estimated times, and difficulty overlaying the image. Also, I like the idea of hideable sections so that users can close sections when completed. For instance, after all of the ingredients for the recipe are checked off the list, they can minimize the Ingredients section. A similar interaction will happen with the Kitchenware/Tools. The final section has one step of the process at a time in a simplified format. I thought that Yummly’s card styles for the directions were clear and simple and users can horizontally scroll to the next step.
Essential Screens
After selecting my favorite essential screen from the Crazy Eights, I designed the user experience that would lead into and away from the essential screen. The first screen in the sequence is where the users would select the recipe they want to try out. Then, the essential screen is second. It contains the main pieces that appeared in competitive apps and meets the pain points of Savr’s users. I included a full-width image, cook times, difficulty rating, list of ingredients, list of kitchenware, and the directions displayed in step-by-step cards. Thirdly, the user finishes the recipe with this feedback screen where they can rate how difficult it was, save the recipe to refer to it later, and view similar recipes. |
Day 3 - Decide
Now, it’s the time to decide which screens I want to prototype for the minimum viable product. I put myself in the shoes of Nick, my persona, and walked through the experience of cooking a new recipe.
Recalling apps like Postmates and Tasty’s homes screen, I wanted to duplicate the experience. I really enjoy how Postmates allows users to browse by category to assist with the selection process. Also, one user from the research phase said that she spent a lot of time researching techniques or terms that she didn’t understand that would often detract from cooking. I added an overlay feature so that less common techniques and terms can be tapped to reveal an overlay with the definition. This will help users save time rather than needing to research outside of the app to accomplish the task. |
Day 4 - Prototype
When designing the higher fidelity prototype, I used my sketches as a skeleton and applied the pre-existing elements that I knew from the design brief. Based on the design brief, I downloaded the Savr Recipes logo and used the font and colors to dress up the rest of my design. From there, I followed the iOS design standards found on Apple’s website keeping usability heuristics and my persona at the forefront of my mind.
|
|
Day 5 - Test
The user testing portion of the process is perhaps my favorite. Throughout my interviews for this project, it became more clear who was an external processor. In my first interview, I experience some bugs with the prototype that I needed to fix to ensure a correctly working prototype. These bugs weren’t there when I did the rehearsal test. Fortunately, when I fixed the bugs, there were no issues for my other interviews. Overall, the feedback that I received from users was that the process was simple and enjoyable. They enjoyed having the option to see full-screen directions.
Constructive User Testing Feedback
Positive User Testing Feedback
Constructive User Testing Feedback
- Include the quantities with the ingredients list
- Include sizes with the kitchenware list
- Make the "dicing onion" button more clear to users
- Include details on techniques that newer cooks may be unfamiliar with in an noninvasive way to more experienced cooks
- Add oil to the ingredients list
- The rating system needs improvement, smiley faces don't seem quite right
Positive User Testing Feedback
- Enjoys how each step is separated into individual cards to make it easier to navigate without losing track
- Likes how the ingredients and directions are on the same screen
- Likes that prep and cooking are separate
- Enjoys the full-screen directions while cooking
Analysis
After testing, my prototype relieves the pain points of Savr’s users yet can still use some more testing to work out the minor problems. The main problem that I was trying to fix was to put an end to wordy extensive recipe directions. Users would get frustrated after losing their place or confused from misunderstanding what the directions were asking them to do. Users from the research interviews expressed that they felt like the order of the recipes could be made more simple and less chaotic. By creating recipe direction step cards, users can clearly complete tasks in a simplified view before moving onto the next step. Users from the testing interviews found the process to be “intuitive” and “easy.” Ultimately, this concept satisfies our persona’s biggest goals. Now, let’s get started on that shopping cart feature.