Minjun Chen
Artboard.jpg

Menuet

Mobile, IOS Design

 

Menuet

Menuet is a mobile app providing a two-way translation for travelers as well as offering personalized recommendations based on their food profiles that will empower travelers to feel taken care of when dining in foreign countries.

 

Type | Side Project, April-June 2018 

My Role | User Interviews, Competitive Analysis, Prototyping, Usability Testing, Illustration

Team | Minjun Chen, Will Wang

 

Context

 

Our initial idea for this side project came from our personal dining experience.

As international students who are less familiar with the language, we found difficulties understanding restaurant menus when dining out. This problem results in a frustrating dining experience: what we order are not what we expected. More generally, when we discuss this with our friends who share the same background with us, they have the same issues.

 

The Challenge

HMW.jpg
 

The Solution

 
 
Translate Card 2.gif

FEATURE 1

Translate Menu and Order Request 

Understand the menu in your native language and get help with your order to the waiter by translating your order card into the local language. 

 
 
 

FEATURE 2

Eat around the world safely 

Create a personal food profile based on your dietary restrictions and food allergies and apply this these information to menus and dish descriptions.

Food Profile 2.gif
 
 
 
AR 2.gif

Feature 3

Preview your food before order

View a gallery of pictures for menu items and use augmented reality to see the ingredients and portion sizes of your dishes before you order 

 
 
 
Explore 2.gif

Feature 4

Discover local food nearby

Explore local food based on your real-time location.

 
 
  1. Travelers have to switch between different applications to translate menus and communicate with waiters when dining abroad. Menuet is trying to fill in the gaps by providing all of those services in one app.

  2. Existing food and restaurant applications focus on the post-dining experiences for general users who want to find a place to eat. Menuet ships digital experiences that address offline dining experiences for international travelers. 

  3. In most visited countries, restaurants provide "tourist versions" of their menus which have many limitations, including poor translation, higher dish price, and inconsistent and poor quality of images. Menuet is partnered with local restaurants to provide appropriate translations, fair prices and suggest dishes which contain allergens based on individual food preferences.

Why Menuet over other applications?

 

 

Research Process

 

User Research

We conducted a few user research studies to help us understand travelers’ needs and pain points.

The first- round of user interviews helped us narrow down the target user group to international travelers. The second - round of user interviews helped us discover problems travelers generally face when dining overseas. Competitive analysis enabled us find design opportunities where we can provide better experiences for our users. Secondary research gave us valuable knowledge of traveler’s behaviors and dining trends.

research activity.jpg
 

Research Insights

 
menu.png

1. Text-based menus don’t necessarily help travelers make a decision, especially when dining in the situations that are outside their familiar languages and typical food cultures.

“ Sometimes it is hard for me to decide without looking at the photos, especially the cuisine is the one I am not super familiar with. ” - Participant 18

food allergies.png

2. Travelers feel included when dietary, food allergies, as well as cultural and religious needs are being considered.

“It is a challenging for me because since the fact that I am vegetarian, so it's like not a lot of places have the vegetarian option” - Participant 25

 
local.png

3. Travelers will fallback on gestures and body languages when ordering food with the wait staff under the language barrier.

“I saw the local person ate a dishes, I just pointed out that dishes.” - Participant 9

gesture.png

4. Travelers will seek out specialities and authenticity.

“It is really once in the lifetime opportunity to try some authentic and local in a certain country or in a certain city.” - Participant 3

 
local opinion.png

5. Travelers rely on local opinions and recommendations to guide their decision making.

“I like to ask the waiter, it is very important to have the local opinions for sure. We need a guide or a friend who is local to recommend something” - Participant 20

communicate.png

6. Modern technology helps travelers to better experience local cultures by providing tools such as language translation and information search, but it cannot completely replace the role local people play in offering authentic local knowledge and human interaction.

Technology is an aid to foster in-depth interactions between travelers who would not be able to communicate with each other due to key cultural boundaries.” — Participant 26

 

 

Design Process

 

I developed this storyboard to depict an archetypal traveler’s dining experience and map out a few major pain points he/she might have.

