.png)
By using data-driven design, Savr caters to everyday chefs looking to serve up there next culinary masterpiece.
Savr is a personal cooking app that allows users to cook both simple and challenging new recipes at home. The application has been doing well with users selecting recipes. However, some users have expressed difficulty cooking and trying new recipes.
Based on the existing research and design foundations of Savr, any future design solution must follow three constraints.
.png)
Savr must be design as a mobile-first app.
Recipes have to follow the basic list order.
Design solutions must focus on recipe & preparation.
To help aid with both time and design constraints, usability interviews were pre-conducted. The following invaluable thematic insights were synthesized from the interviews.
Providing users with information about special skills, techniques, and cooking steps that can be prepared in advance may greatly enhance their cooking experience.
Users require a need for feedback to ensure that they are correctly following the recipe.
.png)
By mapping out the typical process for Kevin, crucial areas were identified for improvement. The main theme for user pain points to the way information within recipes are presented to the users. By reevaluating the way information is provided to the user and changing it to fit user needs will significantly enhance the user experience.
.jpg)
**It is important to note that while another important problem of users finding the ingredients and materials in question necessary to prepare a recipe, the current scope of user pain points of following the recipe takes priority.
Taking inspiration from both direct and indirect competitors, popular application elements were incorporated into mock up designs for later rapid iteration. Elements such as Progress Bars, Touch Tap Function, Carousel or Horizontal Scrolling were taken into account as it takes away mental load from the user as its is most commonly encountered within other mobile media applications they use throughout the day.
.png)
.png)
Design elements that were taken into consideration must enhance and enforce the informational hierarchy in order to empower users with the necessary preparatory knowledge before they start cooking. Important considerations include the tools and necessary knowledge to operate techniques that will be required for more complex recipes. After taking becoming more familiar with the helpful design elements, rapid prototyping through Crazy 8s was utilized to fuse key components from different applications into potential design solutions geared toward assisting users in effectively following a recipe.
.png)
There are some ideas that were honorable intentions but did not make the cut due a steep learning curve and increase in mental load.
1. Scrolling carousel: To enable users to swipe through recipe steps effortlessly, similar to how they browse through photos on social media.
2. Expandable banner for cooking steps: Providing users with collapsible and expandable individual cooking step scrolls as they progress through each step. Although simple enough to use, there could be more unintended outcomes than the traditional numbered static steps. One of them which could be losing a step due to a collapsed banner or the added user action of having to physically click on a collapsed banner could prove more harm than good.
.png)
An intuitive feature that allows Kevin to seamlessly switch between the two primary aspects of cooking recipe anatomy—preparation and cooking steps—using a single tap, eliminating the need for scrolling. This streamlined approach reduces mental load and simplifies Kevin's search for specific information.
.png)
Kevin requires a clear hierarchy of information. This includes knowing whether he has the necessary materials, the skills required to use tools effectively, and ultimately, the ingredients needed to complete the recipe. This structured hierarchy ensures Kevin can confidently gather what he needs to succeed.
.png)
Kevin benefits from visual aids that ensure his dish turns out as expected. Whether through video demonstrations or step-by-step images, these visuals provide Kevin with crucial insights into cooking techniques, expected dish outcomes, and other essential elements of the cooking process.
On the third day I took the solution sketch developed on Day 2 and transformed it into a nine-panel storyboard. This storyboard serves as a simplified, hand-drawn wireframe, serving as a foundation to construct our prototype.
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
If you like what you see and want to work together, get in touch or follow my journey on:
%201.png)
.png)