The Application Suggests Recipes On A Daily Basis

The Project

Duration: 2 months

Project Type: Personal

Role: UX Research, UI Design

Method: Sketch, Surveys, Interviews, Affinity Wall, Usability Testing, A/B Testing, Preference Test,

Think- Aloud, Wireframes, Prototyping

Tools: Adobe XD, Adobe Illustrator, Google forms

Project Brief

About what?
This is an application is automatically display the meal menu recipe for the day (the week, the month) when people put in their own budget or certain conditions.

For whom?
People who think it's hard to come up with recipes for food.

What problems are users having?
People have to find the recipes every time when they cook if they would like to use as a reference. They can also calculate the cost per meal, but based on their budget, it is difficult to show them the recipes that fit their budget for the number of days they specify.

How did I find this need?
Nowadays, more and more people are concerned about their health since corona became widespread in the world.
In addition, some people have lost their income due to corona, and others have become worried about their future income.
There are a lot of people like that around me, and when I came up with this idea, I gathered information and found a lot of people who were looking for such an app.

The app recommends a cooking menu to users by combining the following items.

- Budget

- Single day / week / month

- 1 Breakfast / 2 Lunch / 3 Supper / Combination of them / All of them

- Vegetarian / Vegan / Meat / Balanced

- Priority: Vitamin / Protein / Calcium etc

- Style: Asian / American / European / African / Mexican

- Allergies: Egg / Flour / Shellfish / Nuts / Fruits etc

- Number of portions

Target

Age: According to all ages

Gender: Follow all genders

Area: Follow people who live in all areas

Occupation: Follow all occupations. Unemployed, students, adults, housewives, singles, retired, etc

Needs

- People are spending more time at home with Corona.

- Under such circumstances, there are the following needs, and the effects can be expected.

- People get productive when they are at home.

- People can cook for themselves and take good care of themselves.

- Cook with friends, lovers, and family, serve cooked dishes and strengthen relationships.

- People can focus on their health.

- People can save money.

Competitive Overview

Method Used

- Website

- Application

- Youtube

- TV

- Book

- Taught from Family/Friends/ etc (by people)

- Original recipe

Currently, there are many useful and wonderful cooking applications.

There is no application that suggests cooking recipes for the day or week according to the budget and the conditions indicated by the user.

Similar applications are, for example, "Paprika Recipe Manager" and "Plan to eat".

System Goals

Goal 1

I want to make it so that users can complete everything by using only this app.

This one app should be able to search, suggest menus for a week (or a single meal, a day, or a month), a timer, and even calculate calories.

Goal 2

To help people become healthier and enjoy their time at home.

Recruiting and Interview Design

I plan to conduct informal unmoderated interviews with three participants between the ages of 14-85.

- Participant 1: age 14-20

- Participant 2: age 21-30

- Participant 3: age 31-50

- Participant 4: age 51-70

- Participant 5: age 71-90

Interview Criteria

- Men and women, approximately equally distributed.

- Internet and tech-savvy, regularly use the Internet to search for information and enjoy using apps on their cell phones.

- People who have used some cooking applications at least once.

Interview Guide and Questions

Below is an outline of potential questions I will use to guide the interviews.

Do you like to cook? Or do you have no choice?
How much cooking do you do per week?
How often do you refer to recipes when you cook?
What do you use as a reference when you cook?

- Website

- Application

- Youtube

- TV

- Book

- Taught from family/friends/etc (by people)

- Original recipe

Do you have more than one source of information to refer to?

- Or is it specific?

- Why do you use this source?

- What made you decide on the recipe you looked up?

- What frustrations do you have when using recipes as a reference?
- What features would you like to see in a recipe app?

Needs finding and Initial concept

Conduct Needs Finding and Analysis

I conducted research on cooking applications and sites.

Based on the standards of recent cooking applications and sites, I assume that users referring to cooking menus are looking for the following things

Clarity about how many servings the dish is for.
The time it takes to prepare the dish.
An explanation of how to make each step of the process.
A video of how to make the dish is included.
There are reviews from people who have actually made the dish.
There is a "My List" of favorite recipes.
There are rankings.
You can search for dishes by a variety of criteria.

For example, you can search for vegetarian recipes.

There are pictures for each part.
Tips and pointers.

Current Practice

It has become a standard for cooking applications to have the following features to meet the needs of users.

A search bar immediately after opening the application.
Trending and popular recipes are displayed.
The number of servings in a recipe is displayed.
Each step of the recipe is listed in numbered order.
You can search for dishes in each genre.
For example Cuisine of nationality, Diet, Occasion, Meal style...
In some cases, videos of how to make a dish are included.
There are reviews by people who have made the dish.
AI will recommend other recipes to you based on your past search history.

Functional Requirement

You can search, set a timer, and complete the process in one app.
You can look up a week's (a day's, a month's) worth of cooking menus at once.
You can specify the budget for the dish.
You can sort the number of servings for a dish and display the amount of seasoning to match.
You can exclude from the search results dishes that contain allergic ingredients you have entered.
The process from search sorting to result in the display is less burdensome.
The units of quantity and weight can be changed.
For example kg, oz, g, lb, l, gal, qt, pt, inch, cm, °C, °F

Constraints

There is a lot of information displayed on the screen.
There are many steps to take before the search results are displayed.
Blue color should not be used because it suppresses the user's appetite.
Small text.
There are no enough recipes.