He/she might have trouble in understanding menus in local languages, difficulty in communicating with the waiter, etc. These language barriers might further result in a bad dining experience—what you order is not what you expect. This might be worse when you are traveling with food allergies or dietary restrictions. 

Storyboard

storayboard3.jpg
 

Ideation

We challenged ourselves to generate as many ideas as we can using one of Design Sprint’s methods—Crazy 8’s.

During each 8 minute session, we roughly sketched out ideas that corresponded to each pain point. We narrowed our ideas down into several concepts and organized them into interaction flows that informed our paper prototype. 

5b5cd59a89ff9ced5d24328b_Ideation-Map-Full-Res.jpg
 

Paper Prototype

We designed the paper prototype to achieve our initial goal of helping travelers understand menus and communicate with waiters. Our paper prototype can be divided into four parts: on-boarding, view and add dishes, communicate with waiters, and user profile. We found both conceptual issues and usability issues from the initial user testing:

Usability issue:

  • Overwhelming filters for people to choose their dishes

  •  Too much many effort required for the on-boarding process 

Conceptual issue:

  • Not knowing the key value prop of the app.

  • Be frustrating at some moments.

 
 
 

Wireframe

 

High-Fidelity Prototype 

Two flows that we struggled with a lot but eventually reached the solutions were: a local food exploration flow and a dish list translation flow. We iterated on these two flows several times based on user feedback from usability testings. Here are two design challenges we tried to address during the iterative process:

  1. Map improvement

  2. Empty state situation

 

Case Study: Explore Local Food

I made the assumption that travelers actually need information about local food rather than restaurants to make a decision. User research informed us that travelers cared about (in order):

  1. what kind of local food travelers are interested in

  2. Which restaurant provides this type of local food 

We already used users’ location-based data to identify which restaurant they are dining out at. I asked myself why not use their live location to provide travelers with personalized information about local food? Based on these, I came up with a fundamentally different flow which allows users to find local food nearby and then find the restaurant that provides this type of food. Below you can scroll through a number of variations we explored for displaying local food and restaurant information in the Explore page in earlier stages.

Explore Local Food.jpg
 
 

Final Design

On the home screen level, each type of local food is displayed as a “card”. We wanted to highlight local food through this visual presentation. We provided a variety of images and the information about ingredients of each local food when users tap on each card. On the food detail page, users are able to scroll down to see a list of restaurants nearby. A visual cue close to the restaurant list allows users to use the map to see their current location and the restaurant location. We tested this 2-step Explore feature with users. As expected, users liked this solution to find local food.

map.jpg
 

Case study: Dish List and Translation 

cast study 2.jpg
 
 

Final Design 

We highlighted the core function of adding and translating dishes by merging two categories of  the navigation menu into one general category “Eat” that enables users to browse, add and translate dishes in a consistent way. Inspired by the Now Playing screens of Apple and Spotify, we designed the “view order list” button that would appear after adding dishes to the order list, which made it easier for users to switch between the Menu page and the Translate Order list page.

final translation.jpg
 

Color

Inspired by current food and restaurant apps, we chose warm-tone color palettes to speak to promote an atmosphere that is appetizing, flavorful, and welcoming. I complemented our orange with red as our grounding elements, which allow for customization, keeping our app fresh and dynamic. 

Visual Design

color.jpg
 
 

Avatar 

I specifically illustrated this unique avatar to breathe life into our product. Like the travelers’ local foodie friend and interpreter in their pocket, the avatar has its own personality and creates an emotional connection between travelers and our product.

avatar 11.46.21.jpg
 
 

Illustration

I designed these illustrations to make our app entertaining, captivating and fun. All illustrations were created in a flat style and used the warm shades and colors, providing consistency to our visual identity and reinforcing our branding.

illustration.jpg
 

Final Prototype

 

We presented Menuet to restaurant owners and entrepreneurs, and they thought our product could help grow their business on international customers.

Based on their feedback, we designed a varied web app for restaurant owners to gather business analytical information and manage menu information.

Outcome & Business Validation

dashboard.jpg
 

Points which are not covered in this project but could be worth discussing in person:

  • Accessibility

  • GPS accuracy & location intelligence

  • Browse Navigation 

  • Content browsing

  • The on-boarding Flow

  • Business Model & Plan

Additional discussion