Ongoing Passion Project: Spill the Boba Tea

How Asian Are you? Boba is Not Just a Drink, but a Means to Identify Yourself

Passion Project
Role
Tools
Keywords
On going project
New York, NY
January 2021 - May 2021/ 4 months
Designer and dev—
discovery, user research, design, testing, development
Figma / Miro / JavaScript
Pencil / Sketches
#data visualization
#asian identity
#stop asian hate

Boba tea, as simple as a drink can become a rallying focal point for a subset of the Asian immigrant community.

Over the past 30 years, bubble tea in America has gone from a niche Taiwanese beverage to a mainstream iconic cultural symbol for Asian Americans. Bubble tea (often called Boba among Asian Americans) is an exciting blend of texture and flavor for the palate from Taiwan. It is a milk-based tea with chewy tapioca pearls inside. The word boba has become so widely used in this community socially as a controversial noun in the discussion of defying unique cultural traits for immigrants. This data visualization, which consists of multiple data sources and charts, is intended to explore and visualize the reasons behind the popularity of boba.

Data Source
- Personal Data: Boba tea order history
- 2500 drinks from 58 boba tea shops of NYC
- 2560 posts about boba tea of nyc on instagram
- 549 tweets talking about boba and identity with hash tags#boba and #identity on twitter

Impact of project: Project been selected to participate the Parsons Festival!

Project featured on Sheila C. Johnson Design Center's Windows during summer! Unfortunately, I wasn't been able to return to Parsons campus during that time

Project Explain in Video

Background
Anti-Asian hate crimes rose 339% nationwide last year, I want to be a voice for the Asian community

Recently the resurgence of explicit, often violent racism towards Asian Americans has triggered people to look beyond the framework of their own growth and interpret their "Asian-ness" objectively from the outside. I want to explore Asian Identity from the familiar things around the community and give a voice to the Asian American group.

I immediately thought of the drink we used to drink frequently and got a new name in the states: boba

The word boba has become so widely used in this community socially. Asian immigrants hang out at boba tea shops and joke that “How Asian are you if you don’t like boba?” It brings them together and gives them something that constitutes a commonly shared experience

This project is to raise awareness of the struggles that immigrants face lifelong for everybody not only Asian immigrants

Outcome: the Story of Boba

Part One: My drinking habits and How does a simple drink become “the boba”

My boba aria during covid

-  For the past year, my roommate, an Asian American, and I, ordered 100 cups of boba. Drinks in hand, We joked about our common strict asian parents, lactose intolerance and what to order next time. 

Boba from Taiwan to the States

- Born in Taiwan in the 1980s Boba tea began its journey with immigrants, First seen in Los A before taking the country by storm,

Part Two: Why does boba become popular

Customizable

2500 drinks from 58 boba tea shops

- Atomize the data from the menu, A dot represents a line The novelty never wears off, boba keeps evolving with new interests which has a lot of room for customization to keep a larger audience.

Instagramable

2560 posts about boba tea of nyc on instagram

boba is definitely a social drink, inviting others to join in the trend to stay connectedLayered matcha milk tea inviting customers to share its unique appealing appearance through social media.

Boba associated with identity of asian immigrants

549 tweets talking about boba and identity

-.Boba brings immigrants together during their younger years as they try to find their place in society.

-.On the other hand: boba is too shallow of a measurement of all asian identity, likened to the often ridiculed “boba liberals”: Looks sweet and well-presented, but no real glow, for asian culture traits.

Overall, it's a matter of how people define who they are and who they will be

Boba with its simple ingredients and strong social media presence is a cultural object that is readily adopted by generations of Asian Americans, But at some point in their lives, people graduated from the boba life.

On going project it is...

01. Concept Research

Desktop Research

Can Boba repesent Asian American Identity?

This project ventured into the field of cultural studies, so I went through the process from study idea to collect data, to design and development, and I read a lot of papers on asian American identity.  By reading about boba and cultural identity,  I find that boba tea is pop-cultural imagery that is hard to ignore when discussing contemporary Asian American cultural identity. So can I state that boba represents Asian Americans?

Survey

15.2% vs. 95.8%: "Boba tea shop is the meeting spot for me and my friend"

In order to understand the experiences and opinions of asian, especially asian Americans, about boba tea.,I designed a survey, including 20 questions to find out the drinking habits and perceptions of boba tea among the Asian American community aged 18-35.  As you can see, it is difficult to define the meaning of boba in the Asian community. I decided to use data to help me find the answer. And it did in turn help me to prove and correct some of my existing concepts.

Unpack vague cultural topic....

How might I visualize such a complex  identity topic and making it resonate with the public not limited to Asians ?

02. Data

