Users that are familiar with basic recipes often have trouble with unfamiliar techniques that are rudimentary in their explanations and format. For instance, the current SAVR recipe format is an ordered text list of instructions with very little else. Through 8 interviews I’m able to deduce the following issues:

- Constantly referencing their phone throughout the process
- Don’t know what kitchenware is required
- Don’t know if they’re on the right track (photos of intermediate steps aren’t included)
- Don’t know what they should be working on when they have “down time” 
- Have trouble coordinating cook times to bring all dishes together at once
- Cooking times are inaccurate and usually undersold
- Don’t know what steps can be done in advance, for example - a simple mignonette

I think I’ve identified a few things that are absolutely necessary for the MLP:
- “Downtime” needs to be better utilized with “Do this ____ while that is cooking…”
- Mise en Place instructions are critical, things can be prepared beforehand and different parts of the recipe need to be segregated to accomplish this
- Chopping time/s need to be incorporated into the recipe to reflect ACTUAL time required to prep something
- Step-by-Step photography needs to be incorporated into the intermediary steps to instill confidence and confirm the directions have been followed by the user
- If not photos for above, small vignette videos can be utilized, especially for intermediate to advanced techniques, think looping .gifs as the next step in the backlog perhaps
- Steps need to be optimized so that cookware can be used without washing, for example - deglazing a pan rather than washing it between linked steps/ingredients
"I have to say you outline every pain point I have experienced when it comes to executing a recipe. I have made it a practice to go through the motions prior to actually making something and reading the recipe over and over to decrease the down time."
Lightning Demo - Tasty
I really like how Tasty presents information for a few reasons. It keeps the videos short and they’re shot directly overhead which gives the user the exact view they would have when working on their recipes. The app looks exactly like the Instagram versions where they’re presented in multiple, seconds-long .gif vignettes. Additionally, they offer a text-driven step-by-step version if the user prefers. Obviously, within the app more information is presented, as well as variations on recipes. I’m seeing a lot of variety that can be tailored to each individual. This is the app I’ll be emulating for the MLP.

Lightning Demo - Yummly
WOW. This app has it all. The EXPLORE menu has 12 different categories: Guided (the one we want), Articles, Seconds (recipes in 15 mins.), Popular, Trending Now, Seasonal, Quick and Easy, Kid Friendly, Cuisines, Courses, Diets, Dishes. In addition, there are 2 other top level choices with subsequent sub-menus: Just For You (which is customized to the preferences the user submits in the onboarding process) and Pro (which are deep dives into larger, more complicated thoughts/recipes). 
That said, the guided section covers some of the issues our research uncovered. Specifically, this section addresses both the ingredients that are necessary as well as the equipment that’s required. Each step is a quick video showing exactly what to do and exactly what the process looks like. The check boxes that denote completion keep everything linear and on task. If the user wants to look beyond, say, a timed bake, the information will be slightly obscured, but still available (see bottom 2 screens). The folks behind this app clearly put a lot of research into their product and I think SAVR needs to find the sweet spot between Tasty’s simplicity and Yummly’s overwhelming thoroughness.
Crazy 8's

I cook every day. I’m not talking about warming up cans of soup or making grilled cheese sandwiches. I mean, for real, COOK. Like porchetta or boeuf bourguignon (not the most complex in regard to technique to be sure but delicious all the same). Additionally, I have a fair amount of experience in professional kitchens - working my way up to sous before returning to the design field to push pixels. All this to say, I think I speak for nearly all cooks, (regardless of experience level) that your Mise better be in its Place before you get going. It’s just good technique and gives one time to enjoy a glass of wine instead of white hot panic because someone forgot to chop and sauté the ______ (fill in the blank). Back to UX...this is why I think the Mise en Place screen will be either the beginning of a fun and delicious experience or the onset of stress and probable disaster. Nobody wants the latter.
3-Panel Solution

I think swiping left or right can be established early as part of the on-boarding experience. Also, I’m not great at drawing or sketching hands, so here's our Mise panel flanked by the screens that come immediately before and after.
Further refinement and extrapolation of the 3-Panel Solution into a full-blown storyboard. I want to lead off with the full-length video for the first screen along with ALL of the pertinent information a user would need; what cookware is required, which ingredients are being used, any tips or tricks that can make or break the dish, possibly the history of the dish, recommended pairings of other dishes or drinks and obviously, the all-important barometer of a recipe, the review section.

The next screen is the most important and distinguishing feature of SAVR - the Mise en Place screen. I'm able to solve most of the concerns mentioned in the interviews with this simple pre-cooking screen. This sets the user up with expectations on what's ahead, what can and should be done before any real work begins, how to organize a work space and how to bring everything together in an efficient manner.

The subsequent screens are what one would expect; end-result thumbnails to reassure the user that lead into small vignettes. By breaking the recipe into smaller units of no more than a couple steps each we remove some cognitive load from the user as well as any anxiety related to being overwhelmed. 

Another note, the recipe title is only included in the thumbnail and slides down behind the white copy panel below it when the video begins.

Luckily for me, the overwhelming majority of my friends and family are really into cooking also so there was no shortage of volunteers to test drive this badboy. By in large, the idea of a Mise en Place step / section that precedes the main assembly section was well received. Additionally, having the required tools outlined beforehand helped streamline the theoretical cooking process. The only slight hiccup was the unfamiliarity with the French Brigade term, Mise en Place. Once explained, light bulbs went off, wheels turned, babies laughed, dogs frolicked, knives chopped; success!​​​​​​​
I think my sample data may be skewed. Because of the Covid 19 lockdowns, I was really only able to interview friends and family, which previously stated, are already into cooking. I think that edge case users that are less experienced in the kitchen or have difficulty remembering the steps may stumble a bit.
I think if this was a real world assignment, I would advocate for a voice feature to be added to the backlog. Nothing too technical, just access to the microphone and the ability to either "REPEAT," "FORWARD," or "BACK." I think this hands-free functionality will also solve the issue of referring back to the phone with dirty or occupied hands.
Back to Top