view 3.png

Copy of Recipe App Design

Recipe App Design


Best displayed in computer

Ever since I came to college, the number of times I had to cook increased compared when I was in high school. After cooking for myself for a year, I've realized to cook successfully; you've to need not only a culinary skill but also a good planning skill for the grocery shopping as well.

So, I had this idea in mind, what if the recipe app would tell me which things to buy to make something with that I already had in my fridge. In this way, instead of wasting foods, people can use most of the ingredients they had in one's fridge.



Landing page

The picture on the left is the landing page of the app. It contains scrollable lists of featured recipes. Clicking on them will directly lead you to the recipe.



Recipe interactions

I'm a fan of recipe apps, and one thing I've noticed is that there were a lot of useful tips in the comments section. However, because comments sections are usually placed at the end of the article, there have been a lot of times that  I've found myself reading good tips after cooking the meal.

On this app, I've inserted the 'useful comment' section right before the start of 'how-to' section to amplify the usage of knowledges from the community.


If featured recipes doesn't seem appealing, see what you could make with few things in your fridge.

This is the critical feature of this application, if you insert three to five ingredients you have at home, the app will suggest lists of recipes you could make with just a few more ingredients.

As you can see on the right, if you start typing ingredients you have in a fridge, they will appear under the search bar, and it will instantly find a right recipe you could make.

Users could update their lists of condiments they have, in this way, they would not have to enter every spice they had whenever searching for the right recipe.


Editing your 'ingredient list' instantly changes the meal suggestions

Even if you realize that one of the ingredients is missing from the list, you can quickly erase and edit your list, and the app will instantly suggest new recipes with the combination of the ingredients you have.

swipe the menu you wanna make.gif

You can swipe to left to find out what ingredients you are missing to make a dish.


Clicking the filter icon on the left enables much more control on what kind of recipes will appear on the list.

Users can edit their lists of condiments or limit how many extra ingredients it will show in recipe results.


Thank you!