Interactive Lip-Synced Teacher Animations for ELSA Speak (Rive)

The core idea behind this project was to give users of the ELSA Speak language learning app the ability to choose not only their teacher’s voice, but also their appearance and personality. By the time I joined the project, the app had already been live for quite a while and featured an animated character called Planet. My task was to design and animate four additional human teachers, expanding the cast and giving learners more ways to connect with the experience. For each of these characters, I built full lip-sync functionality based on a Viseme table, allowing them to pronounce any AI-generated phrase naturally and convincingly. This made the teachers feel responsive and alive during lessons. The characters also react dynamically to the user’s actions. Depending on whether an answer is correct or incorrect, they show different emotional responses: celebrating success, listening attentively, encouraging the student, or offering supportive reactions that keep the learning atmosphere positive and motivating. In addition, I created waiting animations designed to be playful and engaging. While waiting, the characters might follow the flight of a butterfly or a bee. What happens next depends on each character’s personality, adding small moments of charm and humor to the experience. As usual, I created all vector illustrations in Sketch. All animations were built in Rive and are controlled through state machines, enabling smooth transitions and interactive behavior throughout the app. https://play.google.com/store/apps/details?id=us.nobarriers.elsa&hl=en https://elsaspeak.com/en/