Mockups featuring listening assessment and character selection screens.

The Race to Teochew

Who or What

CIM 3 | Intro to Video Games course project

Role

UX/UI Researcher & Designer, Illustrator, and Graphic Designer

Timeline

Jan 24th - Mar 14th 2021
2 months

The Race to Teochew is a language-learning RPG game that teaches basic Teochew grammar, vocabulary, and tones. This project aims to create a solution for the Teochew community, by creating a resource for my endangered heritage language as there are only a few active online resources. The Race To Teochew has enabled me to use my skills across disciplines and showcase my research methods in design and language acquisition.

background

Before you keep reading, what is Teochew? Teochew is a Chinese dialect (used very loosely in this context) that I speak and identify with. The Teochew identity is part of the Chinese diaspora that includes roughly 15 million speakers across South East Asia and in the Western hemisphere; and in fact most people are unable to understand or even know of it from China. Being Teochew is something I struggled with for the longest time since I didn’t understand it nor felt represented in most Asian communities and didn’t understand until I learned of a little club at UCLA called the Teochew Association.

It's no surprise that this project was calling out to me. As someone immersed in a multilingual environment, constantly exploring new apps and games, and with a knack for visual design and artistry, I couldn't resist diving into this endeavor. And guess what? I've even delved into research on Visual Design in Second Language Acquisition and How Duolingo's UI Keeps Us Hooked. You could say I'm totally hooked on language learning design.

This is my Visual Design in Second Language Acquisition presentation from UCI's 2020 Honors Transfer Council Conference.
This is my How Duolingo Keeps You Hooked presentation, presented at the 2020 Saddleback Psychology Symposium.

Problem

So, unless you can read Chinese, there aren’t many resources that exist for Teochew.

Good friend and founder Ty Eng Lim created Gaginang and worked on the What TC Say app alongside other community members. Learn Teochew with Ah-Boon on Github exists and there’s the theteochewstore.org. With the aside of many YouTube videos scattered across topics, there is no centralized or consistent language learning resource for Teochew. And nearly all, if not most, is community-generated.

But if it’s a kind of Chinese, isn’t it available in China?

Yeah, but it’s more complicated than that for so many reasons. And since there’s no standard writing system, various resources aren’t accessible to everyone regardless. This discouraged me for the longest time, so the simple ask was — can I at least make it fun?

research

This is a big task, so I broke it into 4 main categories:

This image shows the competitive analysis between Duolingo, Babbel, and Rosetta Stone based on personally established topics.

I graded Duolingo, Babbel, and Rosetta Stone based on their popularity and running ads (marketing = money, thus people are willing to invest)

  • Duolingo: Its gamification mechanisms go unparalleled with other language learning applications
  • Babbel: Great coverage across all kinds of practice with SRS methodology and teaching to exercise ratio
  • Rosetta Stone: Speaking emphasis provided visuals matching speech production and practice of it

I also looked to Clozemaster, Lingvist, Mango Languages, and Pimsleur for inspiration

Competitive Analysis Finding

Language learning needs to give users agency, be customizable to one’s preference and reason for learning, and obvious

Online Teochew Resources

  • What TC Say: a phrasebook + dictionary app
  • Learn Teochew with Ah-Boon: a guide or reference website to grammar
  • Mogher: An online dictionary and database of characters, idioms and more

Video Games

  • Pokemon: battle UI + general RPG inspiration
  • Genshin: great cast of characters + mechanics to keep players playing
  • Children of Light Sky: character design + nostalgic vibes
  • Super Smash Bros. Ultimate: ability to review character fight styles

The Gamification of Things

  • Korean Dungeon: learning Korean vocabulary
  • Habitica: leveling up your to do lists and habits
  • Ring Fit Adventure: weight loss, exercise, and health
This shows a lot of the sketches and written competitive analysis in tandem with early  character development and notes of inspiration.

putting it all together

I knew what I wanted and what I liked. But I needed to ground this learning experience to something, and I then remembered the story of how the Chinese zodiac animals came to be. Basically, a bunch of animals raced one another to be in the final 12. I don’t know the full story but I was able to adjust it to “journey to Dio Sua” or “Swatow” inspired by the great Monkey King’s “Journey to the West”.

Once I did all this research, I established two main goals:

Goal 1

