Los 12 principios de la animación: qué son, ejemplos y en qué orden aprenderlos

Lo esencial

• Los 12 principios de la animación son ideas para que el movimiento se vea vivo: con peso, con ritmo y con intención.
• Los escribieron Frank Thomas y Ollie Johnston, dos animadores de Disney, en el libro The Illusion of Life (1981).

• Sirven igual en 2D, 3D y motion graphics. Cambia la herramienta, no la idea.
• No se aprenden todos juntos: timing y estirar y encoger primero, el atractivo al final.
• Cada principio tiene un error típico que se reconoce a simple vista. Acá los vas a ver en movimiento.

Animaste una pelota. Seguiste el tutorial al pie de la letra, con los mismos cuadros clave y el mismo programa. Y se ve de plástico. El problema casi nunca es el programa: es que le falta alguno de los 12 principios.

En esta guía vas a ver qué son, de dónde salen y cada uno de los 12 con su error típico, en una animación corta. Después, cómo se usan en motion graphics y en qué orden conviene aprenderlos. Si llegaste buscando cómo aprender animación digital, esta es la base, antes que cualquier programa.

¿Qué son los 12 principios de la animación?

Los 12 principios de la animación son un conjunto de ideas para que el movimiento se vea creíble, con peso y con intención. Los describieron Frank Thomas y Ollie Johnston, animadores de Disney, en su libro The Illusion of Life (1981). Valen para 2D, 3D y motion graphics.

Salen de lo que el estudio fue descubriendo desde los años 30. Thomas y Johnston eran parte de los "nueve ancianos", el grupo de animadores que hizo los clásicos de Disney. En el libro ordenaron lo que habían aprendido en décadas de prueba y error.

No son reglas: son herramientas para diagnosticar. Si algo se ve mal, casi siempre falta uno. Y como son doce, ayuda agruparlos por lo que resuelven:

Los 12 principios, uno por uno

Los primeros seis principios son estirar y encoger, anticipación, puesta en escena, directa y pose a pose, acción continuada y aceleración y desaceleración. Los otros seis son arcos, acción secundaria, timing, exageración, dibujo sólido y atractivo.

Van en el orden del libro, con su nombre en inglés. En cada animación, lo gris es el error típico y lo naranja es el principio bien aplicado.

1. Estirar y encoger (squash and stretch)

Un objeto se aplasta cuando choca y se estira cuando va rápido. Eso le da peso y elasticidad. La regla de oro es que el volumen no cambia: si se aplasta, se ensancha; si se estira, se afina.

Error típico: la pelota que se aplasta y "engorda". Se nota enseguida, aunque no sepas por qué: el ojo detecta que la masa cambió.

En motion graphics: un logo que cae y se aplasta dos cuadros al tocar el piso pesa mucho más que uno que frena en seco.

2. Anticipación (anticipation)

Antes de una acción, hay un movimiento en sentido contrario que la prepara. Antes de saltar, el personaje se agacha; antes de tirar algo, lleva el brazo atrás. Le avisa al ojo qué va a pasar.

Error típico: la anticipación más grande que la acción. Si el personaje se agacha como para saltar un edificio y después da un saltito, la acción se siente floja.

Lo desarrollamos en detalle en anticipación en animación 2D: tipos, cuántos cuadros y errores.

3. Puesta en escena (staging)

Es presentar una idea por vez, de la forma más clara posible. La silueta, el encuadre y lo que se mueve tienen que llevar el ojo a lo importante.

Error típico: dos cosas importantes a la vez. Si los dos personajes se mueven igual de fuerte, el espectador no sabe a quién mirar.

La puesta en escena se decide antes de animar, en el storyboard.

4. Animación directa y pose a pose (straight ahead / pose to pose)

Son dos formas de trabajar. En la directa, dibujás un cuadro detrás de otro, del primero al último. En la pose a pose, primero dibujás las poses clave y después los cuadros intermedios.

Error típico: animar todo en directa sin un plan. El personaje va cambiando de tamaño de a poco y, cuando llegás al final, ya no se parece al del principio.

La directa sirve para fuego, agua y movimientos caóticos. Para casi todo lo demás conviene pose a pose, porque controlás el resultado. Más en cómo hacer animaciones más fluidas.

5. Acción continuada y superpuesta (follow through / overlapping action)

Cuando un cuerpo frena, sus partes sueltas siguen moviéndose un poco: el pelo, la ropa, una cola. Eso es la acción continuada. La superpuesta es que cada parte se mueve a su propio ritmo, desfasada de las otras.

Error típico: que todo frene en el mismo cuadro. El movimiento se siente rígido, como un muñeco de una sola pieza.

En motion graphics: desfasá las capas uno o dos cuadros. Si un título entra letra por letra con un pequeño retraso entre cada una, ya estás usando este principio.