Affinity Wall

Persona

Sketch and ideate storyboard

Scoreboard

Low-Fidelity Prototype and

Micro-usability Test

Wireframe

Based on sketches I started creating wireframes.

UI Kit

Following the Style Guide, I crafted a UI Kit that would inform the Design System for Conciermange.

Micro-Usability test plan - Overview

○ Overview

Here, I check if the user can search for recipes without strain and without hesitation.

We will also check if the sort types of what the user wants to search for are sufficient or if there are already too many, burdening the user.

Then, we ask the user to Think-Aloud and find out where the user gets lost and stressed on this app wireframe.

○ Test Goal

Test Goals of this initial user testing is to answer the question:

- How is the system less or more efficient for finding the recipes?

- What problems or needs are not addressed when the user is attempting to settle their recipes using the system?

○ Specific Recruiting and Diversity Criteria

The participants for this test are aged between 14-85.

Non-gender regardless. They have experienced using some cooking application.

In addition, these are the diversity criteria as below.

- Test participants should have a mobile device.

Test Component

Note Taking (laptop)
Audio Recorder
User Test Plan
Tasks
Consent Form
Wireframes
Script
Post-Test Questions

The Sequence of Test Activities

Consent Form
Pre-test Interview
Task 1
Task 2
Task 3
Thank Participants
Post-Test Questionnaire

Consent Form

Logging Sheet

Micro-Usability Test Plan - User Test Script

Pre-test Check List

Double-check that all dates in the task are in the future
Fill in all blanks with the name of the app (all documents, including the test plan, test script, and informed consent form)
Go through all of the tasks before performing the test
Print out the task for the user
Print out each task for the user
Print out a post-test questionnaire
Print out or type into the logging sheet
Print out the user script
Record when the test begins

Pre-test questionnaire

1. Have you used a cooking application?

2. How often do you use them?

3. What source do you use most?

4. What is the most important when you will use the applications?

5. What frustrations do you have when using recipes as a reference?

6. What features would you like to see in a recipe app?

Task Instructions

Print tasks and present them, one at a time. Read each task aloud and give the printed sheet to the participant. Make notes of successes and failures while the user performs the test.

Task 1

Task 2

Set it to see the result you want.

Task 3

Finish it from searching and see the result.

Task 4

Change the unit of measurement.

Task 5

Go to "Thread" and "Dictionary".

Post-test Check List

Keep recording when the post-testing
Stop recording, save audio and video
Save informed consent form
Save logging sheet

Debriefing

The focus of the debrief is to walk through any problems that were encountered during the tasks. If any time remains afterward, ask higher-level questions 2-5.

1. Review parts of the test where the user struggled:

(Examples)

What difficulties did you have on ____?
I noticed you struggled with____, can you tell me what happened?
You paused here, tell me more about that.

2. Preferences: What did you think about the app? What did you like/dislike?

3. Changes: If you had 3 enhancements to make this better for you, what would they be? Why?

4. Understanding: How would you describe this to a friend?

5. Use Cases: Under what circumstances would you use this? Why?

User Test Script

Moderator (with a big smile!): Thanks for coming in today! We’re constantly trying to improve our product, and getting your frank feedback is a really important part of that.

The goal for today’s session is to test the application - Conciemange. I’m here to learn from you so I’ll ask a lot of questions, but I’m not testing you. There are no right or wrong answers.

I’ll start this session by asking some background questions. Then I’ll show you some things we’re working on, and ask you to do some tasks. As you work on the tasks, please think aloud.

This means that you should try to give a running commentary on what you're doing as you work through the tasks. Tell me what you're trying to do and how you think you can do it. If you get confused or don't understand something, please tell me. If you see things you like, tell me that too. I want to emphasize that, you won’t hurt my feelings by telling me what you think. In fact, frank, candid feedback is the most helpful.

If you do get stuck, I’m going to try not to answer your questions or tell you what to do. I’m just trying to see what you would do if you were using it on your own.

But don’t worry-- I’ll help you if you get completely stuck. Do you have any questions before we begin?

Consent Form

A present consent form, summarize and receive a signature from test participant.

Conclusion

I think that's all the questions I have for you. I want to leave a little bit of time to

see if you have any questions for me about the website, test, or anything like that.

Okay. Then I just want to say thank you very much for participating, and if you

have any follow-up questions please let me know and we really appreciate your

time. Thank you!!

Post-Questionnaire

Provide the post-test questionnaire to the user at the end of the user test.

For the post-test questionnaire, we will administer the standard SUS questionnaire on paper.

The form should be printed out before each session.

User Test, Mid-prototype

Create Med- Prototype/ Prototype Screens

Before Testing

Survey

User Testing

The target population: 4

Recruitment method: I asked my roommates. I asked a friend of mine who seemed to make a fair decision.

Analysis methods: Interview, Questionnaire, Think-Aloud, Debrief Question, Morae.

Conduct Heuristic Evaluation/ Prioritized List

After Testing

Final UI & What's next

What's next

I used a lot of colors in this UI because the target of this app is wide and I wanted to make it easy to understand for people of all ages. However, I felt that it could be a little simpler.
The feature of this app is that both right-handed and left-handed people can use it in the same way. This is one of the points I want to focus on in my UI/UX.