Skip to content

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

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

Run on your computer

Terminal
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.

Complete Aulafy mapSee how this lesson fits without leaving your path.

Complete Aulafy map

How all courses connect

This is not a checklist. Start with the foundation, choose an outcome, and go deeper only when your project needs more control.

  1. 1Understand
  2. 2Apply or build
  3. 3Operate with confidence
01

Choose an application

Turn the foundation into a visible outcome: a website, a business improvement, media, or an interactive experience.

Continue into the technical branch when you need to maintain code, data, or infrastructure.

02

Build with code

Prepare your environment, work with coding agents, and run models while keeping control of your projects.

This branch prepares you to design and operate reliable AI systems.

03

Take systems to production

Combine retrieval, agents, evaluation, security, deployment, and model adaptation when the problem requires it.

You do not need every course: choose the component your system needs and return as it grows.

View full catalogue