6. Aceleración y desaceleración (slow in / slow out)

Casi nada arranca y frena de golpe. Las cosas aceleran al salir y desaceleran al llegar. Para lograrlo, se ponen más dibujos cerca de las poses clave y menos en el medio.

Error típico: poner la misma curva automática en todo. En After Effects es el "easy ease" en cada cuadro clave: todo se mueve igual y nada tiene carácter.

Una aclaración: el spacing (cómo se distribuyen los dibujos en el recorrido) no es uno de los 12 principios. Vive acá y en el timing, pero es tan importante que conviene estudiarlo aparte. Te lo explicamos en qué es el spacing y en easing con criterio.

7. Arcos (arcs)

Los movimientos naturales siguen trayectorias curvas: un brazo que se balancea, una cabeza que gira, una pelota que vuela. Casi nada se mueve en línea recta.

Error típico: la mano que va en línea recta de una pose a la otra. Pasa mucho cuando el programa calcula los intermedios y nadie revisa la trayectoria.

En After Effects: mirá el trazado de la posición en la composición y curvalo con los tiradores.

8. Acción secundaria (secondary action)

Es un movimiento chico que acompaña a la acción principal y la refuerza. Un personaje que camina mientras silba, o que salta y sube los brazos.

Error típico: que la acción secundaria le robe la atención a la principal. Si los brazos se mueven más que el salto, el ojo se queda en los brazos.

9. Timing

Es la cantidad de cuadros que dura una acción. El timing define si algo se siente pesado o liviano, rápido o torpe, decidido o dudoso.

Error típico: que todo dure lo mismo. Una pelota de bowling y una de ping-pong no pueden rebotar igual, aunque tengan el mismo dibujo.

Timing y spacing son la pareja más importante de la animación. La diferencia entre los dos, en timing vs spacing. Y para animar con menos dibujos sin perder fluidez, mirá cómo animar mejor usando menos frames.

10. Exageración (exaggeration)

Es llevar la idea un poco más allá de lo real para que se entienda y se sienta. No es deformar todo: es exagerar lo que cuenta la idea.

Error típico: exagerar todo por igual. Si cada cuadro es extremo, ninguno destaca y la animación se vuelve ruido.

11. Dibujo sólido (solid drawing)

Es dibujar las formas con volumen y peso, como si fueran objetos en tres dimensiones. Aunque la animación sea plana, la forma tiene que respetar su perspectiva cuando gira.

Error típico: el giro "de calcomanía". Los ojos se deslizan de un lado al otro sin achicarse, y el personaje se ve como un cartón.

En motion graphics: una forma que gira tiene que acortarse con la perspectiva, aunque sea un ícono plano.

12. Atractivo (appeal)

No es que el personaje sea lindo: es que quieras seguir mirándolo. Un villano también tiene atractivo. Sale del diseño, de las proporciones y de la actitud.

Error típico: el diseño simétrico y sin contraste. Dos ojos iguales, brazos iguales, pose de frente: el personaje existe, pero no tiene personalidad.

Leer los 12 te lleva diez minutos. Aplicarlos en el orden correcto es otra cosa.

Para eso armamos la Fase I del Códice: 24 clases, desde cero. Uno de sus trabajos prácticos es tu primera animación con los 12 principios, hasta que el movimiento deje de verse de plástico.

Los 12 principios en una tabla

Para repasarlos de un vistazo, con su nombre en inglés y el error que hay que buscar:

¿Los querés en papel? Armamos una guía en PDF con los 12: cada uno con su imagen, el error típico y un ejercicio para hacer. Viene en A4 y en Carta. Es gratis: la descargás desde nuestra tienda.

¿En qué orden conviene aprender los 12 principios?

No se aprenden todos juntos. Empezá por el timing, la aceleración y desaceleración y el estirar y encoger, con una pelota que rebota. Después sumá la anticipación, los arcos y la acción continuada. La puesta en escena y la exageración llegan con el personaje. El atractivo se pule toda la vida.

Este es el orden que te recomendamos, en cuatro escalones. Cada uno tiene su ejercicio:

1. Pelota que rebota: timing, aceleración y desaceleración, estirar y encoger. Es el ejercicio más famoso de la animación por algo: en una tarde te enseña peso y ritmo. Lo explicamos en domina el arte de la animación.
2. Péndulo y cola: arcos, acción continuada y superpuesta. Una pelota con una cola que la sigue alcanza.
3. Salto de un personaje simple: anticipación, pose a pose y exageración. Un frijol con ojos, como el de estas animaciones, sirve igual que un personaje completo.
4. Una acción con intención: una caminata corta o un gesto. Acá entran la puesta en escena, la acción secundaria, el dibujo sólido y el atractivo.

Terminá cada escalón antes de pasar al siguiente. Mirar los 12 principios en un video de cinco minutos no es aprenderlos. Se aprenden animando, de a tres o cuatro, hasta que te salen sin pensarlo.