Find the proper data source

Start from a dozen of api sources

Because there has been a lot of California-based boba tea industry research, for this project I am collecting data on the local milk tea market from the city where I live: New York. Therefore I can bypass subjective ideas and use objective data to explain why boba tea becomes popular among Asian Americans? 

Source 1: My boba tea drinking habits
I collected the takeaway orders between March 2020 and March 2021 from 6 different milk tea stores. The actual number of boba tea purchases is higher than what the data shows because offline purchases are not included.
Source 2: Menu of randomized 30 boba tea shops of NYC
I have included a list of 1500 boba tea orders. Then I manually tag them. Format, Liquid base add-on, and Toppings. 
Source 3: Post of Boba tea from Instagram
I got the most recent 10,000 posts with hashtags #boba as of April 8. In geolocation, I further filtered the posts sent from within the US and there were 2451 posts.
Source 4: Twitter discussions of boba tea
I searched for keywords #boba, #identity and got 3589 tweets, and by using the prebuilt library LDA.js, I was able to extract keywords by cluster to quickly summarize the main content of a bunch of tweets
Clean data ready for design

Re-categorize data

Each tea shop has its own naming principle, it is not very efficient to just follow the information shown on the menu. So, I further categorized and merged these categories into general categories

Crop content

the existing color extraction tends to extract background color as the biggest color block, so i cleans and extracts the beverage part.

Re-render tweets

the terms “boba” and “identity” appearing too frequently, so these two original search terms were deleted from the result

03. Ideation

Design Principle

Objectivity

Staying true to the facts on cultural issues does not instill any of  the author's subjective ideas

Clearity

Sort through complex information and interact well

Fun and playfulness

The overall visual also lean towards interactive and playful to fit the pop culture characteristics of boba tea. 

Educational

If possible, the design  should be content appealing and thus hopefully resonates with the public

Wireframing

Iteratively improve the flow and visual details

Multiple rounds of iterations revolved around different aspects, including Narrative, data vis accuracy, and visual presentation. This was all done by absorbing test feedback between 15 designers and users

Key Design Decisions

:)

Next,  design details will be explained from aspects such as layout and visuals

01/
Layout and flow

Long data vis narrative vs self explore

Original Design: long scrolling page Like an academic paper. Trying to tell all the details
My original design was to scroll through an article like an essay and let the audience understand the development of boba tea in the immigrant community. But I quickly discovered the problem with this through testing: because everyone has a different level of knowledge about boba tea and its cultural connotations, I had to start with the basics of what boba tea is. This would cause some viewers to quickly lose interest as they scrolled alone
"Not quite sure what's my focus on this visualization"
"It is kinda plain with many repetitive information"
Updated:Divided into several parts with clear navitgations
So I accepted the feedback from other designers and viewers, I only keep the basic information, hide the same type of content, and let users to explore. at the same time, divided the long page into 4 separate sections. let the whole layout at a glance become more effective.
02/
Visual Format

How to present customization?

Visualize in a smarter way
One of the most important reasons for the popularity of Boba tea is the customizability of its elements. Toppings, drink bases, flavors are all freely available, even those options that do not appear on the menu. At this level it is becoming more and more accessible to people. How to show this customization is my task here.
Refine: added bar chart to show detailed composition
Turn each option on the menu into a dot, and dots move with each other to gradually blend together, visually displaying the customization of each element
03/
Refine Visual Language

The journey of a cup of spilled boba tea

Hand drawn main visuals for landing Section:
Color palette extracted from vivid mood board
By choosing food as the main theme, I want to present a gentle but warm color collision, representing the diversity of pearl milk tea flavors and its active presence on social media. in order to avoid visual over-busy, the main colors were extracted from the milk tea which are white, orange, and black. In the data visualization piece, 8 colors were selected for a collision of tropical vivid life. 
This is a ongoing project call for devs and stories collaborations:
I am collecting people's memories related to boba to make a cultural boba map with common memories.
This map is different from a food map like yelp, because boba is closely related to the memories of asian immigrants. I want to use the theme of boba tea to remind people within the asian community of the cultural bond and to let others understand the long life story of immigrants adapting, integrating and developing in a strange land

Reflection

Don't take anything for granted before you look closer and try to understand

This work is a combination of objective and subjective work. After I had a preconceived general theme, I collected the corresponding data to create the expression. In this process, subjectivity may take over and affect the accuracy of the entire data vis work.
When I decided to start researching boba as my thesis, from an outsider's point of view, I kept presuming Boba helped Asian Americans to form their own identity as an immigrant minority. The more I researched, the more I realized the struggle and effort that immigrants have with cultural identity in their new environment. 

More Case Studies