Eases avanzados: gráficos de movimiento de la base para arriba

1. Introducción: No estoy entrenado musicalmente. Solía decir, bueno hasta antes de la pandemia, supongo, y luego perdió el contacto un poco y no puedo cantar tan bien ahora necesito algo de práctica. Y aunque no estoy entrenado musicalmente, una cosa que me fascina mucho de la música, o de las hojas musicales o de las notaciones musicales es básicamente música que está escrita en papel, que se pueda leer. Y creo que los entrenados musicalmente también pueden escuchar la música en sus cabezas mientras la están leyendo, representando un fenómeno físico. El sonido y el tono sobre papel son asombrosos. Es notable lo que hemos podido hacer. Ahora antes de pasar a hablar de gráficos de movimiento, me gustaría continuar un poco más en el tema de las notaciones musicales y hablar de pero música, no, no lo es. ¿Qué crees que es? De hecho proviene de una pintura pintor renacentista Hieronymus Bosch en este tríptico acosado en esta esquina en este mar de caos es este tipo con anotaciones musicales escritas ahí. Pero la gente tiene, por supuesto, tratar de tocar esa música y tú seas el juez de lo buena o de lo mala que es. ¿Bien? El punto que estoy tratando de hacer es que se puede escribir un fenómeno físico o representar un fenómeno físico como la música en papel con bolígrafo. De igual manera, también se puede representar el movimiento en un papel con pluma utilizando tres líneas como estas. Como las notaciones musicales son para mí o para cualquiera que no esté entrenado musicalmente. Estas líneas tampoco transmiten mucho si no entiendes los gráficos de movimiento. Hola, mi nombre es Nash y en esta clase, quería entrenar tu cerebro para que mires las líneas como estas e imaginar movimiento pasando en tu cabeza. Imagina un movimiento sucediendo en tu cabeza y dibuja las líneas que corresponden a ese movimiento. Porque son los gráficos de movimiento y las cosas fáciles las que hacen o rompen en la animación. Incluso si tienes una hermosa animación, grandes colores y todo. Si las tardes y los gráficos de movimiento no son escritos, tu animación apestará. Eso lo digo con mucha confianza. Te voy a enseñar lo que significan estos gráficos en líneas y cómo manipularlos para crear hermosas animaciones, esta clase ha utilizado que ya sabes, los conceptos básicos de tu camino alrededor de After Effects como propiedades de keyframing, etc, cualquier cosa que se pueda cubrir en un curso rápido de YouTube de 10 minutos. Comenzaré desde lo básico y construiré encima de eso. Y también, sin dudarlo, te mostraré un poco de matemática que está involucrada en estas gráficas. Entonces, no perdamos el tiempo. Vamos. 2. Tasa de cambio: Bienvenidos a la primera lección de esta clase. El título de esta lección es tasa de cambio. Ahora, antes de entrar en por qué esta lección se llama tasa de cambio. Y las otras cosas, hay algo que quería compartir. La forma en que he estructurado esta lección es que te vas a alejar de esta lección con una y sólo una idea central al final de esta lección, no para llegar a esa idea, tendré que ir através de cierta cantidad de cálculos y alguna cantidad de matemáticas. No, no nada súper complejo, solo cosas simples para llegar ahí. Pero yo sólo quería exponerlo antes del inicio de la lección. Porque si llegas a una parte de la clase o de esta lección, que no necesariamente estás disfrutando por las matemáticas y todo. Yo sólo quería decirte que está bien. Si no entiendes eso, es solo una idea central de la clase con la que debes irte. Pero eso fuera del camino, sólo vamos a meternos en la carne de la clase. La diferencia entre cualquier cosa que sea estática y cualquier cosa que se anime como simple. En algo que es estático, nada está cambiando. Pero en algo que es animado o una animación, las cosas están cambiando y las cosas que están cambiando. Posición, tamaño, rotación, etcétera. De ahí que el bloque de construcción muy básico de cualquier animación sea el cambio. Y el cambio siempre se mide con respecto al tiempo. Cualquier cambio requiere que el tiempo también se esté moviendo hacia adelante en Pattern roll. Sin el movimiento del tiempo, sin la flecha del tiempo, no puede haber ningún cambio y no puede haber ninguna animación. Y de ahí que a esta parte de la interfaz de usuario de After Effects se le llame timeline Aquí puedes fregar de ida y vuelta en el tiempo y ver una animación sucediendo. Y si no lo ves, otra vez, entra en ventana y verás timeline. Tomemos el cuadrado por ejemplo, en el tiempo t es igual a 0, estableceré un fotograma clave para la rotación de 0 grados. Y en el momento t es igual a 1 segundo, lo rotaré de cuatro a cinco grados. Y si me frego, se puede ver girando. Ahora tomemos este mismo conjunto de acciones de establecer un fotograma clave en el tiempo t es igual a 0 para 0 grados y en el tiempo t es igual a 1 segundo para 45 grados y graficado en una gráfica muy simple. Ahora ya sabemos que necesitamos el movimiento del tiempo. Entonces dibujaré este eje plano y lo llamaré tiempo. Y dibujaré otro eje como este. Y voy a llamar a esto el eje de rotación. ¿ De acuerdo? Ahora, de nuevo, el mismo conjunto de acciones. Voy a seguir adelante y cambiar mi color a algo así como el azul. De acuerdo, entonces en el tiempo t es igual a 0 segundos, tenemos la rotación como 0 grados. Y digamos que aquí es el tiempo t igual a 1 segundo, tenemos la rotación. Y si dividimos este eje como diez grados, tasas 203040506070. Entonces esto podría ser diez grados, 20 grados, 3040 grados, 506070 grados, y así sucesivamente y así sucesivamente. 45 grados estarían en algún lugar por aquí. Entonces en el tiempo t es igual a 1 segundo, la rotación es de 45 grados, así que solo dibujaré un punto aquí. Genial. Ahora sólo voy a dibujar algunas líneas horizontales y verticales. Entonces a partir de t es igual a 1 segundo, sólo voy a dibujar esta línea. Y en el tiempo t en rotación de 45 grados, sólo voy a trazar esta línea. Entonces aquí es donde se cruzan y este es nuestro primero que es de 0004 a cinco a uno. Estos son todos estos dos, estos dos puntos básicamente dicen, ahora sigamos adelante y conectemos esos puntos usando un bonito, ya sabes, color amarillo. Si eso es visible, lo voy a hacer un poco más oscuro. Entonces voy a seguir adelante y conectar estos puntos así. De acuerdo. Y su VR, tenemos una gráfica y realmente no necesitamos este círculo aquí. Entonces yo sólo voy a seguir adelante y, ya sabes, solo, sólo voy a deshacerme de ello. De acuerdo, solo concéntrate en esta línea. Entonces tenemos una gráfica ahora. De acuerdo, genial. Ahora intentemos simplificar un poco esta gráfica. En primer lugar, no necesitamos estas líneas horizontales y verticales. Estas líneas punteadas solo estaban ahí para enfatizar que estos puntos se crean en su intersección y los puntos son lo único que realmente nos importa. A continuación, sabemos que dado que esta gráfica se dibuja en el contexto de la animación, el eje horizontal siempre será un eje de tiempo. Ahora vamos a dejar las divisiones, vamos a dejar estas divisiones aquí, pero podemos deshacernos de la etiqueta porque se entiende que esto siempre estará cronometrado, ¿verdad? Está implícito, se entiende. Vamos a dejar la rotación por aquí por ahora porque estamos lidiando con la rotación. Pero recuerda que en After Effects siempre estará trabajando dentro de propiedad, rotación o escala, o británico y etcétera. Y eso siempre estará implícito. Pero por ahora, Dejemos aquí la rotación. Tampoco necesitamos estas etiquetas aquí, ¿verdad? Porque todos nosotros, al final, verán que a todos nos importa esta gráfica aquí, ¿no? A eso estoy tratando de llegar. Sólo para simplificar un poco la gráfica y deshacerse de la información redundante. Una vez que hayamos hecho eso, una vez que lo hayamos limpiado un poco, uy, déjame solo limpiar un poco. Y si usas Procreate, sabes que esta app, estoy usando un iPad y Procreate, pero eso es como realmente totalmente no la parte de la clase. Pero bueno, al final, tenemos esta gráfica por aquí, ¿no? Lo que hicimos es que esto se entienda que este es tiempo, este eje, la propiedad en la que estamos trabajando, esta línea amarilla o verde, soy daltónica, no sé, pero esta línea de aquí es lo que supongamos que es tu primer gráfico de movimiento. De acuerdo, ahora, si vuelvo a After Effects a través de esta pequeña animación rehecha de este cuadrado giratorio, a la derecha. Podemos ir por aquí, clic en editor de gráficos, luego hacia arriba, ir a la derecha hacia abajo, hacer clic en Editar gráfico de valor y asegurarnos de que la propiedad de rotación está seleccionada. Y al hacer clic en él, exactamente la misma gráfica como esta. Mira eso. Y por eso dije que tal vez esto, ya sabes, si no estás familiarizado con la gráfica, esta es tu primera gráfica de movimiento. Ahora esto va de 045 grados es lo que cambia. Pero recuerda que el nombre de esta lección es tasa de cambio. Ahora, ¿qué es eso? Tasa de cambio es lo mismo que decir qué tan rápido está sucediendo el cambio o la velocidad del cambio y lo que está cambiando aquí de nuevo, el valor de una propiedad, el valor de una propiedad y el propiedad en cuestión en este momento es rotación. Volvamos a esta gráfica que esbozamos antes del cuadrado girando de 0 a 45 grados e intentemos averiguar la velocidad. Y la velocidad de una gráfica se mide mediante una fórmula simple. De acuerdo, habrá un poco de cálculo. De acuerdo, giro. Cierra el video ahora si no te interesa, solo bromeaba. No es tan complicado. Y no solo haré de tu peso tu tiempo aprendiendo algo que no usarás. Pero de todos modos, la velocidad se mide por una fórmula simple, que se divide por dx. ¿ De acuerdo? Ahora, aquí hay tres cosas que pueden ser nuevas para ti. D, y y X. Primero que nada, saquemos x e y del camino. Ahora presumo que ya lo sabes, pero déjame repasarlo una vez más en un plano bidimensional. Y hablaremos más de esto cuando lleguemos a cambiar la propiedad de posición y después de efectos, sólo hay dos direcciones. Puedes moverte, ya sea horizontal o vertical,en ya sea horizontal o vertical, lugar de llamarlo repetidamente vertical y horizontal, que son a la vez un bocado, convencionalmente aceptamos universalmente por todo el planeta. Etiquetamos la dirección horizontal como x y la dirección vertical como y Y sólo vamos a ignorar esa etiqueta de frío hielo, etiqueta en la última frase. Pero ese es el punto que llamamos la dirección horizontal x y la dirección vertical y. y si entiendes esta media, pues felicidades, entiendes el concepto de x e y en una gráfica. En nuestra gráfica aquí, tiempo está en la dirección horizontal. Entonces podemos decir que este es nuestro eje x de la gráfica o el eje horizontal y rotación o cualquier otra propiedad con la que estemos tratando. Un After Effects estará en la dirección vertical, o que podemos decir que es el eje y. Ahora x e y está fuera del camino. Qué es esta d Ahora, aquí es como voy a escribir la velocidad de rotación para esta animación, esta animación de símbolo cuadrado giratorio que creamos un After Effects. Lo que voy a hacer es que puedo escribir velocidad de rotación es igual a, por lo que va a 45 grados. Entonces 45, y empieza desde 0 grados. Entonces 0 negativo, alcanza de cuatro a cinco grados a 1 segundo y empieza desde 0 segundos, por lo que menos 0. Entonces esto sería de 45 grados por 1 segundo, lo que implica que la velocidad de rotación es 45 grados por segundo. Y esta resta aquí mismo, esta resta o resta, ¿cómo la llamas? No lo sé. Esta resta es lo que se llama Delta, y está representada por el símbolo griego de delta o en lugar de delta, lo que se puede usar es solo una letra minúscula D. Ahora hay algunos matices de cálculo donde debes usar Delta y dónde deberías usar D. Pero eso no nos concierne realmente. Estamos bien para ir. Todo esto fue solo para mostrarles que esta es la gráfica de un cuadrado que está girando a 45 grados por segundo, ¿verdad? Entonces déjame deshacerme de todas las matemáticas aquí. Ahora lo que voy a hacer es seleccionar un color diferente. Voy a seleccionar este color. Y voy a dibujar otra gráfica, pero una que sea un poco más pronunciada que esta, ¿no? Entonces déjame dibujar algo como esto. Un poco más empinada que esto, ¿verdad? Un poco más empinada que esto. Como pueden ver que esta gráfica de aquí mismo, la original, es más plana que esta gráfica, esta nueva gráfica que dibujé. Ahora me dices esto, el objeto con esta gráfica para rotación, el nuevo, rotaremos más rápido que este o más lento. Ahora piénsalo. Sí, rotará más rápido porque está cubriendo más. Está girando más de 45 grados en la misma cantidad de tiempo para obtenerlo. Ahora deja que esto se hunda. Este es el único concepto importante que vas a quitar de esta lección. Ahora permítanme volver a After Effects a esta sencilla animación que creamos. Voy a seguir adelante y seleccionar esta capa presiona Comando D para duplicarla. Y antes de seguir adelante y hacer cualquier otra cosa, veamos una vez más la rotación, el gráfico de movimiento de la rotación justo aquí y ahora ocupa toda el Área de la línea de tiempo, que se debe a que esta opción está seleccionada, que es la altura del gráfico de zoom automático. Vamos a apagar eso que nos sea más fácil para que nos sea más fácilver la diferencia de lo que vamos a hacer. Ahora, acabamos de duplicado esta capa. Voy a esconder el original. Voy a seguir adelante y seleccionar la nueva capa, presionar R para subir la rotación. Y se puede ver que como lo duplicamos, es exactamente lo mismo. Pero lo que voy a hacer es aumentar su velocidad. Y una forma de hacerlo es aumentar la cantidad que gira. Entonces ahora este cuadrado gira 75 grados en 1 segundo, y este cuadrado giró 45 grados en 1 segundo. Entonces echemos un vistazo a sus gráficas. Voy a seleccionar rotación del original. Y se puede ver esta es la gráfica. Y ahora voy a seguir adelante y seleccionar la propiedad de rotación de la más nueva. Y ahí vas. Como pueden ver, la gráfica es más pronunciada y espero que estén entendiendo a lo que me refiero cuando digo más pronunciada, significa que es lo que es, está más lejos. Este ángulo de aquí está más lejos, más del suelo para esta gráfica, luego para esta gráfica. Así que más plana, más empinada, más plana, más pronunciada, rotación más rápida, gráfica más pronunciada, rotación más lenta, gráfica más plana. Y de la misma manera si dibujara otra gráfica que era más plana como algo así, ¿no? Este de aquí mismo. ¿ Te imaginas la velocidad del objeto? Pero esta gráfica de rotación, por supuesto, será más lenta porque está rotando menos en la misma cantidad de tiempo. Y permítanme reforzar eso volviendo de nuevo a After Effects. Voy a seguir adelante y duplicar esta plaza otra vez. Y lo que voy a hacer con este cuadrado duplicado es presionar R para que aparezca la rotación, y lo voy a rotar como 20 grados en 1 segundo. La velocidad de este cuadrado está girando 20 grados en 1 segundo. Como puedes ver, es bastante lento, ¿no? Y si sigo adelante y miro su gráfica, es más plana, más plana, más lenta, un poco más rápida, más rápida. Por lo que como se puede ver, la gráfica cambiando de, de más plana hacer más empinada a más empinada a medida que la velocidad de la rotación va en aumento. Entonces así es como se puede interpretar, correlacionar lo empinada o plana que es la gráfica y qué tan rápido está sucediendo la rotación o cualquier cambio en la propiedad. Ahora antes de salir de este video con la perspicacia que hemos conseguido, déjame seguir adelante y darte un ejemplo más para que se haga más concreto. Entonces voy a eliminar extra estas capas. Voy a seguir adelante y eliminar cualquier fotograma clave de la rotación. De acuerdo, entonces esto es sólo un cuadrado normal. Déjame girarlo hacia atrás 0. Seguiré adelante y presionaré S seleccionando esto y sacaré a colación la propiedad de la báscula. Y voy a seguir adelante y mantener la báscula en un 100 a t igual a 0 segundos. O puedo ir en cualquier momento. Y luego otra vez, puedo aumentar su escala a algo así como 150, ¿verdad? Entonces se puede ver que así es como está cambiando de ciento, doscientos cincuenta. Echemos un vistazo a la gráfica de esta animación y se puede ver que está de nuevo, la misma gráfica de ella aumentando así. Ahora, duplicarlo y luego nuevo presiona S y déjame aumentar la velocidad de la misma. ¿ Cómo puedo aumentar la velocidad haciendo que vaya 200 por ciento en 1 segundo? Para que puedas ver como boop, es más rápido. Y si miro su gráfica, se puede ver que esa es más pronunciada, más pronunciada, más plana, más pronunciada , más plana, más plana equivale más lenta, más pronunciada es igual más rápida, ¿verdad? Y no es magia, matemáticas porque cuando la gráfica es más pronunciada, la misma cantidad de cambios suceden en menor tiempo o más cambios suceden en el mismo tiempo. Y de ahí que la animación sea más lenta o más rápida. Y con eso, terminamos con esta lección. La única idea clara de que una idea central de la que estaba hablando con la que te vas a ir fue, cuando la gráfica es más plana, cuando la gráfica es más plana, las cosas se mueven más despacio y cuando la gráfica es más empinada, las cosas se mueven más rápido . Tan lento, rápido, rápido, rápido, rápido, rápido. Y esa es la idea central y espero que la hayas entendido y espero que te vayas con esa idea. A partir de esta lección. Enla siguiente lección hablaremos más sobre flexibilización, diferentes tipos de flexibilización y por qué se llaman. Por lo que me tomaría un breve descanso. Te veré pronto. 3. Easing (s): De acuerdo, Así que aquí estás. Vamos a saltar a la derecha y saber recapitulado. Vale, un poco de recapitulación. En la lección anterior, dejamos en esta gráfica. Si puedes verlo muestra básicamente cómo una propiedad está cambiando con el tiempo. Y aprendimos que cuanto más empinada es la gráfica, más rápido ocurre el cambio y plana es la gráfica mientras más lento ocurre el cambio. Ahora cuando se trata de flexibilizar, easing no es realmente una palabra en inglés, supongo que no la vas a encontrar en el diccionario. Me costó mucho pensar en una forma explicarlo a alguien que nunca lo había escuchado antes. Así que presta mucha atención. Facilitación es básicamente cómo un cambio en la propiedad sucede con el tiempo, cómo se ralentiza, acelera, etc Hay muchos tipos de flexibilización que los diseñadores de movimiento utilizan facilidad en, facilidad de salida, facilidad Expo y facilitar Expo hacia fuera, etcétera. Y todo esto será más claro medida que progresemos en la clase. No tienes que tener un 100% de comprensión de esto. ¿ De acuerdo? Ahora bien, esta gráfica aquí representa una flexibilización colineal flexibilizadora, esta gráfica que es muy solo una línea recta inclinada. Y la flexibilización lineal es la clase de flexibilización más aburrida que hay. ¿ Se puede decir por qué? Es? Porque todo el cambio en el valor de una propiedad ocurre a una velocidad constante. Al igual que si toco esto, sucede tenía una velocidad constante, que no es como se mueven las cosas en la vida real. Ahora bien, si te pidiera trazar una constante gráfica en papel, ¿cómo se vería? Una constante como, por ejemplo, este es tiempo, claro, pero una constante podría ser cualquier cosa. Podría ser el número dos, Número, Número uno, Número diez, o lo que sea. ¿ Cómo sería la gráfica de una constante? Ya sabes cómo se verá si selecciono el color verde, totalmente arbitrario. El verde no tiene nada que ver con la gráfica. Entonces la gráfica de una constante, nos veremos algo así, lo que significa que a medida que pasa el tiempo, se mantiene igual. No hay cambio en la constante, pero con una velocidad constante no es como se mueven las cosas en la vida real. En la vida real dicen que cuando el auto arranca, empieza lento y luego coge velocidad. Y luego a medida que se va desacelerando, se ralentiza gradualmente. O cuando haces rodar una pelota, comienza a una buena velocidad pero luego salones lentamente debido a la fricción. Hay algo que te voy a mostrar en After Effects. Sólo un pequeño vistazo de algo. ¿ De acuerdo? Por lo que hay dos tipos de gráficas en After Effects. Ahí está la gráfica de valores, que muestra cómo el, el valor de una propiedad cambia con el tiempo. Y luego está el gráfico de velocidad que muestra los cambios de velocidad a lo largo del tiempo. Y si hago clic aquí, lo que verán es esta es la gráfica de velocidad y la gráfica de una constante que dibujamos aquí, lo que significa que el tiempo pedido pasa, se queda igual. Por lo que la velocidad de esta animación se mantiene igual a lo largo de su duración. Y por eso es muy robótica, muy antinatural y en realidad no se ve bien. Y este tiempo de flexibilización es lo que se llama flexibilización lineal. Ahora Value Graph y speed graph están muy conectados y te lo mostraré más adelante. Pero en este momento se siente seguro olvidar que el gráfico de velocidad incluso existe. Cambiemos un poco las cosas ahora. Volvamos a nuestra línea de tiempo haciendo clic hacia fuera si el editor de gráficos, seleccionaré el primer fotograma clave. Voy a hacer clic derecho en él e ir al asistente de fotogramas clave y elegir Fácil, Facilidad, bien, y usted puede notar que la forma del fotograma clave cambia, que discutiremos más adelante. Ahora bien, si toco esa animación, fíjate como que va a empezar lento y luego en algún momento empezar a moverse a una velocidad constante. De acuerdo, listos, presten atención, voy a tocar la animación. Comienza lento y luego comienza a sangrar a una velocidad constante. Y luego solo moveré este fotograma clave un poco más adelante para que puedas conseguir que tengan más sensación de la animación. Entonces hago clic en Reproducir, empieza lento y luego empieza a moverse a una velocidad constante. Ahora si echamos un vistazo a la gráfica de valores, que muestra la gráfica de cómo cambia el valor de una propiedad con el tiempo. Podemos ver un cierto, la curva aquí. Si tu gráfica no está, es como totalmente alejada, puedes hacer clic aquí, que dice Ajustar gráfico a la vista y simplemente lo estirará para que encaje correctamente. Eso se puede hacer. Y se puede notar que la gráfica ya no es una línea recta debido a la curva de aquí. Ahora bien, ¿cómo leemos una gráfica que está curvada así? Y esta es una gráfica interna muy grande. Va a haber injertos que están retorcidos y demás. ¿ Y cómo leemos esos? Bueno, no es tan difícil. Todo lo que tienes que hacer es recordar que cualquier gráfica o cualquier curva está compuesta por una gran cantidad de puntos como estos. Este es un punto, este es un punto, es un punto, este es un punto. Entonces se compone de muchos puntos como estos. Ahora lo que tienes que hacer es dibujar mentalmente tangente en cada uno de estos puntos o algunos de estos puntos, ¿verdad? Pero primero, ¿qué es una tangente? Una tangente es solo una línea recta que toca una curva en un punto. Entonces si esto es una curva, entonces tangente podría ser esto. Es una línea recta que toca esta curva en este punto, ¿verdad? Para que puedas dibujar tantas tangentes como calientes ahí. Entonces escojamos este punto y dibujemos una tangente. Escogeré este punto y dibujaré una tangente. Escogeré este punto y dibujaré una tangente. Escogeré este punto y dibujaré una tangente como esta. Y recuerden lo que hablamos antes. empinado, más empinado equivale a más rápido y más plano. Igual a más lento. Pero mira esto, la propiedad que sigue esta gráfica. Entonces esta tangente de aquí es más plana, entonces la velocidad es lenta, luego más plana aún aumentar un poco, ¿verdad? Y luego de nuevo, se vuelve más pronunciada y más pronunciada hasta que alcanza todas las tangentes en realidad son del mismo ángulo o igualmente empinadas o iguales E planas. Entonces básicamente empieza lento, y luego alcanza un punto de velocidad constante. Y eso es lo que está pasando aquí también. Ya ves que es la misma gráfica. Entonces la tangente es más plana, más plana, más plana, y luego alcanza velocidades de cuenta. Imagina esto. Voy a seguir adelante y hacer un poco de manipulación gráfica. No mucho, sólo para reforzar el punto. Y si jalo esto, estoy sosteniendo Shift para que se mueva en línea recta. Jalo de esto y lo hago más plano. De acuerdo, entonces si dibujo una tangente en este punto, será casi plana, así que la velocidad casi será 0, y luego se quedará con una velocidad más lenta durante más tiempo. Entonces si toco esta animación, mira esto. Sí, empieza bastante lento y luego retoma. Entonces déjame seguir adelante y estirar un poco más esta animación para que puedas entenderla mejor. Y voy a seguir adelante y reproducirlo para que puedan ver que pasa tanto tiempo antes de que empiece a girar porque la velocidad es lenta durante toda esta duración. Por lo que de nuevo, fregar esto, mira la gráfica, qué tan plana es y qué menos se está moviendo durante la parte plana. Y si lo hago plano o quieto, se puede ver que tardará más tiempo en empezar. Entonces, de nuevo, recuerda que esta es la gráfica de valores con la que estás lidiando. Estamos ignorando gráfico de velocidad por ahora. Y sí, entonces en el gráfico de valores, cuanto más plano es, más lento se mueve y luego lentamente coge velocidad. De acuerdo, Ahora, va a haber alguna nomenclatura que estaremos usando descargo de responsabilidad de engranaje. Ahora bien, si nos fijamos en toda esta gráfica, esta gráfica de valores como un todo, llamemos a este lado el lado izquierdo, el interior. Muy bien. El lado derecho, el exterior. Ahora estaremos haciendo algo similar cuando realmente estábamos hablando de flexibilizar app en nodos individuales. Después, tendremos un interior y un exterior. Pero ahí es donde entonces solo les estaba dando un aviso. Entonces en esta gráfica en su conjunto, el lado izquierdo aquí es el interior, este es el lado de entrada, y este lado de aquí es el exterior. Ahora como se puede ver en esta gráfica, hay flexibilización aplicada en el interior, ¿verdad? Y de ahí que podamos llamar a esta gráfica la facilidad en grafo, si traigo en este sitio web llamado flexibilización es dotnet. Simplemente muestra todas diferentes, algunas clases diferentes de cosas. Por supuesto, ningún sitio web puede cubrir cada pequeño cambio en curva. Pero mira todas las curvas que tienen 0s n frente a ellos. Todos ellos tienen alguna flexibilización en el interior de la gráfica, ¿verdad? Está adentro, ahí vas, allá vamos. Hay algo de flexibilización aquí, ¿verdad? Y de manera similar, y de manera similar en esta gráfica, si sigo adelante y elimino flexibilización de este punto, lo cual se puede hacer simplemente volviendo a la línea de tiempo Command Plus click and gear para que no haya flexibilizando. Y si sigo adelante y aplico flexibilización a este fotograma clave yendo a asistente de fotogramas clave y facilidad fácil, puede ver que esto se convierte un gráfico de facilidad de salida porque hay flexibilización en el fuera de esta animación. Y de nuevo, si traigo a colación ese sitio web, se puede ver que todas las Ease Outs tienen algún tipo de curva sucediendo aquí. Facilidad hacia fuera, aliviar el frío. Todos estos tienen algún tipo de curvas sucediendo aquí. Entonces espero que entiendas cuando llamas a una gráfica, facilidad de entrada y cuando lo llamas gráfico facilidad de salida. Y no hace falta decir que ya aprendiste a leer el tipo de gráfica es que las tangentes aquí están formando el mismo ángulo desde aquí. Entonces son la pendiente similar si eso es una palabra y luego empieza a aplanarse aquí, lo que significa que comenzará a una velocidad constante y luego se ralentizará. Se va a salir. Ahora hay algunos valores matemáticos precisos que After Effects, se aplica a estos gráficos cuando se sigue adelante y se aplica algún tipo de asistente de fotogramas clave y luego fácil facilidad y vamos a hablan más sobre los valores por defecto y cómo manipularlos más adelante en las próximas clases. Ahora, si sigo adelante y aplico flexibilización a este fotograma clave al ir al asistente de fotogramas clave y aplicar facilidad fácil. Se puede ver que ahora tiene flexibilización en ambos lados. Y a esta gráfica se le llama una gráfica de entrada y salida de facilidad. Y recuerda que aquí estamos hablando de esta gráfica en su conjunto. Toda esta gráfica de valores. Ahora hasta ahora, ya sabes de en gráfico, sobre el gráfico de Ease Out, sabes de la facilidad en nuestra gráfica, y también sabes sobre la aburrida gráfica lineal. Ahora, todas estas cosas son la plantilla muy básica, cosas fáciles que solo puedes agregar a tu animación para que sea un poco un poco más natural, un poco más interesante, pero nada mucho con toda esta información. Ahora en su cabeza, estamos listos para comenzar a trabajar en un proyecto que requerirá una tonelada de juguetear con gráficos de movimiento para obtener un cambio deseado. Entonces eso es algo que estaremos haciendo en la siguiente clase. Y no puedo esperar a empezar a trabajar en ello. Tómate un breve descanso y te veré en el siguiente. Es decir, la siguiente lección. 4. Tu escritura es única: Aquí tienes un secreto. Es posible que no lo sepas. Es que tu letra es única. Muy único. Y no creo que alguna vez podamos copiar la letra de alguien a la t. Quiero decir, hay tanto que entra en lo desarrolla nuestra caligrafía y que desarrolla nuestra caligrafía yla hace ver como lo hace. Tenía un amigo cuando era bastante joven y él tenía una letra hermosa y más que nada, me encantó mucho la forma en que escribió para ello y así lo copié. Hay tantas instancias y ocurrencias de este tipo que se han filtrado en la personalidad de mi letra, la mayoría de las cuales ni siquiera recuerdo. ¿ Ni siquiera recuerdas el último año mientras hacías platos? Juré que me pego el pulgar y eso cambió bastante mi letra. Sólo quería sólo quería esperar a que fuera. Todavía no se cura adecuadamente. No hay más proyecto. En esta lección, vamos a animar la escritura a mano, mi letra. ¿ Tu letra, la de alguien más? Y todo depende de cómo decidas seguir adelante con el proyecto. Ahora, si entras a la sección de proyectos y recursos aquí en Skillshare y descarga los archivos. Debajo de la carpeta principal, encontrarás esta otra carpeta llamada ocurrida. Dentro de esta carpeta, este archivo llamado archivo de inicio, y es necesario hacer doble clic y abrirlo. Lo que verán es este carrito escrito en mi letra, me preguntaba justo en mi nombre, aquí Nash, pero eso va a ser demasiado de autoindulgencia ya que leí el nombre de uno de mis escritores favoritos, Kurt Vonnegut. Están listos para empezar si quieres saber cómo es este Curt, esta aquí mismo, Dios aquí. Yo sólo lo rastreé. Lo escribí en papel, y lo rastreé en Illustrator e importé este camino a After Effects. Si quieres hacer eso y no trabajar en este archivo, simplemente noquearte, anotar algo, trazarlo en Illustrator y llevarlo a After Effects, y simplemente continuar como voy a seguir con este archivo justo por aquí. Ahora hay dos capas que notarás aquí. Primero está Kurt, escrito en cursiva, ¿de acuerdo? Y el segundo es sólo la cruz de esta t aquí. Este es un segundo. Entonces ocurrieron dos capas y la cruz T. De acuerdo, genial, hora de empezar, Javier, vamos a empezar es así. Haré algo con la cuajada escrita aquí, esta capa. Y luego dejaré que le hagan lo mismo a la cruz T, ¿verdad? Entonces después de que termine, solo pausar el video y ver si puedes hacer el mismo conjunto de acciones en T cross. De acuerdo, así que sólo voy a esconder un poco la cruz T y concentrarme por aquí. Entonces lo primero que querrás hacer es que quieras desenvolver, ¿verdad? Y entonces verás los contenidos. Voy a entrar en Agregar clic aquí, y voy a seguir adelante y agregar trazados de recorte. Ahora lo que hace los trazados de recorte es darle estas dos opciones, inicio y un desfase. Y lo que puedes hacer usando esto es básicamente si arrastras y puedes hacer que parezca que se está escribiendo. Entonces eso es muy chulo. Entonces dejémoslo aquí. He añadido trazados de recorte, y vamos a seguir adelante y hacer lo mismo con T cross. Entonces lo desvelaré. Es para que hagas no esperes a que me deje de seguirme. Voy a entrar en Add y voy a seguir adelante y añadir trazados de recorte. Y como pueden ver, aquí también se agregan estas tres opciones . Y ahí estás. Ocultemos de nuevo la cruz T y empecemos a concentrarnos en este gran pedazo de texto aquí, que es Kurt sin la cruz T. Y recuerden que ya les he agregado trazados de recorte a ambos. Ahora voy a seguir adelante y hacer esto, establecer un fotograma clave en t igual a 0 para fin, y voy a cambiar el final para ser 0 aquí, así que sólo 0. Y ahora me voy a adelantar a 1 segundo. Y voy a seguir adelante y poner n a 100, ¿verdad? Y si lo toco ahora, se puede ver que si parece que se está escribiendo, genial. Tenemos una animación sencilla ahora. Bueno, pero qué atrapando un bolígrafo y un papel si lo tienes cerca. Y fíjate que cuando escribes curt o cualquier cosa, el bolígrafo no se mueve a una velocidad constante. Es una especie de velocidades en algún momento y se ralentiza en las curvas, etcétera, ¿no? Vamos a recrear la misma variación de velocidad y After Effects. Ahora, comencemos. Ahora puedo fregar a través de la línea de tiempo para ver cómo está progresando la animación. Y puedo usar esto para identificar puntos donde están enrollando, se ralentiza y crea fotogramas clave ahí. Entonces el rizo de este tallo caso aquí es donde crearemos un fotograma clave. Entonces todo lo que tienes que hacer es dejar de fregar aquí, ir aquí y dar clic aquí. Entonces agrega un fotograma clave aquí. La k es curva de cara es otro punto donde la escritura de la Iglesia se ralentiza. Así que voy a seguir adelante y crear otro fotograma clave aquí. Ahora, sigamos adelante. Y creo que simplemente te dejaremos ser como está y añadir otro fotograma clave en este punto de arco. Así que voy a añadir un fotograma clave aquí y luego adelante y añadir otro fotograma clave para la curva de t aquí. De acuerdo, Así que acabamos de identificar puntos donde quisiéramos que la animación se ralentizara un poco. Porque cuando estás escribiendo tus manos como que toma su tiempo para escribir estas curvas, ¿verdad? Entonces si vuelvo a reproducir la animación, será lo mismo. No habrá variación en absoluto porque realmente no hemos jugado, jugado con las gráficas todavía, ¿verdad? Se acaba de agregar fotogramas clave. Ahora sigamos adelante y echemos un vistazo a la gráfica. Y para recoger la gráfica, vas a dar clic aquí y asegurarte de que esta propiedad seleccionada, que está terminada por ahora. Y también asegúrate de que estás mirando el gráfico de valores y no el gráfico de velocidad. Y mira la gráfica, es más o menos recta, más o menos se asemeja a la gráfica lineal. Y por lo tanto no hay velocidad de vibración, no hay personalidad, ningún matiz dice en absoluto, vamos a cambiar eso, pero antes de ese tiempo por un atajo. Ahora, recuerda cómo en la lección anterior te dije puedes seleccionar el fotograma clave. Haga clic con el botón derecho, vaya al asistente de fotogramas clave y fácil facilidad. Bueno, solo son buenos para eso, pero solo escrito justo por aquí, Es F9, ¿no? Entonces lo que puedes hacer es seleccionar todos los fotogramas clave y luego presionar F9 y tener en cuenta que en algunos teclados, así que tienes que tirar de la tecla de función antes de presionar F9, ¿verdad? Así que voy a seguir adelante, mantenga pulsada la tecla de función, presione F9 y mire eso, cómo ha cambiado la forma de los fotogramas clave y lo que haciendo esto agregando Easy Ease también hace es que en el gráfico verás que también agrega asas para mostrar los fotogramas clave para una fácil manipulación. Si estás viendo tu gráfica bastante apretada hacia el lado izquierdo, puedes seguir adelante y hacer clic en este botón aquí que dice Ajustar todos los gráficos para ver y simplemente lo estiraremos, lo ajustan para que sea fácil de manipular. Pero lo que hay que notar aquí es que cómo cambia la forma del gráfico una vez Fácil, Facilidad como Abbott y si toco la animación ahora, notarás que hay muy meniscal de una diferencia, no es algo que realmente puedas notar. Pero sigamos adelante y empecemos a jugar con la gráfica. Alejaré un poco el lienzo. Seleccionaré nuevamente la propiedad final para que salga la gráfica. Déjame alejarme un poco y empezar a jugar. Comencemos con este marco clave justo por aquí que compensa el rizo de la k No recuerdo que lo que discutimos y el quid de todos los videos antes esto es que para una gráfica de valores, plano equivale a más lento y más empinado es más rápido. Entonces ahora mismo, justo por aquí, la gráfica es súper plana, ¿de acuerdo? No es súper plano, es un poco plano, pero sigamos adelante y tratemos de hacerlo súper plano. ¿Y cómo hacemos eso? ¿ Simplemente extendemos esto? Por lo que si mantienes pulsado Shift, puedes hacer que se mueva en línea recta. Si no mantienes turno y se tambalea. Entonces voy a mantener turno y sacar esto adelante. Y voy a mantener shift y mover esta hacia atrás para que esta área sea súper plana y esta área corresponda a esta curva si k Así que empecemos a reproducir esta parte de la animación otra vez. Y se puede ver que hay una ligera desaceleración. Y luego otra vez, podemos retroceder un poco, ¿verdad? Golpea el punto correcto. Y notarás que mientras manipulas gráficas, habrá montones de minúsculos atrás y adelante, cuartos de ida y vuelta que tendrás que hacer para conseguir una cierta flexibilización, ¿verdad? Correcto. Entonces eso es lo que estoy haciendo aquí. Y estos, estos puntos amarillos, espero que sepan, ya corresponden al fotograma clave. Así que al moverlo aquí también se mueve el fotograma clave en la línea de tiempo. Ahora en este punto, sabes que hacer esto más plano ralentiza la animación y sabemos que todas las curvas varían. Quieres ralentizar la animación y todos están representados por estos puntos, estos puntos donde cambia la gráfica. Y puedes seguir adelante e intentar hacerlo por tu cuenta. Porque lo que voy a hacer ahora, es un trabajo muy manual o simplemente puedes verme hacerlo. Lo que sea, tú decides hora para este bucle de k Así que de nuevo, lo voy a hacer más halagador. Puedo seguir adelante y mantener presionada la tecla Shift, arrastrarla para que se vea más plana y también te va a tener que gustar jugarlo una y otra vez. Y lo que puedes hacer en After Effects es recortar tu área de trabajo hasta cierto punto para que sólo sustituya esa parte. Para que pueda seguir adelante y arrastrar esto así. Y puedo seguir adelante y puedo hacer zoom para que cuando se reproduzca, simplemente salga de esta área que estoy tratando de ver toda la animación. ¿ Verdad? Entonces sí, eso se ve bastante bien. De acuerdo. De acuerdo, ahí se ralentiza. Para hacerlo más lento un poco aquí. Entonces hagámoslo plano. De acuerdo, permítanme extender esto a toda la zona. Y entonces puedo seguir adelante y hacer el bucle de las T un poco. Y el final es algo que vamos a manipular un poco para que parezca que llega al final. Entonces voy a extender esto y conocer al súper plano, ¿no? Entonces hay un bonito, Hay una agradable desaceleración al final. Si no llegas a cobrar ralentización, también puede simplemente mover este fotograma clave un poco más adelante, así. Entonces te vuelves un poco más lento. También puedo mover esto así, solo asegurándome de que se quede plano en su mayor parte. Así que vamos de verdad, sí, bastante cool. Déjametocarla otra vez. Vemos que es no lineal, además hay un poco de personalidad a la escritura ahora. Por lo que de nuevo, déjame seguir adelante y tocarlo. Fresco. Yo lo voy a hacer es hacer que la animación tome un poco más de tiempo. Así que cuando puedo hacer es seleccionar todos los fotogramas clave, mantener pulsada Opción en Mac o Alt en Windows, y arrástrela para que estire los fotogramas clave así, así que eso lleva un poco más de tiempo y también asegurarme el área de trabajo le lleve suficiente espacio. Sí, ¿ves eso? Esa es una, esa es una linda animación. Ahora traigamos la cruz T para la guinda final de la animación, voy a colapsar esta altura que traiga, traigan la t cruz hacia arriba. Si has estado siguiendo a lo largo, puedes seguir adelante y darle un tiro por tu cuenta, animando el T cross el estructurado animado, swish, rápido al principio y luego ralentizar al final. Entonces dale un grito si quieres. Y mientras estás haciendo eso, yo mismo le daré un tiro. Entonces voy a bajar y fosforilar, ir a la propiedad final. Voy a seguir adelante y crear un fotograma clave, que sea 0. Adelante un poco. Y lo voy a hacer un 100%. Y ahora si lo toco, se puede ver eso, Woo, sí, muy lineal, muy malo. No me gusta eso. Entonces selecciona el fotograma clave. Fotogramas clave. Prensa acabo de decir mantener, re, bien, entonces, así que me gustan los fotogramas clave, presione F9 para agregar flexibilización. Y entonces sigamos adelante y tratemos de manipular. Y voy a acercar un poco la gráfica. Lo primero que queremos es empezar rápido. Entonces quieres asegurarte de que las tangentes que se dibujan este, este lado de la curva son bastante empinadas. Entonces, ¿cómo hacemos eso? ¿Cómo nos ponemos empinados? Simplemente haz que se mueva así. Entonces quise ir más despacio hacia el Android. Para que pueda seguir adelante y hacerlo más empinado. A ver cuánto más profundo puedo hacer. Entonces lo haré como realmente empinado. Y entonces a medida que llegue a este punto se aplana, simplemente se ralentizará. Entonces déjame seguir adelante y tocarlo. Sí. Correcto. Entonces empieza rápido y luego boom, se vuelve más lento. Voy a hacerlo más empinado en realidad. Entonces voy a seguir adelante y volver a intentarlo. Entonces me gusta esto, me gusta esto, y voy a seguir adelante y acercarlo para que esto pase más rápido, ¿no? Entonces sí, eso me gusta. Voy a seguir adelante y dar vuelta de nuevo para poder ajustar la posición de los fotogramas clave correctamente. Por lo que voy a seleccionar las gráficas PTE mama te para revelar todos los fotogramas clave que ahora tiene. Y voy a seguir adelante y digamos que a medida que llegue a este punto, quiero que suceda la animación T cross. Así que voy a ir a seleccionar ambos fotogramas clave manteniendo presionada Shift y arrastrarlos aquí, ¿verdad? Entonces déjame seguir adelante y volver a reproducir esa animación. ¿De acuerdo? Sí, o tal vez sabes qué, puedes esperar a que toda la T esté escrita como naturalmente. Entonces déjame seguir adelante y echarle un vistazo de nuevo. Apenas algunos ajustes menores aquí y allá. Sí, así que voy a seguir adelante y volver a tocar toda la animación. Y se puede ver que está bastante bien. Y lo he hecho deliberadamente como muy lento aquí, que puedes notar como en las curvas. Y si quieres hacerlo un poco más rápido, ya sabes qué hacer. Ir a la, ir a la gráfica. Selecciona final aquí y hazlo un poco menos plano. ¿ Y cómo se hace algo un poco menos plano? Sólo tienes que seguir adelante y moverlo así. Y si notas que solo un lado de tu curva está cambiando y el otro lado no responde. Lo que puedes hacer es hacer clic con el botón derecho aquí y seleccionar Fotogramas clave. interpolación de fotogramas clave cambió de Bezier a bezier continuo. Y si haces clic en Ok, puedes ver que puedes cambiar ambos lados con los fotogramas clave. Entonces voy a hacer un poco, un poco menos plano para que no quede totalmente Hall dan punto punto. Sí. Bastante guay, ¿verdad? Y eso es lo que voy a hacer aquí. Haga clic con el botón derecho en Interpolación de fotogramas clave, cambie a bezier continuo y luego hágalo un poco menos plano. Y luego lo mismo aquí a la interpolación clave-marco. Bézier continuo y sí, sí, Cool, cool, un poco menos plano, no totalmente todo. Entonces ahora si lo ejecuto, puedes ver, sí, eso está bastante bien, ¿no? Como si estuvieras viendo que se necesita un par de espalda y forths para hacerlo bien. Creo que ya casi hemos terminado aquí y he transmitido cómo usar el gráfico de valores y ya sabes cómo puedes ajustar la pendiente o qué tan plana es la curva para controlar la velocidad. Y ya terminamos con la animación aquí. Todo lo que voy a ir y hacer una cabeza de esto es sólo una cereza en la parte superior. Te voy a mostrar algunos efectos para que parezca que ha sido escrito y pluma estilográfica, etc. Así que si quieres estar por ahí para eso, quédate por ahí para eso, pero estás todo listo y listo para moverte al siguiente video. De acuerdo, pues sigamos adelante y agreguemos algunos efectos. De acuerdo, entonces lo primero que queremos hacer es simplemente colapsar todos estos. Selecciona ambos y presiona comando shift C en Mac o Control shift C en Windows para precomponer estas dos capas en una, voy a dejar que el nombre sea pre-comp uno y voy a hacer clic en Ok, lo siguiente que haremos es entrar en el panel Efectos y Presets. Y lo puedes encontrar en Windows si no te aparece, puedes ver que aquí hay efectos y presets. Vamos a seguir adelante y buscar el desenfoque guasiano. Y voy a hacer doble clic para agregar a este precomp. Ahora sigamos adelante y arrastremos esto a algo así como 12 o 13 para que esté tan borroso. Lo siguiente que vamos a hacer es buscar niveles y efectos y presets, y luego hacer doble clic en estos niveles bajo corrección de color. Entonces haz doble clic en él y se agrega. Ahora lo que vas a hacer aquí es seguir adelante y cambiar el canal a Alfa. Y vamos a ajustar estos tres deslizadores aquí. Pero sigamos adelante y movamos esto hacia la izquierda. Y tomará este deslizador y lo moverá hacia la derecha. Y se puede ver que lo aclara. Y después puedes ajustar la posición de estos tres para que sean delgados o más gruesos dependiendo de lo que más te guste. Ahora esto me parece bien. Entonces si sigo adelante y vuelvo a jugar, se puede ver que como que crea esta pequeña pocillos de tinta que se forman cuando se escribe con una pluma estilográfica. Y este es el efecto por el que yo estaba tratando de ir. Y este es el efecto que obtuvimos. Una última cosa que vamos a hacer es crear una nueva capa de ajuste. Así que ve a Capa Nueva y selecciona Capa de Ajuste. En la capa de ajuste, vamos a agregar turbulentos y displays. Entonces déjame buscar turbulencia. Vaya, pantallas turbulentas, ¿verdad? A veces olvido el nombre. Es desplazamiento turbulento. Entonces haz doble clic y asegúrate de que lo estás aplicando en una capa de ajuste. Lo que hace la capa de ajuste es que todo lo que está debajo esta capa de ajuste y este panel de capas obtiene el efecto que aplicamos en la Capa de Ajuste. Entonces haz doble clic y lo has agregado a la capa de ajuste. Esto hace que todo esto sea muy flojo, pero déjame seguir adelante y ajustarlo. Lo único que quieres hacer es establecer el tamaño a algo pequeño, como dos, por ejemplo. Y ahora verás que se pone una especie de bordes ásperos, ¿verdad? Y eso es bastante chulo. Puedes jugar más con el tamaño al contenido de tu corazón. Yo sólo voy a seguir adelante y dejarlo a la altura. Ahora si toco la animación, se puede ver que tiene los bordes rugosos añadidos a ella por las pantallas turbulentas. Pero sigamos adelante y sumemos una cosita final. Dice pequeña expresión. Así que mantén presionada Opción en Mac o Alt en Windows y haz clic en el ícono de un reloj de evolution aquí, lo que abrirá este panel. Y aquí voy a hacer bien, este tiempo posterize ocho entre paréntesis, un punto y coma y luego tiempo en 800 y un punto y coma otra vez. Y si hago clic fuera, y ahora si toco la animación, se puede decir que hay algún tipo de personaje a los bordes ásperos también. Y eso es todo. Eso es todo lo que queríamos agregar a esta animación. Y espero que lo hayas seguido, y espero que lo hayas terminado. Y si quieres saber más de expresiones, tengo otra clase en Skillshare que puedes ver, a la que enlazaré en la descripción o hablaré en el video de conclusión. Pero sí, esta es la animación que hacemos juntos. Bastante genial. Ahora para toda esta clase, para manipular la velocidad de la animación, único que hicimos fue manipular la gráfica de valores. Para que no se olvide, permítanme recordarles que hay otra gráfica, carbón la gráfica de velocidad. Y si sigues adelante y, um, como estás trabajando en tu proyecto, si sigues adelante y echas un vistazo al gráfico de velocidad, no tendrá sentido para ti si aún no lo has familiarizado, pero simplemente perfecto porque en la siguiente clase, vamos a sumergirnos más profundamente en las curvas de movimiento. Y hablaremos más sobre el gráfico de velocidad y el gráfico de valores y cómo están conectados. Y yo estoy muy emocionada, ¿tú? Espero que lo estés. Nos vemos en la siguiente lección. 5. Eases avanzados: De acuerdo, bienvenidos de nuevo. Estamos a arrodillarnos profundamente en esto ahora para dar vuelta atrás. Por lo que toda mi mano y sígueme. Eso suena a algo incompleto, pero no lo es, en realidad es algo muy bueno. La cosa número uno a entender es que gráfico de valores y el gráfico de velocidad no son exclusivos entre sí ya que en ellos no existen por separado por sí solos. Hay dos formas diferentes pero conectadas mostrar la misma animación. Y como están conectados, el cambio de forma de uno afecta la forma de otro. Y a menudo los animadores mientras trabajan en un proyecto cambian entre la velocidad y la gráfica de valores, dependiendo del contexto del cual gráfica es más fácil de manipular para resaltar el efecto deseado. Entonces sigamos adelante y tomemos un poco de tiempo para entender cómo están conectados. ¿ De acuerdo? La forma más sencilla de poner la diferencia es que gráfica de valores muestra cómo el valor de la propiedad en cuestión, que en este momento aquí es n Entonces, cómo el valor de la propiedad en cuestión está cambiando con el tiempo. Y el gráfico de velocidad muestra cómo la velocidad de ese cambio sucede con el tiempo. Sé lo complejo que suena todo esto, pero no es sólo tener que aguantar conmigo. Ojalá fuera posible mostrar los cambios que ocurren en ambos gráficos lado a lado, pero After Effects no lo permite. Entonces haremos el cambio en una y luego cambiaremos a la otra para ver cómo responde la otra gráfica a ese cambio. Observe también la unidad de los números que están aquí en la esquina izquierda o el eje y. El gráfico de valores, si voy a la gráfica de valores, es básicamente el valor de la propiedad. Y luego el gráfico de velocidad es la velocidad de cambio en la propiedad set. Si unidad de valor es en persona, que en este momento como puedes ver, este inmueble tiene unidad de persona, y eso es lo que aquí se ve. La etiqueta de la gráfica de velocidad en el eje y será persona por segundo. Ahora bien, para el escenario donde queríamos hacer este bucle de la k, este bucle de esta k para animar lentamente, que básicamente corresponde a este fotograma clave y al gráfico de velocidad o este fotograma clave, que es el mismo fotograma clave en realidad en este fotograma clave y el gráfico de valores y hacerlo más lento. Lo que hicimos fue hacer esta curva, este punto, la curva alrededor de este punto más plana en lugar de así, lo hicimos algo así. Lo cual es porque sabemos que en la gráfica de valores, medida que las tangentes se aplanan, la velocidad disminuye. Así que las dos formas en que puedo hacer que la animación suceda lentamente en este punto es haciendo esta curva más plana en el gráfico de valores o simplemente pasando por el Gráfico de Velocidad y haciendo clic en este nota y tirando de ella hacia abajo. Y fíjate, a medida que lo baje hacia abajo, medida que lo baje hacia abajo, observe que la gráfica de valores, este punto se vuelve más plano. De acuerdo, entonces una vez más iré al gráfico de velocidad y me dejaré aumentar la velocidad. Y a medida que aumente la velocidad moviendo este punto hacia arriba, verán que la gráfica de valores alrededor de este punto se vuelve más pronunciada. Y una vez más, si vuelvo a la gráfica de velocidad y una pelea, disminuya la velocidad tirándola hacia abajo así, notarás que la gráfica de valores se vuelve más plana y viceversa. Si hago esta curva más plana aquí, notarán que el punto aquí baja y toca casi 0 porque ahí está tan plano. En ocasiones es más fácil manipular esta gráfica, que es la gráfica de velocidad. Y a veces es más fácil manipular la gráfica de valores para obtener un resultado deseado en una animación. Ahora que entiendes estas dos gráficas, más que nada, espero que veamos algunos pequeños ejemplos de gráfico de valor y gráfico de velocidad para algunas cosas fáciles comunes, solo para que toda esta información se sienta mejor en tu cabeza. También veremos cómo cambiar la gráfica, cualquiera de la gráfica de velocidad o el gráfico de valores afecta la forma del fotograma clave, ¿verdad? Ya sabes, esta es una forma, nuestra forma de vidrio, esta es una forma lineal. Ya veremos cómo va eso, cómo el cambio de la gráfica afecta la forma de los fotogramas clave. Aquí estamos de vuelta en donde empezamos con un cuadrado que está girando de 0 a cuatro a cinco grados. Lo siento, debería ponerme el teléfono. Silencio. Sí. Por lo que estamos de vuelta con esta raíz cuadrada de 45 grados. Esto es todo lo que le vas a quitar de esta clase, es cómo hacer datos cuadrados de 0 a cuatro a cinco grados. Pero en fin, de todos modos, vamos, vamos a fregar a través de esta animación. Y en algún lugar del medio, lo que haré es añadir otro fotograma clave. Entonces todas estas pequeñas cosas cuadradas que no necesitas seguir. Esto es sólo para demostración, ¿verdad? Por lo que aunque te estés cayendo, es algo bueno, pero no estás obligado a hacerlo. De acuerdo, así que hemos añadido otro fotograma clave en medio de estos dos fotogramas clave. Y lo que quiero que noten es la forma de estos fotogramas clave. Y la forma de estos fotogramas clave parecen dos triángulos unidos en su base, ¿verdad? Y hay una razón por la que llamé a la Forma dos triángulos conjuntos en su base y no un rombo, que es el nombre legal real para esta forma. Porque quedará claro en un rato. Agárrate. Además, recuerda que después los efectos por defecto aplica lineal, facilitando los fotogramas clave que creas como se puede ver en la gráfica de valores. Sí, yo soy la gráfica de valores, que es una línea muy recta sin rasgos de ningún tipo. Cuando ves fotogramas clave con la forma de dos triángulos se unen en su base dice que también significa que los fotogramas clave tienen flexibilización lineal aplicada tanto en entrada como en salida. Ahora bien, ¿qué quiero decir con n Y fuera? En el video anterior, aprendimos a agregar fotogramas clave de flexibilización. Una es haciendo clic con el botón derecho. Voy a asistente de fotogramas clave y seleccionando fácil facilidad o pulsando el atajo F9. Otra forma de hacer esto es así. Entras en la gráfica, seleccionas un nodo o un fotograma clave. Y fíjate cómo restringimos toda la gráfica es lo que voy a hacer ahora es dar clic aquí donde dice, Fácil, Ease out. Y en cuanto haga clic aquí, observe cómo agrega una curva hacia la dirección de este fotograma clave. lado izquierdo de este fotograma clave es la indirección, y el lado derecho de este fotograma clave es la dirección. Similar como ya hemos hablado toda la gráfica de movimiento que tiene en el lado izquierdo y fuera del lado derecho cuando estábamos hablando por qué cierta flexibilización se llama facilidad en o facilidad hacia fuera, ya saben acerca de. Por lo que también parece que cada fotograma clave, cada nodo también tiene una visión a la izquierda y al exterior a la derecha. Así que cuando hago clic en este nodo y hago clic por aquí, que dice agregar fácil, facilitar a cabo. Agregó una curva hacia la dirección búho de este fotograma clave con el mismo fotograma clave seleccionado, vuelvo a mi línea de tiempo y veo cómo ha cambiado la forma de este fotograma clave. El lado izquierdo, el insight es lineal, mientras que el exterior tiene flexibilización aplicada a él y de ahí esta forma. Ahora si vuelvo a la gráfica y selecciono nuevo este fotograma clave y voy por aquí donde dice, agregue una facilidad fácil en, ya sabes, qué pasará. Agregaremos una curva hacia la indirección de este nodo. Y si vuelvo a mi línea de tiempo, se puede ver cómo ha cambiado la forma de este fotograma clave. No es un RTOS. Es decir, parece un RTOS, pero hay dos partes de ella a través de fácil en el lado izquierdo y también hay flexibilización en el lado derecho. Esto es lo que indica la forma. Y recuerda que la forma no tiene nada que ver con la curva exacta de este lado. Todo ello demuestra que esto no es lineal, pero sí se aplica algún tipo de flexibilización. Eso es todo. Ahora, si deshago todo, vuelve a mi cronología. Seleccione este fotograma clave en medio del botón derecho, vaya al asistente de fotogramas clave. Y voy a agregar facilidad fácil. ¿ Y me pueden decir qué lado de la forma del fotograma clave va a cambiar, por favor? Espero que dijeras el interior hicimos el lado izquierdo. Entonces si agrego fácil, facilidad y verás que la mitad de nuestro vaso se agrega al interior y la otra mitad es un triángulo. Y si vuelvo a mi gráfica, verán que hay flexibilización por dentro. Y de manera similar, si vuelvo, haga clic con el botón derecho en este fotograma clave, vaya al asistente de fotogramas clave y fácil facilidad de salida. Ahora tiene flexibilización en ambos lados. ¿ Yo quién? Ahí vas. Hay múltiples formas de agregar flexibilización a ello que ya sea por esto y eso es bastante genial. Esa es tanta información para ti. Espero que estén manejando todo correctamente. Y si sigo adelante y hago todo de nuevo y vuelvo a este fotograma clave, haga clic con el botón derecho del ratón en Asistente de fotogramas clave y seleccione Fácil, Facilidad en y qué pasará. Agregará flexibilización en ambos lados de este fotograma clave. Y luego otra vez, tendremos la misma gráfica. Y de nuevo, si sigo adelante y deshago, selecciono este nodo, y voy a dar clic por aquí y va a hacer lo mismo otra vez. Entonces espero que esto de ida y vuelta y todo, te tenga sentido. Y estoy bastante seguro de que estás entendiendo esto porque no he repasado esto tantas veces ahora. Pero permítanme una última vez, una última vez voy a ir falda Mansi, que sea lineal, seleccione este fotograma clave y pulse el atajo F9 y vamp. Ocurre lo mismo. Eso es todo. Esta es la última vez que estoy haciendo esto. Y en este punto también espero que puedan leer esta gráfica. Entonces lo que va a pasar es que va a empezar a cierta velocidad, más lento aquí porque la curva, la gráfica de valores es plana aquí y luego retoma velocidad de nuevo, ¿no? Entonces si juego esta suelta se ralentiza, vuelve a subir. Y si vuelvo a la gráfica de velocidad, notarán que arranca, va, velocidad va realmente baja, casi 0 porque ahí la curva es plana, y luego la velocidad aumenta y disminuye de nuevo. Bastante genial. Volvamosa nuestra línea de tiempo. Ahora hay que decir algo para los fotogramas clave extremos, el primero y el último en cualquier animación, no solo uno, el primer fotograma clave, no hay indirección porque este es el punto donde la animación comienza a partir de. Y si sumamos flexibilización hacia el interior de este fotograma clave, realmente no hará nada. Y de manera similar, para el fotograma clave final, si agregamos flexibilización hacia la dirección exterior, realmente no hará nada. Así que vamos a seguir adelante y mirarme haciendo algo que realmente no afecta a la gráfica en absoluto. Entonces déjame seguir adelante y volver a la gráfica de valores. Y seleccionaré este fotograma clave, que es el fotograma clave extremo, ese fotograma clave final. Y le agregaré facilidad. Y se ve facilidad hacia fuera se ha añadido. Por supuesto que la forma ha cambiado, pero en realidad no hace nada. Del mismo modo, si voy al primer fotograma clave y agrego facilidad hacia la izquierda o la indirección. Ha añadido flexibilización, pero en realidad no hará nada. Y creo que eso fue simplemente autoexplicativo. Yo sólo quería repasarlo para completarlo. Ahora una última cosa que quiero mostrarles aquí es si vuelvo a esta gráfica y vuelvo a este nodo de aquí. Y ya sabes que puedes cambiar la pendiente de esta gráfica o la planitud aquí para controlar la velocidad. Y también hemos visto que cómo se desconectan estos gráficos, y también hemos visto que cómo se pueden conectar seleccionándolo, haciendo clic derecho, yendo a interpolación de fotogramas clave y eligiendo bezier continuo. Ahora hay otra forma de hacerlo. Si vuelvo, sigo diciendo que retroceda. Pero si voy a la gráfica de velocidad y miro este punto aquí, y si quería subir su velocidad, y lo que haré para volver a subir la velocidad, acción muy normal es que pincharé y arrastraré, pero notarás que estos dos puntos están desconectados, lo cual no es correcto, y y son los desconectados. Es porque esta gráfica de valores tiene dos curvas diferentes en cada lado. Y por eso hay dos puntos en la gráfica de velocidad. Ahora hay otra forma de conectar esto. Aparte de hacer clic con el botón derecho e ir a la interpolación de fotogramas clave, seleccionando este doble clic aquí y luego haciendo clic en bloqueo continuo, bloquee tanto la dirección entrante como la saliente. Entonces si hago clic en él, da clic en Ok, verás que se convierte en un solo punto y luego puedo moverlo hacia arriba o hacia abajo. Y eso cambiará la gráfica de valores como debería. Y también este punto también es una sola cosa ahora y puedo moverlo. Entonces esa es la única cosa que quería mostrarte. Esa es la última cosa que quería mostrarles en esta lección. Sí. Sí, eso es todo. Eso es todo. Eso es todo. Eso es todo. Eso es todo con esta lección. realidad no tenía nada que decir en la conclusión excepto que espero verte en la siguiente también en la siguiente lección. Adiós. 6. Posición de animación: De acuerdo, Bienvenidos a esta lección. Esta es una lección más corta de toda esta clase. Hasta ahora en esta clase, solo hemos estado animando propiedades como la escala o la rotación o el porcentaje final cuando estábamos trabajando con la animación de escritura a mano de cuajada. Y hay una razón para ello es porque todos estos son propiedad unidimensional en contraposición a, digamos algo así como la posición, que es una propiedad bidimensional. Y quedará claro a qué me refiero cuando diga bidimensional más adelante en la clase. Solo quería mostrarte el problema que plantea la manipulación del gráfico de valores manipulación del gráfico de valorescuando se trata cualquier propiedad que tenga más de una dimensión. Ahora de vuelta en después de efectos de gaba raíz cuadrada aquí, lo que haré es ir a la propiedad position, que puedo revelar seleccionando la capa y presionando P, crearé un fotograma clave aquí. Avanzar un poco y cronología en cualquier lugar, no importa, totalmente arbitraria. Y moveré este gris a esta esquina, la esquina diagonalmente opuesta. Ahora la forma en que funciona la propiedad de posición, y estoy muy seguro de que probablemente ya lo sepas. Pero si hay siquiera un estudiante que no lo hace, entonces esta breve explicación, los ayudaremos. Ahora moví esta plaza diagonalmente a esta esquina. Si miro en la propiedad de posición, se puede ver que en lugar de sólo un número, como en una propiedad unidimensional como rotación o escala, hay dos números. El primero es x y el segundo es y. X significa horizontal e y significa vertical, como ya hemos comentado en una de las lecciones anteriores. ¿ Recuerdas eso? ¿ Qué significa eso? Unpoco de náuseas. No lo sé. No lo sé. Algunos rapero x e y. espero que recuerden eso. Eso lo moví. ¿ Te acuerdas de eso? Entonces bien. Entonces el primer número es x y el segundo número es ¿por qué? Y a diferencia, como en gráficos por computadora, y a diferencia de cómo lo hace en papel, donde la esquina inferior izquierda es 00 o x e y es 0. Y en gráficos por computadora y también en After Effects, esta esquina superior, la esquina superior izquierda es el origen donde x e y es 0. Entonces a medida que avanzas hacia la derecha, x aumenta y a medida que te mueves hacia abajo, y aumenta. Y en esta animación donde el cuadrado se mueve de esta esquina a esta esquina, los valores de x e y están cambiando porque el cuadrado se mueve horizontalmente, pero también se está moviendo verticalmente. Se puede ver que aquí mientras frego, se puede ver que estos dos números cambian simultáneamente. Y si sigo adelante y miro en la gráfica de valores desde aquí, asegurarme en gráfica de valores, verán que hay dos gráficas, una para x, otra para y, y esto se pone un poco difícil de jugar. Entonces hay una cosa que se puede hacer. Puede hacer clic con el botón derecho en la posición y para separar las cotas. Y ahora tienes diferentes gráficas con las que jugar. Pero incluso con las dimensiones de Sabrina, como en un contexto general, se hace realmente difícil jugar con dos gráficas diferentes para posición y obtener la animación deseada. Entonces déjame presionar Comando Z y conectarlos a ambos contra sin que hubiera una sola posición y no dimensión separada. Y debido a las dos gráficas, lo que yo y la mayoría de los animadores que he observado hacemos es que entran directamente en el gráfico de velocidad porque sólo había una gráfica para ajustar. En este momento no hay variación en la velocidad. Es una constante y ya sabes, es porque a0 o After Effects aplica flexibilización lineal por defecto, lo que voy a hacer ahora es seleccionar ambos fotogramas clave y seguir adelante y dar clic en facilidad fácil. Y ahora se puede ver que tenemos un poco de facilidad en la posesión. Y con solo hacer cambios en el gráfico de velocidad, hemos cambiado la forma en que sucede la animación. Algo más que puedes hacer es que puedes desplazar la gráfica hacia, digamos hacia la izquierda. Puedo sostener Shift y hacer que se vea algo como esto. cual si has seguido a lo largo algunos tutoriales o curso tiene un efectos Alfa, puedes, sabes que esta es una gráfica muy común. ¿ Eso cambiaría? Esto crea una animación muy diferente y no tuve que entrar en el gráfico de valores y solo dos unidades gráficas simultáneamente para obtener esto, solo podía entrar en gráfico de velocidad y es solo una gráfica. Y también cambiar la gráfica de velocidad, como dije antes, produce algún tipo de cambio en la gráfica de valores, que ya has observado. Entonces aquí puedes ver cómo puedes indistintamente usar el gráfico de velocidad o el gráfico de valores. Ambos están muy conectados a medida que sigues más tutoriales o los trabajos de diferentes animadores, notarás el patrón de ellos saltando al gráfico de velocidad directamente y haciendo estos haciendo estos gráficos de estilo Hale. Heel Stone graph es un término que acabo de inventarme. Te sale la idea ¿verdad? Hay un poco más de matiz a esta gráfica y algunas opciones más que se revelan haciendo doble clic en cualquiera de estos nodos que necesitamos entender. Y lo estaremos haciendo mientras construimos nuestro proyecto final en la siguiente clase. Por lo que no necesitas preocuparte por ellos ahora mismo. Y eso es todo. Algo así como qué, ¿cinco minutos? Sí. Eso es todo lo que necesitaba. Necesitabaun poco de tiempo para hablarte la pobreza multidimensional y sus gráficas. Y espero haber significado esa expectativa o lo que había esperado para esta lección. ¿ Estoy teniendo sentido? Pero como dije, a pesar de que esta fue una lección corta, lección después de esta va a ser muy larga porque vamos a estar trabajando en nuestro proyecto final para toda esta clase. Pero sí, tómate un breve descanso o no tomes un breve descanso porque esta fue una clase corta. Y te veré pronto en la siguiente lección. 7. Proyecto final 1: He hecho un descubrimiento reciente. Es muy delicioso y es muy sutil. Y no sé si te diste cuenta de esto, pero si entras a la app de YouTube en IOS o iPadOS para el caso. Y si estás viendo un video y si presionas el botón me gusta, ocurre una animación muy bonita. No sé si será visible, pero miren eso. ¿ Lo ves? Mira eso. Bastante guay, ¿verdad? Y también otra cosa que solo quería recordarles es que espero que hayan descargado los recursos de la sección de proyectos y recursos aquí en Skillshare porque vamos a estar necesitando eso. Ahora si entras en los recursos y en la carpeta de YouTube lie can, encontrarás este ejemplo de título de video. Y si lo toco, se puede ver mismo YouTube como la animación sucediendo. Nuestro trabajo es recrear esta animación y después de los efectos a la vez que revisamos todo lo que hemos aprendido sobre la gráfica hasta ahora. Ahora puedes intentar hacer esto por tu cuenta para abreviar. Pero primero déjame guiarte a través del archivo de secuelas que estaremos usando para este proyecto. Ahora se le requiere entrar en el archivo AEP punto de inicio. Haré doble clic para abrirlo, y ahí está. Ahora en este archivo, encontrarás una capa, solo una capa atada a mentir puede muy autoexplicable y unos pocos la despliegan. Si Comando y da clic en esta flecha, se despliega todas las opciones anidadas. Entonces ese es un atajo para ti. Si solo haces clic en él sin mantener pulsado el comando y tendrás que desenvolver las opciones anidadas una y otra vez. Pero si queríamos desenvolver todo, mantienes el mando y haces clic aquí, aquí dentro. Si vamos a la propiedad path, notarás que aquí tenemos cuatro fotogramas clave. No, me gustaría que entendiéramos de dónde salieron estos cuatro fotogramas clave y qué hacen. Entonces esto, todo el gráfico está hecho ante todo de dos partes. Ahí está la mano, que es esta parte de aquí, la palma y lo común todo. Y están dormidos, que básicamente es sólo este rectángulo de aquí. Ahora toda esta forma, toda esta forma vectorial fue creada en Adobe Illustrator. Si miras los archivos del proyecto bajo YouTube Line, Can, verás un archivo llamado handy cons.ai. Es sólo un nombre al azar. Debería haberle dado un nombre mejor. Pero de todos modos, puedo, si tienes instalado Adobe Illustrator, puedes hacer doble clic y mirarlo. Entonces como pueden ver que dentro del archivo, tengo los diferentes estados del gráfico, como en cuando el pulgar está en posición normal, pero está totalmente estirado y aquí en el medio cuando se retrocede. Y entonces lo que he hecho es simplemente traer estas diferentes formas a After Effects. Ahora hay múltiples formas en las que puedes llevar un gráfico de Illustrator a After Effects. La forma más sencilla es simplemente importando, lo que básicamente te muestra cada tutorial de YouTube y cada clase. Pero lo que uso es este plug-in llamado Overlord. Y overlord no es un plugin gratuito, es que cuesta alrededor de cuarenta y cinco dólares. Pero si eres serio acerca de animarlo y perseguirlo más lejos, creo que es una muy buena inversión. Déjame seguir adelante y mostrarte una demo de overlord en poco menos de un minuto. De acuerdo, volveré a After Effects. Voy a colapsar todo esto. Esconderé esto y lo cerraré. No quiero meterme con eso. Y ahora miren la magia de overlord. Volveré a Illustrator. Me aseguraré de que esta ruta esté seleccionada. Y luego simplemente haré clic en esta flecha y bam, lo tengo aquí en After Effects. Bastante guay, ¿verdad? Y si sigo adelante y lo despliego todo, verán que los diferentes caminos aquí y aquí se nombra grupo uno porque acabo exportarlo vanilla aquí en like y lo he preparado y nombro las capas y todo de esa manera. Por eso hay dolor y sueño, pero aquí sólo hay el grupo uno. Pero en fin, tenemos que centrarnos en el camino aquí. Y como verán, aquí tenemos todo este camino. Y una cosa que me he asegurado al preparar estas formas es que cada una de estas formas tenga el mismo número de puntos de anclaje. ¿ Y qué significa haber visto número de puntos de anclaje? Es simplemente significa como si miras estos puntos aquí, son estos puntos Bezier. ¿ De cuál de estos caminos estaban hechos? Cada uno de ellos tiene el mismo número de ellos. Y cuando los trazados tienen el mismo número de puntos de ancla, significa que After Effects puede establecer fotogramas clave entre ellos. que significa que si vuelvo a After Effects y he establecido un fotograma clave para la ruta aquí. Muévete un poco hacia adelante, ¿verdad? Y solo quiero traer fotograma clave o el camino para esta parte, la parte la palma, la parte de la mano , y no la manga. Entonces lo que haré es seleccionar esto y asegurarme de poder despegarlo y traerlo aquí. Y luego con esto seleccionado, simplemente presionaré esta flecha, volveré a After Effects. Y ahora se puede ver que aquí tengo dos caminos diferentes. Y debido a que tienen el mismo número de puntos de anclaje, After Effects puede animar entre ellos. Y me desharé de ella. Y así es como he caído en diferentes fotogramas clave para el camino aquí y con los diferentes estados del pulgar. Ahora bien, todo esto, todo lo que dije en los últimos uno o dos minutos, es algo que sólo me puse para la completitud de la lección que no estés totalmente en la oscuridad. Oye, ¿cómo llegó hasta aquí esta forma vectorial? ¿ Cómo lo lograste? Es solo por esa información extra y no es la parte de la clase real, la clase real, comienza la animación de esta mano. Ahora, sé a grandes rasgos, voy a dividir toda la animación en tres pasos. Vamos a animar la rotación, vamos a animar la escala y vamos a animar la posición de manera amplia, en términos generales habría ciertos pequeños matices aquí y allá, pero a grandes rasgos, rotación, escala y posición. En primer lugar, empecemos con rotación y voy a seguir adelante y comando click. O si eres un control de Windows, haz clic para simplemente envolverlo todo para que tengamos justo esto visible. Y otro atajo para ti. Si aún no estamos al tanto con la capa seleccionada, puedes presionar R para que aparezca la rotación y ¿sabes qué? Sigamos adelante y empecemos. La cosa número uno que quieres asegurarte es que el punto de anclaje de todo este gráfico esté en la esquina inferior izquierda. Y si no está en la esquina inferior izquierda, si está en algún lugar al centro, lo que tienes que hacer es presionar Y para que aparezca esta herramienta. Se llama la herramienta de pan detrás, también la herramienta de anclaje. Está justo por aquí. Se ve la herramienta Pan Behind o la herramienta de punto de anclaje. Y luego puedes comenzar a arrastrar y mantener presionado Command en Mac o Control en Windows para ajustarlo justo aquí. Una cosa más antes empezar es que lo que queríamos hacer es de nuevo, voy a mandar clic y desenroscar. Vamos a tomar todos estos cuatro fotogramas clave y arrastrarlos hacia la derecha porque no queremos que interfieran ahora mismo cuando estamos, cuando estamos haciendo rotación, escala y posición, los traeremos de vuelta más tarde para agregar más personalidad a la animación. Pero por ahora, déjame seguir adelante y alejarlos hacia la derecha. No realmente preocupado por ellos. Adelante y selecciona la capa, presiona Oregon y ahí estará nuestra rotación de cabeza. Sigamos adelante y pongamos el primer fotograma clave a 0 segundos así. Dado que una acción importante es la mano girando hacia arriba, agregaremos un poco de anticipación a la rotación agregando un fotograma clave, otro fotograma clave, un poco adelante en el tiempo, y luego girándolo hacia abajo así, Digamos que alrededor de diez grados. Ahora nos moveremos un poco adelante en el tiempo y rotaremos la mano hasta su posición de pico. Entonces sólo seguiré adelante y arrastraré esto hacia atrás. Entonces creo que es algo en algún lugar como aquí. Se ve bien. Una vez que lo estemos. Por lo que es anticipa que pasa por la primera posición. Entonces voy a seguir adelante y traerlo de vuelta a su posición inicial copiando el Comando C y el Comando V. Así que tenemos anticipación, llega a su posición final y luego de vuelta a la inicial posición. Y eso es todo. Terminamos con el proyecto. No, sólo bromeaba. Uh, al tour robótico robótico. En primer lugar, no hay personalidad y sólo flexibilizando tan lineal. Entonces claro que aún no terminamos. Sigamos adelante y sigamos trabajando en ello. Lo primero que vamos a hacer es seleccionar todos los fotogramas clave y usar nuestro viejo atajo de confianza de F9 para agregarles relajación a todos. Y si lo vuelvo a tocar. De acuerdo. Un poco mejor. Un poco mejor. Pero aún no ahí. Míralo. Un poco mejor, pero aún no ahí. Sigamos adelante y miremos las gráficas. Y para esto, estaré editando directamente la gráfica de velocidad y no la gráfica del valle, porque en este contexto, simplemente es más fácil para mí manipular la gráfica de velocidad. Algo de lo que aún no hemos hablado es este parámetro en el gráfico de velocidad llamado influencia. Si quieres ser matemáticamente preciso con tu flexibilización en el gráfico de velocidad, puedes hacer doble clic en cualquiera de estos nodos. Voy a seguir adelante y hacer doble clic aquí. Y en la ventana emergente, verás un parámetro llamado influencia. Además, lo que notarás es que toda esta ventana emergente tiene dos partes, entrante y saliente. Y ya hemos discutido antes, entrante son cosas del lado izquierdo y las salientes son cosas del lado derecho. Desde que hicimos clic en este nodo, que es el primer nodo, no hay entrada real para él, que es algo que ya hemos discutido también. Entonces lo que sea que pongamos aquí, o cualquier valor realmente no afectará nada. Cambiar la parte saliente afectará a la gráfica. Ahora, cuando agrega facilidad fácil a un fotograma clave ya sea haciendo clic con el botón derecho y seleccionando facilidad fácil o haciendo clic en un engranaje o haciendo clic aquí, o presionando F9. Lo que After Effects hace esto automáticamente aplica la influencia de treinta y tres puntos tres, tres por ciento a través del gráfico de velocidad, que funciona perfectamente para el movimiento de rangos pequeños, como para pequeños movimientos, influencia de 33.33% funciona bien. Vamos a seguir adelante y dejarlo en 33%. Porque esto, esto, este particular rango de movimiento es por la poca anticipación en el jamón que sucede. Y como es un pequeño rango de movimiento, otra vez, vamos a seguir adelante y dejarlo en 33%. Aquí vamos a dar clic en Ok. Ahora bien, este segundo nodo es algo de interés ya que tiene tanto un lado entrante como otro saliente. Para la segunda nota, vamos a seguir adelante y mantener entrante en treinta y tres por ciento porque n es el lado izquierdo y es parte de esta gráfica. Entonces lo vamos a dejar en el 33%. Y lo que vamos a hacer por el extrovertido, vamos a seguir adelante y cambiar la influencia a través de algo como, digamos 75%. Vamos a seguir adelante y dar clic en Ok, y ya verás lo que hizo. Simplemente aumenta la longitud de este mango, lo que muy bien se puede hacer arrastrando también este mango hacia la izquierda o hacia la derecha. Y eso es todo básicamente influencias, o hacerlo precisamente haciendo doble clic y agregando un valor allí o simplemente arbitrariamente a su propio gusto, arrastre este mango de todos modos para este gráfico en particular, también queremos que este bando tenga una influencia del 75 por ciento en la velocidad. Si quieres, puedes seguir adelante y hacer eso. Pero aquí están los pasos, haga doble clic en él y como lo queremos de este lado, vamos a seguir adelante y manipular el sitio entrante, que ahora mismo está en 23, un valor por defecto. Eso es 75. Y vamos a dar clic en Ok, y ahora tenemos una gráfica halita en el medio, muy relevante o irrelevante. Tienes un buen punto de partida. Sigamos adelante y juguemos la animación ahora y veamos cómo se ve. Voy a presionar espacio. ¿ De acuerdo? De acuerdo. una cosa quiero asegurarme, ya que esta es una muy, esta animación dura una pequeña duración. Voy a asegurarme de que sea menos de 1 segundo, así que básicamente hasta 24 cuadros. Entonces voy a seguir adelante y posicionar el marcador en el fotograma 24. Puedes ver el número de fotograma Soy anuncio desde aquí, o tu anuncio desde aquí. Es After Effects es para todos. Así que selecciona todos los fotogramas clave, mantén presionada Opción en Mac o Alt en Windows, y sigue adelante y arrástrala así para que quepa dentro de 24 fotogramas. Ahora, lo que quería hacer a continuación es que quiero que la anticipación dure. No tanto. Yo sólo quiero que dure como tres cuadros. Entonces voy a seguir adelante y posicionar el cabezal de reproducción, sumar 0. Entonces en Mac puedes usar Comando y flecha derecha, y creo en Windows Control y flecha derecha para mover un solo fotograma hacia adelante. Entonces voy a seguir adelante y pasar al tercer frame, ¿no? Entonces Comando 123, y esto es todo, este es el tiempo que quiero agregar disipación para durar. Entonces voy a seguir adelante y arrastrar esto hasta aquí. Entonces ahora la anticipación es así. De acuerdo, Cool. Y también lo que queremos es que la mano se quede un poco en esta pose. Y recuerda cómo hicimos la gráfica de valores mucho más plana en curvas de k Cuando estábamos animando K incurrido. Aquí vas a hacer algo parecido. De acuerdo, Sigamos adelante y vayamos a la gráfica de valores. Adelante y ve a la gráfica de valores. Y lo que quería hacer es aplanar esta parte de aquí. Así que asegúrate de que este nodo esté seleccionado, que es el punto pico. Y voy a seguir adelante y seleccionar esta parte. En primer lugar, déjenme acercar un poco. Voy a seguir adelante y seleccionar esta parte mantenga presionada Shift y simplemente arrastrarla hacia fuera. Simplemente lo hará más plano aquí para que perdure en esta posición. Y puedo ir e irme, seguir regresando y reproduciéndolo. Y eso se puede ver, sí. Bueno, cuanto más halago, más se quedará aquí. Entonces déjame seguir adelante y hacer esto un poco más halagador. Sí, ¿lo ves? Simplemente va adelante y almacenó bolas arriba está en esta posición y es porque aplano esta parte aquí. Ahora puedes ver cómo el valor en los gráficos de velocidad se usan indistintamente. Este cambio, el aplanamiento, por supuesto, se ha ondulado al gráfico de velocidad, como pueden ver aquí. Y a su vez, también habría cambiado la influencia de la cama, que es un 100%, que está bien. Solo usamos su influencia para darnos una animación base sobre la cual podemos construir. Además, si miras, si sigo adelante y juego atrás, mira cómo el, la forma termina la anticipación es un poco afilada aquí. Entonces déjame seguir adelante y tocarlo. Y se puede ver que es un poco afilado pero simplemente puro. Yo sólo quería ser un poco más suave. Volveré a la gráfica de valores aquí, acercaré un poco más y tratando de que sea halagador. Entonces voy a seguir adelante y sostener Shift y hacerlo más plano. Y también puedo moverlo hacia adelante y hacia atrás. Puedes hacer cambios que el plano con gráficas se trata de hacer cambios minuciosos y no es el tipo de cosas en las que puedes desaparecer en algún momento. El diablo en los detalles, que Dios está en los detalles siempre que en detalles son lo que hace que algo sea mejor. Entonces, sí, algo de ida y vuelta, por supuesto, siempre se necesita ya que lo he reordenado, agitado y repetido mucho en esta clase, pero hice esta parte un poco más suave. Entonces sigamos adelante y volvamos a reproducirlo y a ver si termina esa fuerte licencia y luego termina la disipación. Entonces voy a seguir adelante y presionar Space. Y sí, no es tan afilado. Es algo suave, lo cual es bueno, lo cual es bueno. Ya estamos llegando. Ahora. Tenemos que jugar un poco con escala. Queremos que esta mano se encoja durante la anticipación como cuando va de aquí para acá, queremos que se encoja un poco y luego irrumpa en mayor tamaño a medida que alcanza esta posición de pico. Volvamos a nuestra línea de tiempo donde podemos ver los fotogramas clave. Puede seleccionar la capa. Y si ya tienes una propiedad visible, puedes mantener presionada la tecla Mayús y presionar un atajo. Entonces presionaré Shift y S para sacar escala aquí, ¿no? Y luego voy a ir a 0 por 0 y pop en un fotograma clave a una escala del 100% en el tiempo 0. Entonces durante la anticipación, lo que quería hacer es reducir el tamaño a algo así como 90 o 87%, algo así, número muy arbitrario. Y luego a medida que llega a la gran posición, lo que quería hacer es aumentar a escala a algo así como un 110 o vamos con 115 año. De acuerdo, Así que va así, se encoge y luego aparece ahí arriba y luego vuelve de nuevo como m ya que está regresando. Quería seguir adelante y copiar el fotograma clave de escala inicial y pegarlo aquí para que el salvaje bajando se encoja a su posición original. De acuerdo, ahora si vuelvo a reproducir esa animación, verán que la rotación y la escala de residuos se animan. Está totalmente fuera de sincronía. Y no debería estar fuera de sincronía porque hay flexibilización aplicada a todos estos. Fotogramas clave de rotación y solo hay una flexibilización lineal por defecto aplicada a todos los fotogramas clave de escala. Tenemos que conseguir que las rotaciones se flexionen a escala. Para ello, podemos usar un plug-in que se llama copia de e, que puedes ver justo aquí. Es un plugin de $15, que sé que no todos ustedes podrían tener. Así que vamos a dar fácil, facilidad a todos los fotogramas clave y ajustarlos manualmente. Entonces lo que haré es volver a seleccionar todos estos fotogramas clave para la escala, presionar F9, y ahora todos ellos tienen una flexibilización. Ahora para dar una flexibilización exacta, el regalo, la escala exactamente usings y las formas gráficas y todo como rotaciones. Lo que tenemos que hacer es entrar en el gráfico de velocidad de rotación desde aquí. Sí, estamos en el gráfico de velocidad de vez en cuando copiamos las influencias en cada nodo y lo pegamos en escala. Entonces déjame seguir adelante y empezar a hacer eso. Haré doble clic en esta nota. Es 3733. Voy a ir a la gráfica de velocidad de escalas. Haré doble clic aquí. Y como es una propiedad bidimensional y x e y ambos están cambiando, vamos a asegurarnos de que el candado Dimensions esté marcado y solo vamos a pegar los valores aquí. Como usted sabía. Perdón, como vimos en gráfica anterior, lo teníamos en 37% y el saliente en treinta y tres por ciento. Aquí vamos a dar clic en Ok. De acuerdo, vamos a ir a rotación otra vez. Haga doble clic aquí. Tenemos 86.567 a cinco. Ir a escala, haga doble clic en 86.56. ¿ Y lo que se hizo fue ese 75? Supongo que sí, voy a dar clic en Ok. Y se puede ver que la forma del gráfico cambia a una mímica exactamente cómo es esto. Por lo que voy a comprobar de nuevo con 7575. Hagamos doble clic aquí. Tenemos un 100100. Volveré a escala, haré doble clic en este nodo, le daré un 100 aquí, y luego otro 100 aquí. Y fama, tenemos esta gráfica. Sigamos adelante y miremos el último fotograma clave aquí. Tiene 3316. Entonces vuelve a escala. Tenemos 33 aquí. Y en realidad no importa la parte saliente porque no tiene parte saliente. Pero en fin, déjame sólo escribir 16, vale, no importa. Ahora, si sigo adelante y lo toco, se puede ver que la escala y rotación están totalmente sincronizadas. Como puedes ver, todo ese trabajo de copiar y pegar podría haberse evitado si solo seleccionara todo esto, fuera a la copia Este, plug-in, lo copiara, y luego seleccionara esa escala y simplementepegarlo en. Pero otra vez, lo sé, lo sé. Me parece realmente un poco frustrante cuando estoy viendo un tutorial y aparece un plugin pagado. Pero de todos modos, aquí no estamos usando un plugin de pago. Solo te estaba mostrando que este plugin existe y podemos usar eso. No, ella entraría en tus recursos y te fijas en la carpeta de lata de mentiras de YouTube. Encontrarás este pequeño archivo de texto llamado expresión elástica punto TXT. Yo quiero que lo abras, copies todo lo que contiene, y luego regreses aquí. Digamos rotación. Sólo para comenzar con Opción, mantenga presionada, Opción en Mac o Alt en Windows, y haga clic en el icono del cronómetro, que abrirá el editor de expresiones. Y aquí mismo, solo quiero que lo pegues comando V y click out y no te preocupes por ello. ¿ De acuerdo? Quiero que hagas lo mismo con escala a opción, haz clic en Comando V, da clic hacia fuera. Nada de qué preocuparse. Sin fin. Haga clic en mantener presionado Comando o Control en Windows y simplemente colapse todo. Y si toco la animación ahora, bueno, nada realmente feliz. Oh ****. ¿ Yo hice algo mal? No, no hice algo malo. La forma en que funciona esta expresión es que necesitas que tu último fotograma clave sea una relajación lineal. Entonces, ¿cómo se cambia esto a flexibilización lineal? Sostiene Command en Mac o Control en Windows, y simplemente siga adelante y haga clic en nombre en BAM. Y ahora si vuelvo y lo toco, whoo, hay algunos límites. No hay en la vida de alguien ahí. Tienes razón, Cool. De acuerdo, ahora ya casi terminamos con esta animación. Necesitamos agregar posición y todas las formas de las manos aquí. Pero me di cuenta de que esto, que este video está tocando la marca de los 20 minutos. Entonces me detendré aquí mismo y haré otra parte de esta lección y nos vemos entonces. Así que aguanta, aguanta, toma un descanso, bebe un poco de agua, y vuelve. 8. Proyecto final 2: De acuerdo, bienvenidos de nuevo a la segunda parte del proyecto final. Hasta ahora hemos podido animar escala y rotación de esta mano y también darle un poco de bounciness usando expresiones. Lo siguiente que queremos hacer es que vamos a traer, sacar a colación la propiedad del camino, que está por aquí. Estos dos caminos, de los que ya hemos hablado, cuyos fotogramas clave hemos empujado hacia la derecha. Es hora de traerlos de vuelta. Entonces sólo los voy a arrastrar, posicionarlos al principio de mi línea de tiempo. Y déjame seguir adelante y ajustar estos para que coincidan con la anticipación y todo. Entonces esta parte es en realidad cuando el pulgar retrocede un poco al paciente. Y luego la postura extrema por aquí con el pulgar estirado y luego volviendo a la normalidad. Entonces vamos a seguir adelante y tocarlo. No será perfecto, pero veamos si nos da, nos da una idea de la animación final. Entonces, vale, sí, así que definitivamente no es apropiado porque se está moviendo en un todo diferente fuera de sincronía. El pulgar, lo que tenemos que hacer aquí es traer a colación la flexibilización de la escala a la orientación al camino. Ahora, antes, me viste copiar y pegar las influencias, ¿verdad? Puedes seguir adelante y hacer lo mismo. Pero lo que voy a hacer es seguir adelante y usar el plugin de copia de e. Entonces voy a seguir adelante y seleccionar escala o rotación. ¿ Realmente importa que tengan la misma flexibilización. Voy a dar clic en Copiar. Voy a seguir adelante y dar clic en el camino. Y voy a seguir adelante y pegarle a Paste. Facilidad. De acuerdo, Y luego voy a seguir adelante y tocar esa animación y mirar esto ahora mismo. Está más o menos en sincronía. Déjame seguir adelante y acercarme y ver si puedo hacer ciertos ajustes. Déjamejugar otra vez. Sí, más o menos en sincronía. Lo que puedo hacer aquí es tal vez mover esta posición pico un poco más adelante para que se quede un poco más. Entonces déjame hacer esto y déjame entrar y jugar de nuevo. Sí. Sí. Todo se ve perfecto y todo se ve correcto. Lo único siguiente que necesitamos agregar en este momento es la animación para la propiedad position. Entonces sigamos adelante y hagamos eso. Déjame seguir adelante y seleccionar esta capa y presionar P para que aparezca la posición. Y voy a seguir adelante dos veces 0 y crear un fotograma clave. Ahora también necesito emparejarlo con rotación o escala. Simplemente voy a seguir adelante y presionar Shift S para que suba escala para que pueda igualar la posición de los fotogramas clave. Y como se está anticipando y encogiendo, quiero que esto se mueva. Quiero que la mano se mueva un poco hacia abajo. Así que déjame seguir adelante y elegir el segundo número, que es la posición y en arrastrarlo un poco hacia abajo como un encogimiento. Se está encogiendo. Se va un poco hacia abajo. Déjame moverlo un poco más, un poco más abajo. Y ahora como va surgiendo quería moverme un poco hacia arriba, así que voy a seguir adelante y moverlo un poco arriba justo por ahí. Y entonces como va bajando, quise llevarla a su posición original. Así que copia este fotograma clave y pegarlo aquí. Entonces ahora se mueve hacia abajo, se mueve hacia arriba, y luego vuelve a bajar. Ahora voy a seguir adelante y volver a copiar la flexibilización de la escala usando la copia de e, claro. Ahora podría volver a entrar en el gráfico de velocidad y copiar y pegar influencias individuales. Pero no quieres sentarte y verme hacer eso, ¿verdad? Entonces haces eso si estás haciendo tomar estos café, he tenido realmente culpable de estar usando un plug-in, pero, ya sabes, se requiere de nuevo. Perdón por borrar un tiempo. Voy a seguir adelante y copiar la flexibilización. Ir a la posición y pegar la flexibilización así. Y si sigo adelante y lo juego, se puede ver que la posición también está cambiando ahora y se ve mucho mejor. Un último bit de ajuste es hacer que el camino del movimiento sea un poco parte. Porque recuerda que es un principio básico de la animación que nada en la vida real se mueve en línea recta. Tenemos que añadir un poco de arco a la posición. Entonces déjame seguir adelante y seleccionar esto. Y con la propiedad de posición seleccionada, notarás que hay estos puntos, no los cuadrados con los circulares. Se trata de asas para las curvas Bezier. Para que pueda seguir adelante y arrastrarlo para que forme una curva. Y déjame seguir adelante y formar una curva donde pueda y que sea lo más suave posible. Entonces eso es lo que estoy haciendo ahora. Y vamos a moverlo así. Y vamos a moverlo así. Ya basta curva. Déjame alejarme y volver a jugar. Y se ve que ahora como que se mueve en una curva y luego agrega la curva del camino. Acaba de agregarle mucha más vida. Animación. Entonces déjame seguir adelante y jugar esta última vez. Y ahí estás. Y a tu propio gusto, creo que esto es un poco demasiado en este momento, pero a tu gusto, también puedes seguir adelante y ajustar esto como te guste. Entonces sí, eso es más o menos eso. Eso es más o menos. Una placa final. De acuerdo, genial. Si has realizado esta animación siguiendo a lo largo, sigue adelante y haz un GIF o un video y póngalo en los proyectos. Y estoy tan orgullosa de lo que hemos podido lograr hasta ahora, tan cool, nos vemos en la siguiente lección, que es la lección final. Y no puedo esperar a recapitular desde el principio donde no sabíamos nada de gráficas hacer aquí donde hemos manipulado gráficas e hecho esta animación. 9. Conclusión: Después de todo eso, sí miramos la partitura y diciéndome que puedes escuchar música real sonando en tu cabeza. Sé que probablemente no puedas, porque hablamos de gráficas y mirando esta hoja que tiene un gráfico de valores dibujado en ella, probablemente puedas decir el tipo de movimiento que representa esta gráfica. Y si puedes volver a ver la clase, quiero decir, depende de ti. Si no puedes, puedes volver a ver la clase, pero estoy bastante seguro de que lo haces de todos modos, cualquier h2. Tomemos un resumen de todo lo que hicimos en esta clase. Algo importante que quería enseñar a través de esta clase, porque era bastante misterioso para B2 es por qué cierta flexibilización, llamada facilidad ins and outs, etcétera. Y lo miramos a través de toda una gráfica. Ese gráfico de movimiento completo tiene un interior y un exterior y dependiendo qué lado se aplica flexibilizando en él podría llamarse ECM está fuera o facilidad en, fuera. Y también hay lados de entrada y salida a cada fotograma clave o que también es un nodo en un gráfico de movimiento. Entonces eso es algo que hicimos. Utilizamos caminos de recorte para animar la escritura a mano y agregamos variaciones de velocidad a la escritura a mano mediante la manipulación del gráfico de valores, ya sea haciéndolo más plano o más empinado, etcétera. Y ya sabes, ¿qué podría ser? Un proyecto genial es que te grabes a ti mismo o a cualquiera escribiendo algo en papel e intentes recrear el de After Effects. Entonces eso es algo que puedes hacer para nuestro proyecto final de la clase, recreamos el YouTube como la animación de leva como lo es en 2022 en dispositivos iOS y iPad OS, aprendimos sobre la anticipación cuando el mano sube, hay este pedacito de anticipación y queríamos considerar seguido a través. Y agregamos un poco de seguimiento mediante el uso de una expresión que agrega algún tipo de bounciness al Lai Can, deberías revisar el proyecto terminado que hicimos. Hay algo de lo que debería aclarar. El proyecto de la izquierda que construimos juntos que estás resolviendo pero ligado entre sí. Necesitaba más pulimentos y más tiempo. No pude ir todo el camino con ella por la limitación de tiempo y todo. Pero el archivo terminado que hay en sus recursos es el que he trabajado extensamente. Y se ve mucho más suave y mucho mejor. Por lo que debes echarle un vistazo. No te preocupes, está creado usando exactamente las mismas técnicas que mostré. Y por cierto, si eres nuevo en las expresiones y quieres aprenderlo. Tengo otra clase en Skillshare, que se titula de introducción para principiantes a las expresiones. Podrías tomar que definitivamente no es para avanzar y no entra en recrear algo avanzado como expresión que usamos en esto, en esta clase para el YouTube como la animación Han. Pero aún así, creo que da un terreno muy sólido para cualquiera que quiera empezar a aprender expresión. Para que pudieras comprobarlo si quisieras. Eso es un envoltorio para mí. Agradecería mucho que estuvieras viendo esto, si has llegado a esta parte de la clase para dejar caer una crítica, realmente significa mucho. Leyendo una buena crítica. O si no te gustó la clase, sigo poniendo una visión general. Me gustaría obtener algunos comentarios sobre cómo me va porque realmente disfruto enseñar y soy estudiante de cómo enseñar mejor. Entonces sí, lo que sea, depende de ti, otra vez, Eso es una envoltura y te veré en la siguiente. Esperemos que pronto. Adiós.