Product Design, UX/UI Design
LunchBox allows on-campus student to access homemade food easily.
Understand the problem
It's hard to find home-made food to add to the limited food choices
Students at the university are facing the situation that they barely have time to cook and they mostly eat in restaurants on campus. However, they only have limited food choices. Some students have started to trade homemade food on Wechat (a social app) to their Wechat friends, which is very small amount of people. You have to know the person in order to buy food from him or her. We felt their was a needs to create a platform that helps students access homemade food.
The power of home-made food provider is underutilized
Students who study abroad are mostly comfortable with food style from their hometown. Many home-made food providers are from different parts in China and they are able to customize food for students. However, they don't know what the demand is. They were bothered by the question what to cook everyday.
User Research & Synthesis
Field Observation & Interviews
I observed and asked some students about their eating habit, especially their access to healthy foods, as well as their cooking habit. I found out that they like homemade food and they would likely to either buy food from other students or offer food to others, in order to save their own time and money.
• Students eat at the university student center usually buy a meal from on-campus restaurants. Most of the food is or contains fast food or snacks.
• Most of students at the university student center eat alone. They usually stay there for half hour.
• Students usually have personal preference of food everyday.
• Students are worried about the nutrition facts when talking about home-made food.
• There are also students who have passion on cooking. They sometimes spend time to cook complicated dishes or dessert, such as Moon-cake or Lady M cake. Other students would really want to have them, because there is nowhere they can buy them in Champaign-Urbana area.
• Students cooked too much food for themselves and have extra to share.
• Students said they were worried about the safety and clean.
• Students said how fast they can get the food is a key factor when they decide what to eat.
We should provide users feedback mechanism to inform food providers what they want to eat.
We should provide users a feedback mechanism to review food, for the purpose of keeping food clean and safe.
We should provide users nutrition information even it's hard for Chinese home-made food, at least gradient or so.
We should provide a way for users to get food easily and efficiently.
After clarifying needs and goals from targeting user group, what are other product features that provide smooth experience to use the product? I created a journey map to go through the whole process of using the product, which is the core to the lifecycle. I focused on three representative users' actions, thoughts and emotion on each stage, in order to discovered some opportunities so the product can better meet their intention on each stage fluently.
Lists of Features & Low-fi Design
We listed features that journey map and personas helped us defined and developed. We then transferred the feature list to user flows and the actual interface design. We want to provide a space for students to post their food and see others' posts. They can filter foods based on the nutrition, food type, available time / duration, delivery methods, etc. The food will be prioritized based on review and likes, which is a important feature for homemade food. In addition, we think this app can potentially become a social networking tool for the Chinese student community.
Fonts & Colors
1. How to assist user to find food based on their preference
Looking for unique food is such an important feature of this app. To assist user to find food of their best choices, I focused on sorting and filter options. Users can limit their choice load based on rankings or distance, further filter by food categories, available time, delivery methods, nutrition info, etc. To define the best way that helps get to their intents as quick as possible, I explored different ways to filter results. I ended up with the version only has a few necessary features on the top bar (an expandable bar), and the rest going to a filter page. This solution avoided horizontal scrolling, which is not a common user habit on mobile, and it avoided too many choices that cause cognitive overload.
Explorations of filters
2. How to help user make food choices fast
Result Listing Variations
Since there will be multiple information for one result, I expirmented with various layouts and compared alternatives to see which one made the crucial information stand out (I made assumption that title, images, price, review score and delivery methods were crucial information) and helped user to determine their food choices. I went with the last option with large picture and efficient use of space for text.
ways to reach out people who post food on their profiles;
a chat window provides a way that is easy to refer to the food post;
stored chat history
Making Nutrition Info clear
easy to search & add nutrition info when posting
show it on every post with visual representatives
automatically add consumed nutrition info to user's profile
3. How to assist users to meet people
During the interview, students said that they usually eat alone and would like to meet new people. There are some designated eat area in each building and they could inform others in the app if they would like to eat together and chat.
see where other people are located
see nearby people and other similar foodies
send invitations and ice-breaker stickers
View friends' recent food experience
4. How to privde second-time users fluent order experiences
It's less like other online shopping experience that user needs to add multiple items on their carts. Instead, user usually browse the Feeds page and order food right away.
Things I would do differently (Learnings)
Get user involved during concept development if possible
I went into design low-fi interfaces without gathering feedback. There was no way to continue design without knowing I was on the right track in terms of problem solving. I will at lease make sure to gather feedback after the first iteration of design.