Homework： Enlist a friend (or 2) to spend 10 (?) minutes using an app while you record them using it. Don’t tell them anything about the software, just the process, that you will turn on a screen recorder, record what they do and say for ten minutes and then ask them some post-experience questions. Reassure them this has nothing to do with them personally; it is not a test of their abilities or intelligence or anything else. This is just about the software and there are many testers contributing data so no pressure of any kind. Remind them to speak freely as they use the software.

After the recording, do a post-engagement review: play the video back and ask the participant to comment whenever they feel like it. Stop the video where they want to speak and record what they said and where they said it.

Post-engagement interview — how did they feel about the whole experience. Have they any advice for you? You will not use any of this advice in subsequent iterations of this test unless what they found is a fatal flaw. You want each iteration to be done in an identical fashion. But you also want to learn over time so the next time you do something like this, use what they taught you.

Goal： to test if a mobile website is accessible and user-friendly that lets Chinese users and a few American Chinese food lovers order meals from the food website on their mobile phones quickly and easily at their convenience.

YiFan is a Chinese food restaurant nestled in the heart of Johns Creek in Atlanta, which offers fusion cuisine.

It offers a pick-up food ordering service through the website https://qmenu.us/#/yifan/menu/1645135062215.

 

Usability test：

1. I recruited 4 participants who have some experience with ordering Chinese food via online platforms including 2 friends, my husband,1 schoolmate in GSU, and 1 student at an American University.

To truly understand the needs, behaviors, and motivations of the users I’m designing for, my research identified 2 pain points:

1). Ease of Use

2). Time

2. I used Zoom & Tencent Meetings to record them how to use the website to order their favorite 5 dishes for the Lunar Chinese New Year’s Eve in 10 minutes！
3. I conducted an online interview afterwards to ask them 16 questions about the positives and negatives of using this food mobile website.

Before the usability test：

I told them these instructions clearly and asked them to think aloud while doing the tasks. The think-aloud technique was used to extract information about the users’ thought processes during the task.

“Please take 10 minutes to order your favorite 5 Chinese dishes for Lunar New Year’s Eve on this food ordering website. You need to log in to the website using the Chrome search engine on your laptop. But you need to click toggle device toolbar mode (Ctrl+Shift+M) so it can show the mobile menu mode on your laptop, as it is convenient for me to see how you click and scroll down the menu with the recorder. This is for my user experience research need instead of for commercial use.”

1. You don’t have to go through the full process of buying them. Just order 5 dishes and put them in the shopping cart then cancel.
2. When you browse the website, feel free to speak out loud about your positive or negative feelings towards any button, image, tag, or any other design element on the website, which will be helpful for my research.”

During the usability test:

Task 1: Go to the site https://qmenu.us/#/yifan/menu/1645135062215. Task 2: View the Menu Scroll down to the bottom of the main page to find the necessary information on the menu.

Task 3: Find their favorite dishes Find the “menu category”, and choose 5 favorite dishes for Lunar New Year’s Eve.

Task 4: Put dishes in the cart Put 5 dishes in the cart and click on “Check-out”.

 

Task Time and Completion outcome:

The average task time of 4 participants, the number of problems per task on average, and the task completion of the 4 participants are described in the following table.

Participant 1 Task completion

Participant 2 Task completion

Participant 3 Task completion

Participant 4 Task completion

 

After finishing the task of ordering the dishes:

I evaluated the usability of the website by interviewing each of them with these questions and made a summary of their opinions.

Interview Questionnaire:

1. How easy is the website to navigate and search?
2. Does each food title make sense?
3. Do you think the Chinese and English fonts are big enough to see?
4. Do you think the main color of the food website is visually appealing?
5. Does the food description help?
6. Is each photo large enough to see?
7. Can you find your favorite dish quickly？
8. Do you think it is easy for you to put the dishes in the cart and be ready to check out？
9. Could you rate it on a scale from 1 to 10? How much do you like the food delivery website?
10. How much do you dislike the food delivery website?
11. What do you care about most in the food ordering process?
12. Do you think it is well-organized？
13. Do you think it is user-friendly?
14. What challenges do you face in the ordering process? How does this make you feel?
15. Is there any way in which you feel these challenges could be resolved?
16. How do you think the website can be improved in web design and interaction?

 

Based on the test answers the strengths of the website were:

