Challenge Brief

Medium

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

Challenge Overview

You are the lead UX designer for SAVR - an app that provides awesome recipes that can be cooked in under 30 minutes.

Your Challenge

Many users have reported that while they enjoy most recipes, there are times when the recipe includes a certain ingredient that they want to leave out. Your challenge is to create a feature that allows users to substitute an ingredient in a recipe.

Unlock the Challenge

Device & Platform

You will design this feature for the SAVR iPhone app. The recipe screen is included in the attachments - you can use these templates as a reference to start designing the feature. Remember: For this challenge, you don't need to re-design the entire experience - you are only focusing on adding this feature to allow users to substitute ingredients.

Unlock the Challenge

Research & User Insights

The research below shows some insight into why users want to substitute ingredients, and what options they would like to see as possible substitutes. You can also do your own research to learn more about how you can recommend great ingredient substitutions for users. The most important part of this challenge is creating a usable feature that helps everyone modify a recipe to meet their needs.

Unlock the Challenge Unlock the Challenge Unlock the Challenge Unlock the Challenge Unlock the Challenge

Check out this submission, and use it as an inspiration to get started on your own!

Joe Formica

Joe Formica

12345



How I created a feature to help users substitute ingredients! 



1. Competitive Analysis

I started by checking out some other apps, and seeing how they handle switching options, and recommending new choices for users.

Below are a few screenshots of what I looked at, and some notes on how they might be useful to create this feature for SAVR.

Trello
Beerlist
Options



Generating Ideas with Crazy 8's 

After looking at how some other apps handle a similar feature, I worked on the Crazy 8's exercise to start coming up with some solutions that could be incorporated into the SAVR app.

Crazy83

After looking at my 8 sketches, I decided on combining two of the solutions to create a pretty simple interaction of choosing the ingredient you want to switch, and picking from a list of substitutes that is overlayed on the screen.

Crazy84



Sketching

After outlining the basic idea of the feature, I began sketching the screens in more detail, adding some ways to show the categories of different options (eg., popular substitutes, vegetarian). The screens below show how the interaction would work in a little more detail.

Sketches1

Creating and Testing a Paper Prototype

After creating my sketches, I used Marvel to create a quick prototype to test.

The animation below shows how the prototype works, with a user being able to switch mayonaisse for another ingredient.

The main feedback I got from testing was:



"If you were vegetarian, wouldn't you want to substitute all non-vegetarian ingredients at once, instead of having to go one by one?"



Here's how I solved that in the next iteration of the prototype:



Vegetarian






 

Want to see the full brief and get started?

Start Your Free Trial

Challenge Checklist

A step-by-step guide to creating an awesome submission

Get some inspiration
35 Minutes
Use Crazy 8's to generate some ideas
8 Minutes
Sketch out your solution
20 Minutes
Create a Paper Prototype
20 Minutes
Test out your prototype!
30 Minutes
Turn your sketches into digital designs
1 Hour

Want to see the full brief and get started?

Start Your Free Trial