Eat in


Passion project


Mobile app (iOS)


Hooked model, Figma, InVision


2 weeks (is being revisited),
September 2017


Product designer
Eat in splash image.


Helping people to have a healthier, cheaper, and non-time-consuming eating habit

Cooking at home can become a burden in this fast-paced life. Barriers such as unfamiliarity with cooking and time pressure lead young people to eat out often. This behaviour tends to be expensive and/or unhealthy. Solutions were explored using hooked model by Nir Eyal resulting in a meal planning app. The meal planning app caters weekly recipes and shopping list by learning from the user’s spending habits. The app's main features include varied weekly recipes and pre-populated grocery list. This project is currently being revisited with the focus on breaking barriers of the unfamiliarity of cooking through food education.


Eating out can be expensive and/or unhealthy

Due to the unfamiliarity of cooking and time pressure, young people tend to eat out or take out food almost all the time. While not only does it cost a lot of money, this can lead to unhealthy eating habits. In addition, for the people who are not familiar with cooking, the barriers to start cooking are bigger. From not having the right equipment to not knowing how to do things. Currently, most recipe apps or sites act like a recipes database instead of helping the users to start cooking. With the “I have no time to cook” excuse, cooking becomes a huge burden.


Business goal

To help the user learn how to cook and plan their meals. Ideally, optimize user retention and gaining revenue by partnering with food brands and grocery stores.


User's goal

To create a healthier, cheaper, and non-time-consuming eating habit.


Guiding the project that satisfies the user’s and business goals

From the goals  and constraints, a set of requirements was defined to measure the success of the project:
  • The solution should have multiple ways to learn user’s food preference
  • Show a set of recipes to cook on a weekly basis
  • The user should have control over the suggested options
  • The solution should be optimized for sharing

Defining users

Young professionals and university students

Two types of young people were explored, young professionals and university students. Young professionals were chosen as the main focus with the assumption that they are more aware of their spending and eating habits.From observation, they often eat out for lunch. While it’s true eating out remove the necessity to spend time on cooking, however, during lunchtime, food places get really busy causing them to have to wait a long time anyway. They do however sometimes bring food from home, but they’re being inefficient about it (e.g. brought too many containers for a simple sandwich).

The Hook model

Creating a habit-forming product

Since the goal is to change eating habits, I used Nir Eyal’s framework of the hook to create a habit-forming-product. The hook model helped me to figure out what important features to add to the app. The features implemented in the final design were all based on the hooked model.
Eat in Hooked model.
Eat in Hooked model

Final Design

Hook it up - Tracking user food spending habits

The onboarding of the app includes the credit card or Mint account integration and questions regarding the user. The idea of the card or Mint account integration is the app should be able to track what the user spends daily and record all the food-related purchases. Then this can be used to predict what cuisine do those restaurants provide and what’s the most popular food there. This solution is heavily data-driven to obtain information about the user by tracking their food spending without the need for user constantly inputting information. By knowing this information, it can understand what kind of food the user may enjoy, thus can provide the recipes that the user likes.

Alternatively, if the user chooses to skip this step they can still receive a personalized cooking plan by answering questions on dietary restrictions, allergies, and the number of people the user will cook for.
Eat in on-boarding screens.
Eat in on-boarding screens

Final Design

Cooking plan - App generated weekly recipes

The cooking plan consists of recipes for the whole week. It uses information from the user answers and spending habits. While the app giving a set of recommendations, it still gives the user control over their weekly recipes, allowing them to remove or add a new recipe.
Eat in cooking plan screens.
Eat in cooking plan screens

Final Design

Shopping list - Auto-generated ingredient list from the weekly recipes

The shopping list gathers ingredients from the cooking plan recipes. In addition, I decided to allow the user to add a new list for their own use. Thus their other shopping list can be united in the Eat In app.
Eat in shopping list screens.
Eat in shopping list screens

Final Design

Recipe - Steps and reviews

When a card is selected, the user is led to the recipe page. Within it, there are details about the recipe (ingredients and how to), reviews, and photos of the food generated by the app users.

To see the review the user can tap the top photo. Below it is the list of photos generated by Eat In users. The featured photo, which is the top photo can change depending on the popularity of the photo.
Eat in recipe screens.
Eat in recipe screens

Final Design

Optimized for sharing

There are two ways to share a recipe, direct share and share to feed. Direct share allows the user to share only the recipe to the user’s social circle through social media or messaging. The share button is placed right beside the recipe name. It’s placed there so that it’s obvious enough for the user to navigate to the button. The information at the top of the recipe should be enough for the user to decide to share the recipe or not.
Eat in direct share screens.
Eat in direct share screens
In contrast, share to feed adds the social factor of cooking at home to the app encouraging the user to “show off” what they can make at home. By sharing what they can cook, their followers will see what they made and this is an indirect form of sharing the recipe. Through the feed, the user’s followers should be able to select the post and access the full recipe.

The upload button is placed at the end of that recipe page right underneath the last how to step. The idea is as the user reaches the last step, the cooking process is pretty much done and the user can easily select that button to share what they’ve just made.
Eat in share to feed screens.
Eat in share to feed screens


Exploring the interaction of the app

An InVision prototype was also made to understand the flow better and making sense of the interaction. Feel free to play around!

InVision prototype

Marketing website

Inviting visitors to download the app

A landing page for the app was made as an introduction page for this new app. The purpose is to inform the benefits of Eat in. It was designed so that the user can easily download the app by funnelling them through SMS link.
Eat in marketing homepage.
Eat in marketing homepage

Learning and Next Step

Progress indicators and milestones should be explored

The target user might be very narrow. One suggestion is to add more questions in the onboarding to better learn the user preference. Progress indicators and milestones like money saved, meals cooked, calories count etc. were not considered in the design and should be explored. Finally, what if the user sceptical to connect their mint account or credit card? How would the user know how the app uses the information from the Mint app or credit card? This project is currently brought back for a second iteration. Barriers, such as equipment absence, time pressures, and lack of cooking knowledge of the users are the main focus for this iteration.