1. The website is somewhat easy to use and follow. The rating from 4 users on average is 6.8 which means it can meet basic users’ need for ordering dishes. (2 females give ratings of 8 and 8.8 respectively, while 2 males having experience with website setup give ratings of 5 and 5.5 respectively.)
2. The color of the food website is generally visually appealing despite that the white background with red logos lacks innovation.
3. It is very convenient for all the participants to put the dishes in the cart and click on the checkout button.
4. Most of them can find their 5 favorite dishes on the website in 10 min, although 1 person uses more than 10 minutes and complains the menu lacks any vegetable dishes and ones for vegetarians and vegans.

 

The main problems of the website were:

1. The website is not so easy to navigate and users cannot find dishes very quickly without the help of a moderator. On average, they need to spend 7 minutes and 57 seconds to find 5 dishes, because the users cannot find the grey “category” button on the bottom of the main page very easily.
2. Some food titles are too complicated for most users (3/4) to comprehend because there are some very difficult and are Chinese words to recognize and pronounce like “燎” in the title of Stir-Fry Abalone with Asparagus.
3. Some Chinese and English fonts are big enough to see but for some Chinese food descriptions are too small to read and the price tags are not obvious to see at all.
   
4. Food pictures and Chinese/English fonts are not very placed in an orderly arrangement.
   
5. Although the food description in the smaller fond helps to some extent, some information like the weight and size of the crabs is missing in Yolk Salt& Pepper Dungeness Crab. And not all the dish has detailed food descriptions.

For instance, in Stir-Fry Abalone with Asparagus, there are no labels about the weight of the main ingredients of abalone and clients cannot know whether it is spicy or contains any allergic food ingredients.

6. Some food photos are not large enough to see as they are not panoramic views of the food and most of them are not authentic food they made (just downloaded from other food websites.) 
7. Half of the participants say they cannot find their favorite dish so quickly due to a lack of searching tools and no clear category button on the website. So it is not so well-organized and user-friendly.

8. In Featured Items, there are two repeated pictures of the rice.

 

Expected improvement for the food Mobile Web according to users’ feedback

1. Add breaking up of appetizers（cold Chinese dishes）, entrees (main dishes), side dishes, desserts, soup, salad, vegetarian food, vegan food, gluten-free, and halal food on a category on the top of the home page.
2. Add distance between the pick-up spot and the client.
3. Add on-site search and search filtering options like recommended dishes,  recently viewed dishes, and most sold dishes！
4. Change some Chinese food titles to easy ones without any complicated Chinese characters.
5. Put Chinese and English fonts in two different rows to make them clearer and put the food pictures just on the left side below each tile.  
   
6. In terms of texts, only make the food name and the price bolder and obvious to see. The price should be in red rather than the package information as some users care about the prices of the dishes the most！
   
7. Only make detailed food ingredient descriptions visible on the separate specific items page after they click on the title of the food to make them clearer.

For instance, in Stir-Fry Abalone with Asparagus, add descriptions about the weight of the main ingredients abalone on the specific items page and add flavor tags to let users know whether it is spicy or contains any allergic food source.

8. Invite some professional photographers to take delicate panoramic food photos made by YiFan restaurant to replace some fake ones from other food websites. Users may first pay attention to the food pictures and then to the titles as a picture is worth a thousand words.  Make sure that the food images are real otherwise the dishes may disappoint the clients after being served.  For instance, the Red Kidney Beans Chestnut& Stewed Duck Pot photo should have shown the full view of the duck. The image should have been more visually appealing taken by photographers who should have placed the dish on the beautiful tablecloth and used bright lighting. Clear and fantastic pictures can enhance clients’ appetite and help them to order the dishes more quickly.

Besides, the first picture on the top of the menu should be a real photo of the fantastic restaurant environment of YiFan instead of a chicken picture from another restaurant.

9. In Featured Items, delete repeated pictures of the rice and add more popular vegetable dishes.
10. Add typical Chinese food like dumplings on the menu, because Chinese people have the custom of eating dumplings on Lunar New Year because the dumplings themselves look like money pouches and are said to represent fortune and prosperity in the coming year.
11. Add coupon or discount information for the new user on the top of the menu to attract the first users.
12. Add ratings next to the food title using the number from 1 to 5 or label how much percentage of people like it. Add tags like Top Offer next to the dishes that are extremely popular as the users who see these tags may follow the trend to order the dishes.
13. Add tags about flavor below the food titles (typical flavor: savory, spicy, sour, sweet).
14. Add a food review at the bottom of the page.

 

Summary:

YiFan’s overall online Mobile Website UX performance is mediocre. It can meet basic needs for users to find the main meat dishes for pick up! However, they cannot choose what are their favorite dishes in a short time and cannot meet their diverse needs such as food choices for appetizers, vegetables, and dumplings for the festival. Their UX is especially thwarted by usability issues related to unclear and not panoramic food pictures, poor navigation categories, and no searching tools.