Learn Basic Teochew: The main goal of this application as a means to teach the language and to preserve it.

Goal 2

Cross a river inspired by the Chinese Zodiac story: The ultimate narrative aspect that will carry the learning in a fun and engaging way.

what does it mean

what makes it a game?

This may seem like a moniker issue, but at it’s core, what is it? Duolingo is an app, regardless of its gamification components. Genshin Impact is a MMORPG game. Korean Dungeon and Ring Fit Adventure have enough components in their environments to be considered a game and n these two gamified experiences, you have your metaphorical journey and your literal journey. Both stories aim to fight off a boss or foe to reach the end goal of saving the world. By taking on your metaphorical quests and checkpoints that test your literal abilities, you are able to progress towards both goals simultaneously.

This image shows a screen recording showing how the real person is exercising while fighting the opponent.

The Metaphor of Ring Fit Adventure

The metaphorical journey’s motivation and purpose leads you to progress towards your actual goal whether it be in language learning, or in Ring Fit's case, weight loss.

Therefore, I needed to be able to strengthen my story with a clear cast of “good guys” and “bad guys” that will lead you to learn Teochew and finish the race.

This image shows some of the more final art of the dummy and bear opponent.
This image shows the sketch of all 12 characters for the game. I was taking a Character Design class at the time too :)

so how do you learn from a game

The best way to learn is through consistent and constant assessment. Constant assessment allows the reinforcement of learning concepts while unlearning any errors during the learning experience. Which led me to remembering how annoying Pokemon is with its incessant battles as you walk along any patch of grass. But this nonstop barrage of engagements with foes was the kind of assessment players needed to get practice and learning in.

And so, I created a general storyline and cast of characters with heavy influence from RPG gameplay. This permitted me to begin basic wireframes and the development of lo-fi frames.

This image shows the hand-drawn wireframes as well as some scribbled notes considering the user flow.
This image shows the digitized low fidelity frames after sketching out the wireframes.

I was at a good start and had a sense of where I was going. But like any journey, when things get convoluted, you start asking yourself why.

overcoming obstacles & insight

Why Should You Keep Going?

While I did discover how games kept players playing and what differentiates a game from an app, I needed to discover what’s my why for Race to Teochew. Most learning experiences become discouraging when receiving feedback of failure or making mistakes. And since Teochew is wildly different than so many languages, how do I keep learners from giving up the journey of learning Teochew and racing towards it?

insight

Something I wanted to implement but was unsure how, was the Spaced Repetition System. I knew how my exercises were to be delivered, but I didn’t know how to approach adding flashcards all of a sudden. But just like any RPG game, you would also feel discouraged if you can’t beat your opponent.

So what if there was a fail-safe solution? Kind of like a Free! Bingo spot.
This image shows the low fidelity frames of the solution with the new flashcard button using spaced repetition.

I developed a fifth button that would guarantee an attack regardless if you got it right or wrong. This addition valued giving the learner agency above all else. An opportunity to be honest if they really were learning the language, since that’s the core purpose of engaging with the game.

solution

Visual Identity: Influenced by the bright colors of language learning apps and keeping it fun and simulating, it brings a modern twist to a fantasy approach for this concept.
Character Selection: Allowing users to choose characters based on birth year give a sense of identity and relatability to their in-game character, like your horoscope or MBTI.
Giving Users Agency: Allowing users to choose which practices they want to focus on, personalize their journey while improving on aspects of the language they want to focus on.
Review to Race On: Whether to focus more on learning or engage more with the game aspects, self-guided reviews permit constant assessment to improve language learning and retention.

Key Takeaways

  • All kinds of stakeholders are involved to tell a convincing story through gameplay
  • Story and world-building are challenging and essential to a cohesive gaming experience

With more time, I would address the grammar and pedagogy with a skill tree mechanic while creating more opportunities to incentivize learners through a shop. Furthermore, I’d love to dive into distinguishing practices from regular quest progression.

Ultimately, this project was a labor of love in which I hope to inspire people within and outside my community. As of 2024, I am planning to bring it back with some game design friends!

Want the long version?

Click to learn more about how I determined what makes a game a game and how that ties in perfectly with Teochew.

More like this

Lorax

A gamified environmental sustainability habit tracker.

phraseflash

A phrasebook & flashcard 2-in-1 app for tourists abroad.