Transcripciones
1. INTRODUCCIÓN: El propósito de este
episodio es hablar sobre los principios de animación
y cómo pueden aplicarse a las animaciones de texto
en motion graphics. Los 12 principios fueron desarrollados por
primera vez por Disney
en la década de 1930, pero no es necesario que estés
creando caricaturas de gran presupuesto o animación
fotograma
a fotograma para implementarlos
en Juntos,
crearemos una animación de texto mientras aprendemos sobre
los principios. No puedo esperar a ver
tus animaciones.
2. Introducción y proyecto de clase: Para comenzar con esta clase, vas a necesitar Adobe After
Effects para seguir adelante. El proyecto de tu clase es aplicar los principios de animación a tu propia animación de texto o a
cualquier animación que te gustaría. Puede descargar una versión
completa de este archivo de proyecto en la página de proyectos y
recursos y no dude en publicar sus proyectos en
la galería de proyectos.
3. La diapositiva principal en animación: Para esta clase, estoy tomando un enfoque
un
poco más relajado. Traeremos la página de
Wikipedia para los 12 principios de animación, y los
revisaremos uno por uno, y veremos cómo
podemos
incorporarlos a nuestra animación de texto. Comenzaremos esta clase
creando una simple diapositiva
en la animación de texto. ajustes de composición realmente no importan para este proyecto. Voy a conseguir mi
herramienta tipo y escribir algún texto. Voy a escribir animación. La fuente que uses realmente tampoco
importa, pero voy a usar
Montserrat Black Centraré el texto a la
mitad de la composición. Y esto nos lleva a nuestro
primer principio de animación, pose depose versus acción
recta Estos son dos enfoques
diferentes para el proceso de dibujo. Las escenas de acción en línea recta se
animan fotograma por cuadro
de principio a fin. Mientras pose depose
implica comenzar con dibujar fotogramas clave y luego completar los intervalos acción recta
crea una ilusión
de movimiento más fluida y
dinámica y es mejor para producir secuencias de acción
realistas. Por otro lado,
es difícil mantener proporciones y crear poses convincentes
exactas en el camino Posar funciona mejor para escenas
dramáticas y emocionales donde la composición y
la relación con el entorno son
de mayor importancia. A menudo se utiliza una combinación de las dos
técnicas. En la animación por computadora,
que es lo que estamos haciendo, animación por
computadora
elimina los problemas de proporciones relacionados con el dibujo de acción
recto, pero pose a pose todavía
se usa para la animación por computadora debido a
las ventajas que
aporta en la composición. El uso de computadoras
facilita este método y puede rellenar automáticamente las secuencias
faltantes entre poses. Sigue siendo importante supervisar el proceso y aplicar
los demás principios En realidad no hay que hacer nada por este principio de animación, ya que en motion graphics, mayoría de las veces estamos haciendo
pose para posar automáticamente. Ahora que sabemos qué tipo
de animación estamos creando,
seguiremos adelante y crearemos esa simple diapositiva en la animación de texto. Traeré la
posición presionando P. Solo
voy a presionar
el cronómetro para poner un fotograma clave y arrastrarlo
sobre la Realmente no importa
dónde en este momento. Ahora voy a
cambiar el valor Y. A lo mejor voy a sumar Voy
a añadir 300 al valor Y. Ahí vamos. Y eso nos crea otro
fotograma clave automáticamente. Ahora vamos a averiguar cuánto tiempo queremos que sea esta animación. A lo mejor vamos a hacer
1 segundo de largo. Así que voy a arrastrar ese fotograma clave a
30 fotogramas en la línea de tiempo. Y ahí lo tenemos, nuestro
sencillo slide en animación. Ahora podemos comenzar a mejorar esta animación usando nuestros principios de
animación.
4. Cómo entrar y salir lentamente: Lento de entrada y
desaceleración o en otras palabras, facilidad de entrada y facilidad de salida. El movimiento de objetos
en el mundo real, como el cuerpo humano,
los animales, los vehículos, etcétera, necesita tiempo para acelerar
y ralentizar. Por esta razón, se dibujan más
imágenes cerca del inicio y
el final de una acción, creando un
efecto slow in y slow out con el fin de lograr un movimiento
más realista. Concepto enfatiza los
objetos poses extremas. Inversamente,
se dibujan menos imágenes dentro la mitad de la animación
para enfatizar la acción más rápida Este principio
se aplica a los personajes que se mueven entre dos poses
extremas, como sentarse
o ponerse de pie, pero también para objetos inanimados en
movimiento como
una pelota que rebota Entonces, como mencioné,
slow in y slow out también pueden llamarse
facilidad de entrada y facilidad de salida. Para facilitar y facilitar nuestro
movimiento en After Effects, es tan simple como
seleccionar nuestros fotogramas clave, presionar F nine para
agregar una facilidad fácil Ahí lo tenemos. Nuestro primer principio de animación ya
está aplicado. Si eres un
usuario intermedio de After Effects, ya
sabes que una
facilidad de entrada y salida crea una animación
más suave entre nuestros fotogramas clave Por supuesto, podemos dirigirnos
a nuestro editor de grafos y retocar nuestra animación
a nuestro gusto. Pero por ahora,
voy a dejarlo como está,
y lo mejoraremos más
adelante usando nuestros otros principios de
animación.
5. Anticipación (y rebasamiento): El siguiente
principio de animación que vamos a aplicar a nuestra animación
es la anticipación. La anticipación se utiliza para
preparar al público para una acción y hacer que la
acción parezca más realista Un bailarín que salta del suelo tiene que doblar primero las rodillas. Un golfista que hace un swing tiene
que hacer pivotar primero el palo hacia atrás. La técnica también se puede utilizar
para menos acciones físicas, como un personaje que mira
fuera de la pantalla para anticipar la llegada de
alguien o la
atención
centrándose en un objeto que un personaje
está a punto de recoger. Para aplicar cierta anticipación
a nuestra propia animación, antes de que nuestra animación
comience a animarse hacia arriba, podemos avanzar algunos fotogramas, y podemos
bajar nuestra animación así que vamos a tal vez
cuatro fotogramas en la Copiaremos y pegaremos nuestro primer fotograma clave y
arrastraremos la posición Y, tal vez redondearlo
a 930. Ahí vamos. Antes de
que nuestra animación
vaya hacia arriba, bajará un poco, y esa puede ser
nuestra anticipación Lo que también podemos hacer es agregar
un poco de sobreimpulso. Y sobreimpulso es solo otra
palabra para anticipación, pero está sobrepasando
el lugar de descanso final Podemos copiar nuestro último fotograma clave, pegarlo en el fotograma 26, y cambiaremos la posición
Y hacia arriba Voy a hacer el mío
525. Entonces ahí vamos. Ahora nuestra animación
en lugar de simplemente animar de un
fotograma clave al siguiente, va un poco hacia abajo, que es nuestra anticipación, y luego se rebasa
un poco antes de ir al Voy a dirigirme
al editor de grafos y echar un vistazo
al gráfico de velocidad. Se ve un poco raro. Una solución fácil a esto es molestar a nuestros fotogramas clave
seleccionándolos, presionando control y haciendo clic en nuestros fotogramas clave, y luego
los facilitaremos fácilmente presionando F nueve,
diríjase de nuevo al Y voy a empezar a
aliviar nuestros fotogramas clave. Empezaré arrastrando
estos dos hacia el medio, luego me dirigiré a los dos
últimos fotogramas clave También arrastraré a estos
dos hacia el medio. Y para la
animación principal en el medio, voy a arrastrar este
asa hacia la izquierda. Ahí vamos. Vamos a previsualizar
y ver cómo se ve eso. Estoy pensando que se ve
bastante bien. Entonces ahí vamos. Hemos creado cierta anticipación
y algo de sobreimpulso. También voy a mover nuestros
fotogramas clave un poco en la línea de tiempo para que la animación no
comience de inmediato. A lo mejor podamos moverlo a cinco
fotogramas en la línea de tiempo.
6. Encoger y estirar: Sólo un pequeño resumen de
lo que tenemos hasta ahora. Hemos determinado
que el tipo de animación es pose a pose. Hemos agregado algo de
facilidad de entrada y facilidad de salida, y también hemos agregado algo de
anticipación y sobreimpulso Ahora llevemos nuestra
animación un paso más allá con nuestro siguiente
principio, squash y stretch. El propósito de squash y estiramiento es dar
una sensación de peso y flexibilidad a los objetos dibujados o animados por
computadora. Se puede aplicar a
objetos simples como una pelota que rebota o construcciones más complejas como el musculoso
del rostro humano N a un extremo, una
figura estirada o aplastada en un grado
exagerado puede tener un efecto cómico En la animación realista, sin embargo, el aspecto más importante
de este principio es que el volumen del objeto
no cambia cuando se
aplaste o se estira Si la longitud de la bola
se estira verticalmente, su ancho en tres
dimensiones, también es profundidad, necesita contraerse
correspondientemente horizontalmente En nuestra propia animación, ya que solo estamos haciendo una animación de texto
simple, no
creo que
debamos preocuparnos
demasiado por la animación
realista. No obstante, si estuviéramos animando algo así como una pelota rebotando, tendríamos que contrarrestar
un estiramiento vertical
con una con una Aplica un poco de squash y stretch
a nuestra animación de texto, agregaremos una animación
a escala simple. Creo que a medida que nuestro texto
se está animando hacia arriba, estiraremos un poco el
texto, y luego cuando el texto
aterrice en su lugar de descanso, le
daremos un
poco de calabaza, y luego unos fotogramas después, lo
haremos volver
a su escala regular Entonces, para comenzar, trae las propiedades de posición y
escala
presionando P, manteniendo presionada
la tecla Mayús y presionando S. Nos dirigiremos al fotograma clave de segunda posición y
presionaremos el cronómetro de escala
para poner un Ahora pasemos al fotograma clave de
tercera posición. Desvincularemos la escala para que
podamos cambiar la propiedad Y. Cambiaremos nuestra
escala Y a un 15%. Ahora pasaremos al fotograma clave de
última posición. Y lo que queremos hacer
es que queremos presionar el botón del fotograma clave porque
queremos que estos dos fotogramas clave
permanezcan iguales No queremos ninguna
animación entre ellos. Ahora vamos a
pasar, digamos, tal vez cinco fotogramas en la
línea de tiempo para enmarcar 40, y aquí es donde
haremos algo de squash. Cambiaremos nuestra escala Y a 85%, y luego unos fotogramas
más tarde en el marco 43, volveremos a
nuestra escala regular, cambiaremos nuestra
propiedad de escala de 100. Ahora vamos a previsualizar
cómo se ve. Es muy sutil, pero creo
que suma mucho
a la animación. Todas estas pequeñas cosas
sutiles pueden hacer que tus animaciones
se vean mucho mejor. Y creo que podemos aliviarlo y simplemente dejarlo en la facilidad
básica por ahora.
7. Seguimiento y superposición: La acción de seguimiento y
superposición es un rumbo general para dos técnicas
estrechamente relacionadas que ayudan a hacer que el movimiento sea
más realista para ayudar a dar la impresión de
que el personaje sigue las leyes de la física, incluido el
principio de inercia Seguir a través significa que las partes
del cuerpo atadas
sin apretar deben continuar moviéndose después de que el
personaje se haya detenido, y las partes deben seguir
moviéndose más allá del punto donde el personaje se detuvo solo para ser posteriormente retrocedido Hacia el centro de masa o exhibiendo diversos grados
de amortiguación de osculación. acción superpuesta
es la tendencia de que partes de los cuerpos
se muevan a diferentes velocidades. Por ejemplo, un brazo se moverá en momento
diferente
al de la cabeza y así sucesivamente. Una tercera
técnica relacionada es el arrastre, donde un personaje comienza
a moverse y partes de ellos toman algunos
fotogramas para ponerse al día. Estas partes pueden ser objetos
inanimados como ropa o la antena en
un automóvil o partes del cuerpo,
como los brazos y el cuerpo humano, el torso es el núcleo
con dependencias de brazos, piernas, cabeza y cabello que normalmente siguen
el movimiento del torso Las partes del cuerpo con tejido muscular, como los estómagos o
senos grandes o la piel suelta un perro son más propensas al movimiento
independiente que las partes del cuerpo
más bonificadas Nuevamente, el uso exagerado de esta técnica puede
producir un efecto cómico animación más realista debe
cronometrar las acciones exactamente para
producir un resultado convincente. La bodega móvil anima entre dos posiciones muy
similares Incluso los personajes sentados quietos o apenas moviéndose pueden mostrar
algún tipo de movimiento, como respirar o cambiar
ligeramente de posición. Esto impide que el dibujo se convierta en implementar
este principio en nuestra propia animación, podríamos tener todas las letras de nuestra palabra animando
en un momento diferente Entonces en esta lección,
voy a mostrarles dos métodos separados para
compensar nuestras letras El primer método es mucho
más amigable para principiantes, pero aunque podría ser más fácil, es mucho menos indulgente cuando vamos a modificar nuestras
animaciones El segundo método
conectará todas nuestras capas juntas a una capa
usando una expresión. De esa manera, cuando editemos la
animación en una capa, todas las capas seguirán. Verás a lo que me refiero cuando
vayamos a implementar esto. Entonces, lo que recomendaría hacer es ver esta lección
hasta el
final, y luego puedes decidir qué método te gustaría usar. Comenzamos
haciendo clic derecho sobre nuestro texto. Ve a Crear formas a partir del texto. Lo que vamos
a tener que hacer es duplicar esta capa
por cada letra. Duplicaré mi
capa siete veces
, bajaré el contenido, y vamos a eliminar
todas las demás letras de aquí, que no sean la A, luego
cambiaremos el nombre de esta capa A, y vamos a hacer
esto por cada letra. Podría avanzar rápidamente
a través de esto, pero esencialmente, estamos
pasando por cada capa, y estamos eliminando todas las letras excepto la que queremos, y luego estamos
renombrando la capa Y me estoy dando cuenta
ahora de que necesito
crear otra porque
olvidé una letra. Bien, ahora que terminemos eso, ahora vamos a
compensar nuestras capas. Podemos seleccionar todas nuestras capas, dirigirnos a un fotograma
en la línea de tiempo,
mantener presionada la tecla Alt y corchete cuadrado para cortar nuestras capas
en la línea de tiempo. Después arrastraré mis capas en la línea de tiempo para que tengan
solo un fotograma de largo. Puedo hacer clic derecho en las capas. Ir a Asistente de fotogramas clave, capas
de secuencia. Simplemente haremos clic en Bien. Y esto compensará todas nuestras capas en
un fotograma en la línea de tiempo. Ahora tendremos que
volver a
arrastrar nuestras capas para que se expandan
a través de la línea de tiempo. Y tendremos que hacer lo mismo
al inicio
de la línea de tiempo. Y esencialmente todo lo
que se hace es compensar nuestros fotogramas clave
en la línea de tiempo Esta es solo una forma mucho
más rápida de hacerlo. Verá, a medida que sacamos a
colación nuestros fotogramas clave con la tecla U, todos
están compensados por un fotograma Entonces ese es el primer método
de compensación de nuestras capas. Ahora voy a
mostrarte otro método usando una expresión. Para comenzar las cosas,
vamos a
hacer clic derecho en crear formas a partir del texto. Entonces duplicaremos esa capa suficientes veces por cada letra, muy similar a
nuestro primer método. Sólo vamos a
ir a través de todas ellas, eliminar todas las letras
que no queremos, y vamos a
renombrar nuestra capa, igual que en nuestro primer método. Bien. Ahora que hemos
terminado con eso, aquí es donde las cosas se
ponen un poco diferentes. Vamos a sacar a colación los fotogramas clave para
todas nuestras letras, excepto la primera letra A, y vamos a
eliminar toda la animación porque vamos a estar reemplazándola por una expresión Recuerda, para eliminar la animación, solo
puedes presionar el cronómetro Ahora podemos sacar esos fotogramas
clave para nuestra capa A. Ahora con la posición para nuestra N, vamos a presionar Alt
y presionar el cronómetro Y en este campo, vamos
a escribir nuestra primera expresión. Voy a escribir primero
una variable. P es igual, y voy
a usar el látigo de púa
para agarrar la posición Termina eso
con punto y coma. Ve a nuestra siguiente línea y voy
a escribir mi expresión. Valor de punto P a la vez. Recuerda que esto es sensible a mayúsculas y minúsculas, así que escríbalo exactamente
como se muestra. Y aquí voy
a escribir tiempo -0.10 0.1 de segundo porque las expresiones
son siempre en segundos. Y como puedes ver cuando
pasamos por la línea de tiempo, nuestra N anima exactamente un punto de segundo después que nuestra A, que es exactamente lo que queremos Ahora vamos a hacer lo
mismo por escala. Empezaré con una variable. S es igual, usa el
látigo de pico para agarrar la báscula. Terminar con punto y coma. Dirígete a la siguiente línea. Escriba el valor de
punto de las variables en el momento. T -0.1 de segundo. Ahí vamos. Ahora también copia
sobre la
animación a escala. Y vamos a hacer
esto por cada letra. Lo único que
vamos a cambiar en la expresión para el resto
de nuestras cartas es el momento. Pero sí, así que ahora cualquier
cambio que hagas la capa A se trasladará
a las otras letras porque, nuevo, estamos usando una expresión que está copiando toda
la animación. Entonces voy a seguir
adelante y copiar esta expresión
para el puesto. Dirígete a la siguiente letra, presiona
Alt para agregar una expresión, luego solo pegarla
en este campo, y vamos a
cambiarla a 0.2. Eso traslada la animación de
posición, otro 0.1 de segundo después. Haremos lo
mismo por la báscula. Y lo adivinaste. Estamos haciendo
lo mismo por cada letra. Así que probablemente solo
avance rápido a través de esto. Pero recuerden, cada letra, vamos a cambiar el
número a 0.3 0.4, etcétera Ahí vamos. Vamos a
previsualizar nuestra animación.
8. Animación secundaria: Ahora que hemos agregado
algo de seguimiento y superposición
compensando nuestras letras, podemos dirigirnos a nuestro siguiente principio de
animación, que es la acción secundaria Agregar acciones secundarias
a la acción principal le da una escena más vida y puede
ayudar a apoyar la acción principal. Una persona que camina puede balancear
simultáneamente sus brazos o guardarlos en sus bolsillos, hablar o silbar o expresar emociones a través de sus expresiones
faciales Lo importante de las acciones
secundarias es que
enfatizan en lugar de apartar la
atención de
la acción principal. Si este último es el caso, mejor dejar fuera
esas acciones. Por ejemplo, durante
un movimiento dramático, las expresiones
faciales
suelen pasar desapercibidas En estos casos, mejor
incluirlos
al principio y al final
del movimiento en lugar de durante. Oye, ahí, maestro
del futuro aquí. ¿Recuerdas antes en esta
clase cuando dije que no
importaba qué tipo de letra
usaras? Bueno, mentí. En esta lección,
vamos a estar animando los puntos en nuestros ojos Si tu fuente no
tiene puntos en los ojos, no
podrás completar esta lección. Pero no te preocupes. No es esencial para
el proyecto de clase. Puedes saltar a
la segunda mitad de esta lección donde agregamos
una animación de opacidad,
o mejor aún, puedes hacer una lluvia de ideas sobre diferentes formas en las que podrías agregar movimiento
secundario a
tu propia Estoy pensando que una
forma en la que podríamos agregar algo de movimiento secundario es
animar los puntos en nuestros ojos Comenzaré las cosas
seleccionando todas mis capas, haciendo clic
derecho,
yendo a precomponer Y vamos a nombrar este nuevo texto de animación de
composición. Ahora vamos a dirigirnos
a nuestro menú de proyectos, seleccionar nuestra composición de
texto de animación. Vamos a
duplicarlo presionando Control D. Esto crea una nueva composición, y cambiaremos el nombre de este punto porque vamos
a tener uno con nuestro texto de animación en él, y la otra composición
contendrá nuestros puntos. Nos dirigiremos a nuestra composición de texto de
animación. Vamos a alternar nuestro I, y vamos a
eliminar la parte superior I justo aquí para deshacernos de nuestro punto. Ahora vamos a hacer lo
mismo para nuestro segundo alterno hacia abajo la capa, toggle down content,
toggle down this I, borro el superior. Ahora tenemos una composición con solo nuestro texto de animación
en ella sin los puntos. Ahora vamos a
tener que entrar en nuestra composición de puntos
y hacer lo contrario. Elimina todo lo que hay aquí
excepto los puntos. Excepto que una cosa a tener en cuenta es que vamos a
tener que mantener esta capa
superior A porque esa es la capa con
nuestra animación en ella. Porque recuerda, todo está conectado a través de una expresión. Podemos apagar la
visibilidad en él. Voy a seguir borrando
todas las letras, alternando el
contenido I, y en esta, vamos a eliminar la segunda e. Hacer lo mismo para
la otra capa del ojo. Eliminar el segundo. Entonces ahora tenemos una composición
con solo nuestros puntos en ella. Y recuerda, la
razón por la que estamos manteniendo esta capa A es porque esa es la capa con toda
nuestra animación en ella. Ahora volveremos a
nuestra composición principal. Ahora vamos a caer en
nuestra composición de puntos en nuestro panel de proyecto. Así que ahora podemos empezar a
animar nuestra animación de puntos. Creo que lo que haremos es animar los puntos dentro de
la composición principal Entonces lo que tendremos que
hacer es duplicar nuestra capa de puntos y dibujaremos algunas máscaras para separar
los dos puntos. Voy a tomar la capa de puntos, duplicarla con Control
D. En la primera capa de puntos, voy a obtener la herramienta
rectángulo y dibujar una máscara sobre la
primera mitad de la pantalla. Eso será para nuestro primer punto. Por cierto, asegúrate de que
la máscara esté establecida para agregar. Voy a renombrar
esta capa punto uno. Fuera para nuestro segundo punto, haremos lo mismo
pero dibujamos la máscara del otro lado de la pantalla.
Este será nuestro punto dos. Voy a cambiar el nombre de la capa. Entonces comenzaremos con la
animación del punto uno. Creo que para el punto
uno, podríamos hacer que el punto salte hacia arriba ya que
el yo está animando hacia arriba. Y luego a medida que aterrice la letra, punto se pondrá al día casi
como un pequeño efecto rebote. Entonces alrededor del fotograma 20,
sacaremos la posición con P, presionaremos el cronómetro
para poner un fotograma clave Creo que tal vez
pasar al cuadro 32. Y aquí es donde
arrastraremos nuestra posición Y hacia arriba. Voy a restar
200 de la posición Y. Entonces pasaremos más
allá de la línea de tiempo. Intentemos tal vez el marco 44. Copiaremos ese primer
fotograma clave y lo pegaremos. Seleccione nuestros fotogramas clave, presione
F nine para agregar algunas Es fáciles. Vamos a previsualizar cómo se ve
esto. Estoy pensando de
inmediato, eso se ve bastante bien. Podríamos dirigirnos
al editor gráfico. Estoy en el gráfico de velocidad, y voy a arrastrar estas asas, una a la izquierda,
otra a la derecha. A Estoy pensando que
se ve bastante bien. Bastante bien para un primer intento. Ahora podemos dirigirnos a nuestro punto dos. El punto dos, estoy pensando que
tal vez podamos
tenerlo simplemente caer desde
la parte superior de la pantalla. Entonces tendremos que encontrar un
punto en la línea de tiempo. Creo que el marco 54 es cuando queremos que el punto esté en
su posición regular. Entonces sacaremos la posición
y presionaremos el cronómetro. Ahora tendremos que retroceder en la línea de tiempo a un
punto en el que queremos que nuestro punto empiece
a caer. Y sólo voy a arrastrar
la posición Y hasta que nuestro punto esté fuera de la pantalla. Yo sólo lo
redondearé a 100 negativos. También voy a
recortar la línea de tiempo para que no
veamos ese punto
hasta ese momento en el tiempo. El corchete alt es
la clave para hacer eso. Es un bonito atajo para saber. Seleccionaremos estos fotogramas clave, presionaremos F nueve para facilitar Es. Y para este, queremos
un movimiento agradable y rápido porque se verá más natural como si la pelota realmente
estuviera cayendo del cielo. Nos dirigiremos al gráfico de velocidad, y arrastraremos
ambos mangos hacia la derecha. Ahí, eso se ve
mucho más natural. Ahí vamos. Tenemos
nuestras animaciones de puntos. Y ahora como
segunda moción secundaria, ¿por qué no aprovechamos esto
como una oportunidad para animar la opacidad de
las letras animadas Nos dirigiremos a nuestra composición de texto de
animación. Saca los marcos E para
la capa A presionando. Presione Mayús y mantenga presionada la tecla T
para que aparezca la opacidad. Bajaré la opacidad al 0% y presionaré el cronómetro Ahora tenemos que decidir, ¿
en qué momento
queremos que la opacidad
llegue al 100? queremos que la opacidad
llegue al 100 Creo que el marco 25 podría ser bueno. Entonces volveremos a traer esa
opacidad a 100. Seleccione los fotogramas clave
y F nueve para EZ Es. Creo que eso podría ser bueno. Desplazándose por la línea de tiempo, puedo ver que
todavía podemos ver un poco de nuestra anticipación,
que es lo que queremos Entonces para el resto de las capas, ya que hice mi compensación
usando la expresión, voy a hacer lo mismo por
la opacidad de todas
las demás letras G para escribir en mi expresión. Escribiré O iguales, usaré el látigo de pico para agarrar
la opacidad de la capa A. Salta una línea, y luego voy a
escribir mi expresión o valor de punto a la vez, tiempo de
paréntesis -0.1 Ahora el N, copió las propiedades de
opacidad, pero apenas 0.1 de un segundo después Y esto debería ser fácil.
Simplemente copiaremos esa expresión, la pegaremos en la opacidad para
el resto de las capas Y, por supuesto, estamos cambiando
el número en cada capa. Éste lo cambiará a dos y así sucesivamente para el
resto de las letras. Y solo avanzaré rápido
a través del resto de ellos. Y recuerda, si hiciste tu compensación usando
el otro método, necesitarás copiar y pegar la propiedad de opacidad
en todas las letras Ahora vamos a previsualizar toda la animación y ver
cómo se ve. Estoy pensando que
se ve bastante bien. Voy a copiar los fotogramas clave de
opacidad, nos dirigiremos a nuestra composición de
puntos Y solo quiero
asegurarme pegar la animación
en los mismos fotogramas. Entonces vamos a pasar al
marco cinco, pegar. Y claro, tenemos que
hacer lo mismo por nuestra opacidad en las dos capas I Sólo voy a volver a la composición del texto de animación, copiar la expresión
para esa capa, pegarla en la opacidad aquí Hacer lo mismo
para el segundo yo, copiar esta expresión, ir
a la composición de puntos, pegarlo en el segundo Así que ahora esos puntos tienen
la misma animación sus
composiciones de texto de animación contraparte. Ahora pasemos a la composición
principal y previsualicemos nuestra animación. A mi, esto se ve bastante bien. Por supuesto, puedes
animar el tuyo, como
quieras, pero creo que
voy a
mantener el mío de esta manera
9. Exageración: Entonces, ahora que hemos agregado algo movimiento
secundario
a nuestra animación,
entremos en nuestro siguiente principio de
animación, la exageración La exageración está en efecto, especialmente útil para la animación
ya que los movimientos animados que buscan una imitación perfecta de la realidad pueden parecer
estáticos y El nivel de
exageración
depende de si se busca el realismo o un estilo particular como una caricatura o el estilo
de un artista específico La definición clásica
de exageración, que empleó Disney, era mantenerse fiel a la realidad, solo presentándola como una forma más
salvaje, más extrema Otras formas de
exageración pueden implicar las alteraciones sobrenaturales o
surrealistas de los rasgos físicos de un personaje o elementos de
la propia historia Es importante emplear cierto nivel de restricción
cuando se usa la exageración. Si una escena contiene
varios elementos, debe
haber un equilibrio de cómo esos elementos son
exagerados en relación entre sí para evitar
confundir o
sobrecostar al espectador Cuando se trata de
nuestra propia animación, en realidad
ya
hemos incorporado alguna exageración
animando nuestro primer punto Esa animación en sí misma ya
es exageración. Pensando que podríamos llevar
las cosas un poco más lejos exagerando tal vez
nuestra animación a escala Entonces me dirijo a nuestra composición de
animación de texto. Y en nuestro fotograma clave de segunda
escala, tal
vez
voy a subirlo a un 30% También tendremos que cambiar nuestro tercer fotograma clave a un
30% porque recuerden, esos dos fotogramas clave
son iguales Y luego como nuestro texto
aterriza en el suelo, agregaremos un
poco más de squash, tal vez bajemos nuestra
calabaza al 70%. Vamos a previsualizar esto.
Y recuerda, si hiciste tu offset
usando las expresiones, entonces esto es extremadamente fácil para ti porque
toda la animación que cambiemos en esta capa debe seguir a
las otras letras. Si lo hiciste de otra
manera, de la manera más sencilla, tendrías que copiar y pegar la animación de escala de nuestra capa A en todas
las demás letras. Así que ten eso en mente cuando estés creando tus
propias animaciones. Voy a entrar en
mi capa de puntos y cambiar la escala en
los puntos, también. Ir a la animación a segunda
escala. Segundo fotograma clave de escala,
gírelo a 130. Vaya al tercer fotograma clave, cámbielo a 130 también Después bajaremos a
nuestro fotograma clave squash, lo
cambiaremos a 70%.
Y ahí vamos. Ahora volvamos a
nuestra composición principal. Vista previa de lo que
parece. Ahí vamos. Hemos añadido un poco de exageración a nuestra animación a
escala, y recuerda que nuestra
primera animación de puntos también
es una animación exagerada
10. Sincronización: tiempo se refiere al número de dibujos o marcos
para una acción determinada, lo que se traduce en la
velocidad de la acción en película. A nivel puramente físico, sincronización
correcta hace que los objetos parezcan obedecer las
leyes de la física. Por ejemplo, el peso de un objeto determina cómo reacciona
ante un ímpetu como un empujón A los objetos ligeros
reaccionarán más rápido que uno pesado. El tiempo es fundamental
para establecer el estado de ánimo, la
emoción y la reacción de
un personaje. También puede ser un dispositivo
para comunicar aspectos de la persona de un personaje
por lo que esta es la parte
del proceso de animación donde
contemplaríamos, ¿el tiempo de nuestras animaciones tiene sentido lógico para
lo que estamos animando Si estuviéramos animando
algo complejo, como una animación de personajes, este proceso sería mucho más
largo y complejo Pero para algo así como
una animación de texto, como nuestro caso,
aquí es donde
pasaríamos por nuestra línea de tiempo, tal vez espaciaríamos un poco nuestros
fotogramas clave, o podemos compensar nuestras capas, o podríamos dirigirnos
al editor de gráficos Cambiar la flexibilización
de nuestra animación. Estas son todas las cosas
que podemos tener en
cuenta a la hora de
ajustar nuestro tiempo. Para mi animación, creo que el
tiempo se ve bastante bien. Lo único que quiero
ajustar ahora es tal vez
ajustar la flexibilización de escala
en el editor de grafos Entonces voy a
seguir adelante y hacer eso y
avanzaré rápido hasta el final. Ahí vamos. Solo hice algunos pequeños ajustes al
editor de grafos y la animación a escala
solo para que coincida más con nuestra animación de
posición Si hiciste tu compensación
usando el método de expresiones, entonces toda esa animación debería
trasladarse a las otras letras Pero si no,
tendrás que copiar
los fotogramas clave de escala y pegarlos en
tus otras letras Y claro, todo
esto depende de ti. Puedes facilitar tus animaciones como
quieras.
11. Preparación para las tomas: Este principio es
similar a la puesta en escena, como se le conoce en
teatro y cine. Su propósito es dirigir
la atención del público y dejar claro cuál es la mayor importancia
en la escena. Johnson y Thomas la definieron como la presentación de
cualquier idea para que
quede completa e inconfundiblemente claro si
esa idea es una acción, una
personalidad, una
expresión o un estado Esto se puede hacer
por diversos medios, como la colocación de
un personaje en el marco, el uso de luz y sombra, o el ángulo y
posición de la cámara. La esencia de este principio
es mantener el foco en lo que es relevante y
evitar detalles innecesarios. Dado que lo único en nuestra
escena es nuestra animación de texto, este principio de animación
no nos aplica realmente, pero ¿por qué no aprovechamos esto como una oportunidad para estilizar un poco
nuestra animación Lo primero que voy
a hacer es arrastrar en esta paleta de colores que
hice en la página web de Coolers Voy a escalarlo y ponerlo en la
esquina de mi pantalla. Voy a crear
un nuevo fondo yendo a capas de nuevo sólido. Lo llamaré BG como fondo. Usa el seleccionador de color y
elige uno de mis colores. Arrastre esa nueva capa al
fondo de la pila de capas. Ahora voy a añadir un efecto de relleno
a mi animación de texto. De nuevo, voy a tomar
el recogedor de color y a lo mejor elegir este color azul
oscuro Copia el relleno, agrégalo a mis dos capas de puntos
pegándolo a mis capas de puntos azul y el naranja son
colores contrastantes, lo que significa ,
en otras palabras,
esta animación textual destacará
del fondo. Por cierto, tengo toda
una clase dedicada a elegir colores si acaso te interesa. ¿Por qué no para un
toque final fuera de viñeta? Las viñetas son excelentes para llamar
la atención de los espectadores hacia
el centro de la pantalla Crearé una nueva capa de forma
usando la herramienta rectángulo. Le renombraré viñeta
con la viñeta seleccionada. Voy a ir
a mi herramienta Elipse. Voy a asegurarme de que la herramienta
crea máscara esté seleccionada. Ahora podemos
hacer doble clic en la herramienta Elipse para crear una máscara sobre
nuestra capa de viñeta Tendremos que cambiar
el modo para restar. Trae la pluma
con la tecla F, y podemos arrastrar esta pluma hasta que consigamos una viñeta
bonita Para que la viñeta tome un tono más oscuro
del color de fondo, podemos cambiar el modo
de la capa para superponer Ahí vamos. La viñeta se ve un poco demasiado
saturada para mi gusto. Entonces lo primero que voy a hacer es volver
a subir la pluma. Sube la pluma
un poco más. Y otra cosa que podría hacer es sacar a colación la opacidad
con la tecla T, cambiar la opacidad al 50% Ahí, creo que
se ve genial.
12. Arco: La mayor parte de la acción natural tiende a seguir una
trajetoría arqueada y la animación debe adherirse a
este principio
siguiendo arcos implícitos Esta técnica se puede aplicar a una extremidad móvil
girando una articulación
o un objeto lanzado moviéndose
a lo largo de una trayectoria de parábola La excepción es el movimiento
mecánico, que normalmente se mueve
en líneas rectas. A medida que aumenta la velocidad
o el impulso de un objeto, arcos tienden a aplanarse en
movimiento hacia adelante y a
ampliarse Beisbol, una bola rápida
tendería a moverse en
línea más recta que otros lanzamientos, mientras que un patinador artístico que se mueve a máxima velocidad
no podría girar tan
bruscamente como un
patinador más lento y
tendría que cubrir más terreno
para completar Un objeto en movimiento que
se mueve fuera de su arco natural sin
razón aparente
aparecerá errático
en lugar de fluido Por ejemplo, al animar
un dedo señalador, el animador debe
estar seguro de que todos los dibujos entre
las dos poses extremas, la punta del dedo sigue
un arco lógico de un extremo al Los animadores tradicionales
tienden a dibujar el arco ligeramente sobre papel para que la
referencia se borre posteriormente Entonces, esencialmente, en
términos legos, parece mucho más natural
animar algo en forma de
arco u ovalado
que en línea recta Ahora bien, esto puede ser cierto para
cualquier tipo de animación, pero especialmente cierto para la animación de
personajes. Aquí hay un ejemplo de un
ciclo de caminata que hice hace un tiempo, y he mencionado
el camino de movimiento. Y como pueden ver, como el
pie sale del suelo, lugar de animarse en línea recta o
en forma de triángulo, lo
tengo animando en
más de forma ovalada, y esto es esencialmente lo que dice
el principio del arco Parece mucho más
natural animar algo en un arco que
animar recto. Entonces, ¿cómo podemos implementar esto
en nuestra propia animación de texto? Bueno, para esta animación básica de
texto, no
hay
mucho que podamos hacer, excepto por una cosa
que creo que
podemos hacer es quizás animar nuestra segunda animación de puntos para fuera de la pantalla
desde un lado, casi como si fuera
una pelota rebotando Entonces voy a sacar a colación la
posición para mi punto dos, y vamos a tener que ajustar esta animación para tenerla
animando desde Mantendremos nuestro segundo
fotograma clave igual. Iremos a nuestro primer fotograma clave, y voy a
mover la posición que esté animando
desde la derecha de la pantalla Ahora que lo tenemos animando desde
el lado de la pantalla, vamos a tener que
hacer algunos ajustes más para que se animen en
más de forma ovalada Primero, voy a incomodar a
los fotogramas clave por ahora,
solo para que esto sea más fácil solo para que esto sea más fácil Puede molestar a los fotogramas clave
seleccionándolos y
presionando Control y haciendo clic en los Entonces pienso a mitad de camino o
tal vez un poco pasado a mitad de camino, tendremos que agregar
otro Levantaremos un poco nuestra
posición Y. Ahora tendremos que suavizar
la curva de la trayectoria de movimiento Primero, voy a ir
a nuestro primer fotograma clave, y voy a mover la
posición Y un poco más hacia abajo, tal vez redondearlo a 60 negativo Voy a acercar
un poco nuestro segundo punto en
nuestra trayectoria de movimiento, y voy a
obtener la herramienta Pluma. Más específicamente,
voy a obtener la herramienta de vórtice de cambio, y voy a hacer
clic en este punto medio, y eso
lo suavizará un poco Y ahí vamos.
Estamos llegando ahí. Se ve un
poco más natural ahora. Ahora bien, este fotograma clave medio, voy a hacer clic derecho y voy a ir a
vagar a través del tiempo Si no sabes
lo que eso significa, significa que cuando vayamos a facilitar nuestros fotogramas clave en
el editor de grafos, los
seleccionaré, presionaré F nueve Nuestro fotograma clave de tiempo Rove Across ahora
es solo parte de
la trayectoria de movimiento, y realmente no tenemos que preocuparnos por
aliviarlo Sólo tenemos que facilitar nuestro
primer y último fotograma clave. Entonces, el segundo fotograma clave
solo está actuando más
como una trayectoria de movimiento Arrastraré el primer
mango hacia la derecha. Ahí, creo que eso se ve bien. Solo voy a
ajustar
un poco más la trayectoria de movimiento para
que se vea más como una curva porque
queremos que se vea más como si estuviera rebotando
desde fuera de la pantalla Entonces voy a ir a
mi primer fotograma clave, y voy a arrastrar más la posición
Y hacia abajo Y voy a
arrastrar las asas para el fotograma clave
del medio para que
tenga más forma ovalada Vamos a
bajar un poco más nuestro primer fotograma clave. Entonces voy a tomar
esta manija otra vez. Y ahora estamos consiguiendo
algo que se parece mucho más a un arco. G para arrastrar el otro
asa. Ahí vamos. Creo que se ve bastante bien. Sí, creo que se ve bien.
13. Los otros principios de la animación: Los dos últimos
principios de animación se aplican específicamente a la ilustración
y la animación de personajes, pero aún así los
repasaremos rápidamente. El principio del
dibujo sólido significa tomar en cuenta las formas en el espacio
tridimensional o darles
volumen y peso. El animador necesita ser un artista
hábil y tiene que entender los fundamentos de las formas
tridimensionales anatomía, peso, equilibrio, luz
y sombra, etcétera Para el animador clásico, esto se lograría a través de
la formación clásica, incluyendo amplias
clases de arte y dibujo de vida Una cosa en particular contra la
que Johnson y Thomas advirtieron
fue la creación de gemelos, personajes cuyos lados
izquierdo y derecho reflejaban entre sí
y parecían En la animación por computadora, los animadores informáticos
modernos dibujan menos debido a las
instalaciones que
les dan las computadoras , pero su trabajo se beneficia enormemente de una comprensión
básica los principios
de animación y sus adiciones a la animación básica por
computadora Este principio resalta
la importancia de una buena ilustración
en la animación. Y aunque no
siempre va a ser relevante para nosotros los diseñadores de
movimiento, a veces
seremos los ilustradores de nuestros propios motion graphics Por lo que sigue siendo importante
tener una comprensión básica de este principio y cómo podemos implementarlo en
nuestras propias creaciones. atractivo en un personaje de dibujos animados corresponde a lo que
llamaríamos carisma en un actor Un personaje que es atractivo no
es necesariamente comprensivo Los villanos o monstruos también
pueden ser atractivos. Lo importante
es que el espectador sienta que el personaje es
real e interesante. Existen varios
trucos para hacer que un personaje se conecte
mejor con el público. Para los personajes simpáticos, una cara simétrica o
particularmente
parecida a un bebé tiende
a ser atractiva cara complicada o difícil de leer carecerá de atractivo o cautivación en la composición de la pose o diseño del personaje Entonces este principio
sería mucho más relevante si estuviéramos haciendo animación de
personajes. El propósito de este
principio es hacer que tu personaje sea lo más agradable
posible para el público Pero como estamos haciendo
una animación de texto, no
vamos a
profundizar demasiado en este principio.
14. Perfeccionar nuestras animaciones (la etapa final): Entonces esta es la parte
del proceso donde
voy a repasar mi
animación y refinarla. Lo primero con lo
que no estoy muy contento es la animación
a escala. Creo que podría agregar
más seguimiento, así que voy a dirigirme
a mi texto de animación, y voy a modificar
la animación de escala
agregando más seguimiento
hasta el final de la animación de
escala Voy a empezar arrastrando mi último fotograma clave sobre algunos
fotogramas en la Voy a cambiar el
porcentaje de 100 a quizá 115. Me moveré a lo largo de tres
fotogramas en la línea de tiempo. Cambiar el porcentaje a 95. A lo mejor voy a arrastrar este
fotograma clave sobre otro fotograma. Ahora voy a repasar
otros tres fotogramas, y aquí es donde podemos cambiar nuestro porcentaje de nuevo a 100. Pero tenemos un poco más seguimiento a través de la
animación a nuestra escala. Creo que eso se ve mucho mejor. Incluso podría aumentar la escala en algunos
de nuestros fotogramas clave Voy a ir a este
fotograma clave, cambiarlo 130-145. Tendremos que cambiar
este fotograma clave porque queremos que
sean los mismos Entonces lo cambiaré a 145. Muévase a este fotograma clave,
tal vez cámbielo a 60%, diríjase a este fotograma clave En vez de 115, tal vez
vamos a subir a 120. El segundo último fotograma clave lo
cambiará a 90%. Y vamos a previsualizar
cómo se ve esto. Sí, eso me gusta mucho más. También creo que la
animación es un poco lenta cuando se está escalando hacia arriba. Entonces voy a encontrar un
punto en la línea de tiempo, tal vez por aquí y
voy a seleccionar todos estos fotogramas clave y los
voy a arrastrar. Ese es el fotograma 26 en la línea de tiempo. Es un adelanto.
Creo que eso se ve bien. Y, claro, no
podemos olvidar que
tenemos que editar nuestro editor gráfico. Recuerda, estoy usando
el gráfico de velocidad. Asegúrate de agarrar
el asa derecha. Solo mueve esa manija
fuera del camino. Ahí tenemos
el asa correcta, arrástrala un poco. Arrastra este un poco. Simplemente suavizando las curvas. Haremos lo mismo con
los dos últimos fotogramas clave. Y por supuesto, puedes usar la gráfica de valores si
lo deseas, si estás familiarizado
con la gráfica de valores. Así es como se
vería en la gráfica de valores si eliges
usar la gráfica de valores. Y recuerda, de nuevo,
puedes editar estos. Puedes editar tu animación
de la forma que quieras. Recuerda que el mío
es solo un ejemplo. Vamos a tener que
copiar los fotogramas clave de escala, y vamos a tener que
ponerlo en nuestra capa de puntos Sólo voy a
quitar la animación
presionando el cronómetro y luego
reprimirlo y
luego pegar los fotogramas Recuerda,
lo estamos haciendo en la capa A porque eso es lo que hacen referencia nuestras
capas de puntos Ahí ahora nuestros puntos tienen
la misma animación. Volvamos a nuestro comp principal y previsualicemos la animación ahora. También aproveché esto
como una oportunidad para volver a editar la animación del punto
dos, que pasé rápidamente, pero te voy a dar el
resumen de lo que cambié Básicamente solo
cambié el camino cambiando las coordenadas
de la posición. Aquí te mostraré
las nuevas coordenadas. Y también
ralentizo la animación arrastrando los
fotogramas clave en la línea Aquí tienes un pequeño consejo
que puedes usar. Puede seleccionar fotogramas clave,
mantener presionada la tecla Alt
y, como puede ver, arrastra los fotogramas clave proporcionalmente,
manteniendo
la misma fotogramas clave proporcionalmente,
manteniendo
la manteniendo Y arrastré el primer fotograma
clave al fotograma 17, y mantuve el último
fotograma clave en el mismo Entonces la animación
seguirá terminando en el mismo fotograma clave
que teníamos antes
15. Conclusión: Enhorabuena por completar esta clase de principios de animación. Siéntase libre de publicar sus proyectos
en la galería de proyectos. No puedo esperar a ver las
animaciones que creaste.
Tyler Bennett, Motion Graphics Designer & Photographer
