Submission

Medium

Create a feature for this cooking app that lets users substitute ingredients

👍
👍
1
🔥
🔥
10
♥️
♥️
0
💃
💃
0
😀
😀
1

SAVR App

SAVR is a mobile app that allows users to find food recipes that use simple ingredients and typically take 30 minutes to prepare.

The Problem: Many users have reported that while they enjoy most recipes, there are times when the recipe includes a certain ingredient they want to leave out.

The Task: Create a feature on the app that allows users to substitute an ingredient in a recipe.


User Research

Here is what SAVR users had to say when asked about substituting ingredients and the changes they would like to see within the app.

Design Analysis

To get a better idea of how to solve this problem, I looked at some other apps that already allow users to edit and delete certain choices off of a list.


A. Nike

Nike

To change an item on the Nike App, a simple click of the item image will bring the user back to the screen showing the different colors and sizes. However, there is no edit feature, and clicking the "Buy" button will instead insert another purchase into the shopping bag rather than replacing the previous selection.


B. GrubHub

Grubhub

The GrubHub app requires users to swipe left on a selection to be given the options to change or delete that item. Upon tapping the "edit" button, the user is brought back to the initial menu item screen in which one can change the item and the update will appear on the order screen.


C. MyFitnessPal

Myfitnesspal

MyFitnessPal allows users to input items in order to track calories throughout one's day. To edit an entry, just tapping the entry will bring the user to the "Edit Entry" screen, in which a user can change the type of food, number of servings, and meal time.

Sketches

Using the other apps for inspiration, I sketched out a potential way to install the new feature.

Usability Test and Feedback

By creating a paper prototype with the sketches above, I was able to get early feedback on the usability of the potential new feature. Below are the main takeaways from the tests.


Wireframes

With the insights gained from the paper prototype, I created an improved digital mock-up of the Replace feature.


Prototype

Below is a video showing a prototype of the new feature in action. 


Next Steps

While the Replace feature has been successfully designed, there are always improvements that could be made to further enhance the user experience. Of course, these are discovered through more user testing to gain additional feedback and to ensure the new feature works seamlessly with the rest of the app.

Paul Josel

View Portfolio

Comments

Log in to leave feedback, show some love, or ask a question.