Si recién arrancás y querés el mapa completo, con los tipos de animación y los programas, mirá nuestra guía de animación 2D.

Los 12 principios en motion graphics y en 3D

Los 12 principios valen igual en motion graphics y en 3D. Cambia la herramienta. En After Effects, la aceleración y desaceleración vive en el editor de gráficos, y la acción superpuesta es desfasar capas. Un logo que entra sin anticipación ni asentamiento se ve tan rígido como un personaje.

Así se ven en una pieza de motion graphics:

En 3D, el programa calcula los cuadros intermedios. Por eso el error típico es dejar que la curva por defecto decida por vos: todo sale prolijo y sin vida. Los principios son lo que te hace corregir esa curva.

Si venís del diseño, te va a servir qué es el motion graphics y en qué se diferencia de la animación. Y para aplicarlos a títulos, 3 secretos de animación de texto en After Effects.

Cómo darte cuenta de qué principio le falta a tu animación

Si se ve de plástico, revisá el timing y la aceleración. Si se ve rígida, la acción continuada. Si no se entiende, la puesta en escena. Si no pesa, el estirar y encoger y la anticipación.

Una lista rápida de síntomas para la próxima vez que algo no te convenza:

• Todo se mueve a la misma velocidad: falta aceleración y desaceleración.
• El movimiento se siente robótico: revisá los arcos.
• Frena en seco: falta acción continuada.
• No se entiende qué pasa: puesta en escena. Probá ver la animación solo en silueta.
• No tiene peso: timing, estirar y encoger y anticipación.
• Está todo bien, pero aburre: exageración o atractivo.

Lo desarrollamos paso a paso en cómo diagnosticar por qué una animación no se siente bien. Y para entrenar el ojo con animación profesional cuadro por cuadro, Sakugabooru es un archivo enorme.

¿De dónde salen? The Illusion of Life, el libro de los 12 principios

Los 12 principios salen de The Illusion of Life: Disney Animation, el libro que Frank Thomas y Ollie Johnston publicaron en 1981. Los dos fueron parte de los "nueve ancianos" de Disney, el grupo de animadores de la época de oro del estudio.

El libro es largo, lleno de dibujos de producción, y sigue siendo de lectura obligada en las escuelas de animación. Los principios no cambiaron porque el ojo humano tampoco cambió.

La versión animada más vista de los 12 es el corto The Illusion of Life (2014) de Cento Lodigiani, que los explica con un cubo. Si querés verlos en otro estilo, está en Vimeo.

Preguntas frecuentes

¿Quién creó los 12 principios de la animación?

Frank Thomas y Ollie Johnston, dos animadores de Disney. Los publicaron en el libro The Illusion of Life en 1981, a partir de lo que el estudio venía aprendiendo desde los años 30.

¿Cuál es el principio más importante?

Para empezar, el timing: sin él, ninguno de los otros se ve. Es nuestra opinión, y es por eso que el primer ejercicio de casi cualquier escuela es una pelota que rebota.

¿Los 12 principios sirven para 3D y para motion graphics?

Sí. Nacieron en la animación dibujada a mano, pero valen igual en 3D, en motion graphics y en animación web. Cambia la herramienta, no la idea.

¿El spacing es uno de los 12 principios?

No. Es parte del timing y de la aceleración y desaceleración. Pero es tan importante que se estudia aparte.

¿Cómo se dicen los 12 principios en inglés?

Los primeros seis: squash and stretch, anticipation, staging, straight ahead and pose to pose, follow through and overlapping action y slow in and slow out. Los otros seis: arcs, secondary action, timing, exaggeration, solid drawing y appeal.

¿Hay que aprenderlos todos antes de empezar a animar?

No. Se aprenden animando, de a tres o cuatro por vez. Empezá con una pelota que rebota y sumá principios a medida que tus ejercicios los piden.

Doce ideas, cuatro grupos y un orden. El programa cambia; los principios, no.

El ejercicio de hoy: animá una pelota que rebota en 12 dibujos. Después hacé una copia y aplicale solo estirar y encoger, sin tocar el timing. Mirá las dos versiones juntas: vas a entender en un minuto lo que te costó leer diez.

Ya sabés cuáles son. Falta aplicarlos en orden.

Tenés 400 tutoriales y cero dirección. Eso no se arregla con otro tutorial: se arregla con un camino. El Códice es ese camino, y la Fase I es donde empieza: los principios del movimiento, las herramientas y tus primeras piezas terminadas, de punta a punta.

La Fase I se vendió a US$ 50 cuando era un beta. Hoy es más completa y sale US$ 29. La comprás una sola vez y es tuya para siempre.

Aclaración: el Códice es un producto de Koncepto. Las animaciones de este artículo son de Koncepto, hechas por código.