Savr
5 Day Design Sprint
Day 1 – Understand & Research
Savr Recipes is a startup app that provides recipes for users to follow to help them learn to cook and eat at home more. Users have not shown issues with locating recipes that they enjoy. The problem that Savr has discovered is that some of their users are having issues with some of the more difficult recipes. They have been known for having quality recipes. However, they have received reviews about recipes having difficult techniques, confusing instructions and issues with timing. I have been tasked with finding a solution that helps users be able to follow any recipe easily and efficiently.
Secondary Research
Whisk
I decided to take a look at the recipe website, Whisk. One thing I think is useful is using pictures next to each of the ingredients. This is especially useful when someone is trying a new type of cuisine with unknown ingredients. I enjoy the bright UI and simplicity in color because there are a lot of pictures. I also like it has the ability to adjust the number of servings and the app automatically changes the recipe increments.
Tasty
There are many great aspects about the Tasty interface and recipe layout. I really enjoy that they have 3 ways to follow along with the recipe. You can watch a full interrupted video, follow the classic list instructions or there you can follow the step by step directions that also have short videos to follow along with. Having different methods will accommodate many types of learning among users. It also allows people to adjust how much help they might need. In the step by step they also give you a pop up window to see which ingredients are needed on the specific step.
Day 2 – Map & Sketch
After conducting research about Savr’s background and about competing apps, I was able to start visualizing the page and information architecture for the functions I want to implement. From here I can start laying out red routes and site maps. Starting from the basics, I developed a simple site map organizing how the flow of information and page architecture.
Crazy 8’s Sketching
Before wasting too much time sketching screen ideas that won’t be used, I enjoy starting with a Crazy 8’s sketching exercise (8 designs in 8 minutes). This works especially well for a design sprint because time is essential and this is an excellent way to develop many different designs quickly.
3 Panel Sketch
For my next step I believed it is important to be able to visualize the full layout of the app’s function. Being able to view the page sequence and architecture helps you evolve your designs.
Day 3 – Decide
The design that I decided to go with has the best solutions that address the problem area. I decided to keep photos and videos to always be readily accessible whether you are on the ingredients or instructions page. I also decided to put a media carousel with videos and pictures of the progress of the meal being cooked. I also decided to make all the cooking ingredients and terms have a pop up window when clicked to give more information on the ingredient, phrase or technique. To address the issue about what cooking utensils are needed, I added a supplies section to outline all pots, pans, etc. Laying out your designs like this allows you to refine your designs. While theses might not be the final layouts or page flows, it is an important sketch theses before putting effort into wireframes.
Day 4 – LoFi & Prototype
With only a day to complete this prototype I had to focus on very specific tasks that addressed the main problem. I narrowed the prototype to include the areas I felt were necessary for optimal recipe completion. This includes viewing as many instructions before starting, both video and written. I kept a picture and video compilation that remains at the top of the recipes page. This is so the user can refer back to visuals whenever they want. I felt it was also important to have the user review all materials needed before starting to cook. This includes all ingredients and supplies, such as cookware. Another aspect I put emphasis on was being able to learn about ingredients, materials, and techniques on the spot, reducing the need to back out and searching a term online. I did this by adding links on the key terms. This opens a pop up window with more information on the specific ingredient or technique.
Day 5 – Validate
After developing my prototypes, it is time to validate my designs and test the functions with some users. I was able to recruit four participants to conduct user interviews three in person and one over video chat. The scenario I laid out for them is that they are reviewing a recipe that looks delicious to them. Since the main issues in the product have stemmed through trouble in following directions, recalling information and completing recipes correctly I decided to focus mainly on the functionality of the design. In my interviews most of the tasks and questions went smoothly and without issue. All my participants were able to complete most of the tasks with only clarifying questions. I had to clarify on three occasions that the boxes with ‘X’ to the left of the ingredients were supposed to be pictures of the specific ingredients. This is where minimum UI became a disadvantage. After the end of the interviews, I determined that the functions and flow of the design has been a success. I had no issues with my participants completing specific tasks. The only questions that came my way were clarifying ones. Mainly about the UI and how it might look in higher fidelity. If I had more time I wish I had made my design a higher fidelity to help minimize the need for clarifying questions. I thoroughly enjoyed this project because I use a number of cooking apps in my daily life.
High Fidelity Designs
