Aulafy

Speaking Avatar

An animated face (an avatar) that reads text while moving its mouth, for presentations, online courses, or explainer videos. You write what you want it to say and the avatar narrates it while synchronizing its lips.

  • What lip sync is and how to achieve it.
  • Combine synthetic voice (TTS) with an animated face.
  • Generate clips for your educational materials.

Key concepts

This project brings together two things you already know or nearly know: synthetic voice (TTS, from the audio chapter) and an animated face that moves its mouth to the rhythm of that voice.

How it fits with what you already know

This project is an extension of the text-to-audio chapter: there you generated the voice; here, you also put it on a face. If that one worked for you, this is the natural next step. The only new part is the visual layer: visemes synchronized with the audio you already know how to produce.

Step by step

TerminalCode
cd ~/proyectos-ia
mkdir avatar-parlante
cd avatar-parlante
claude

Run on your computer

TerminalCode
npm install
npm run dev

Type a sentence, generate, and watch the avatar speak.

If something goes wrong

  • Out-of-sync mouth — ask Claude Code to adjust the offset between audio and animation.
  • Doesn't export video — you may be missing a tool (for example, one to combine audio and images); Claude Code will tell you which one to install.
  • Robotic voice — switch TTS engine or voice.

Practice challenge

Connect the avatar to an Ollama model: have the avatar answer questions by speaking, not just read fixed text. You'll have created a virtual tutor with a face.