Cook
4 U
A digital recipe
Overview
A feature that allows the user to find the recipe from the web and with minimum ingredient they have at home.
Jan 2019- May 2019
User Researcher
UX designer
Timeline
Role
Challange
Design a prototype for a mobile app to assist the users to improve their health by changing their food selection. The aim of this research is to first understand the people’s behaviours toward food consumption through an online survey and based on data collected, an interactive mobile application will be designed to simplify their food consumption to encourage them to incorporate nutrients into the diet of their choice.
Objectives
The web and the internet may not always provide the information they are looking for. The web-based search engine consists of various irrelevant information, hindering the chances of the user to find a trustworthy result (Sriramoju, 2017). This can impact the eating behaviour of the people who are busy to prepare a meal and depends on a web-based search for the recipe and instruction. Hence, this research project called “Cook4U” is an attempt to design a smart cookbook for the healthful eaters, which generates a recipe by entering the readily available ingredients with features such as their dietary requirements, allergies, calories intake and an ability to share it with millions via the social media. Therefore, this project will be use oriented to help them make healthier food choices to support their busy lifestyle.
Process/ Research
Method
Result
Understanding the end-user, app’s function that can fulfil their needs and the App’s usability is
essential to design a user-friendly app. The design principle of this project focuses on “User Centred Design” (UCD). App with UCD requires maximum involvement of potential end-users
because "user influence how the design takes shape” (Abras et al., 2004, p.445-446). “The designer should ensure users are able to use the product with a minimum effort” (ibid). Researches on the current technological usage by users will be done to measure usability which can be measured on participants performing tasks in a real environment (Nayebi et al.,
2012, p.2). UCD requires an understanding of potential users, insights regarding their eating behaviour, and their experiences and challenges with smart-devices to design app to match their expectation. Users are the key to the design process because they are the one using the final product (Abras et al., 2004, p.448). To have the ground understanding of the audiences, a
quantitative research study was conducted to identify: 1. Demographic details; 2. Define persona; 3. Importance of health for a designated persona; 4. Their technological understanding, importance and challenges. Similarly, an online observation was conducted to understand the user’s opinion towards other similar mobile apps. Finally, User-Interface (UI) for the mobile app was designed using wireframe tools mockflow.com and prototype designing platform called proto.io.
Through the survey audience’s needs, values, challenges, were analysed. The data suggests that they prefer home cooking over eating out because they are concerned about the ingredients used which may affect their health. 90% of participants prefer healthy eating. 42% of the participants cook almost every day. Although 61% responded not using any media as reference for a guide to cook, 16% used Google and YouTube as a platform for recipe search. 97% uses mobile for web and video browsing and rarely have any problem with the system such as reading, audio, colour etc. 82% use mobile phones mostly for social networking with YouTube (61%), Facebook (25%) and Instagram (11%). Analysing the responses from the participants, I was able to get insight and create the persona to design the “Cook4U” to fulfil their requirements listed.
Persona
Design
Wireframe
Final
Design
Function
After collecting and analysing data, the main objective of the app to provide users with healthy recipe still remain the same. The Fig1. shows the Cook4U app’s design when the user has viewed the recipe.
1. Cookbook
90% responders/participants prefer staying healthy whereas 45% maintain a healthy weight. According to the research study, a diet with high dietary fibre is lower in saturated and trans-fatty acids, sodium, and added sugars which is beneficial to improve health when consumed adequately (Dahl and Stewart, 2015, p.1868), It also lowers the risk of chronic diseases like cardiovascular diseases, type 2 diabetes and some forms of cancer (ibid). Similarly, “At least 48g whole grain offers beneficial effects for weight maintenance” (Ye et al., 2012, p.1311).
2. Nutritient Intake
Based on the data from the survey, there was a major difference in the preferences regarding the non-vegetarian diet (96.8%) and vegetarian diet (3.2% i.e. only one participant). However, increasing plant-based diets and reducing intake of animal products such as red and processed meat are beneficial in the prevention of type 2 diabetes(Satija et al., 2016, p.3). Along with the participant willing to stay healthy and the importance of plant-based diet with the research study proves that plant based diets such as vegetarian, and vegan were important to be encouraged
through the Cook4U app.
3. Dietary Needs and Allergies
4. Customisable
The following Fig 8, 9 and 10 show social networking features which makes it an
interactive app.
5. Social
The user will have the ability to create their own recipe with options first by writing and uploading (Fig.13) on their own or by uploading the link from YouTube that will automatically generate video recipe (Fig.15). When the user writes their own recipe, they are also allowed to take and upload pictures, video or upload the picture or video (Fig.14) they already took.
6. Create own Recipe
Search: Although, the app has the ability to let the user find the recipe with the option already available (Fig.16, 17, 18,19) it will only show the latest uploaded recipe from the app users. The search function (Fig.20) lets the user search for the older and the particular recipe they want.
7. Search and Save
Save: The feature allows the user to save the recipe (Fig. 11) for future use. When saved the user can view the saved folder (Fig.21). They do not need to search again which saves a lot of time for the users as they can just tap the save button to view the list.
8. Export Ingredients to Phone's Note
Final
Design
Prototype
Description of the User Interfaces of Cook4U app.
P1. Welcome Screen: The first screen when user selects the app on their phone.
P2. Register: The user will have to register by filling in information as asked on the Register Screen.
P3. Login: If the user have registered they will be asked to login.
P4.1. Meal Type: The screen contains the types of meal such as Breakfast, dinner, lunch etc of their
choice.
P4.2. Diet Type and Allergies Menu: The screen contains the list of diet types to choose from including
some common form of allergic free food choices
P5. Cuisine: The list of cuisine based on the country.
P6. Recipe List: The list of the recipe the user can choose from.
P7. Recipe: The format of the recipe which includes the detailed ingredient required and the
instruction of the steps how to make.
P8. Generate Recipe: The user can type in the ingredient they want to use as part of their meal.
P9. Upload Recipe: User can write and upload their own recipe.
P10. Upload Recipe by Typing: Recipe can be uploaded either with the option to manually type the
instruction.
OR.
P11. Upload Recipe by URL: Upload by copying the YouTube link which will automatically convert the
video into text. The recipe will be uploaded in video, as well as text format.
P12. Recipe Share: The recipe can be shared onto the social-media of the user’s choice.
P13. Rate Recipe: Rating the recipe based on user preference. This will allow other user to analyse
and understand be the recipe is worth making.
P14. Search: manually typing the keyword to find the recipe. Keyword can be: ingredient, dietary
need etc.
P15. Saved Folder: All the recipe that the user decides to save will appear in Saved Folder.
P16. Edit Recipe: App allows the user to add or delete the ingredient from the recipe if they do not
like it. They will be suggested with other possible ingredient as possible.
P18. Edit Allergies: The user can predefine the ingredient they wants to avoid. When the user does
this , either the recipe which do not include the listed ingredient will be presented or present the
recipe by replacing with other ingredients.
P18. User Profile: It will view all the details regarding the user i.e. their personal infromation, recipe
they have uploaded, followers and who they follow etc.
P19. Colour theme for each dietary option: Each dietary need is represented with different colour.
For example, if the user selects Vegetarian the list will be represented with green colour around the
label, vegan with green as well but transparent green background, Non-vegetarian -black,
pescatarian- blue.
P.20. Picture Library OR P.21. Video Upload OR
P.22. Picture Upload When the recipes are manually written, the user can either decide to upload
picture from their phone(P20), record video and upload(P21), or take still picture(P22).
P.23. Messaging: All the message receieved messages stored.
P.24. View Review: User can view the review of the recipe before deciding to make one.
P.25. Nutrition Value: Detail of nutrient value listed.
P.26. Accessibilty: User with visual impairment can change text size, its colour, interfaces colour etc.
P.27. Export List to Phone’s Note: The user can export all the ingredients to their phone’s note to
refer while grocery shopping.
P.28. Menus: Menu with list of sub-menus which can take user to the screen (UI) listed.