
Houghton Mifflin Harcourt (HMH) is a leading global learning company dedicated to delivering innovative and impactful educational solutions, specializing in K-12 education.
In 2018, in the collaboration between CMU HCII and HMH, I together with a few classmates (Team Otter) spent 9 months and created a interactive language learning system for HMH client. The final product was delivered to HMH in Auguest, 2019.
Project Highlights
Team Website

In 2018, as the development lead for Team Otter, I spearheaded the creation of our team website to highlight the outstanding work of my colleagues during the development of our final project. The site was crafted using ReactJS and Redux for state management, with React LazyLoad to optimize performance. For dynamic visual effects, we incorporated AnimeJS and React Transition Group. The website, deployed on GitHub, effectively showcases our team members, the challenges we addressed, and the extensive research process behind our project.
Developed in collaboration with our team's design lead and content writer, the final product is a visually appealing and smoothly operating single-page application that dynamically presents our project's journey and achievements.
Click here to see the website. Go to this public Github repository to check out the code.
Final Product

The final product developed by Team Otter is an innovative educational tool designed to enhance speaking and listening fluency in Spanish as a second language for K-12 students. Named "Háblame," which translates to "Talk to me" in English, this project utilizes cutting-edge technologies to create an immersive and interactive learning environment.
Some key capabilities include:
Automatic Speech Recognition (ASR): Enable students to engage actively by speaking directly to the computer and receiving instantaneous feedback, fostering an interactive learning experience.
Branching Scenarios: Features multiple branching storylines that adapt to the learner’s choices, offering repeatable value and customizing the learning experience to individual needs.
Motivational Tools: Includes badges and progress tracking to motivate learners and promote ongoing engagement with the content.
Feedback and Scaffolding: Provides detailed insights into completion and performance, while scaffolding tools such as re-prompting, hints, and modeling guide learners through the educational material.
To support these capabilities, we leveraged several technologies, including AnnyangJS for Automatic Speech Recognition, H5P Interactive Video Modules on top of Drupal 7 CMS with PHP along with multiple open source plugins for animations and authentication purposes.
The final product was delivered to HMH in Auguest, 2019. Click here to check out the final presentation of the product before delivery.
Other Explorations

Discover the meaning of Spanish words in real life by scanning a mark with your phone. Built using Aframe for easy web AR experience and open source 3D models.
Test it out by following the instructions here.

Test out Automatic Speech Recognication by uploading a audio file here. Powered by Amazon AWS.
*Please refrain from using it extensively as this service is not free.