This website uses the CSS Grid layout, which your browser does not support.

Interactive Mandarin and English
interactive Mandarin exercise
tile showing Mandarin glyph and latin-character transliteration

Problem Statement

Learning a new language can be difficult. New sounds can be complex on their own. When coupled with unfamiliar tonal systems and glyphs, dynamic scaffolding is essential.


Rich, interactive exercises and continuous, integrated assessment and adjustment can assist students in learning a new language.

My Roles

  • Client-side developer
  • UX designer
Process: My teams were lead by language acquisition researchers, who wrote exercise outlines. In concert with visual designers, writers and backend developers, I developed front-end interactive animations. In addition, I created shared code libraries, client-server protocols and XML schemas. Usability data came in the form of server logs, hand-written surveys and remote video interviews.
Details: Each language course used a server-side Bayesian inference engine to continuously adjust the level of exercise difficulty based on student performance. To maintain student engagement during sessions, a variety of audio-visual-kinesthetic exercise modalities were used, including drag-and-drop, multiple choice, translation into target language, translation from target language, etc. Test locations were Chile, and South Korea.
  • At the time, there was no way to easily teach manual character rendering, which is a significant part of learning Mandarin.
  • At the time, audio processing was not efficient enough to provide real-time feedback.
  • Unicode content testing needs to be conducted at all levels of the stack.
  • For elementary school students, culturally neutral imagery and content is important in language acquisition.
hand written feedback form

Paper survey example

From a fifth-grade student in Chile.

Server log example

The student's learning journeys are traced across content categories. The Bayesian engine compensates for the student's performance by adjusting the difficulty level of each succeeding exercise.

server log showing individual student progress
Data and Dialogs: XML schema, XML data, client-server dialog
xml schema xml data client servver dialog
  • Organization: Stanford University
  • Stack: Flash, XML, Java, Perl
  • Domain: Language curricula
  • Project Type: Interactive animations
  • Content: Mandarin and English language
Product images and content © Stanford University
Code and data shown have been modified and do not represent actual data.