The Museum of Vancouver (MOV) and the University of British Columbia (UBC) present a feature exhibition, A Seat at the Table, Chinese Immigration and British Columbia. It looks to food and restaurant culture as a narrative entry point to feature stories that reveal the great diversity of immigrant experience and of the communities immigrants develop.
The objective of our application is to create an experience for museum visitors to sample Chinese dialects spoken in China today. Our application features the 45 different Chinese dialects saying the phrase “Have You Eaten Yet?”, a common Chinese phrase that is used as a greeting similar to “How are you?” in English.
This project is part of the Museum of Vancouver’s exhibition titled: A Seat at the Table: Chinese Immigration and British Columbia which will run from April 2020 to January 2022
Graphic Design, User Experience/User Interface Designer.
- Researched various methods to UI/UX paradigms that could be translated into a digital application
- Rapid prototyped interface for a user interaction design using paper prototyping, digital mockups, and user testing.
- Design a series of UX Diagrams and storyboards for potential Interface directives and features that we are able to be implemented on time and exceeded the client’s expectations.
Our application, "Have You Eaten Yet?", will be loaded a few iPads located on one of three “dimsum-style” tables near the end
of the exhibit. The table is represented by Language-related experiences. In the centre of the
table will be an antique Chinese typewriter and samples of British Columbian Chinese-language newspapers.
1: Collected useful documentations and study materials that help the team to be familiar with the different dialects, and food dishes with the different regions in China, such as general design guidelines for Museum of Vancouver. And analyzed recorded audio and recorded more for the project.
2: Conducted User research interviews with MOV’s exhibition organizers to understand the user flow and space setup.
3: Created personas which identifies the user flow and to father information about what people would like to see how
Our team brainstorm a lot of different ideas to build this app, including teaching the different Chinese tones, the regions in China, and the famous food dishes from each Chinese Region.
1: Delivered creative and stimulating new ideas that was used in our current application
2: Produced weekly outputs for client review by using design thinking process and agile sprints.
3: Designed multiple UI options for our application.
Some images from our Design Sprint Sessions.
1: Created a series of user flows, wireframe and storyboards about the product feature in detail, to help technical team to understand better before building the digital prototype, which greatly saved the developing time.
2: Designed the application interface, which could improve the user flow and help them interact more intuitively as well as user-friendly.
3: Revised design documentation throughout the process when moving forward with ideas that were decided upon.
Major Decisions for the User Experience
1. Expanding Regional Representation: There are a total of 34 regions. We decided to get one voice recording for each region.The Museum of Vancouver
provided us with 34 sound files, from 16 different regions in China. We decided to expand our sound bites
to have files from all 34 provinces and various autonomous regions within China. This would provide a fuller
picture of the dialects that are spoken in China.
2. This is Not A Language Learning App: We briefly considered visualization of pitch and tonal changes. However, we moved away from this because
after discussion with the MOV, we all agreed that the goal of this project was not to teach attendees how
to speak Chinese, but simply to showcase the diversity of the language within various Chinese communities.
3. Dish Names & Visual: We chose to visualize with food as this exhibit installation is called A Seat at the Table and focuses
on Chinese Immigration to British Columbia. Food is a huge part of Chinese culture as well as Chinese
Immigrant culture specifically. Chinese food is incredibly diverse within China and being able to showcase
unique regional dishes alongside unique regional dialects provides us with the opportunity to present viewers
with a grander appreciation of Chinese culture, as well as maybe understanding what they’re ordering the next
time they go to eat Chinese food.
4. Text Transcription: In order to enhance accessibility and allow audio-impaired audiences to get a sense of the differences
between regional dialects, we decided to provide audio transcription with Mandarin, Cantonese and English
5. Map Artwork: In order to geographically locate each individual dialect within a tangible context,
a map was developed in order for users to navigate and interact with. After working on multiple
concept studies for this asset's art, concerning both style and colour palette, the team settled
with visuals in coherence with both the art style of the animations developed by the Map Groups
featured in the beginning of the exhibit, and also to the branding's colour palette. The final visual
style contemplates a watercolour textured map, with brush strokes and a subtle pastel colour palette.
Additional art for geographical features, such as trees & mountains were created in the format of icons,
in order to give life to this feature. They were based in accordance to China's actual geographical features.
6. Dish Artwork: We wanted to have an image of the dish we feature for each region. We debated and decided to go with
an illustration instead of a photograph. After the client confirmed and double checked our research, we
set to work on illustration. We chose a friendly, vectorized, icon-like style because we figured that that
would work best on a smaller medium of an iPad. But after multiple user tests, we received feedback that
the dishes were not detailed enough and that testers were unclear of what they were/what they were composed
of. With three designers on our team, we each had a unique style, and we found that people leaned more
towards a brushy, detailed look, that showcased the food in a more beautiful way. So we adjusted the other
illustrations to match this, making the dishes look as scrumptious as we could.
7. Text Blurbs: Amount of text and what to focus on - Origins of name? Ingredients?: We chose to focus on a short amount of information about the dish within the blurbs after getting so many
comments that people were curious about what the dish was. We settled on 20-40 word descriptions about the
preparation of the dish and what ingredients are used in it as many are unique to the various biomes of the
8. Adding Landmarks: Initially, to add flavour to our map, we considered adding unique landmarks for each region
and city we were showcasing dialects from. But there were several reasons why we could not
a: Map gets too busy and distracting
b: Including information on the landmarks would add too much text to our final design
and contribute to reading fatigue
We replaced the landmark icons with location pin icons. Each region has a pin at the featured city.
They are animated to show that they are clickable.
Initial Interface Design
Below are the interface design iterations of the Idle page, the map, and the food page.
Map Styles Design
One of the main features of our application is the map. The following is the process of designing the map style.
Pop up interface iterations
Below are icons, buttons, and food illustrations designed for the application.
Persona and User flow design
Throughout the process, we conducted several user tests during our process.
1: Generated the user test to get feedback of prototypes and digital mock-ups.
2: Conducted user tests by observing, screen-recording and taking notes during the test.
The test gathered valuable feedback to help influence the next iteration to achieve a more user-friendly design.
3: Delivered and organized the result data of the user test. Analyzed the data and presented a list
of proposed adjustments to the team and clients for enhancing the application and its’ features.
1: Designed and created the final assets for the final deliverables.
2: Contributed to writing the project documentation, which provides a guideline for design approaches of features and user experience.
3: Planned and produced information for the final project presentation for the client.
1:Showcasing 34 regional dialects in a meaningful and engaging way when a user may only spend 1-3 minutes using our app.
2: Balancing the visual elements of our app so as to not detract from the dialect audio. The audio recording is key to showcasing linguistic diversity, yet audio alone is not enough for users to make memorable distinctions between different Chinese-speaking regions, especially if users are not native Chinese speakers. Visuals must be carefully chosen to complement the audio and enhance the key takeaways of our app (see next section).
3: Keeping our art style consistent with the other student groups who are contributing work to this MOV exhibition.
What I’ve Learned
I felt fortunate to have the opportunity to work with my team on this Exhibition "A Seat at the Table: Chinese Immigration and British Columbia” for the Museum of Vancouver (MOV).
In the 4 months of the project, I’ve learned how to improve my hard skills through exploring different types of design thinking and user experience methodologies. I have also improved my soft skills such as improving communications within the team, our client and users of our product.
On top of improving my skills as a designer, I also learned a lot about the different Chinese food and dialect of each region!