Transcripciones
1. Introducción: Creo que mi estilo en general es bastante sencillo. A poder realmente contar esa historia a través un cierto tipo de energía que transmite emoción. Hola, ¿cómo te va? Mi nombre es William Kesling, y soy diseñadores de emociones y hoy voy a estar enseñándote a crear un bloqueo de logotipo animado en After Effects. Por lo que hoy, vamos a estar buceando en el inicio y el final de un proceso de diseño de movimiento y eso realmente comienza con conseguir el bloqueo del logotipo, entrar en storyboards, entrar en animación y realmente regalar esa animación en un par de diferentes escenas con transiciones, y luego a partir de eso, haciendo una fase de pulido y luego haciendo exportación y entrega. No necesitas experiencia en After Effects para poder tomar esta clase, algo en lo que vamos a estar buceando a lo básico de principio a fin,
desde Illustrator hasta After Effects y después hasta la exportación final. Es decir, una cosa grande con movimiento y diseño, creo que permite a un diseñador poder vender su idea a un cliente. Creo que muchas veces estás trabajando con clientes que tienen esta idea de cuál debe ser su diseño y luego los muestras con varios diseños diferentes. No entienden muy bien lo que estás transmitiendo porque a veces solo pueden ser objetos simples, pero para poder poner eso en movimiento, con el diseño de movimiento realmente ayuda a vender esa idea. Entonces, ya sea que sea el bloqueo del logotipo que
tienes o algo en lo que estás trabajando con un cliente, esta clase es algo realmente genial para empezar a entender After Effects y cómo entender la emoción a través del movimiento diseño. Agradezco que vengan y vean esta clase y estoy muy emocionado de ver lo que ustedes crean.
2. Planificar tu animación: Por lo que hoy, vamos a estar creando diseño de movimiento en torno a la remarca de Fathom, que Fathom es un software de informes financieros. Por lo que el cliente Fathom llegó a Focus Lab que es un Brand Studio en Savannah, Georgia para obtener un rebrand completo de su empresa. Pero también querían poder
transmitir y tener un poco de narración a través del diseño de movimiento, y así es donde entré en el proceso que vamos a estar mostrando a los usuarios hoy. Entonces una vez terminada la fase de diseño, me encargo de tomar el diseño y tomar la historia que nuestros estrategas y diseñador han creado, y tratar de transmitir eso a través del bloqueo del logotipo que tengo frente a mí. Es entonces mi trabajo poder tomar ese bloqueo de logotipo y transmitir esa misma historia
que hemos estado haciendo a través de la marca a través del diseño de movimiento. Entonces el primer paso para eso es realmente arrancar con algo de storyboarding. Te voy a estar mostrando cómo hacer eso de manera muy sencilla y casi en un estilo tipo boceto. Entonces, ¿cómo vamos a estar acercándonos a este proceso de diseño de movimiento es realmente a través concentrarnos en tres componentes del bloqueo del logotipo de la marca que tenemos aquí. Entonces el primer componente va a ser realmente elegir ese objeto guía, casi el personaje principal para tu animación que puedes pensar en ello como, y luego realmente sumergirte en la marca y la historia de la marca, y lo que realmente hace la marca, y eligiendo nuestro elemento de marca que quieres transmitir como segundo componente, y luego tu tercer componente siendo ese cierre de logotipo final y cómo vas a hacer que esta cosa se haga círculo completo y llegar a eso. Entonces vamos a empezar con el storyboard. Entonces el propósito del storyboarding es realmente darte una guía para tu animación de movimiento, y poner realmente estos tres componentes en papel y luego diseñar las transiciones entre esos tres componentes para poder llegar a tu cierre de logo final. Entonces lo primero que quieres hacer una vez que te den la marca del diseñador, del cliente, es querer realmente entender la marca y lo que hace la marca y lo que están tratando de transmitir. Para Fathom, realmente estamos trabajando con una empresa que maneja datos
financieros y también usan muchas
gráficas dentro de su empresa y para sus clientes con los que están trabajando. Entonces la marca aquí obviamente está utilizando un gráfico dentro la marca y realmente utilizando un diagrama de Gantt dentro de la marca misma. Entonces desde el principio, entendemos que queremos tener ese elemento inicial de marca que va a ser el segundo componente, ser algo sobre una gráfica. Pero queremos dar un paso atrás y entender cómo vamos a llegar a esa gráfica y realmente poder diseñar alrededor de un objeto guía,
casi como un personaje al que puedes agregar emoción a través del diseño de movimiento, es realmente donde nosotros van a empezar. El primero que quieres hacer es mirar el bloqueo del logotipo que tienes, y ver de qué está hecho. Por lo que el bloqueo del logotipo de Fathom tiene muchos bordes duros, por lo que crear realmente ese contraste es realmente importante en el diseño de movimiento. Quiero usar algo que sea un poco más suave para ese conductor,
para ese guiar objetos a lo largo de este proceso de diseño de movimiento. Entonces algo así como un círculo funcionará muy bien porque es fácil agregar características y también marcos clave a una vez que nos metamos en el proceso de animación. Vamos a empezar con storyboards y es importante
recordar cuando estás iniciando tus storyboards, que no necesita ser perfecto en absoluto pero quieres tener un sentido de la composición y tu marco que vas a ser utilizando en After Effects. Para el círculo, ya que sólo va a estar empezando con el círculo, casi
puedes darte animaciones ásperas para entender que el círculo va a estar en medio del cuadro. Pero luego también agrega algunas flechas para entender el movimiento que va a estar sucediendo, ya sea para ti o para el cliente, sobre todo cuando vas a entregar esto, quieres poder tener algo de lo que puedas hablar. Por lo que poder dirigir literalmente el movimiento con esta flecha, ser como si empezara desde abajo, ser un poco más pequeño y dirigir hacia arriba para llegar al tamaño completo de ese objeto guía. Ya que el Fathom trata mucho con gráficos, sé que quiero que el elemento de marca sea algún tipo de gráfico. Entonces podemos escoger un gráfico de barras, y así justo debajo de esto, sólo
vamos a dibujar otro rectángulo de 16 por nueve aquí, y trabajar más o menos, entender cómo puedo usar este círculo y entender dónde sería ese gráfico de barras tierra. Ya que quiero quedarme con la composición central, voy a tener una estructura de la parte inferior aquí para darle
al gráfico de barras algo en lo que apoyarse, algo en que estar parado,
y agregando bloques de color a lo largo de tu storyboards es algo bueno para ti. Simplemente dibujo más o menos un gráfico de barras, tal vez en alturas variables aquí, y tal vez lo guardo a donde tengamos alguna elevación. Entonces si quiero poder tomar este círculo, y si quiero ubicar composicionalmente eso dentro de esta escena de elementos de marca, creo que eso se verá realmente bonito poder
tenerlo casi ponderado aquí arriba en la parte superior, y tal vez un poco más pequeño de lo que lo tenemos en la primera escena, entendiendo el movimiento que posiblemente podría suceder lo largo de aquí hacia como movimiento swooshing. Es algo a tener en cuenta cuando estás pasando por tus storyboards. Está bien. Entonces ahora vamos a pasar al tercer componente, y a ese tercer componente está el bloqueo final del logotipo, y así una vez más, simplemente dibuja aproximadamente un bonito y
hermoso rectángulo aquí y poder visualizar donde quieras que composicionalmente dentro del rectángulo y quiero que sea un poco más pequeño, pero poder tener en trazar casi visualmente, la marca aquí, teniendo este rectángulo. Creo que es importante tener algunos de los elementos estructuralmente suenan dentro de tus storyboards. Pero luego cuando sale a gustar el tipo de logotipo, a veces eso puede ser realmente negro-arenoso para los storyboards. Entonces sólo para poder tenerlo a donde es sólo una cuadra. Entonces sabes que ahí es donde el tipo de logotipo podrá pararse, y luego uno solo agregando un poco como llenar esto. Esto podría ser para ti o esto podría ser para que el cliente pueda ayudarles a
entender visualmente la composición en la que estás trabajando. Poder ir de esto, puede ver con qué estamos trabajando en las tres etapas diferentes y los tres componentes diferentes por los que vamos
a estar trabajando dentro de los storyboards y luego el movimiento proceso de diseño también. Está bien. Entonces ahora, una vez que tengas tus tres componentes dispuestos dentro de una forma storyboard, forma de storyboard
áspera, tienes que averiguar cómo vas a pasar de un componente a otro. Entonces ahora sé que tengo este círculo, pero necesito este círculo para iniciar de alguna manera este gráfico de barras que he dibujado, este elemento de marca, y así sé que quiero el círculo una vez que esté en medio del marco por aquí, Quiero descender casi y golpear el fondo de esta marca, o el fondo de esta gráfica e iniciar ese proceso de iniciación. Entonces en realidad voy a tener esta pelota estando aquí arriba, pero bajando y a medida que se desliza hacia abajo, este gráfico de barras de aquí abajo va a empezar con ese elemento de cimentación construyendo hacia fuera. Entonces, puedes ver cómo estoy dibujando las flechas para mostrar el movimiento ya que estoy hablando a través de él, porque así es exactamente como hablaré a través de él con el diseñador o el cliente con el que estoy trabajando. Por lo que incluso puedes conseguir un poco más detallado y mostrar que los gráficos de barras van a estar empezando desde abajo, y van a estar creciendo hasta la cima aquí, y haciendo eso realmente bruscamente. Entonces, también mostrando dónde estará esa pelota, y tal vez se vaya haciendo un poco más pequeña a medida que llegue, pero demostrando que ese movimiento continuo va a suceder todo el camino, y ese será un elemento transitorio en este marco. Entonces ahora, yendo desde aquí y cómo llegamos desde aquí, este componente hasta el cierre del logotipo final. Entonces una vez más, sólo voy a dibujar nuestro rectángulo, los rectángulos están mejorando como los hago, y así sé que tengo la pelota aquí arriba y la gráfica se ha construido, pero ahora necesito colapsar la gráfica y llegar a esto. Entonces sé que quiero utilizar, tal vez utilizando un color de marca diferente el cual tal vez podamos usar ese azulado, y tener ese TOB que elementos transitorios. Entonces tenemos la pelota estando aquí arriba, y dibujando eso un poco, y tenemos nuestro elemento fundacional una vez más aquí abajo, y solo intenta hacerlo realmente bosquejo como, tenemos todo esto pasando. Entonces ahora sé que quiero este balón. Desde entonces ha estado aquí arriba, quiero tal vez bajarme y volver por ahí. Al volver, casi hace el efecto inverso de lo que hicimos en el último elemento transitorio, regresa, colapsa todos los gráficos de barras. Al colapsar los gráficos de barras, tal vez tengamos otra forma que sale de abajo. Entonces usando un bolígrafo aquí, tienes que ponerte creativo. Entonces tenemos esta forma saliendo de abajo, y puedes usar líneas rayadas para hacer referencia a que esa va a ser una nueva forma que viene, y darle a esa forma su propia flecha, y entender que este círculo va a subir alrededor y colapsar esas formas. A medida que ese nuevo objeto azulado sale de abajo, empezará a construir esta marca que tenemos aquí. Por lo que ahora para la tercera transición, sé que ya tuve esta transición llevando al cierre final del logo, pero ahora necesito volver del bloqueo del logo a nuestro objeto guía o conductor. Entonces lo que voy a hacer es, sólo
voy a dibujar una vez más aproximadamente a dibujar tal vez una marca un poco más compacta como si se estuviera colapsando sobre sí mismo para volver a ese círculo, y entonces tal vez esa barra tipo logotipo se esté deslizando en realidad detrás de la marca, y la marca se desliza sobre el tipo de logotipo para volver a colapsar todo. Entonces voy a seguir adelante y llenar esas cosas y eso es solo para crear esa consistencia visual que realmente te ayude a vender tu idea. Entonces, también este es un gran lugar para agregar algunas flechas simples solo para ti o para que alguien más realmente entienda
con qué movimiento estás trabajando y cómo todo eso va a pasar, y ahí tienes. Por lo que ahora vamos a poder volver a este objeto guía. Está bien. Entonces ahora una vez que tengas tu storyboard completo fuera, puedes mirar y ver lo que has creado y ver si todo tiene sentido y para realmente entender y solo reiterar por ti mismo también, la repetición es clave. Entonces entendiendo que tenemos nuestro círculo el cual está brindando ese contraste al logotipo más duro de borde con lockup que tenemos, y ese realmente va a ser el objeto guía para toda esta animación. Entonces yendo del círculo, a construir este elemento de marca, esta gráfica y mostrando que el movimiento circular de la misma viniendo, la gráfica finalmente siendo construida y teniendo esa marca, ese objeto guía descansa en la parte superior hay un poco, mostrar el elemento de marca por una fracción de segundo, y después tener ese elemento de marca colapso, que tenemos aquí pasando, que vuelve a bajar, y tener ese elemento de marca una vez que lo colapsar para poder realmente construir el tipo de logotipo de marca, y realmente entender que acabamos de contar una historia realmente buena sobre la marca. Después, llegando del tipo de logotipo de la marca,
al bloqueo del logotipo , al objeto inicial donde va a tener, vamos a hacer un simple colapso con cierta facilidad en él para realmente volver a ese círculo. Entonces el objetivo del storyboard que quiero que realmente recuerdes es que, te está dando tu guía. está ayudando realmente a sumergirte en After Effects y tener un punto de partida en lugar de sumergirte en After Effects y tener un signo de interrogación de lo que incluso empezar a crear. Por lo que bloquear los tres componentes y las transiciones que vas a estar utilizando dentro de tu proceso de diseño de movimiento, realmente te dan algo para trabajar, y para realmente mostrarte ese progreso que vas a ser haciendo a lo largo tu diseño de movimiento y también el impulso para mantenerte en el camino.
3. Organizar capas en Illustrator: Entonces lo primero que quieres hacer una vez que puedes sumergirte en After Effects, probablemente recibas un archivo AI de un diseñador o de un cliente. Entonces vamos a abrir eso a Illustrator y ver con qué estamos trabajando. Entonces ahora, una vez que hayamos abierto el branding que tenemos para Fathom, vemos con qué estamos trabajando y entendemos si solo lo seleccionas todo ve de qué se compone. Entonces una cosa que descubrí que es más sencillo de hacer en Illustrator es romper todos los elementos dentro ilustrados que sabes que vas a estar animando. Entonces si sé que voy a estar animando todas las formas tipo, entonces quiero dividirlas en sus propias capas. Entonces ahora mismo, si entro en el panel Capas de ilustrador, podremos ver que estamos trabajando con la capa uno que es esta marca aquí. Entonces lo que voy a hacer es que voy a hacer “Shift+Comando+G” para desagrupar esos ahí mismo. Por lo que ahora, tenemos todos estos elementos dentro de su propio contenedor. Pero lo que quiero hacer es que puedes ver que sigue en la misma capa. Entonces lo que voy a hacer es que sólo voy a crear una nueva capa aquí abajo, y voy a empezar a trabajar con la marca. Entonces solo voy a seleccionar la marca “Comando+C” “Comando+X” para cortarla. Después en la capa dos, voy a hacer “Comando+F” para poder pegar eso en su lugar. Entonces esto es algo realmente importante porque en Illustrator te quedarás con muchas capas, y es realmente importante etiquetar tus capas si es una marca, si es una letra, si es un color. Entonces, cuando entres en After Effects, todo se convertirá, y podrás tener algo mucho más organizado en la capa uno, en la
capa dos, en la capa tres, y así sucesivamente. Entonces ahora, sé que voy a poner todas las letras individuales de Fathom también en su propia capa. Entonces voy a hacer ese mismo proceso que acabo de hacer con la marca ahora mismo. Entonces Comando+C, Comando+X, hacer una nueva capa. Ponte eso ahí. Simplemente pon una F. Así que ahora que puedes ver tenemos todo por
aquí roto de la marca a todas las letras de la tipográfica, entonces voy a entrar en esta marca misma porque sé que en realidad quiero utilizar todos estos formas individuales como esta. Entonces quiero poder utilizar estos, y como estos dos están pegados juntos, quería simplemente romper esas dos formas. Entonces yo sólo voy a hacer eso muy rápido aquí. Entonces básicamente, lo que estoy haciendo es tirar de los elementos que ya
tenemos porque sé que esto fue diseñado de manera uniforme. Entonces básicamente solo estoy sosteniendo Option y solo arrastrando, y eso te permitirá duplicar una imagen. Es decir, te permitirá duplicar un vector dentro de esa capa que has creado. Entonces ahora, tengo esas dos piezas duplicadas. Ahora bien, si ven tengo a estos dos separados. Si fuera a seleccionar esos, ponlos a la parte trasera manteniendo “Shift+Comando” y el soporte trasero. Se lo enviarán a la parte de atrás, y ahora puedo eliminar esa capa superior que era una forma a ahora donde tengo dos formas creadas, apenas fuera de muestreo de la propia marca. Entonces ahora, si salgo, entendemos que tenemos todas estas capas rotas, e incluso puedo llegar al grado porque sé que en realidad voy a estar usando la marca y voy a estar usando esas cuatro formas individuales, individualmente. Entonces puedo romper esta marca en cuatro capas individuales, y así lo voy a hacer ahora mismo. Algo que es genial acerca la relación entre todo el software de Adobe que vamos a estar usando es tamaño del contenedor aquí con el
que estoy trabajando en mi tablero de arte puede reflejar el tamaño de la composición dentro de After Effects. Entonces si tuviera que hacer clic en “Shift+O”, en Illustrator se abrirá el tamaño del tablero de arte. Si hago clic en “Enter”, puedo ajustar ese tamaño de tablero de arte. Por lo general, nuestro tamaño de tablero está diseñado alrededor de la impresión o algo que se va a utilizar en la Web. Entonces, cuando se trata de usar píxeles, literalmente
puedes entrar en el ancho y la altura de Illustrator y decir, trabajaremos dentro de 1920 por 1080, y aquí le dará el tamaño. Entonces esto es importante porque ahora, puede ver el tamaño del contenedor que vamos a estar usando para nuestra composición con After Effects. Realmente puedes entender que la composición del tipo
de logotipo final es mucho más pequeña de lo que realmente queremos. Por lo que para poder combatir eso antes de entrar en After Effects, literalmente
puedes seleccionar todo, sostener “Shift+Option” para mantener todo uniforme al escalar, y para conseguirlo en una zona agradable. Esto se puede ajustar después, nada es realmente definitivo con nada de esto, y para tal vez solo ajustarlo al tamaño que creas que funciona mejor para ti, y eso está luciendo fantástico. Está bien. Entonces ahora, vamos a entrar en el proceso de ahorro de ir de Illustrator a After Effects, y cómo crear una estructura de carpetas simple para ti solo para mantener todo organizado para el proceso de relinking.
4. Transición a After Effects: Entonces cuando entramos en el proceso de ahorro, básicamente es tan simple como lo que parecía. Por lo que entra en Archivo, Guardar como. Esto es justo si tienes ese documento guardado en tu escritorio o algún disco duro aleatorio, y quieres guardarlo, digamos en tu escritorio. Hagamos aquí una nueva carpeta llamada Fathom Motion Design. Está bien. Entonces ahora vamos a crear esta carpeta, y vamos a llamar a ésta. El logo de Fathom lockup AI, que funciona bien.Podemos especie de crear una nueva subcarpeta dentro de esta carpeta maestra, y llamar a ésta una IA. Entonces sabes que ese es el documento ilustrador en el que vas a estar trabajando. Asegúrate de que todo esto esté bien, quieres asegurarte de que está guardando como carpeta de IA. Es decir, archivo AI y haga clic en Guardar. No tienes que preocuparte mucho por esto, pulsa bien, y estamos guardados. Ahora, podemos empezar a pasar a After Effects. Entonces ahora estamos en After Effects, y ahora tenemos la locura, el After Effects es, que si tu primera vez investigando esto, probablemente
te estés preguntando qué es todo, y por qué es todo organizado así. De verdad lo que probablemente estés mirando en este momento es algo como esto. Entonces así es como empieza, y como viste cambié de ida y vuelta entre diferentes diseños, porque es agradable a donde puedo arrastrar y soltar diferentes diseños de cómo quiero que esto funcione mejor para mí, y tal vez en una laptop pequeña, o en una computadora de escritorio más grande. A veces no sabes exactamente qué vas a estar utilizando más dentro de tu proceso de diseño, pero es importante tener en cuenta que puedes simplemente hacer clic fácilmente en la composición aquí arriba, y arrastrarla para decidir y literalmente tenerla más aquí. Entonces ahora esta es la composición, aquí es donde estará sucediendo tu acción principal. Entonces sé que quería como estar del lado derecho, y quiero tener todos mis otros módulos por aquí. Ahí o puedo llegar a mis efectos y de nuevo te consigue un par de los plugins que tengo, significaba que quiero tener mi línea de tiempo en la parte inferior solo para utilizar ese espacio. Entonces a la izquierda quiero tener todos mis archivos de proyecto, donde estoy importando y exportando, y arrastrando y soltando archivos que
necesito poder usar en mi proceso de diseño de movimiento. Entonces ahora una vez que tengas tu diseño a lo que crees que lo necesitarías, y a veces este proceso ocurre después de hacer un par de proyectos. Voy a seguir adelante y agregar algunos de los plug-ins que he aprendido a gustarme mucho, y usarlo casi todos los proyectos. Entonces si subo a la ventana, y voy aquí abajo una vez que ustedes tengan estos instalados, y que son realmente fáciles de instalar. Podría usar siempre Motion2, quiero decir Motion2 te permite hacer muchas cosas. Lo uso mucho para alinear ciertas cosas, y realmente poner un punto central a
un objeto para cambios de rotación y posición a medida que nos metemos en eso. Por lo que abrirá un nuevo módulo, y literalmente puedes hacer clic en este módulo y arrastrarlo a este panel aquí mismo, y puedes organizar a estos panelistas como quieras. Entonces sé que voy a estar usando mucho eso. Entonces voy a poner eso a la cima. Entonces ahora vamos a entrar en el, cómo importar a After Effects. Por lo que hay un par de formas diferentes de importar a After Effects, y es importante entender que realmente no hay una forma
equivocada o correcta de hacer nada en After Effects. Simplemente se basa en, diría eficiencia, y la eficiencia viene con el tiempo. Entonces no te preocupes por hacer todo perfecto la primera vez. Podemos simplemente hacer doble clic en este panel de producto aquí mismo, y subirá una carpeta. Subirá tu buscador y luego podrás seguir adelante y buscar eso,
para el archivo AI que acabas de guardar. Entonces como sé que guardé bajo mi carpeta maestra, Fathom Motion Design, entré ahí. Tengo mi carpeta AI, y luego hago clic en Fathom Logo Lockup. Sé que esa es una foto en la que acabo de organizar todo. Una cosa a tener en cuenta, y cuando haces esto, es bajar a la configuración, la configuración de importación aquí abajo. Lo tiene tan por defecto como metraje, y quieres decir Composición Retener tamaños de capa. Entonces eso conservará unos tamaños de capa dentro de la composición, el tablero de arte que diseñaste dentro de illustrator. Entonces eso es todo lo que tienes que preocuparte, crear composición, que
eso creara esa composición fuera de ese tablero de arte que creaste en Illustrator. Puedes seguir adelante y hacer clic en Abrir, y así como veas como las importaciones, obtendremos nuestra nueva composición, y luego también obtendremos nuestras capas dentro del documento de Illustrator que habíamos roto en el formularios de carta individuales y Mark. Por lo que ahora, literalmente, puedo hacer doble clic en esto. Puedo hacer doble clic en esta composición que creé para sí misma, y se levantará el documento de Illustrator dentro del módulo de composición. Ya verás que tiene un fondo negro. Entonces ahora esto es algo que puede ser un poco confuso cuando te metes en esto, cuando te inicias porque has conseguido, estás trabajando en Illustrator, ilustrador tenía un fondo blanco. ¿ Es esto algo fácil de controlar haciendo el comando K? Command K sacará tus ajustes de composición, y a partir de esa configuración de composición, puedes cambiar rápidamente el color de fondo de negro a cualquier color que quieras. Pero cambiémoslo a blanco, seguiremos adelante y pincharemos bien. Haga clic en OK. Entonces ahora lo que vamos a hacer una vez que tengamos nuestras todas nuestras capas tipo de puestas aquí. Vas a saber que todos tienen esta pequeña insignia de IA junto a ellos. Eso significa que están vinculados con ilustrador. Entonces lo que siempre hago cuando me meto en esto, es básicamente mantengo esto como mi composición maestra, y selecciono todas las capas que sé que voy a estar poniendo cambios de posición,
y cambios de escala en, si es así si los seleccionas, haces clic con el botón derecho. Tienes que crear, vas a crear formas a partir de capa vectorial. Haga clic en eso y básicamente hará su magia, y creará otra capa encima de esas capas de IA, que ahora es una capa vectorial que se puede trabajar con los caminos. Puedes cambiarlo por completo como si fuera un ilustrador para que no tengas que preocuparte por los píxeles y todo eso. Por lo que este es uno de los atajos realmente importantes, sosteniendo Shift Command y corchete derecho, llevarán todas tus capas a la parte superior. Entonces solo si mantienes pulsado Shift
Command, y el corchete izquierdo, los llevará todo el camino hasta la parte inferior. Entonces esto es algo que estaremos utilizando a lo largo del curso para realmente estructurar capas y organizarlas fácilmente también. Ahora que tengo todas las capas en un contorno vectorial, voy a tomar estas capas, y las voy a poner en una nueva composición en la que voy a estar trabajando. Entonces básicamente voy a hacer clic en la composición a la que
importamos de Illustrator a After Effects, voy a hacer clic en el comando D para duplicarla. Voy a volver a etiquetar eso y llamar a eso Fathom Motion Design, y voy a dar clic ahí y todo lo que voy a hacer es simplemente eliminar el archivo Illustrator, capas de
Illustrator que habíamos importado, y sabiendo que los tengo en el cierre del logo de Fathom aquí. Entonces lo que puedes hacer para especie de mantener esto organizado, porque aquí es donde vas a estar cayendo en muchas capas en un montón de pre-comps que terminas usando, es que solo haces subcarpetas por ti mismo. Por lo que una manera fácil de hacer una carpeta es simplemente hacer clic derecho dentro de este módulo, Nueva carpeta y llamemos a este Archivos Maestros. Entonces sé que estos serán todo el archivo maestro es de que no voy a tener que preocuparme, a menos que realmente necesite volver atrás y corregir algo. Ahora que tengo todo importado y como que tengo algo roto, y estoy en mi carpeta maestra, voy a dar clic en comando S. Ya que no he guardado aún,
porque no he guardado mi archivo After Effects, si hago clic en el comando S, me va a pedir que lo guarde en una ubicación. Por lo que aquí es una vez más donde quieres mantenerte organizado. Entonces quiero volver atrás, quiero navegar de nuevo a esa carpeta maestra, el Fathom Motion Design. Entonces vas a conseguir una nueva, luego vas a hacer una carpeta nueva para ti y al
igual que hice una para AI para ilustrador, lo
vamos a llamar AE para After Effects, y vamos a guardar esto Archivo After Effects ahí dentro.
5. Crear el objeto guía: El primero que queremos hacer entrando en nuestra animación es trabajar dentro de ese objeto guía que escribimos en nuestros Storyboards, que vamos a estar usando un círculo. Básicamente, lo que voy a hacer es, voy a crear un nuevo objeto. Entonces me voy a quedar justo dentro de la composición en la que estamos trabajando. Voy a hacer Comando A para seleccionar todas las capas, y sólo voy a mover esas hacia alrededor de 10 segundos, sólo para darme algo de espacio para crear ese nuevo círculo y trabajar a través del proceso. Pero ten en cuenta que siempre estarán por aquí, por lo que siempre puedes hacer referencia a la marca o a los colores que vas a estar usando. Algo a tener en cuenta es que si ves aquí mismo, verás que todos tienen sus cajas delimitadoras alrededor de las formas individuales. Para ocultar eso, puedes sostener Shift Command H, y eso lo ocultará para que puedas ver con qué estás trabajando. Entonces ahora, vamos a ir al inicio de
la composición o al inicio de tu línea de tiempo, y vamos a subir a capa,
nueva, y hacer una nueva capa de forma. Se puede hacer esto de un par de maneras diferentes. Esa es una forma de hacer una capa de forma. De otra forma, si sabes exactamente qué tipo de forma quieres hacer, podemos seguir adelante y eliminar esto. Puedes subir a este objeto aquí arriba, puedes mantenerlo presionado, y vas a la herramienta de elipse, y luego, puedes ir a tu composición después de golpear la herramienta de elipse, manteniendo presionado Mayús y Comando para que el tamaño mantenga su proporción. Puedes hacer que el círculo sea el tamaño que creas que funcionaría para ti. Entonces en este momento, sólo vamos a hacer que sea de tamaño mediano, y notarás que todo es blanco. Si vas a la parte superior de After Effects, verás que puedes ajustar el relleno y el contorno de este trazo del objeto que acabas de hacer. Por lo que tenemos seleccionada nuestra capa de círculo. Yo puedo subir aquí, y puedo hacer de esto un rojo brillante si quiero. Si quiero apagar el trazo porque no necesitamos el trazo, todo lo que haces es solo hacer clic en el trazo justo aquí, puedes ir al panel de opciones que aparece, y hacer clic en ninguno, y hacer clic en OK. Entonces quiero trabajar con ese color azulado que tenemos que define la marca. Entonces voy a volver sólo un par a alrededor de 10 segundos en mi línea de tiempo, y ahí mismo, tengo la marca, y tengo el círculo sobre ella. Puedo usar el cuentagotas de tinta. Entonces lo que voy a hacer es, voy a elegir el círculo rojo, y voy a tintar-soltar el color turquesa para que emparejemos ese color perfectamente desde el branding. Entonces ahora, si vuelvo al inicio de la línea de tiempo, estamos trabajando con nuestro círculo. Entonces el círculo en este momento, el punto del eje central parece que está en el centro. Pero a veces, cuando creas objetos, el punto del eje central se baja, y eso determinará realmente cómo
va tu animación cuando haces rotación y cuándo haces cambio de posición. Por lo que sólo queremos asegurarnos de que ese punto del eje central esté en medio del objeto. Entonces, una forma fácil de hacerlo si no tienes Motion 2 es hacer clic en Y en tu teclado, y luego, podrás moverlo. Si mantienes presionada Comando en tu teclado, verás que se bloquea en su lugar. Por lo que se cerrará en el centro, a la derecha, a la parte superior, donde realmente necesites, y queremos que eso sea en el centro. Ahora, si sí tienes Motion 2, básicamente
puedes hacer clic en cualquier capa que tengas, subir aquí al panel lateral, hacer clic en eso, y podrás elegir a dónde quieres que vaya ese punto de eje. Para que veas que estás saltando de arriba y abajo, y queremos que eso esté justo en el centro. Entonces eso es lo que estaré usando a lo largo de esta clase. Para poder conseguir este objeto ahora en el centro de la composición, y algo que vamos a usar, y se llama alinear. Esto es muy similar a Illustrator a donde tenemos la línea. Lo vamos a alinear con la composición. Simplemente vamos a asegurarnos de que todo esté alineado al centro de la comp. Entonces ahora, tenemos nuestra capa. Entonces verás que nuestra capa es
del mismo color que las otras capas que tenemos dentro de nuestra línea de tiempo. Entonces para algunas personas, es realmente importante etiquetar por nombre, para algunas personas, es realmente importante etiquetar por color, y para algunos, son ambas. Para mí, soy más una persona visual. Entonces para mí, ha sido genial simplemente hacer, si yo [inaudible] sé que voy a tener tres círculos diferentes y voy a tener dos cuadrados en un triángulo, etiquetaré esas diferentes formas, diferentes colores. Entonces visualmente, puedo ver eso, y puedo acceder a eso rápidamente. Entonces lo que tienes que hacer para poder cambiar el color de la forma es ir a los pequeños bloques azules. Todo lo que haces es, haces clic en él, y eres capaz de escoger qué tipo de color. Le daremos a esto un color rojo, y luego, estamos trabajando con un círculo delineado rojo. Puedo seguir adelante y cambiar el nombre de ese círculo. En este momento, dice Shape Layer 1. Puedo cambiar eso a círculo si lo necesito solo haciendo clic en Entrar y luego cambiarlo a Circle_001. Entonces, también tengo eso etiquetado dentro del nombre y el color. Ahora que tenemos nuestro diseño de objetos orientadores que escogimos de nuestro proceso de storyboarding, básicamente
voy a traer eso al marco. Por lo que hablamos de que
subiera de abajo con el cambio de escala y usar la posición. Entonces voy a meterme en la tontería de cómo usar algunos atajos para básicamente hacer cambio de posición y cambio de
escala y hacerlo realmente rápido en tu proceso también. Entonces lo primero que puedes hacer para hacer un cambio de posición, si queremos que este círculo venga de la parte inferior de la composición a la parte superior de la composición, podemos dar click aquí abajo en esta flecha, click en contenidos, vaya a la elipse, vaya a transformar, y luego vaya a la posición, y haga y haga clic en este cronómetro, y haga un fotograma clave aquí mismo. Esa es una forma de hacerlo. Ahora, si hacemos clic en Comando Z para deshacer, otra forma más rápida de hacerlo es mantener presionada la Opción de Mayús P, y luego, haré un fotograma clave para ti hasta donde ahora este es un fotograma clave dentro de tu composición. Esa es una posición que va a ser keyframe. Vamos a bajar eso sólo un poquito, sólo un par de segundos. Sé que quería empezar en la parte inferior del marco. Entonces solo voy a bajar esto, y verás que está empezando a mostrar el movimiento que va a estar sucediendo. Ahora si tocamos, tenemos una animación agradable y
sencilla pasando aquí. Algo a tener en cuenta dentro de tu línea de tiempo, ya que tenemos una línea de tiempo que es de una duración de 20 segundos y si quieres que esto bucle, puedes o bien arrastrar esta barra en la parte superior hasta el punto al que quieres que recorra. Entonces si fuera a arrastrar esto hasta aquí y tener un bucle, puedo dejar que se reproduzca en un bucle atrás solo por tener esta barra superior determinando eso. Entonces otra forma de hacerlo es básicamente pensar en
como la clave B y la N como el principio y el final de esa firma de tiempo en bucle en tu línea de tiempo. Por lo que voy a alrededor de cinco segundos y hago clic en N. Hará ese punto de bucle justo a los cinco segundos. Entonces lo vamos a mantener a la derecha. Dos treinta, haga clic en “N”, eso parece bueno. Entonces ahora, tenemos una animación sencilla pasando con nuestro círculo, pero sé que fui ese círculo para ser mucho más pequeño. Sé que quería empezar con un cambio de escala donde casi está saliendo de la nada. Entonces lo que voy a hacer una vez que tenga esa capa seleccionada es que voy a mantener Shift-Command-S, y eso va a hacer una vez más un fotograma clave en esa capa, para la escala. Por lo que la escala en este punto estará en torno al 100 por ciento. Digamos que quería empezar a cero. Entonces voy a hacer clic en cero, en Escala ,
aquí mismo, y luego tengo una animación de ella creciendo, realmente simple, no la mayor animación, pero ahora estamos moviendo formas y donde se está poniendo emocionante. Es un extraño entrar en esto aún más lejos, otro atajo realmente bonito es “U” en tu teclado. Entonces “U” en tu teclado si seleccionas la capa de círculo con la que hemos estado trabajando,
y en lugar de torcer hacia abajo esta flecha y el giro hacia abajo esta para poder llegar a los fotogramas clave en los que hemos estado trabajando. Algo sencillo que puedes hacer es simplemente hacer clic en “U” en tu teclado. Entonces “U” traerá a la luz los fotogramas clave en los que has estado trabajando y After Effects, ya sean 17 tipos diferentes de fotogramas clave o tal vez solo un cambio de posición, lo sacará. Entonces ahora, tenemos nuestros dos fotogramas clave de posición en los que estamos trabajando, que son sólo un simple cambio de posición, haga clic en Fin, para hacer ese espacio de bucle un poco más corto aquí. Entonces lo que quiero hacer es ahora mismo estamos trabajando con un movimiento lineal. Entonces lo que quiero hacer es introducir algo llamado Easy Easy. Easy Ease introduce una cosa completamente nueva en diseño
gráfico que realmente hace que el movimiento sea un gran movimiento, y realmente cómo trabajas dentro de tu proyecto, luego sumergirte en una y más profunda a medida que avanzan los proyectos. Así que una forma de iniciar una Fácil para hacer cambios fotogramas clave en fotogramas clave Easy Easy Easy es seleccionarlos ambos, hacer clic derecho en uno de los otros, y ir al asistente de fotogramas clave y ir demasiado Fácil. Entonces ahora, esto lo hará básicamente si miras el movimiento que estamos recibiendo, empezará un poco más lento, y se pondrá un poco más rápido a medida que sigue. Es sutil, pero le tiene un poco mejor sentimiento, no es tan estancada, no
es tan lineal, y voy a llevar esto aún más allá lo que podemos hacer es entrar al Editor Gráfico. Por lo que el Editor de gráficos realmente te permite ver el movimiento que está sucediendo entre dos a tres a 25 fotogramas clave diferentes en los que estás trabajando. Realmente te muestra la moción que está sucediendo, ya sea una cámara lenta a rápida o rápida a lenta. Entonces vamos adelante y pinchamos en el Editor de Gráficos, lo que más nos interesa es el gráfico de velocidad. Entonces vamos adelante y hacemos clic en esta cosita aquí abajo, que dice elegir tipo de gráfico y opciones. Vamos a ver que está en el gráfico de valores, queremos ir al gráfico de velocidad. Entonces vamos a hacer clic en el gráfico de velocidad, y verás que tenemos una pendiente de Fácil Facilidad la podemos llamar aquí. Entonces una cosa que sabes cuando miras este gráfico es que esto es básicamente una relación con donde está en el eje y es hablar de velocidades. Por lo que tenemos píxeles por segundo. Entonces esto va a estar en la cima de su pico, se está moviendo así de rápido, y luego en el eje x básicamente está mostrando la duración de ese movimiento. Entonces cuánto tiempo va a durar esa moción. Entonces realmente donde quieres que suceda el movimiento principal se va a definir por dónde está este pico en esa línea de tiempo. Entonces, por ejemplo, en este momento tenemos un bonito movimiento de fácil sencillamente por defecto que aplicamos a este cambio de posición. Por lo que quería empezar tal vez un poco más lento. Entonces solo voy a mover este primer fotograma clave. Entonces si no está seleccionado solo puedes seguir adelante y hacer clic en él, selecciónela, y resaltará amarillo. Por lo que conseguirás un punto de anclaje justo aquí hasta donde puedes arrastrar ese ancla hacia fuera, para hacer una pendiente más inclinada hacia donde
puedes ver ahora todo el movimiento va a suceder aquí al final. Empezará muy lento y saldrá
poco a poco subir por la moción va a pasar aquí. Se puede ver cómo se pincha. Realmente hay donde la animación se pone interesante y a donde realmente
haces agrega esa característica a la forma simple como un círculo, y me verás usando esto a lo largo de toda la clase. Pero digamos por este, quería entrar realmente rápido. Entonces voy a tomar ese punto de anclaje, y los voy a arrastrar a ambos de esta manera. Entonces todo el movimiento ocurre en el comienzo mismo de mi línea de tiempo hasta donde se dispara desde la parte inferior del fotograma ahí. Por lo que ahora, sólo podemos hacer clic en el editor de gráficos para salir de ahí. Ahora, ya que hemos hecho esa cosa que siempre
recuerdo cuando estás en After Effects es guardar tu proyecto. A Adobe le gusta renunciar a ti, y creo que todos sabemos eso. Entonces ahora, quiero trabajar con la báscula, porque obviamente no quiero que la escala sea del tamaño que es en este momento, quería empezar pequeño como la tenemos aquí mismo, pero quería crecer para ser alrededor del 50 por ciento del tamaño que está en . Entonces voy a hacer clic en “S” en mi teclado una vez que tenga seleccionada la capa de círculo, y luego tiraré hacia arriba el cambio de escala. Entonces en este momento, no tenemos cambio de escala, por lo que vamos a añadir un cambio de escala. Entonces vamos a ir al inicio de nuestra línea de tiempo, vamos a tener nuestra escala seleccionada, cuando haga clic en las métricas aquí y haga clic en cero, y luego el círculo estará en cero, el tamaño. Entonces ahora, si jugamos, veremos que crece, y está creciendo. La escala está creciendo muy linealmente, y luego la Facilidad Fácil en la posición está proporcionando este tipo de efecto. Por lo que queremos que ambos sean Fácil Facilidad para casi trabajar juntos. Entonces lo que voy a hacer es, voy a seleccionar la báscula, y voy a hacer el mismo proceso que acabo de hacer. Voy a hacer clic derecho en esos fotogramas clave, voy a ir faltas de fotogramas clave, hago clic Easy Easy, y ahora verás que va a ser un poco más de una facilidad en el cambio de escala que tenemos. Todavía no alinearse perfectamente con la posición sólo porque alteramos la posición ahí dentro. Entonces ahora, lo que voy a hacer es que voy a entrar al Editor de Gráficos una vez que tenga seleccionado mi fotograma clave de dos escalas, voy a entrar al Editor de Gráficos, y me voy a asegurar que el cambio de escala también ocurra muy manera similar al cambio de posición a donde sube al principio, y sólo voy a hacer eso arrastrando estos puntos de anclaje hacia la derecha. Entonces ahora, se puede ver que el movimiento tanto de la escala como de la posición están sucediendo de manera similar y alineándose lo que realmente permite que esta forma le dé un poco más de consistencia dentro de los dos fotogramas clave en los que estamos trabajando. Voy a volver a mi línea de tiempo aquí, una vez que tenga mi capa seleccionada, voy a hacer clic en “U” en mi teclado, y eso va a tirar hacia arriba como dije antes tanto de la posición como de los fotogramas clave de escala que tenemos estado trabajando en, y voy a ir a mi segundo fotograma clave aquí, y una cosa a notar que es realmente agradable una vez que tengas varios fotogramas clave en tu línea de tiempo, puedes hacer clic en “J” y “K”, y en “J” y “K” en tu teclado te permitirá saltar de fotograma clave a fotograma clave, en lugar de intentar arrastrar el pequeño cursor al fotograma clave que quieres animar, o que quieres ajustar. Entonces sé que no quiero que este círculo sea tan grande
como lo está ahora mismo dentro del centro de la composición. Entonces voy a hacer clic en el fotograma clave de escala que quiero cambiar, y voy a cambiar eso a alrededor del 50 por ciento. Ahora, se ve genial. Entonces ahora, tenemos esta animación con la que estamos trabajando. Entonces sé por mirar mis storyboards, que casi quiero que ese círculo, el personaje vaya un poco más alto que el punto central de esta composición. Ahora, una cosa que es realmente conveniente que After Effects permite es obtener una cuadrícula en tu composición, pero realmente te permitirá diseñar tu composición de manera agradable y uniforme para tener una manera agradable, y también para solo para entender dónde está el punto central, sobre todo cuando estás trabajando con algo que está diseñado como un tipo de logotipo, quieres poder trabajar dentro de un sistema para ti y realmente mantenerlo en un sistema de cuadrícula. Entonces si voy aquí abajo al ajuste donde puedo elegir las opciones de guía de nivelación, y si hago clic en eso puedo mostrar cuadrícula proporcional, y va a tirar hacia arriba una cuadrícula de línea verde que me permitirá ver dónde están los objetos que realmente estoy poniendo en la composición misma. Entonces en realidad quiero este círculo, lo hará, ya que se dispara desde abajo, quiero que se vaya,
vamos a que venga tal vez entre ahí en la parte superior de la pantalla, y luego yo como viene allá quería para pasar el rato ahí un poco tal vez durante medio segundo, o solo una fracción de segundo. Entonces quería bajar y ahí es realmente donde vamos a entrar en la siguiente fase de transición, a donde vamos a construir ese elemento de marca.
6. Crear el elemento de Marca: Entonces ahora, ya que hemos introducido el círculo de elementos orientadores, ahora
vamos a sumergirnos en el siguiente componente que es el elemento de marca. Para nuestro diseño de movimiento específico, decidimos hacer un gráfico, un gráfico de barras. Entonces lo que voy a hacer es, voy a saltar adelante dentro de mi línea de tiempo. Ahora que tengo este punto de partida de esta animación, voy a saltar un poco adelante y crear como creo
que sería el gráfico de barras dentro de la animación. Una cosa que vas a saber cuando estés pasando por tu animación, estás haciendo cada vez más capas. Cuando hagas una nueva capa, la hará como la duración de tus líneas de tiempo. Tenemos 20 segundos, así que va a hacer que cada capa que creemos alrededor de 20 segundos. Entonces una forma de cortar tus capas en lugar de ir hasta aquí y arrastrarlo todo el camino, puedes usar el cursor que tenemos aquí mismo. Puedes configurarlo en la línea de tiempo a donde quieras romperlo, y mantener la opción corchete derecho y lo cortará justo hasta ese punto. Por lo que esto se vuelve realmente útil cuando tienes múltiples capas en tu corte, y reorganizando, y secuenciando diferentes capas dentro de tu línea de tiempo. Ahora, voy a arrastrar hacia fuera el área de trabajo de looping y voy a empezar a construir nuestro gráfico de barras. Entonces lo que voy a hacer para esto es, voy a anular la selección de todo con solo hacer clic en cualquier parte del espacio gris, para que no se seleccione nada. Entonces si ves, si tengo el círculo uno seleccionado y hago clic en él, justo en cualquier lugar del espacio gris, anula la selección. Entonces ahora voy a subir a la parte superior del panel After Effects, y voy a volver a hacer clic en el fabricante de sombra, y voy a subir a la herramienta de rectángulo. Por lo que verás que te da aquí mismo, herramienta sería el atajo para la herramienta de rectángulo, y así esto es algo bueno tener en cuenta que estaremos usando abajo de la línea. Entonces sé que quiero la referenciación de mi guión gráfico, sé que quiero el fondo, sé que quiero que el gráfico de barras tenga un tipo de elemento estructural, y ahí es donde vamos a crear primero, y eso va para ser un pequeño rectángulo en la parte inferior del gráfico de barras. Entonces vamos a usar nuestra cuadrícula que hemos organizado aquí, y sólo vamos a hacer más o menos un rectángulo aquí abajo. Ya verás que en la línea de tiempo, es After Effects ha hecho una nueva capa para nosotros. Entonces, para hacer clic fuera de eso, puedes hacer clic en una V, entrar, teclado y solo hacer clic en el espacio gris, y puedes ver con qué estamos trabajando. Ahora, si quieres deshacerte de su grilla, podrás ver un poco más prolijamente, quiero decir que puedes bajar a aquí y anular la selección para que veas con qué estás trabajando. Pero para configurar esto, vamos a usar la grilla, solo para que podamos asegurarnos de que todo esté limpio. Entonces dentro de mi guión gráfico, tengo alrededor de cuatro barras diferentes, pero creo que seis probablemente se verían un poco mejor. Entonces lo que voy a hacer es, voy a ir y hacer clic en la herramienta de rectángulo una vez más , sin otras capas seleccionadas, voy a entrar en mi composición y simplemente voy a hacer un rectángulo. Entonces ahora ven aquí que tenemos un rectángulo en nuestra composición. Algo a destacar es que el punto del eje central está dentro del centro de la composición y queremos asegurarnos de que ese punto del eje central esté dentro del centro del rectángulo con el que estamos trabajando. Porque si ves, si yo hiciera un cambio de escala, crecería y, el cambio de escala estaría determinado por dónde está ese punto del eje central. Entonces quiero asegurarme de que, ese es el punto del eje central está en medio de ese rectángulo. Entonces voy a ir a mi panel de movimiento dos, voy a hacer clic en eso, haga clic en este punto del eje central justo aquí y se va a mover eso al centro justo ahí. Voy a hacer exactamente lo mismo para esta capa de estructura inferior también. Por ahora, asegurémonos de etiquetar estos. Yo sólo voy a hacer colores por ahora y así, voy a seleccionar a ambos con sólo mantener
pulsado el turno y seleccionar ambas capas, y voy a dar clic en el cuadro azul, y les etiquetaremos amarillo, por lo que sé que esto es el inicio de esta secuencia. Otra cosa a tener en cuenta es
que, como tengo estas ahora dos capas iniciadas en el inicio de mi gráfico de barras, verás que las capas van todo el camino hasta el inicio de la línea de tiempo. Algo que sé es que, sé que quiero que esto venga después del círculo y la animación del círculo. Entonces lo que voy a hacer es, lo que voy a dar clic es el corchete izquierdo de mi teclado, y eso va a traer esas dos capas directamente a mi cursor. Empieza con mi cursor para entonces puedo saber que esas capas van a aparecer justo entonces. A medida que lo tocamos, se puede ver que aparecen ahí mismo. Entonces aquí mismo, lo que pasó es, cuando creé estas formas, básicamente jalaron los colores con los que estaba usando en el pasado. Desde que estaba usando el círculo azulado, tiró de ese mismo color. Entonces estoy pensando que quiero que esto sea más, tal vez utilizó ese color marino dentro de la marca para este elemento de marca. Entonces voy a hacer básicamente lo mismo que hice por el círculo, y voy a pasar a capas que tengo aquí, alrededor de 10 segundos en mi línea de tiempo. Voy a subirme al relleno una vez tenga
la capa a la que quiero cambiar el color,
voy a hacer clic en la capa, y voy al relleno, haga clic en la casilla, haga clic en el cuentagotas, y vaya a repasar y encontrar ese color marino para que pueda hacer eso exactamente lo que quiero. Entonces estoy pensando que podría ser bueno tener esto también sea un derrame cerebral. Entonces solo voy a hacer clic en el trazo justo aquí, ve por aquí, va a tirar hacia arriba este panel de módulos. Asegúrate de hacer clic en el color del trazo para encenderlo, y haz clic en Aceptar. Entonces notarás que automáticamente va a y, entonces lo que vamos a querer hacer es lo mismo que hicimos para el relleno y vamos a querer hacer esto, esa marina. Entonces una cosa de After Effects es, lo grande de hacer y aprender de y averiguar las mejores formas de crear. Entonces estoy tratando de pensar, ¿cómo puedo hacer esto también donde se acaba de delinear? A lo mejor tiene un fracaso, así que realmente no se pueden ver las cosas detrás por si acaso por una animación a donde quiero que las cosas pasen detrás de la forma. Entonces voy a tener seleccionada la misma capa, y voy a subir al relleno, y todo lo que voy a hacer es solo hacer ese blanco para que coincida con el color de fondo. Por lo que ahora, tengo una forma delineada blanca, perfecta. Entonces para el fondo, hagamos de esto el sólido marino una
vez más utilizando diferentes colores y permitiendo que nuestro conductor realmente sea dueño de ese color azulado. Entonces ahora lo que voy a hacer ya que tengo seleccionado este rectángulo, la primera barra en nuestro gráfico de barras, lo que voy a hacer es solo, haga clic en Comando D cinco veces más para poder tener seis rectángulos. Todos estarán uno sobre el otro. Entonces una cosa que me gusta hacer es, cuando tengo múltiples formas para un senior para un componente, me gustaría poder saber que la capa inferior va a estar en el extremo izquierdo, y la capa superior va a estar en el extremo derecho, que uno sólo funciona para mí. Puedes hacerlo viceversa, pero es bueno saber que, si hicieras click a través de estas capas, podrás tenerlas organizadas y de la forma en que lo entenderías mejor. Entonces voy a seguir adelante y mantener esta capa inferior en el extremo izquierdo, y voy a mantener este botón tipo, y lo voy a poner arriba manteniendo pulsado Shift y la tecla de flecha a la derecha. Yo sólo voy a mover esto hasta que se alinee perfectamente por ahí. Voy a hacer esto por todos ellos hasta que todos básicamente se alineen a través de esta barra de estructura inferior. Ahora que tenemos todos los colores y tenemos la gráfica configurada a lo que creemos correcto, tenemos todas las seis barras del gráfico de barras dispuestas una al lado de la otra. Notaste que el tamaño no es perfecto para lo que es esa barra de estructura en la parte inferior. Pero eso no son preocupaciones, lo que vamos a hacer es que vamos a empezar a meternos en nulos los los cuales son realmente geniales y realmente pueden ser de mucha ayuda para ti en tu animación cuando estás trabajando con hacer cambios de posición, y rotaciones, y otros fotogramas clave en múltiples objetos diferentes. Entonces, lo que voy a hacer es hacer clic aquí en la capa superior, y voy a mantener pulsado el turno, y voy a seleccionar todas las barras que acabamos de crear. Voy a ir a “Capa” y voy a ir a “Nuevo”, luego voy a “Objeto Nulo” y luego va a crear un objeto nulo. Entonces lo que harías es seleccionar todas las capas que quieres emparejar a ese objeto nulo,
y ese objeto nulo te dará la capacidad de aplicar fotogramas clave o cambios de posición o rotaciones a ese objeto nulo que afectan a todas las capas que están conectadas a ella. Entonces, ahora lo que vamos a hacer es que vamos a estar usando Motion 2 para esto y así voy a dar un paso atrás aquí. Entonces, con Motion 2, en realidad es genial porque seleccionas todas las capas que quieres que se agrupen, y te vuelves nulo en Motion 2 y las conecta a todas ahí mismo y te da esta bonita capa nula que es de la misma longitud de todas las capas que tienes debajo de ella, y puedes mover las capas de una vez hacia la izquierda y hacia la derecha. Entonces, ahora verás que tenemos toda la gráfica de barras. Tenemos todas las barras en el centro de la composición. Pero tal vez queremos que este bar de aquí abajo sea un poco más delgado, o tal vez no tan ancho como lo es ahora mismo. Entonces, lo que vamos a hacer es que vamos a tomar esta barra, y vamos a hacer un cambio de escala en su barra sólo para escalarla solo para que sea un poco más corto de lo que es ahora mismo. Entonces, vamos a bajar al contenido. Voy a ir al rectángulo, vamos a ir al camino del rectángulo. Sólo vamos a dar clic en la trayectoria del rectángulo, y sólo vamos a seleccionar eso y sólo vamos a ir
más o menos un poco por ambos lados aquí para que sea un poco más composicionalmente sonoro con el ajuste que acabamos de hacer en las barras. Eso parece genial. Ahora, puedes alejarte y ver con qué estamos trabajando. Entonces, ahora tenemos todos nuestros bares dispuestos aquí, y se puede apagar la red y ver qué tenemos, y se ve genial. Entonces, ahora tenemos que pensar, bueno, obviamente no queremos que todos los gráficos de barras estén a la misma altura el uno del otro, y así vamos a tomarlos, y lo que vamos a hacer es ir a cada uno de los bares y estamos ir a cada uno de sus caminos, y ajustar su camino para poder hacer la posición, quiero decir, para poder hacer su escala. Lo único que estamos haciendo escala es que se puede hacer la escala tomando el cuadro limitador de la forma, y moviendo el cuadro limitador así como lo estoy haciendo yo. Pero verás que si lo escalas, verás que el también cambia el diámetro de un contorno cuando estás usando formas de contorno, las cuales comenzarán a parecer realmente desagradables cuando te metas en él. Entonces, lo que quieres hacer es entrar entrar entrando al contenido,
entrar al rectángulo, bajar por el camino y tener la ruta seleccionada, y luego te dará estos puntos de esquina en los que puedes hacer clic y seleccionar para poder ajustar la ruta y diseña este gráfico de barras a cómo queremos diseñarlo. Otra forma de entrar en eso es tener seleccionada tu capa, hacer doble clic en el cuadro de límite, obtendrás este cuadro de límite diferente, y haz clic una vez más y podrás meterte en eso también. Entonces, esta es una forma mucho más fácil de hacerlo en lugar de girar hacia abajo todos estos rectángulo de contenido en el camino. Entonces, solo voy a pasar por aquí y diseñar estos manteniendo el turno y moviéndolos hacia abajo, y solo diseñar más de una pendiente de lo que creo que estaré usando cuando haga mi transición. Entonces, una cosa a notar mientras voy por ahí diseñando cada una de estas barras y
dándoles sus propias características y elevación, y tamaño. En lugar de ir a trabajar aquí y luego volver aquí y hacer clic en la capa que desea ajustar, puede hacer comando y arriba y abajo en sus teclas de flecha, y seleccionar las barras que desea ajustar. Entonces, si comienzas por la parte inferior de la forma en que lo organizamos, estará en el extremo izquierdo, y luego si usas comando y tus teclas de flecha arriba y abajo, puedes subir en consecuencia para
poder llegar a tu extrema derecha uno que va a ser la capa superior. Así es como lo organizamos, pero es una manera fácil de mantener las cosas organizadas y encarriladas. Tenemos una bonita elevación, un poco de variación dentro de este gráfico de barras consiguiendo un poco más de un diseño interesante. Creo que sería bueno poder tener una de estas barras tenga un tipo diferente de característica o estilo a ellas. Entonces, lo que vamos a hacer es que vamos a elegir esta barra de extrema derecha, y sólo vamos a hacer un efecto fácil. Si entramos en nuestro panel de efectos que está aquí mismo, Efectos & Preajustes. Si no tienes Effects & Presets, lo que puedes hacer es subir a “Ventana”, pull-down “Ventana”, y puedes
sacar Effects & Presets y puedes hacer clic en eso y lo tirará hacia arriba. Entonces, vamos a ir a Effects & Presets y vamos a buscar transición de persianas venecianas. Una vez que haya seleccionado la capa a la que desea aplicar el efecto, puede arrastrar y soltar el efecto sobre la capa
a la que desea que vaya o simplemente puede tener seleccionada la capa a la que desea aplicar el efecto, y haga doble clic en los efectos y todo lo tire hacia arriba en su panel de efectos. Está bien. Entonces, ahora que tenemos el efecto, se levantará en nuevo panel de control Effects, y tenemos las persianas venecianas. Entonces, lo que se puede ver cuando completamos la transición. Está en cero por ciento. Entonces, si lo subimos ahora mismo, verás que ya que sólo tenemos esto en un contorno con relleno blanco que todos podremos ver si hago turno comando H para deshacerme de esas casillas limitadoras para que pueda ver el efecto sucediendo, sólo
está afectando el contorno ahora mismo porque ese es el único color. Entonces, lo que quiero hacer es que en realidad quiero hacer de esto una marina, digamos. Entonces, voy a seguir adelante y voy a seleccionar igual que lo hicimos antes. Voy a hacer que eso llene marina. Entonces, ahora puedo ver que el efecto está sucediendo en todo lo que hay dentro de la caja. Pero tal vez en lugar de que esto sea vertical, quizá lo
rotemos un poco solo para que sea un poco más interesante, y tenerlo en un ángulo ahí lo cual se ve un poco más interesante, y luego tal vez trabajando con el cuadro de esquema aquí ya que se superpone ya que tiene ese contorno, tal vez trabajar con él no tener contorno se vería un poco mejor, y ahí está encajando muy bien, muy bonito. Tan solo asegúrate de que esta línea siga alineándose en la parte inferior, y simplemente moviendo eso un poco hacia abajo. Recuerda, comando de turno si has desactivado eso. Ese comando de turno H volverá a encender eso. Entonces, se puede ver qué objeto está seleccionado. Entonces, ahora si nos alejamos, veremos que tenemos otro elemento adicional a nuestro gráfico de barras lo que lo hace un poco más interesante. El elemento general de la marca que acabamos crear es un poco más grande que la composición. Entonces, quería hacer un cambio a gran escala en todo, y aquí es donde las formas nulas realmente serán útiles. Entonces, ahora mismo tengo una forma nula que está conectada a todos los gráficos de barras, pero también quiero ajustar el tamaño de esta barra de estructura en la parte inferior de los gráficos de barras. Entonces, lo que voy a hacer es que voy a hacer clic en esa barra de estructura de aquí abajo, y voy a agarrar esta cosita giratoria justo aquí se llama látigo de púas. Esto es lo que se utiliza para padres de capas a otras capas o capas a nulos. Entonces, null es realmente solo una capa universal en la que puedes aplicar fotogramas clave, y usando ese marco clave, ajustará el tamaño y la proporción de cualquiera de las capas a las que está conectado. Entonces, voy a recoger látigo esto hasta el nulo. Entonces, ahora tengo todos estos componentes controlados por el nulo, y voy a simplemente hacer clic en “S” en mi teclado, y voy a simplemente bajar esto por tal vez vamos a bajarlo al 85, y eso parece bien, y voy a tirar de mi cuadrícula solo para asegurarme de que esté dentro de la cuadrícula, y solo voy a moverla hacia abajo solo usando mis teclas de flecha mientras tengo seleccionado el aire nulo, solo
voy a moverla hacia abajo un poquito así que se sienta proporcionalmente parejo. Entonces, lo que sé de esta animación es que tenemos mucho espacio en blanco y en realidad estamos utilizando eso para
nuestra ventaja porque estamos anticipando a través nuestros tableros de cuentos que ese personaje guía, el círculo que creamos, realmente
va a estar funcionando y moviéndose a lo largo de una gran parte de este espacio en blanco. Entonces, solo pensar en ese diseño y cómo realmente lo estás escalando dentro la composición es algo que realmente debes tener en cuenta cuando estás diseñando tu elemento de marca.
7. Crear la Transición I: Entonces ahora que hemos diseñado el elemento principal de la marca que vamos a estar utilizando en el diseño de movimiento, vamos a volver a ese personaje guía, el conductor, y vamos a descifrar ese elemento de transición. Ahora una cosa a tener en cuenta es que esto no es perfecto. Se trata mucho de refinar y crear progreso para ti mismo, así que ahora tienes el impulso para seguir avanzando. Por lo que se trata de no quedar demasiado colgado en el diseño de un elemento en particular o de una escena en particular, pero realmente sólo poder avanzar. Para nosotros, eso ahora va un poco hacia atrás para trabajar en esa transición del conductor a este elemento ahora marca. Si volvemos a la animación que tenemos, tenemos este círculo que viene y luego va directo a las barras. Entonces lo que voy a hacer es mover mi área de trabajo alrededor de dos segundos y medio,
tres segundos, con sólo hacer clic en el teclado. Lo que quiero hacer es que realmente quiero que este círculo dispare y quiero volver a disparar hacia abajo. A medida que se dispara hacia abajo, quiero construir esta barra de estructura en la parte inferior del gráfico de barras. Entonces básicamente para hacer eso, voy a bajar aquí a donde está nuestra capa para nuestra, y solo estoy colapsando estas capas solo seleccionándolas presionando U. Así que voy a bajar al área del círculo aquí y me voy a ir para hacer otro fotograma clave de posición a donde llega hacia donde la posición
luego disparará de nuevo hacia abajo a la parte inferior a alrededor justo aquí. Entonces, para hacer eso, todo lo que voy a hacer es seleccionar la capa, seleccionar ésta y simplemente hacer que vuelva a disparar hacia abajo. Ya verás como empiezo a mover esto hacia abajo, es algo que a After Effects le gusta hacer al tener estos pequeños puntos de anclaje extendidos. Eso es algo que va a ser un poco problemático y les voy a mostrar cómo arreglarlo con bastante facilidad
a medida que ustedes pasan. Esto es algo que sucede cuando haces cambios de posición después de tener Easy Easy Easy en una capa. Le gusta casi hacer una curva. Entonces si fuera a arrastrar esto, ya verás que casi tiene una curva hacia ella. Pero ahora verás que tenemos una animación sencilla de la misma que viene y luego retrocediendo. Entonces eso es realmente lo que queremos conseguir y
casi queremos quedarnos ahí arriba sólo por una fracción de segundo, y pasar el rato y luego volver a derribar. Pero quiero el cambio de escala a donde se hace grande mientras está en la parte superior. Entonces como vuelve a nosotros,
va a construir este gráfico de barras,
esa barra de estructura en la parte inferior. Yo quiero que se vuelva un poco pequeño. Entonces lo que voy a hacer es que voy a hacer otro cambio de escala para ir
alrededor del 30 por ciento para hacer ese círculo alrededor de ese tamaño. Entonces ahora para deshacerme así no tengo nada seleccionado, todo lo que hice fue solo hacer click en el área gris. Entonces ahora si lo observamos, tendrá algo a donde se dispara y se dispara hacia abajo y luego se hace más pequeño aquí al final. Ya verás que no es nada hermoso, nada pulido pero está consiguiendo la idea de mostrar el movimiento que estamos tratando de llegar
a donde podemos iniciar la transición al gráfico de barras. Entonces lo único que creo que sería realmente agradable tener es
tener el círculo a medida que se dispara hacia abajo, y luego se vuelve a subir, e inicia el movimiento del gráfico de barras que vamos a estar usando. Pero así como golpea esa capa inferior, lo que voy a tener que hacer es seleccionar todas mis capas de mi gráfico de barras, y las voy a mover por encima con solo hacer clic en el corchete izquierdo para moverlas al cabezal de reproducción justo aquí. Entonces ahora como ves como el círculo baja, golpeará justo a medida que esa cabeza de reproducción se abra, y verás que inicia todos los gráficos de barras. Verás que el tamaño del círculo es casi un poco demasiado grande para este gráfico de barras. Entonces puedo hacer que el gráfico de barras sea un poco más grande lo cual creo que voy a hacer, digamos 85 o bombear hasta 90 en este momento, solo un poco más grande. Voy a hacer que ese círculo sea un poco más pequeño cuando esté en la parte superior aquí, y esto sólo está funcionando dentro de la composición. Entonces iremos de 50 a 40. Entonces solo tengo un poco de círculo más pequeño a medida que baja. Entonces no te preocupes por que interfiera con nada aquí, vamos a estar puliendo todo esto más adelante. Pero ahora una cosa a tener en cuenta es que quiero poder ver este círculo como estoy animando. Ya que hicimos esas formas rellenas que podríamos cambiar más adelante, querré mover la capa de círculo hasta la parte superior. Entonces lo que voy a hacer es que voy a sostener “Shift+Comando” en corchete
derecho y eso moverá la capa hasta arriba. Ahora digamos que quería mover esto solo uno por uno, podría sostener comando y hacer un corchete izquierdo, y corchete izquierdo lo moverá solo uno por uno. Entonces estoy haciendo comando y corchete izquierdo y derecho para mover esto arriba y abajo. Entonces ahora como baja el círculo, voy a ajustar un poco
el editor de gráficos para poder sacar un poco más del movimiento que quiero. Ahora mismo no es derribar tan rápido cuando está arriba en la cima aquí. No es derribar tan rápido como me gustaría que realmente comenzara a iniciar esta barra de estructura inferior de esa gráfica. Entonces lo que voy a hacer es seleccionar sólo los fotogramas clave de posición, y voy a entrar al editor de gráficos aquí y va a tirar hacia arriba los fotogramas clave. Entonces verás que tenemos tres fotogramas clave igual que lo hicimos en nuestra línea de tiempo. Porque diseñamos los dos primeros fotogramas clave de esta manera, cuando hagas un nuevo fotograma clave, diseñará el siguiente editor de gráficos, la siguiente trayectoria la misma que la anterior. Entonces eso es sólo algo a tener en cuenta que tendrás que entrar y ajustarlos para cada uno. Entonces ahora mismo notarás que lo tenemos pinchando aquí y yendo muy rápido al principio, desacelerando y luego vuelve a repuntar aquí y se ralentiza. Entonces en realidad lo que quería hacer es pico, despacio, ser lento por todo aquí y luego pico al final. Entonces lo que voy a hacer es que voy a agarrar estos. Yo sólo voy a mover esto así. Estos puntos de anclaje sobre justo así. Ahora si lo ves, eso será mucho más lento en la parte superior y luego derribar de nuevo al final. Entonces veamos eso de nuevo, y luego vuelve a disparar ahí mismo. Algo que puedes hacer para que el proceso sea un poco más rápido para renderizar, puedes ir aquí y puedes cambiar la calidad de lo que va a ser el renderizado, y lo cambiaremos a aproximadamente la mitad. Entonces esta será una vista previa será alrededor de la mitad, y luego puedes subir a este panel aquí y vas a la sección de vista previa, desplázate hacia abajo y asegúrate de que esto también sea alrededor de la mitad o tercio de la resolución que se va a estar reproduciendo at. Entonces ahora ya sabes que tenemos un poco de anticipación dentro de ese círculo dándole esa emoción, esa característica que íbamos a buscar. Algo a notar sin embargo es que como se está sosteniendo un poco más allá arriba, la animación se va a convertir de forma innata un poco más larga. Algo bueno que he aprendido es que la animación realmente vende bien cuando puedes conseguir todo compacto en dos a cuatro o cinco segundos. Cualquier cosa más de cinco segundos creo que se convierte en algo que simplemente no es utilizado por la empresa, sobre todo a largo plazo una vez que la gente empieza a reconocer la nueva marca. Eso es algo que mucho diseño de movimiento y bumpers que vamos a estar creando e incluso éste, ayudan a vender la marca no sólo al cliente sino luego también a los usuarios de los clientes, ya sea que se esté utilizando en una animación de looping en un sitio web o un video. Entonces mantenerlo dentro de ese rango de cinco segundos es realmente el punto dulce. Así que nota que a medida que estás creando esta anticipación con tu editor de gráficos que
no quieres que nada sea realmente demasiado alargado más de lo que realmente necesita ser. Entonces ahora para salir del editor de gráficos, solo
vamos a volver a hacer clic en el botón y ahora ya verás con qué estamos trabajando. Entonces lo primero que voy a hacer, no me voy a preocupar por ninguno de
los gráficos de barras en este momento. Yo sólo voy a preocuparme por esta barra inferior porque ese va a ser el primer elemento que
vemos como este gráfico de barras todo crece desde abajo. Entonces lo que vamos a hacer es que vamos a seleccionar esa barra inferior aquí mismo, y voy a darle a esto ahora un nuevo color sólo para visual para mí, y voy a hacer este naranja sólo para que sepa que esa es la parte inferior de los gráficos de barras. Eso es algo que una vez más puedes pasar y etiquetar todos estos. Simplemente elijo no hacerlo porque soy más una persona visual. Entonces lo que voy a hacer ahora es que voy a tratar de averiguar cómo entrar esto. Entonces como creo que el círculo viene
de arriba a abajo y tipo de
derribo, tendría sentido tener esta barra de estructura, el gráfico de barras viene tal vez de aquí a mitad de la pantalla. Baje un poco más allá y vuelva a subir a la sección que es en este momento. Entonces otro atajo que realmente ayuda cuando estás trabajando con múltiples capas es I. Así que te llevo al frente de la capa seleccionada en la que estás trabajando sin importar lo que sea. Entonces si hago clic en la forma del círculo rojo y hago clic en I, me llevará al frente de esa capa. Ahora sé que quiero empezar a animar la capa inferior de esa capa estructural, así que hago clic en la capa naranja justo aquí la cual sé que es la capa inferior, y hago clic en I y me traerá justo ahí. Entonces sé que quiero el cambio de posición. El cambio de posición va a ser el más fácil de controlar, así que lo voy a hacer primero. Entonces igual que antes, voy a sostener Shift+Opción+P, y eso me va a dar uno uno de los fotogramas clave de inicio y así frase. Ahora hice el cambio de posición y sé que quiero que esto termine aquí, voy a arrastrar esto sobre un par de fotogramas. Entonces sé que tengo un poco de espacio de trabajo aquí mismo para hacer el movimiento de posición en esta estructura inferior. Ahora una cosa a saber cuando estás trabajando con fotogramas clave es que en cualquier momento que hayas iniciado el cronómetro, en cualquier momento que muevas esta capa o cualquiera de las capas que tienen un cronómetro iniciado, hará un fotograma clave para sí mismo. Entonces si miras aquí mismo mientras mantengo pulsado “Shift” y la “Flecha Key” para hacer un cambio de posición sobre esto, After Effects hará un nuevo fotograma clave sobre eso. Porque ahora si hacemos zoom, se puede ver que el movimiento vuelve a suceder. Entonces ahora sé que quiero que esto empiece aquí y a medida que el círculo baje, quiero que la barra esté abajo por debajo del círculo. Después abajo de su punto de partida, y luego va a volver al punto de partida, el primer fotograma clave que hicimos. Entonces ahora, si vemos esto, verás que el bar se desplomará y hará una animación rápida. Está bien. Entonces ahora, estamos consiguiendo un poco de equilibrio. Estamos consiguiendo un poco más de personalidad a la animación general y mostrando cómo el objeto conductor está iniciando el movimiento dentro de estas formas. Eso es realmente lo que vamos a buscar a lo largo de toda esta animación. Tan bueno es si estás teniendo problemas para ver es porque hemos tenido estas barras delante de ellas, lo que podrías hacer es simplemente seleccionar todas las barras y simplemente moverlas un poco. Ahora, todo lo que estamos viendo será la barra y el movimiento que está haciendo la barra. Entonces aquí es donde realmente ajustar esa área de trabajo para conseguir un lazo es importante. Por lo que pinchando N y tal vez B justo ahí, para que puedas ajustar esa área de trabajo. Entonces, puedes trabajar y repetir esto un montón de veces para ver el movimiento que quieres poder conseguir. Entonces ahora, lo que voy a hacer es que quiero poder diseñar un poco el movimiento alrededor de la velocidad a la que quiero que esta barra se mueva. Entonces lo que voy a hacer es que voy a aplicar Easy Facilidad a todo esto. Entonces lo que he aprendido es que, cuando se trabaja con diseño de movimiento, especialmente formas simples, estás usando mucho la Easy Easy en lugar de hacer clic derecho e ir a un Keyframe Assist e ir a Easy o usar cualquiera de tus teclas F en la parte superior de tu teclado, si te gusta escuchar música o algo por el estilo. Algo fácil es entrar en tus Preferencias del Sistema y hacer tu propio atajo. Lo que he aprendido es que Control One es una gran manera y una gran dos teclas para utilizar para poder hacer ese atajo para aplicar Fácil Facilidad a cualquier fotograma clave seleccionado que tengas. Entonces ahora, si veo el movimiento que estamos recibiendo, tiene un bonito rebote Easy Easy Easy. Pero sé que quiero que eso rebote muy rápido. Entonces ahora, lo que voy a hacer es entrar, una vez más,
al Editor de Graph y voy a ajustar estos fotogramas clave Easy Easy Easy y hacer
que toda la acción esté sucediendo justo al principio, similar a la círculo, a donde el círculo o nuestro objeto personaje, nuestro objeto conductor está bajando. A medida que el objeto círculo baja
, también derribará la barra. Entonces lo que vamos a hacer es que sólo vamos a agarrar estos y sólo vamos a moverlos a la derecha aquí. Entonces toda la acción va a pasar ahí mismo, y luego vamos a hacer un poco fácil, así que se ralentiza aquí mismo. Entonces queremos que algo de la acción suceda aquí mismo, pero queremos que se facilite a la posición final. Entonces vamos a dejar que una facilidad entre a la posición final así en lugar de señalarla todo el camino hacia la derecha hacia donde simplemente sería una parada dura. Entonces ahora, si lo
observamos, vemos que lo tenemos
derribando y relajándonos en esa posición final donde está ahora mismo, lo cual se ve genial. Pero casi quiero que empiece tal vez un poco no tan ancho como es y tal vez aún más pequeño. Entonces lo que voy a hacer es que voy a entrar en los caminos del objeto. Entonces solo voy a dar vueltas esto hacia abajo, entrar en Contenidos,
entrar en Rectángulo, hacer clic en el Camino, y luego conseguiré este objeto. Lo que voy a hacer es volverlo una vez más, y voy a hacer clic en el cronómetro de esto, así que voy a hacer un fotograma clave sobre los caminos. Entonces sé que quiero que la forma final sea de ese tamaño, así que la voy a mover por aquí para que se alinea con la forma final de la posición que acabamos de crear, y voy a hacer clic en U en mi teclado para condensar todo. Entonces ahora, solo puedo ver en dónde estoy trabajando, en qué estoy trabajando. Entonces ahora, lo que voy a hacer es tirar hacia arriba mi cuadrícula de proporciones y alinear estos dos lados a la sección media aquí mismo. Por lo que voy a dar clic en mi camino y luego voy a dar clic en este. verás una vez que tenga mi ruta seleccionada, así que si hago clic aquí, la ruta, o si hago clic en el fotograma clave que está en la ruta, se mostrará el cuadro limitador de la trayectoria y también aparecerá, si vas a ver en el cursor, un pequeño rectángulo al lado. Eso realmente me permite simplemente arrastrar, así que estoy dando clic y arrastrando para poder seleccionarlos, también. Por lo que ahora, incluso puedo mantener presionado Shift y hacer las teclas de flecha, y puedo moverlas sobre, y verás incluso en la línea de tiempo aquí, After effects hizo otro fotograma clave mientras me moví eso. Entonces lo vamos a mover más o menos hasta el centro ahí. Sólo voy a hacer clic en ese fotograma clave y me
va a permitir volver a tener ese cuadro delimitador. Voy a hacer clic y arrastrar para seleccionar esos dos de la derecha, y voy a usar Shift y la
tecla izquierda para simplemente mover esto hacia donde creo que es bueno. Entonces ahora, si vigilamos esto, verás que a medida que baja, se dispara y crece por sí mismo. Entonces una forma de pensar en esto, y qué te hará un poco más fácil a ustedes chicos cómo pasa el movimiento y realmente mantener ese tempo es, el objeto guía, el círculo aquí mismo es lo que está iniciando esta barra inferior. Según ves como golpea, incluso
puedes ver los fotogramas clave, se están alineando al mismo tiempo. A medida que termina este fotograma clave, los fotogramas clave de esa barra de estructura en la parte inferior están empezando. Por lo que realmente te da un punto de partida para los nuevos objetos que estás creando para realmente crear ese impulso y luego ese progreso a lo largo de todo el diseño de movimiento. Entonces ahora, el camino como, ya verás, también tienen movimiento lineal. En realidad quiero que esos sean rápidos justo cuando el círculo golpee igual que antes. Entonces voy a seleccionar estos dos y voy a hacer una Facilidad Fácil en estos dos fotogramas clave aquí mismo. Voy a volver a entrar en mi Editor de Gráficos, y voy a seleccionar este correcto y simplemente moverlos para que
todo pase en un principio aquí. Por lo que se expandirá, ese rectángulo se expandirá más rápido de lo que era antes. Entonces ahora, si regresamos y hacemos nuestro área de trabajo un poco más grande, podemos ver qué hemos creado y con qué estamos trabajando. Entonces ahora, lo que podemos hacer es que podemos traer vuelta el otro elemento que vamos a animar. Recuerda, esto no es perfecto pero nos está dando un punto de partida a donde podemos empezar a animar toda nuestra segunda sección, que es el elemento de marca, y podemos iniciar la animación o proceso alrededor de esto. Entonces veamos qué tenemos. Entonces tenemos este círculo, el conductor bajando, el objeto guía bajando iniciando esa estructura. Lo que quiero hacer es realmente quiero hacer estos rectángulos, quiero que sean verídicos. Entonces ahora mismo, lo que hicimos cuando hicimos los rectángulos es que les
dimos a todos un fondo de relleno. Entonces lo que puedes hacer es que en realidad puedes seleccionar todos los que quieras sacar el relleno, subir a Rellenar y hacer clic en Ninguno, y quitará el Relleno. Por lo que visualmente, no hizo mucho. Pero ahora, si yo fuera a mover este círculo manteniendo comando en el corchete izquierdo para mover esa capa abajo, verás que el círculo empieza a ir por debajo de las formas, lo que en mi mente, lo hace un poco más dinámico y un poco más interesante para mostrar el círculo yendo detrás de las formas en lugar de delante de las formas y mostrando que son transparentes. Entonces ahora, lo que queremos hacer es
asegurarnos de que queremos empezar a medida que este círculo baja, también
queremos iniciar el crecimiento del gráfico de barras. Queremos que todos los gráficos de barras crezcan desde abajo, y entonces lo que vamos a hacer es ir
a cada una de las capas del gráfico de barras. Vamos a hacer un fotograma clave de ruta y sólo vamos a tener un fotograma clave de ruta de inicio de que esté en la parte inferior, luego terminar el fotograma clave de ruta similar a donde lo hemos diseñado desde el principio. Entonces ahora, lo que vamos a hacer es que vamos a entrar en cada una de estas capas. Una forma rápida de llegar a los caminos, si no quieres hacer clic en cada capa, y girarla hacia abajo, y luego girarla hacia abajo, y luego girarla hacia abajo para meterte en caminos, lo que puedes hacer es seleccionar todas las capas que quieres ajustar los caminos, y puedes ir a la Barra de Búsqueda aquí mismo. Se puede hacer clic en él y se puede escribir en camino. Entonces, lo que va a hacer es que te permitirá simplemente
pasar y hacer clic fácilmente en el cronómetro y hacer ese primer fotograma clave que quieres tener en ese gráfico de barras. Entonces ahora, lo que vamos a hacer es seleccionar todas
esas capas en las que acabamos de hacer un fotograma clave. Vamos a hacer clic en U para colapsarlos al solo fotograma clave en el que estamos trabajando, que es ese camino. Simplemente vamos a seleccionar esos y vamos a arrastrarlos sobre sólo un par de fotogramas, porque sabemos que queremos terminar en eso. Entonces visualmente en este momento, tal vez pienses, vale, bueno el contorno es un poco demasiado grueso para el diseño que vamos a buscar. Entonces es tan sencillo como seleccionar los que quieres ajustar el contorno y subir hasta el trazo aquí,
y ajustarlo a, digamos,
en lugar de 10, hagámoslo alrededor de las ocho. Entonces visualmente, esto es un poco mejor para la marca y para el movimiento en el que vamos a estar trabajando. Entonces digamos que ahora, todo lo que vamos a hacer es que básicamente vamos a tomar el camino de cada una de estas capas y vamos a hacer clic en la capa. Voy a hacer clic en I, y vamos a entrar en el camino, y vamos a seleccionar sólo esas dos primeras capas, y sólo vamos a bajarla hasta el fondo y literalmente colapsar esa forma que acabamos de crear. Voy a hacer esto por cada una de esas capas. Entonces simplemente colapsé todas las capas justo ahí, así que las colapsé para entonces cuando el objeto guía vuelva a bajar, todo se disparará desde este punto. Entonces si tuviéramos que jugar esto ahora mismo, aunque son lineales, verás que todo dispara desde ese punto de partida y puedo acercarme aquí. Una forma fácil de alejar es solo si estás usando un trackpad solo para
desplazarte, también puedes mantener pulsada Opción y desplazarte hacia fuera, o puedes bajar aquí donde dice 50 por ciento o muestra un porcentaje, y puedes subir para encajar, y eso se ajustará a la composición al tamaño del panel que tengas abierto. Entonces ahora mismo, lo vamos a ver. Se puede ver que nuestro objeto guía está
bajando y disparando todas esas gráficas de barras hacia arriba, e iniciando toda la secuencia de movimiento a través de la transición. Entonces ahora que tenemos todo disparando, lo que queremos hacer es que queremos darnos cuenta de que el balón está bajando. Pero lo que debería estar iniciando es que tal vez esta gráfica debería diseñarse un poco diferente para esta primera etapa cuando salga a donde todo el peso de la gráfica está centrado similar cómo llegó el objeto guía directamente por la pantalla, esperando ese gráfico dentro del impulso de este objeto guía, y permitiendo que eso defina realmente los movimientos. Entonces lo que vamos a hacer, simplemente, sólo
vamos a rediseñar cómo tenemos esta gráfica dispuestas. Entonces sólo vamos a mover un poco
todo hacia abajo para que el gráfico se pinche justo en el medio. Ahora, cuando lo reproducimos, se puede ver que el objeto guía realmente
está permitiendo que el impulso suceda justo en medio de la gráfica. Justo antes, vamos a aplicar Easy Facilidad a todas las gráficas para que todas las barras gráficas se disparen al igual que todo lo demás tiene como esa bola vuelve a bajar. Vamos a seleccionar todos, vamos a asegurarnos de que tengamos todos los fotogramas clave seleccionados para nuestro gráfico de barras, y vamos a entrar en el Editor de Gráficos. Vamos a seleccionarlos todos haciendo clic y arrastrando, y moviendo esto a la derecha, y moviendo éste a la derecha también para que realmente esa velocidad suceda justo a medida que el balón golpea, y así todos disparan. Entonces ahora, ya ves que estamos tratando de conseguir algo de impulso y realmente empezando a ver cómo esa bola o ese objeto guía realmente está controlando el movimiento de toda esta animación. Ahora, ya que tenemos la transición básica del objeto guía al elemento de marca, lo siguiente es afinar aún más, y pulir, luego ir a la siguiente transición, que nos va a llevar a nuestro elemento final, que va a ser el cierre final del logo.
8. Refinar la transición I: Entonces ahora una vez que hayas agregado el movimiento al elemento de marca usando tu conductor, lo que vas a querer hacer es una especie de revisitar lo que acabas de crear y ver si hay algo que puedas cambiar para crear ese impulso para a ti mismo, a tipo de avanzar, y a ver si puedes pulir algo. Entonces en este momento, lo que estoy viendo es que este elemento de marca inicial. Es un poco lento sobre todo si estamos tratando de
mantener todo este parachoques dentro de cuatro a cinco segundos. Entonces lo que voy a hacer es que básicamente voy a entrar en esto y voy a hacer clic U para tirar hacia arriba los fotogramas clave que tenemos y sólo voy a seleccionar esos, y sólo voy a moverlos por un par de fotogramas y especie de ver la moción que estamos recibiendo. Sé que quiero que ese tipo de inicio pop arriba desde abajo aquí sea realmente rápido y que lo tenga como que se asiente después de que como que aparece. Entonces tenemos un buen movimiento rápido ahí mismo. Entonces ahora como que he ajustado la velocidad a este círculo inicial para tratar de mantenerlo dentro de ese rango de cinco segundos. Lo que voy a hacer, que es realmente simple ya que
alineamos todo hasta estos fotogramas clave finales, es que voy a hacer clic en K en mi teclado que llevará el cabezal de reproducción a ese fotograma clave que queremos trabajar. Si hago clic en J, se lo llevará a las anteriores. Voy a seleccionar todas las capas que quiero emparejar con eso. Voy a tenerlos todos seleccionados y voy a usar el corchete izquierdo para mover todas esas capas al frente del cabezal de reproducción. Está bien. Igual que eso. Entonces ahora tenemos esto. Si lo tocamos, podemos ver que el movimiento sucede un poco más rápido pero todo sigue alineado y ese conductor sigue iniciando ese movimiento. Entonces ahora, lo siguiente que estoy notando es que quiero agregar un poco de peso visual a
esta línea de estructura de fondo o barra de estructura que tenemos aquí abajo, casi como si cuando viene aquí abajo, casi se vuelve un poco más ancha y como que crece un poco. Entonces lo que voy a hacer es que voy a expandir esta capa haciendo clic en U para ver
tipo de fotogramas clave con los que estoy trabajando y voy a acercar manteniendo
pulsada Opción y tipo de zoom en mi trackpad o mouse, y voy a sostener la Barra Espacial para especie de conseguir la mano en movimiento para poder moverla alrededor y especie de organizarse aquí. Entonces lo que voy a hacer es que voy a ajustar el camino en esto para que pueda hacer esta forma un poco más ancha ya que se reduce a esta posición aquí abajo. Entonces voy a hacer clic en el camino, y luego voy a seleccionar estos dos fotogramas clave aquí abajo haciendo clic y arrastrando, y sólo voy a moverlo manteniendo presionado Shift y la tecla Flecha abajo una vez para añadir un poco de peso visual. A lo mejor eso es un poco demasiado. Entonces solo lo ajustaré y eso parece bien. Entonces ahora cuando miramos la animación, se
puede ver que como que tiene este peso visual para ella ya que tipo de crece y luego tipo de aparece de nuevo cuando entra en su lugar de descanso. Se ve bien en este momento, pero podemos hacerlo un poco más agradable entrando en el editor de gráficos. Entonces lo que voy a hacer es que voy a seleccionar el camino y voy a entrar al editor de gráficos aquí. Ya verás que con el camino, se ve un poco interesante y eso se debe a que creamos un nuevo fotograma clave dentro de los dos fotogramas clave ya existentes que creamos previamente. Por lo que entonces implica en él lucir un poco interesante así. Pero todo lo que necesitas hacer es simplemente hacer clic y arrastrar para seleccionarlos y luego simplemente arrastrarlos hacia abajo a la línea, acercar manteniendo la opción y acercar el teclado o track-pad. Entonces ahora lo que vemos es que el movimiento de ese camino está sucediendo en Easy Easy y se está alzando justo aquí. Entonces lo que quiero, quiero que esto sea un poco lento para que este ancho suceda cuando el cambio de posición ocurra al mismo tiempo y se mantenga también. Entonces solo voy a arrastrar un poco estos
para darme un poco de hoyo ahí en la parte inferior, y luego jugar y ver qué tenemos. Entonces eso se ve bastante bonito. Entonces ahora una cosa a tener en cuenta sobre el editor de gráficos. Cuando un punto clave está en la parte inferior, eso significa que está completamente detenido. Entonces lo que quiero hacer es no quiero que se detenga por completo. Yo quiero subirlo solo un poquito. Quizás incluso un poco más para asegurarse de que no se detenga todo el camino, permite
que se produzca más de un movimiento fluido dentro de ese cambio de trayectoria del ancho. Entonces ahora estamos agregando ese peso visual que está haciendo que la animación general sea un poco más interesante. Entonces esos son algunos buenos pasos de pulido que acabamos de hacer ahí, y ahora vamos a hacer el siguiente movimiento sobre el círculo. El siguiente movimiento en el círculo es establecerlo de manera composicional, si fuéramos a hacer zoom aquí, es establecer composicionalmente el círculo tal vez arriba en esta área, tal vez justo encima de este cuadrado, o justo encima de este rectángulo que nosotros tienen similares a nuestros storyboards que habíamos elaborado antes. Entonces lo que vamos a hacer es que vamos a seleccionar nuestro círculo y vamos a mover el círculo. A medida que tipo de hits, queremos que tipo de mover el círculo tal vez justo después de que todo se expanda. Queremos mover este círculo sólo hacia arriba seleccionando la capa y moviéndola hasta esta área. Entonces verás que ahora mismo tenemos la moción. Está siendo indicado por estas dos líneas a donde va a venir directamente hacia abajo y luego ir recto hacia arriba. Jugaremos eso solo para que puedas ver con qué estamos trabajando. Cambiaré mi área de trabajo haciendo clic aquí B, y haciendo clic aquí N al principio y al final. Entonces ahora podemos especie de ver con qué estamos trabajando. Entonces ahora todo eso se ve genial. Podemos hacer que eso se vea aún mejor agregando algo Easy Easy y trabajando
también con la trayectoria de movimiento general en la posición. Entonces tenemos nuestra animación básica y un movimiento para nosotros para nuestro objeto guía. Pero ahora lo que queremos hacer es que me gusta acercar aquí. Ya verás, como te hablé antes, a After Effects le gusta crear estos puntos de anclaje cuando estás trabajando con fotogramas clave Easy Easy. Entonces lo que quieres hacer es hacer clic en G en tu teclado, y G en tu teclado realmente tirará hacia arriba de la Herramienta Pluma. Quieres solo hacer click en esos fotogramas clave para deshacerte de esos. Entonces ya verás que aquí tengo esta pendiente, y eso es porque After Effects está haciendo estos puntos de anclaje. Yo solo quiero dar click en esos para hacer todo para que sean más lineales y no tengan mucha pendiente. Entonces ahora si ves la animación, verás que la pelota va recta hacia abajo y luego recta en ángulo. Pero ahora lo que quiero hacer es que casi quiero
tener este balón tipo de tener un mociones de desprendimiento. Entonces lo que voy a hacer es hacer clic en K en
mi teclado para llevar el cabezal de reproducción a ese fotograma clave que quiero ajustar,
y voy a dar clic en G en mi teclado para tirar hacia arriba de la Herramienta Pluma, y voy a dar clic en esta área en esta fotograma clave aquí mismo, y sólo voy a arrastrar hacia abajo, similar a Illustrator, para especie de crear ese movimiento de pendiente. Entonces ahora si fuéramos a alejar un poco, verás que ahora tenemos un bonito movimiento de pendiente al círculo. Casi quiero que este círculo se mueva un poco
justo encima de esta barra porque no me lo
imagino como sentado encima de la barra y casi iniciando el cambio de gráfico de barras. Entonces lo que voy a hacer es que sólo voy a mover ese cabezal de reproducción haciendo clic en
J ahora en mi teclado y sólo voy a mover eso un poquito. Estoy sosteniendo Shift y las teclas Flecha, y podemos hacer que eso suba un poco más alto. Entonces voy a agarrar este punto de anclaje y sólo voy a tener ese tipo de estar un poco más acentuado hacia abajo, y tal vez incluso un poco de un cambio de escala en ese círculo sólo para dar un poco de variedad. Entonces en este momento estamos al 30 por ciento de la escala, así que bajemos a alrededor del 20 por ciento para hacerla un poco más pequeña a medida que sube por ahí así que encaja justo por encima ese rectángulo y simplemente encaja bien dentro de la composición. Dentro de la composición, como ves que ya hemos creado esta gráfica. Entonces para poder usar eso como elemento guía para donde quiero colocar al conductor, es algo que es realmente útil que puedes hacer. Entonces ahora mismo me estoy dando un elemento guía al mismo,
que quiero que este conductor se alinee con este elemento rayado porque sé que la barra rayada se va a levantar aquí en un minuto. Tenemos una agradable Facilidad Fácil en el círculo y como que golpea aquí
abajo y luego inicia todo lo que está sucediendo. Pero lo que realmente quería hacer es que quería tener más de una Facilidad Fácil y quería tener un poco más
de pico ya que tipo de que se acerca y se sienta en la parte superior, se sienta en su posición de descanso aquí arriba. Entonces lo que voy a hacer es que voy a seleccionar esa posición Keyframe y voy a ir una vez más a mi editor gráfico, y van a ver que el movimiento de la gráfica es simplemente muy Fácil. Pero sólo vamos a arrastrar esto para conseguir un
poco más de descanso y luego es una especie de repunte ahí mismo. Entonces como que se inicia a sí mismo, y como que baja e inicia el movimiento general en todas las gráficas, y luego se agita. Entonces una cosa que hacer de nuevo es ahora mismo que va a completar cero. Entonces lo que puedes hacer es hacer clic y arrastrar solo para seleccionar este, este fotograma clave, y puedes arrastrarlo hasta un
poco para que no vaya al cero completo. Puedes hacer lo mismo por este tipo de aquí. Por lo que ahora como que se mueve a través. Aquí abajo no se detiene por completo. Es como que se mueve y como que tiene un buen movimiento, y tal vez querías un poco más de facilidad en esa posición de descanso final. Entonces, lo que vamos a hacer es que vamos a tener la moción final, la moción sucediendo aquí mismo, y luego tranquilizarnos ya que tipo de entra en su posición de descanso. Está bien. Eso se ve genial. Ahora como tengo al conductor
del objeto guía dentro del punto en el que quiero que esté descansando, quiero reflejar ese movimiento dentro de los gráficos de barras también para que el movimiento
del gráfico de barras refleje lo que está sucediendo con esta pendiente del círculo. Casi tipo de pensar como si este objeto guía de aquí mismo, este círculo es casi una especie de arrastrar estas barras hacia arriba y otra vez y hacia esta nueva posición en la que van a estar descansando estas barras. Entonces ahora lo que voy a hacer es que sólo voy a tomar un tiempo para diseñar estas barras para que haya más de una pendiente ascendente a estas barras hasta donde empieza, realmente baja aquí abajo, y como que va hacia arriba. Por lo que ahora hemos diseñado este tipo de. Como que lo hicimos un poco irregular pero aún así dándole esa pendiente, y podemos como que reproducirla. Se puede ver que no está del todo alineado con el movimiento del círculo, pero vamos a cambiar eso una vez más entrando en el editor de gráficos. Entonces voy a seleccionar a todos estos tipos que acabo de hacer el cambio dentro de las barras, y voy a especie de acercar aquí y seleccionar sólo los que quiero cambiar y tipo de pasar y tipo de hacer que pase el movimiento alineado con eso. Por lo que el movimiento del círculo está sucediendo justo por aquí. Entonces lo que queremos hacer es que en realidad no queremos movernos de esa manera, queremos moverlo de esta manera, y voy a volver a salir. Algo a tener en cuenta es que lo que está sucediendo es que todo esto está creciendo. Por lo que todos los bares están creciendo ahí mismo. Entonces a medida que crecen, queremos que la moción suceda. Entonces lo que vamos a hacer es que sólo vamos a seleccionar todas estas y realmente vamos a
moverlas para que reflejen una especie de movimiento que está sucediendo aquí. Por el tempo al que estábamos trabajando, cambiar la velocidad es algo por lo que pasé primero. Pero después poder pasar y realmente cambiar la duración de
cómo se expande un objeto y cómo se estaban expandiendo estas capas de trayectoria, solo
estamos seleccionándolas todas y especie de ajustarlas ligeramente para poder
alinearse con el pico del objeto guía aquí para especie de hacer los alineados. Entonces ahora si vemos la animación completa, estamos empezando a llegar a algún lugar. Hay un par de cosas pequeñas que tener en cuenta y simplemente pensar en la composición cuando estás pasando y diseñando esto, y una parte del trabajo del diseñador de movimiento es también ser consciente del diseño y tipo de ponderado también ya que estamos trabajando con una gran cantidad de espacios en blanco tipo de permitir que este objeto guía sea dueño de su propio espacio, y este espacio de aquí mismo se podría ajustar un poco. Entonces sólo voy a darle un poco más de espacio a ese objeto guía para vivir. Lo que estoy haciendo es solo asegurarme de que el cabezal de reproducción esté en el fotograma clave que he ajustado. Lo que voy a hacer es entonces volver atrás y sólo ajustar un par de estos sólo para dar un poco más de variación entre el círculo. Voy a ir luego al círculo,
al objeto guía, haga clic aquí en mi teclado, vaya a la posición. Yo sólo voy a subir eso sólo un poquito y tal vez esto más un poco más así que se va a un lado. Entonces ahora visualmente, le hemos dado un poco más de espacio para vivir, lo
que le da un poco más de peso y ojalá mantenga ahí el ojo del espectador y lo siga siguiendo.
9. Crear la Transición II: Entonces ahora, ya que hemos construido el movimiento general
al elemento de marca usando el objeto guía, lo que vamos a hacer es hacer referencia a nuestro guión gráfico y tipo de entender que ahora queremos
traer ese guiador objeto atrás y alrededor y especie de repetir lo que acabamos de hacer dentro del movimiento general. Entonces, voy a extender mi área de trabajo sólo un poco y empezar moviendo el objeto guía hacia abajo y hacia arriba y alrededor de la gráfica hasta donde el objeto guía terminará en la parte superior de la gráfica. Entonces, para hacer eso, simplemente vamos a traerlo camino por aquí, vamos a arrastrar,
vamos a agarrar este punto de anclaje justo aquí, haciendo clic en la tecla G de tu teclado, apuntar con herramienta de lápiz y nos vamos a mover el punto de anclaje. Ya veremos cuando mueva el punto de anclaje, le gusta mover los dos ángulos aquí. Entonces, si mantienes pulsada la opción y te mueves solo punto de anclaje, solo moverá ese punto clave. Entonces, la cosa con el movimiento y aplicando movimiento a las formas, y esto es similar a como diseñar un IIlustrator, cuantos menos fotogramas clave estés usando, más suave será el movimiento. Entonces, voy a ir por aquí y voy a dar clic en este marco clave y voy a mantener presionada opción con mi herramienta de lápiz y voy a arrastrar hacia abajo para tipo de crear esta pendiente, y ahora solo estos mientras sostiene opción para que tipo de ajustarlos y solo asegúrate de que estamos consiguiendo la pendiente que queremos. Entonces, ahora podemos jugar eso atrás y ver tipo de movimiento que estamos recibiendo. Tenemos al conductor tipo de subir y dar vueltas. Queremos poder conseguirlo justo aquí arriba. Entonces, lo que vamos a hacer es que vamos a hacer otro marco clave y
sólo vamos a moverlo aquí arriba, y vamos a volver a ajustar esto. Realmente no me importa que se esté moviendo tanto sólo porque estamos trabajando con fluidez y estamos tratando de hacer todo. Entonces, esto es algo de qué preocuparse, es como
una etapa de pulido y sólo una especie de trabajo con estos, está bien. Entonces, ya verás que ahora desde que agregamos el otro fotograma clave, tenemos un poco de parada ahí mismo. Entonces, lo que queremos hacer, sólo una especie de ajustar esto sólo un poco, hazlo un poco más largo aquí. Queremos entrar a nuestro editor de gráficos mientras tenemos esos fotogramas clave seleccionados. Queremos seleccionar esos y tipo de solo sacarlos a la altura. Entonces, casi son como un solo movimiento. Aquí es donde tipo de juego con él para ver especie
del impulso que quieres poder conseguir en especie de la envoltura alrededor. Entonces, ahora estamos mostrando el impulso del objeto guía, tipo de disparo a través de todas esas barras que tenemos y especie de golpear el marco clave aquí mismo y especie de flexibilización en esta siguiente posición en la parte superior. Entonces, eso me parece bastante bien ahí mismo. Entonces, ahora lo que vamos a hacer es igual que lo hicimos antes para ajustar el impulso y reflejar ese impulso al círculo, vamos a ajustar nuevamente el impulso del gráfico y reflejar el movimiento tal como lo hicimos antes a ese círculo, así que tengan todo tipo de rotar de nuevo hasta aquí. Entonces, voy a rediseñar una vez más el gráfico de barras. Estamos trabajando para que se vea un poco orgánico no tan ordenado y organizado como tal vez pensarías que debería ser. Entonces tipo de ver la animación empezando a suceder. Entonces, una vez más, como que queremos que ese gráfico de barras refleje el movimiento y ahora mismo se está arrastrando un poco atrás. Entonces, lo que queremos hacer es que queremos seleccionar todos estos marcos clave que acabamos de crear. Queremos entrar al editor de gráficos. Una vez más, queremos seleccionar esos y queremos
que el tipo de movimiento suceda justo donde va el círculo. Entonces, los círculos tipo de tiro a través de ahí
mismo, justo aquí es donde queremos que todo el movimiento
suceda hasta que literalmente podamos alinear este pico con el cabezal de reproducción. Igual que eso. Ya verás que ahora estamos obteniendo este movimiento fluido que está reflejando el movimiento del objeto guía. Entonces, ya que ahora hemos reflejado los gráficos de barras para que coincida con el movimiento del conductor, lo que vamos a hacer es que vamos a tratar de averiguar cómo hacer que todo pase a la marca del logotipo final. Sé que la marca del logotipo está conformada por esas cuatro formas diferentes y esas son todos rectángulos. Entonces, creo que podríamos usar esta barra de estructura inferior justo aquí, tipo de diseñado fuera de los storyboards que creamos y tipo de tener que se superponen todas estas otras barras y tienen todo colapsado debajo de ese fondo estructura. Entonces, lo que creo que sería genial sin embargo es que tipo de cambio de los elementos, cambiar todo el diseño de esta estructura inferior solo para que sea más interesante similar a como lo hicimos para esta barra rayada justo aquí, y hacer esta barra ya que tipo de transiciones hacia arriba y sobre todas estas otras formas, tener esta transición de barra en una forma delineada. El objeto guía en ese sentido sería entonces guiar el movimiento y realmente proporcionar el impulso para que esa estructura inferior se superponga y colapse estas barras. Entonces, podemos tener ese elemento de transición en la marca final del logotipo. Entonces, vamos a empezar eso justo ya que este
tipo de objeto guía viene de abajo hacia arriba como si fuera una especie de traer esto. Pero quiero cambiar esto en una forma delineada. Entonces, lo que vamos a hacer eso es que voy a tener este tipo de colapso sobre sí mismo. Entonces, voy a seleccionar sólo estas dos líneas de fondo aquí mismo, asegurarme de que estoy seleccionado en la capa. Yo sólo voy a tener este tipo de selecto ahí mismo. Entonces, ahora verás como algo que aparece y otra vez, la barra inferior se derrumba sobre sí misma, pero quiero que sea Easy Easy Easy. Entonces, el movimiento de esa barra inferior se derrumba como el círculo viene de aquí abajo a aquí. Entonces, lo que voy a hacer es que sólo voy a seleccionar estos dos, entrar a mi editor gráfico y sólo voy a tener que eso pase aquí en la parte final. Entonces, ahora como viene y pasa, se derrumba sobre sí mismo y como se derrumba sobre sí mismo, en realidad quiero hacer un objeto nuevo completo. Entonces, lo que le voy a dar ese nuevo objeto completo porque en realidad voy a cortar esta forma en dos formas diferentes justo en el cabezal de reproducción. Para ello, mantienes pulsado el comando shift D y eso lo cortará justo en lo diferente y hará dos formas diferentes, pero lo cortará justo ahí. Entonces, ahora tengo otra forma con la que puedo trabajar. Entonces, esta otra forma sé que quería que fuera el contorno y sé quiero que sea el mismo ancho que esta, a la que puedo hacer clic en una de estas formas aquí mismo y ver que es un ancho de ocho píxeles. Entonces, puedo ir a la nueva forma que acabo de crear a partir de esa capa de ahí abajo. Puedo hacer ese esquema con solo hacer click aquí, dando click allá, golpeando A y luego ahora puedo cambiar el relleno a donde hay un relleno porque quería solapar todos estos. Entonces, quiero que ese relleno sea, sí, pero quiero que el relleno sea blanco. Entonces, quiero que el relleno sea blanco y que sé que quiero que esto pase por encima de todas estas otras barras. Lo que voy a hacer, es que estoy hold command y el corchete derecho y eso
me permitirá mover esta forma hacia arriba y sobre todas las demás capas. Entonces, ahora cuando entro y hago clic en U, tengo este camino aquí mismo y lo que puedo hacer ya que estoy empezando una nueva capa, puedo eliminar todos estos viejos fotogramas clave que he hecho para esta capa que está aquí abajo. Literalmente puedo bajar aquí y puedo tener ya que esa moción está ahí arriba. Quiero que esto empiece a solapar todas estas formas, así que lo que voy a hacer es seleccionar estos dos fotogramas clave superiores con solo hacer clic y arrastrar,
manteniendo pulsada la tecla Mayús y Flecha solo para darme un poco fuera de ahí y luego solo lo voy a arrastrar hacia arriba y otra vez así. Entonces, ahora cuando veamos a este tipo verás que hemos creado algo mágico. Está bien. Cuando haces una transición como esta es genial
tener la Facilidad Fácil porque permite la imperfección de ese punto de transición pase desapercibida. Entonces, lo que voy a hacer es que sólo voy a ir a esa nueva forma, voy a dar click Yo para asegurarme de que estoy al principio de esta nueva forma que
seleccioné, voy a seleccionar esos dos fotogramas clave van al editor de gráficos. Una vez más tenemos una agradable Facilidad Fácil, pero quiero que ese movimiento suceda muy rápido aquí mismo. Entonces, al igual que antes, solo voy a arrastrar eso, y boom verás que tenemos un poco más de impulso por ahí, pero eso es casi demasiado impulso. Será demasiado. Entonces, sólo vamos a tener ese tipo de estar alineados con ahí, con el movimiento del círculo y ahí mismo se ve bastante bonito. Una vez más, no te preocupes por pulir. Piensas demasiado, trata de seguir adelante y conseguir un poco de impulso. Entonces, lo que creo sería bueno considerando que la marca está conformada por ese color azulado es a, aunque estamos teniendo este cuadro tipo de colapso todo, creo que sería bueno que el tipo de azulado venga de abajo también. Entonces, para introducir eso solo podríamos tener ese inicio como la misma forma que esta forma, pero solo que empiece un poco más tarde. Entonces, lo que voy a hacer es que voy a seleccionar esta capa y sólo
voy a hacer clic en Comando D para ahora duplicar esta capa. Asegúrate de que esté encima de la capa naranja que acabamos de crear, la capa de contorno. Pero este color ya que sé que va a ser azulado, lo que está pasando aquí cambia el color a tal vez un bonito color cian azulado. Entonces vamos a asegurarnos de que ese color va a ser un relleno de azulado y eso va a tener un derrame cerebral y entonces lo que va a pasar es que vamos a tener una especie de venir y otra vez. Pero yo quería como que casi me retrasara. Entonces, para hacer eso queríamos un poco retrasados así. Entonces, verás que lo que está pasando es que desde que
quitamos ese trazo de esa forma ahí mismo, puedes ver el contorno desde la capa debajo de ella. Entonces, lo que vamos a hacer es que sólo vamos a entrar ahí. Solo vamos a hacer esto un poco más ancho que la capa de antemano, y solo estoy usando mis teclas de flecha y seleccionando éstas para un tipo de repasar. Ahora, vas a tener que hacer eso también en el siguiente fotograma clave. Entonces, ahora mismo solo estoy expandiendo la caja solo para que cubra la capa que está debajo de ella. Hermosa. Está bien. Genial. Entonces lo que podemos hacer es, en realidad
podemos tener que esta caja no vaya tan alta como va. Ahora podemos ver con qué estamos trabajando. Ahora se puede ver que estamos consiguiendo un rectángulo hacia este rectángulo nos
va a llevar a esa siguiente fase que va a estar mostrando y construyendo esa marca que está conformada por esos cuatro rectángulos. Una cosa que hay que hacer para agregar al movimiento general es agregar un tipo de característica a las barras sobre las que se están colapsando. Así que ten todas esas barras dobladas una sobre la otra, o tal vez tú solo esta izquierda y esta derecha, tal vez se vuelvan un poco más delgadas ya que esta barra entra casi ya que está apretada debajo de esta dando características de construcción alrededor estas formas a través del movimiento. Entonces a mitad de camino por aquí. Adelante y tiremos a estos tipos. Hagamos sólo estos. Entonces lo que vamos a hacer es hacer clic en estas dos capas justo aquí, las capas superpuestas. Por lo pronto, los vamos a apagar y para hacer eso solo quieres golpear a este pequeño ícono por aquí. Entonces siguen ahí no los hemos borrado, pero acabamos de apagarlos y voy a ajustar el ancho en estas formas para que sean empujados por un poco. Entonces cuando las formas las pasan por encima casi parecen que se están derrumbando entre sí. Ahora vamos a volver a encender las dos capas que acabamos de apagar y voy a ver que tenemos un poco más de reflexión sobre esas cosas a medida que van subiendo y acabando. Como otra forma de establecer las formas para que se superpongan y colapsen las barras, puedes hacer un poco de refinación. Aquí es donde puedes empezar a traer esas capas que dejamos a un lado. El marcado para alinear la marca y el ancho de la marca porque este rectángulo de aquí es lo que vamos a transitar hacia el ancho de la marca. Entonces lo que voy a hacer es ir por aquí y voy
a seleccionar la marca que tengo. Dado que esta marca en este momento está alineada con el logotipo que tenemos, lo que voy a hacer es realmente voy a duplicar esto. Entonces voy a seleccionar todas las piezas de
la marca y hacemos clic en “Comando D” y voy a subir eso, y luego voy a hacer clic en “Shift Comando C” y Shift Comando C crea un Pre-Comp. Por lo que Pre-comp dentro de secuelas permite crear otra composición dentro de una composición. Entonces esto es si quieres agrupar múltiples capas juntas, en nuestro caso tenemos una marca de que realmente no queremos movernos, elementos
individuales alrededor solo queremos mover todo. Puedes hacer esto ya sea creando un nulo o puedes hacerlo creando Pre-Comp. Para esta lección y para este escenario, vamos a estar haciendo un Pre-Comp. Sólo vamos a llamar a este Fathom_mark. Entonces qué pasa cuando creamos Fathom_mark verás que creó una nueva composición dentro de nuestra carpeta del proyecto. Entonces lo que vamos a hacer es que sólo voy a mover eso por aquí. Entonces ahora verás que se alinea y me voy a mover sosteniendo Comando de turno y corchete derecho. Voy a mover eso todo el camino hasta lo más alto de nuestra composición. Yo sólo voy a mover eso. Esto es sólo por áspero. Sólo para ver el tamaño con el que estamos trabajando. Yo sólo voy a mover eso ahí. Entonces una cosa que puedes hacer, es hacer clic en “Y” e Y cambiará los puntos de acceso. Para que pueda mover el eje justo en el medio ahí. Entonces si necesito cambiar el tamaño de esto haciendo clic en “S”, entonces
puedo hacer clic en “S” y cambiará el tamaño a la Fathom_mark. Entonces ahora que tenemos pre-Comp la marca lo trajo a la composición que hemos terminado y ver el área de la línea de tiempo en la que estamos trabajando. Puedes levantar la cuadrícula y asegurarte de que estamos en el centro de la composición. Me refiero a una cosa que hacer para darle este uso esto como tu guía es ir, una vez que tengas el Pre-Comp seleccionado entra en efectos, y ve a “Relleno” solo escribe en relleno. Lo que esto hará es permitirte cambiar el color de toda la composición, y como la única capa que tenemos ahí dentro como marca, esto solo te dará una guía. Entonces cuando estás trabajando dentro de esto
puedes ver con qué estás trabajando ya que son del mismo color. Por lo que ahora una vez tenemos nuestra capa guía frente a la forma TO que viene y otra vez, sé que quiero el TO con partido el de la marca que ponemos en el centro. Entonces lo que voy a hacer es que voy a seleccionar eso TO, seleccionar el camino, voy a sólo un par de fotogramas después, y luego voy a ajustar el camino para que coincida con la marca aquí. Ahora, cuando juguemos verás que da si pudiéramos ser el área de trabajo de startup, puedes ver que va de una a otra. Queremos que eso sea un poco más fluido, por lo que todo sucede a la vez. Entonces vamos a seleccionar todos estos y vamos a entrar en nuestro editor de gráficos, y no es fluido ahora mismo porque va a completar cero aquí mismo. Lo que queremos hacer es solo seleccionar ese fotograma clave que acabamos de hacer, y queremos moverlo hacia arriba. No va a completar cero pero casi tiene un movimiento completo. Cuando el movimiento fluido, y casi quiero que ese movimiento ocurra un poco antes, así que solo lo estoy moviendo un poco hacia la izquierda. A lo mejor tenerlo sea un poco más rápido. Entonces sólo tener la moción que suceda por aquí. A lo mejor hasta mover a este tipo con esto toda la moción está pasando aquí mismo. Ahora, estamos recibiendo más de un movimiento fluido que se ve mejor. Entonces ahora lo que voy a hacer es también voy a sólo esa capa inferior para reflejar también la capa superior. Pero lo que podemos hacer ya que eso está pasando casi podemos tener esto después de que éste cubra todo. Podemos literalmente simplemente eliminar todo lo que hay debajo de él. Entonces lo que voy a hacer es no lo voy a borrar pero voy a cortar todo. Voy a seleccionar esa capa delineada blanca inferior. Voy a sostener la opción y mantener el corchete derecho, y eso va a cortar por ahí, y voy a seleccionar todas las capas de gráficos de barras que hemos estado ajustando. Voy a seleccionarlos todos incluso la capa normal que creamos Voy a mantener opción y voy a dar clic a corchete derecho también luego cortarlo ahí mismo. Entonces ahora cuando toquemos esto verás que cuando suba y
acabe no tenemos ninguna de esas capas que están detrás de ella. Pero una cosa que quiero señalar es que queremos tener casi pensar como si el objeto guía que estamos usando para la marca aquí mismo como si esto se derrumbara sobre sí mismo tendríamos un rectángulo que fuera un poco más delgado de lo que estamos trabajando en este momento. Por lo que casi quiero que esa capa sea tan delgada como esa va a ser. Voy a bajar eso por aquí también. Pensando en estos dos objetos, éste de aquí abajo y éste de aquí arriba iban a derrumbarse cómo se vería. Ahora si lo vemos y lo tocamos ves que estamos consiguiendo esta emoción de todo colapsando el uno sobre el otro. Una vez más, no tiene por qué ser perfecto. Simplemente hay que transmitir la idea con la que van porque
entonces vamos a cambiarla aún más y pulirla. Ahora que hemos alineado todo a la marca en las dimensiones de la marca que queremos poder utilizar
para proporcionar un poco de un cambio de escala, lo que vamos a hacer es que podemos desactivar esta guía superior capa y podemos extender el círculo. Por lo que el círculo extra se extiende pasar esto. Poco después de trabajar a través del elemento de la marca y condensar todo en este único objeto en solitario, vamos a continuar la rotación con el círculo y tener esto para venir todo el camino y realmente empezar a construir el logo encerramiento.
10. Refinar la Transición II: Entonces ahora que hemos trabajado a través de
la animación del elemento de marca realmente usando al conductor para transmitir ese movimiento, vamos a entonces tratar de llevar al conductor círculo completo a ahora
esta forma en solitario que hemos creado que entonces se va a construir el logomark. Entonces para hacer eso, lo que queremos es crear casi un movimiento rápido con el círculo hacia donde casi azote cuando está sentado en la parte superior de aquí, y que azote a la mitad aquí y golpea este rectángulo que acabamos de crear. Al golpear este rectángulo, ese impulso de ese círculo va a empujar el rectángulo hacia la izquierda que lo alineará con la marca, el logomark dentro del bloqueo del logotipo. Entonces lo que vamos a hacer, vamos a ir al círculo que tenemos. Vamos a tener este látigo por aquí mismo. Para ello, vamos a hacer un par de fotogramas clave diferentes. Vamos a hacer uno ahí mismo. Entonces, vamos a hacer uno que está justo por ahí. Entonces, ahora, si ves lo que tenemos para el movimiento, voy a dar click a B para hacer mi área de trabajo un poco más corta, tenemos algo que se está consiguiendo ahí. Entonces, ahora, vamos a entrar, una vez que tengamos las capas descubiertas, vamos a añadir la pendiente de dos capas. Por lo que haciendo clic en G en el teclado y haciendo clic en él, vamos a hacer clic en la capa para poder obtener los puntos de anclaje para luego poder ajustar la pendiente con la que estamos trabajando. Manteniendo pulsada la opción, vamos a ajustar esta para que tenga un poco más de un conteo lento entrando, y usando las teclas de flecha aquí y el cambio para moverla hacia arriba y hacia abajo. Sólo estamos tratando de llegar a donde parece que este camino caería justo en esa nueva forma que acabamos de crear. Ahora, veamos qué tenemos. Entonces, ahora, el camino general es correcto pero la velocidad está apagada y eso es porque tenemos capas EZ, y así vamos a entrar una vez más en el “Editor de gráficos”. Al igual que lo hemos hecho antes, vamos a seleccionar estos dos y agarrar los puntos de anclaje. Vamos a arrastrarlos hacia arriba para que casi fluyan entre sí así. No queremos que eso pare tanto, así que también vamos a hacer que esto salga también. Ya verás que ahora estamos empezando a sacar algo más de este impulso en movimiento. Por lo que ahí se puede ver. A pesar de que se ve un poco
áspero, sigue siendo el movimiento principal que está sucediendo aquí porque ese movimiento
es donde pasa por todos los objetos y luego como que se ralentiza, y casi llega a una parada completa. Aquí abajo, cuando se trata de la cima, y luego como se pone justo aquí, se ralentiza pero luego se dispara y realmente golpea el valor de impulso rápido ya que llega por esa esquina. Eso es realmente lo que estamos buscando. Entonces vamos a salir del editor de gráficos. Vamos a poner un cambio de escala en esta capa y también un cambio de posición. Entonces vamos a subir a la capa. Ya que hemos ajustado la trayectoria en esta capa, el punto del eje central es diferente ahora pero eso algo que fácilmente podemos cambiar yendo a nuestro “Motion”,
“ Plug-in” y haciendo clic en el acceso central. Ahora, cuando hagamos un cambio rápido de escala ya que este camino se derrumba sobre sí mismo, haremos un cambio de escala por ahí. Haremos click en “Comando”, “Opción S”. Haremos de un 100 a cerca de 80 por ciento. Eso vamos a cortar, y luego también haremos cambio de posición. Entonces para hacer eso, haremos “Shift”, “Opción P”, y como este era un objeto que habíamos duplicado antes, tenemos los fotogramas clave de posición del pasado, por lo que en realidad podemos eliminar todos esos porque ya no los necesitamos, porque están en otro objeto. Podemos tener esa posición entonces a medida que ese círculo entra y lo golpea. Eso vamos a tener. Con sólo usar “Shift” y las teclas de flecha, vamos a simplemente empujar eso hacia donde creemos que descansará la marca. Entonces, ahora, tenemos todo moviéndose, pero obviamente el tiempo está un poco apagado, así que lo que vamos a hacer es que sólo vamos a movernos sobre estos dos fotogramas clave que acabamos de hacer para alinearlo con el tiempo del círculo. Entonces, ahora, voy a ajustar el editor gráfico del cambio de posición. Tan justo como ese círculo golpea, quiero que se dispare hacia la izquierda, así que sólo vamos a hacer que eso sea más fácil. No te preocupes por el círculo. Simplemente vamos a borrar el círculo cuando se ponga debajo. Tan pronto como se ponga debajo del rectángulo, podemos seguir adelante y borrar eso. Entonces aquí hay otra instancia en la que se puede ver ese objeto guía viniendo y una vez más controlando el movimiento y realmente empujando objetos y agregando movimiento a otros objetos. Entonces, ahora, para que el tamaño y la posición sean correctos, lo que voy a hacer es que una vez más voy a tirar ahora por encima de la final. Entonces, ya que tenemos todos los fotogramas clave aquí arriba, lo que puedes hacer es hacer clic en Comando-A para seleccionar todas las capas y hacer clic en U y U colapsará todo por lo que es un poco más ordenado trabajar en. Lo que voy a hacer es que sólo voy a mover todas estas capas para alinearlas a la forma que acabo de mover. Entonces quiero que esto quede justo en medio de las marcas, así que lo que voy a hacer es que voy a hacer click en U en ese rectángulo que seguimos empujando. Voy a ir a esa capa. Entonces lo que quiero hacer es alinear esa forma que hemos estado moviendo hacia el centro de las marcas. Entonces lo que voy a hacer es agarrar esta forma y me voy a asegurar que la cabeza de juego esté en ese fotograma clave de posición y sólo voy a mover eso hacia donde está el centro de esa marca. Ahora, déjame volver a jugar esto. Haremos que ese círculo venga y lo mueva al lugar correcto hasta donde debe estar esa marca. Ahora, verás que la forma es un poco más ancha que la propia marca, así que lo que vamos a hacer es que sólo voy a ajustar el camino de la marca a medida que se mueve. También se volverá un poco más delgada. Entonces lo que vamos a hacer es que vamos a ajustar eso. Entonces, ahora, como el objeto guía ha sido eliminado y ha empujado esta forma final a su posición final, el logomark es realmente lo que está controlando la animación. Entonces lo que realmente estoy tratando de hacer es construir la forma para que se forme alrededor de los dos centros de mesa de la marca. Entonces lo que en realidad voy a tener que hacer es que aquí
voy a tener las formas que conforman la marca, ya que esto se desliza en posición, voy a hacer que se amplíen también. Entonces voy a seleccionar entonces todas las formas que conforman la marca que hemos organizado en Illustrator, que están aquí abajo, y les voy a poner un cambio de posición para que todas se abran como si todas estuvieran colapsadas. Entonces voy a hacer “Turno”, “Opción P” para poner un cambio de posición en todos ellos. Voy a mover esos fotogramas clave que acabo de hacer sobre un par de fotogramas porque sé que ahí es donde quiero que termine. Entonces, voy a moverlos hacia arriba hasta que coincidan con el rectángulo que acaba de deslizarse en su lugar. Empezarás a ver qué estamos haciendo aquí. Esto puede ser áspero y refinado al final. Entonces, iremos a la de arriba y lo moveremos hacia abajo también. Entonces ahora, si fuéramos a jugar esto más o menos, y entonces vamos a cortar esta forma. Entonces esta es esa forma de rectángulo que simplemente se deslizaba hacia adentro. Vamos a cortar esta forma justo cuando la marca comience a expandirse. Voy a ponerlo justo a donde quiero cortarlo. Voy a sostener “Option”, “Right Bracket” para cortarlo ahí mismo. Ahora, tenemos una idea aproximada de con qué estamos trabajando aquí. Entonces ahora cuando te alejas, y juguemos todo el asunto, puedes empezar a ver que lo que hemos creado es un bumper de movimiento.
11. Crear el tipo: Entonces mirando a través de esto ahora y sabiendo que los próximos pasos va a estar sacando el tipo desde debajo del rectángulo. El cambio de escala de rectángulo ocurre un poco demasiado pronto, porque necesito tener un poco del ancho en esta forma para poder sacar el tipo. Entonces lo que voy a hacer, es que sólo voy a volver a subir a ese cambio de escala que hice en ese rectángulo inicial, y luego voy a tener que sea un poco más de una facilidad en esa forma final. Entonces voy a seleccionar esos dos, que son dos puntos lineales ahora mismo, y los voy a facilitar. Voy a entrar a mi editor de gráficos aquí, y voy a ajustarlos. Entonces el movimiento principal ocurre hacia el final, y se asienta ahí dentro. Cambiando aquí el área de trabajo, haciendo clic en B
y N, y viendo cómo podemos hacer ese ajuste un poco más lento que lo que es ahora mismo. Entonces lo que estamos tratando de hacer es crear el ritmo para que tengamos tiempo
suficiente para traer la tipografía debajo de esa forma, debajo de la forma, debajo de ese rectángulo que hemos creado. He ajustado el tiempo sólo un poquito, y vamos a sumergirnos en la tipografía. O sea, empieza a construir la tipografía. Entonces construir otra tipografía y lo que quería hacer es trabajar con el borde duro de la tipografía. Voy a apagar la cuadrícula por ahora, y luego trabajar con el borde duro de la tipografía y casi hacer que sean sacados. Pero luego también utilizar algunos de los elementos como el F. Tal vez no tener el F o tal vez el H sacar por completo, pero sólo ligeramente tal vez casi tener un poco de un cambio de escala. Por lo que a lo largo de este proceso, vamos a estar usando máscaras, cambio de
escala y un poco de posición para poder construir toda esta tipografía. Entonces nos sumergimos justo en eso. Queremos que aparezca un poco por aquí. Entonces un poco después de que la marca se asiente, queremos empezar a construir, y esto es algo que siempre podemos cambiar después. Por lo que sólo voy a tener todos seleccionados y hacer clic en el corchete izquierdo. Entonces voy a empezar a hacer las cosas que puedo hacer con los caminos de las formas. Entonces sé que para la F porque es de forma muy lineal, puedo trabajar con el camino. Entonces voy a entrar en el camino de la forma y empezar a añadir algunos fotogramas clave. Entonces lo que realmente estoy tratando de hacer aquí con los formularios de cartas es que los estoy teniendo, quiero que realmente puedan crecer a medida que avanza la moción. Entonces lo que estoy haciendo aquí mismo es, estoy utilizando algunos de ellos mejor más lineales y trabajando con su camino. Entonces también estaré trabajando con otros en el uso máscaras sobre las formas para poder demostrarlo como si estuvieran siendo sacados. Para la F, me voy a concentrar sólo en el camino de la F y simplemente colapsar los dos travesaños aquí mismo, solo darle un poco de animación a esto. Ya que la F será lo primero que aparezca, no
tenemos que añadir demasiado movimiento a eso,
y eso es algo que puedes diseñar por ti mismo si quieres tener un poco más de movimiento al mismo. Entonces para la F por ahora, esa es la única moción que realmente vamos a hacer por ella. Vamos a sumergirnos en la A y mostrar cuántas máscaras usan para dibujar realmente la forma tipo A. Entonces lo que voy a hacer es, básicamente voy a seleccionar la A y voy a hacerlo,
así que para hacer una máscara alrededor de la forma, voy a hacer clic en la capa y voy a mantener pulsada Mayús, Comando, Fin y eso hará una nueva máscara alrededor de la forma. Verás que acaba de crearse un nuevo cuadro delimitador alrededor de la forma. Ahora, si hago clic en la capa que quiero ajustar la máscara y hago clic en m, tirará hacia arriba la capa de máscara debajo de la capa. Al igual que muchas otras cosas con caminos y posiciones, también
soy capaz de iniciar fotogramas clave con esto. Entonces lo que voy a estar haciendo es que voy a estar dibujando esto con la máscara. Entonces para hacer esto, voy a arrancar el temporizador. Voy a arrancar el cronómetro, y luego voy a ajustar la máscara como si fuera a sacar esto casi cuadro por cuadro. Hay un par de maneras diferentes de hacer algo similar a esto a donde dibujas una forma. Acabo de aprender que soy capaz de ponerme un poco más específico con este tipo de métodos. Entonces lo que estoy haciendo es que solo estoy configurando el primer fotograma que quiero iniciar este proceso de dibujo y casi tener el a, b dibujado así. Entonces sube y luego vuelve a bajar, y termina aquí abajo. Entonces para esto, realmente quieres pensar en cuántos marcos
quieres para toda la forma. Entonces sé que como desde un punto de vista fácil, si quiero que esta mitad superior de aquí sea un poco más rápida, voy a tener menos fotogramas. Entonces si quiero que la mitad inferior sea un poco más lenta, voy a tener más fotogramas. Entonces lo que voy a hacer es, quiero que esto se inicie realmente rápido, así que sólo voy a tener alrededor de tres a cuatro cuadros entre este punto de partida y este punto central. Entonces para hacer eso, lo que voy a hacer es, literalmente sólo
voy a acercarme aquí un poco. mantener el comando y la tecla de flecha, puedes saltar fotograma por fotograma. Entonces solo voy a saltar un fotograma, y sólo voy a agarrar esta máscara. Yo sólo voy a mover la máscara y empezar a tener esta cosa aquí arriba. Entonces ahora, esto es algo a donde realmente necesitas conseguir un poco ser pacientecon esto y trabajar con la forma aquí. Por lo que ahora haciendo clic en G en tu teclado, tirará hacia arriba la herramienta del lápiz y la herramienta del lápiz te permitirá hacer otros fotogramas clave en los otros puntos de la máscara que tienes, para que puedas ajustarla a medida que avanzas. Entonces una vez más, voy a mantener presionada la tecla Comando y flecha para ir un fotograma más adelante después de tener ese set, y voy a volver a seguir revelando este un aquí. Entonces ahora, si reproducimos lo que acabamos de hacer, se
puede ver que tenemos un poco de la, estamos trabajando con caminos en la f y luego estamos trabajando con un poco de eso, estamos trabajando con máscaras en la a, y para el resto del tipo lo vamos a estar construyendo con esos dos métodos. Entonces ahora, si damos un paso atrás y miramos lo que acabamos de crear, usamos algunas de las máscaras y algunos de los cambios de ruta para revelar realmente
este tipo a medida que se construyeron esos mercados de logotipos. Se puede ver lo que tenemos aquí, se ve bastante impresionante. Se puede ver que definitivamente estamos usando ese objeto guía como el impulso y luego transfiriendo ese impulso al final al rectángulo, que luego construye la marca y los alimentó como un todo. Estamos recibiendo mucha variación de velocidad, que también hacen referencia a la marca también. Entonces el último paso que vamos a hacer es, vamos a encontrar una manera de colapsar la animación del logotipo que acabamos de crear. Por lo que todo entra en bucle sin costuras en el círculo final.
12. Crear el bucle final: Muy bien, entonces ahora que tenemos la animación rugosa completa usando los objetos guía para construir toda la animación, pasando por el elemento de marca, y luego conduciendo al bloqueo final del logo, lo que vamos a hacer ahora es tomar el bloqueo del logotipo, colapsar un bloqueo del logotipo para poder volver a ese objeto guía. Entonces lo que voy a hacer es seleccionar las capas
que tienen toda la animación en ella que quiero pre-componer y añadir a una sola capa, que van a ser todas las capas tipo logo y luego también la capa de bloque de ese bloque expandiéndose TO que vino sobre todos los gráficos de barras. Y luego voy a dar clic en “Hold”. Voy a hacer clic en “Shift”, “Comando”, “C” para crear un pre-comp y
voy a llamar a este Logo Lockup. Y voy a crear una nueva capa, y va a crear una nueva capa, y cuando la reproducimos, nada ha cambiado porque todo lo que se hace
es que se toma esa animación que acabamos de crear, y se la pone en un pre -comp. Entonces ahora lo que voy a hacer es que voy a hacer algo llamado Remapeo del Tiempo. Por lo que el remapeo de tiempo permite cambiar la duración de un determinado clip. Entonces para hacer eso mantienes presionada “Opción”, “Comando”, “T.” Y entonces lo que va a pasar es que vas a ver que ahora tienes otro fotograma clave en tu línea de tiempo. Entonces ese fotograma clave es realmente el punto de inicio de la duración de ese clip específico. Para nosotros es el inicio de la animación de construir ese lockup logo de Fathom. Entonces lo que voy a hacer es que sólo voy a fregar por aquí y averiguar dónde deja de animar esa marca Fathom. Creo que son alrededor de tres segundos. Entonces justo alrededor de tres segundos, voy a hacer otro fotograma clave ahí mismo. Y así ahora tengo la duración completa de ese movimiento que voy a estar revertiendo, y voy a tomar este fotograma clave inicial justo aquí. Voy a copiar con solo hacer clic en el fotograma clave y hacer clic en Comando C. Sólo voy a ir un par de fotogramas hacia adelante y voy a dar clic en Comando V. Ahora lo que va pasar es que todo el proceso de lo que acabo de crear luego revertirá . Entonces ahora si jugamos esto apenas más o menos, ya verás con qué estamos trabajando aquí. Voy a construir y todos se van a expandir el uno al otro. Entonces verás que lo que estamos
trabajando para que esto se expanda todo y luego llevarnos de vuelta a un círculo central. Entonces ahora mismo nos está llevando de vuelta a un rectángulo central, porque eso es lo que creamos. Pero lo que podemos hacer es que en realidad podemos tener esa parada por aquí. Lo que vamos a hacer es que vamos a curar un fotograma clave por ahí. Vamos a seguir adelante y eliminar este tercero que acabamos de hacer. Ahora si lo jugamos, podemos ver con qué estamos trabajando. Y luego se va a parar ahí mismo. Entonces lo que vamos a hacer es mostrarles cómo hacer una transición rápida desde este rectángulo y crear un nuevo rectángulo para luego transferir eso
a ese círculo inicial con el que empezamos. Entonces una cosa que quiero señalar es que queremos tener el logo. Por lo que ahora mismo se está construyendo el bloqueo del logotipo, y luego de inmediato se está deconstruyendo. Es bueno tener este bloqueo de logotipo quizá sentarse durante medio
segundo a segundo solo para que el espectador lo pueda llevar,
el cliente lo pueda llevar, o quien lo esté viendo. Entonces lo que vamos a hacer es que sólo vamos a copiar este segundo fotograma clave que es el bloqueo del logotipo que se está construyendo por completo. Vamos a copiar eso y vamos a ir sólo un par de fotogramas hacia adelante y sólo vamos a pegarlo. Ahora esto nos proporcionará un marco de retención. Entonces entre estos dos fotogramas, no ocurrirá ninguna animación, y luego entre estos dos fotogramas es donde ocurrirá la animación inversa. Entonces ahora si lo jugamos, verás que se detiene por un par de segundos, y luego se invierte sobre sí mismo y vuelve a ese rectángulo. Entonces en realidad voy a hacer eso un poco más corto. Vamos a jugarla una vez más aquí. Entonces hagámoslo un poco más corto. Entonces la animación no se parece exactamente a la que acabamos de crear, solo a la inversa. Lo que vamos a hacer es aplicar un uso fácil a estos últimos fotogramas clave y eso nos permitirá luego entrar en el editor de gráficos y permitir que el movimiento sea un poco más rápido de lo que realmente se está construyendo. Esto nos dará un buen elemento transitorio desde ese rectángulo hasta el objeto guía, que va a ser ese círculo. Entonces, ahora si lo reproducimos, verás que es un poco más lento, y luego va realmente rápido a colapsar sobre sí mismo. Entonces ahora lo que queremos hacer es por aquí, queremos crear una nueva forma. Entonces lo que realmente voy a crear es que voy a crear este mismo rectángulo exacto. Puedes hacer esto haciendo clic en Comando E, o puedes hacer lo mismo que hemos estado haciendo y subir aquí a la herramienta de rectángulo y crear exactamente
el mismo rectángulo que hemos estado usando y eso es exactamente lo que vamos a hacer. Es importante cuando haces este rectángulo que no
quieras tener seleccionada ninguna de la capa. Si tengo seleccionada una de las capas y sigo adelante y dibujo el rectángulo, lo que va a pasar es que va a crear una máscara sobre esa capa que acabamos de precomponer. Eso se puede poner un poco confuso. Por lo que solo quieres asegurarte de que no tienes “Capas” seleccionadas con solo hacer clic en el espacio gris de tu línea de tiempo. Y así una vez que lo hayas hecho clic en el espacio gris y tengas seleccionado este rectángulo, lo que vamos a hacer es que solo vamos a rastrear sobre esto y verás que After Effects está empezando a hacer una nueva capa para nosotros, y sólo vamos para rastrear sobre esto así como así. Ahora es aquí donde realmente quieres poder usar tu cuadrícula, porque sabemos que ese círculo que creamos en el inicio mismo de la animación estaba directamente en medio de la composición. Entonces una cosa que podemos hacer es simplemente trabajar con la cuadrícula para alinear eso también. Entonces ahora lo que vamos a hacer es cortar esta forma que
acabamos de hacer sosteniendo “Option” en el corchete derecho. Vamos a cortarlo a la cabeza de juego, por lo que empieza exactamente donde queremos que empiece. Entonces vamos a entrar en el camino de este rectángulo, porque vamos a hacer de este rectángulo un círculo. Entonces mientras vamos a hacer eso, vamos a estar usando el camino, y luego vamos a estar usando algo llamado “Corners redondos”. Entonces no te preocupes por las esquinas redondas ahora mismo, sino por el camino básicamente lo que queremos pasar, ya que esto es todo tipo de venir de izquierda a derecha. Y verás que las esquinas redondas ya han redondeado esas esquinas y eso es solo para ayudarnos a transitar a ese círculo. Entonces como viene de izquierda a derecha, lo que queremos hacer en realidad es tener el lado izquierdo de este rectángulo deslizándose para hacer de este rectángulo más un cuadrado que está en medio de la composición. Para ello, podemos jugar con él y asegurarnos de que ambos lados estén parejos. Y entonces ahora lo que vamos a hacer es cortar la capa pre-comp que habíamos creado antes con remapeo en tiempo inverso sobre ella. Vamos a cortar eso aquí mismo, porque ahí es exactamente donde entra
esa nueva forma de rectángulo. Yo sólo voy a cortar eso sosteniendo opción en el corchete derecho. Esta capa aquí mismo podemos deshacernos de esto. Esta fue esa marca roja original de Fathom, y sólo podemos mover eso a la parte inferior sosteniendo Shift Command y el corchete izquierdo para mover eso todo el camino hacia abajo hasta la parte inferior. Entonces ahora lo que vamos a estar viendo si mostramos esto realmente de forma aproximada, verás que cuando esto se derrumba sobre sí mismo, tenemos ese rectángulo transferiéndose a un cuadrado, lo que realmente nos va a ayudar a volver al círculo. Entonces lo que vamos a hacer es obviamente, queremos que esto sea un poco más rápido. Por lo que vamos a volver a aplicarle una facilidad fácil, y ajustarla dentro del editor de gráficos. Recuerda guardar siempre por si acaso. Entonces ahora vamos a saltar al editor de gráficos aquí y sólo vamos a hacer esto. Entonces, este es un movimiento realmente rápido en el principio así como así, y tenerlo casi construido. Lo que podemos hacer es que esto sea aún más corto durante la duración, por lo que sucede un poco más rápido. Entonces como eso golpea, podemos trabajar con las esquinas redondas. Entonces lo que voy a hacer esquinas redondeadas se establece automáticamente cuando lo apliques, y cómo apliqué eso recuerden, es solo haciendo clic en este pequeño anuncio aquí mismo. Puedes hacer eso de un par de maneras diferentes si tienes tu capa seleccionada, puedes hacerlo dentro de los contenidos aquí mismo, o puedes hacerlo arriba en la parte superior derecha aquí solo haciendo clic en “Agregar, " haces clic aquí, y solo tienes que hacer clic en “Redondo Corners”, y eso lo va a agregar debajo de tu trayectoria de rectángulo y eso va a empezar con un valor de 10. Entonces como puedes ver si hago Shift Command H para deshacerme de esa caja limitadora, puedes ver que ya está redondeada ahí mismo. Entonces lo que voy a hacer es crear un fotograma clave, y lo voy a hacer a un valor de cero. Entonces voy a ir un par de marcos hacia adelante. Entonces voy a hacer de eso un valor de un 100. Entonces ya verás cuando cambie el valor a un 100, hizo redondeadas todas las esquinas, pero es un poco un óvalo y solo puedes volver a él,
y solo seleccionando en el camino, y simplemente ajustando el círculo a cómo lo queremos. Entonces voy a hacer esto tanto como un círculo como
podamos y mirar un poco mejor ahí. Y así ahora podemos ver más o menos, tenemos esta cosa trasladándose a un círculo. Entonces ahora lo que vamos a hacer es ponerle un cambio de posición sobre él para llevarlo a un lugar al que salta, sigue el movimiento de este rectángulo. Entonces lo que voy a hacer es realmente voy a ajustar no la porción final, pero voy a ajustar la parte inicial. Entonces lo que voy a hacer es que voy a hacer que ese círculo de porción inicial comience un poco más en el centro. Entonces, si vuelvo a bajar a ese círculo, esa capa circular original con la que empezamos, y hago clic en “U” para tirar hacia arriba sus fotogramas clave y veo donde empieza la posición. Verás que la posición realmente empieza por aquí abajo. Entonces lo que voy a hacer es que en realidad sólo voy a plantear eso sólo un poquito. Por lo que tenemos la posición empezando un poco más en el centro que en la parte inferior del marco. Ahora, si colapsara mi espacio de trabajo y haga clic en “N” justo por aquí o justo antes, esto se convierte por completo en un círculo y tal vez justo como se convierte un círculo y para ver cuál es la animación áspera que tenemos pasando ahora. Entonces ya ves que casi estamos ahí. Es una de esas cosas para trabajar ahora es donde se puede volver atrás y se puede refinar, ya que lo teníamos a donde era un cambio de escala. Es una cosa tan simple donde puedes volver al original y simplemente podemos eliminar totalmente ese cambio de escala, porque como vamos por más de una animación de looping, no necesitaremos ese cambio de escala. Por lo que ahora verás que este círculo comienza hasta allá abajo. Entonces lo que vamos a hacer es que sólo vamos a mover el círculo hacia arriba a la derecha alrededor de donde comienza nuestro círculo. Este es el círculo inicial y sólo vamos
a fregar por aquí y ver con qué estamos trabajando. Por lo que realmente queremos que este círculo inicial se ponga en su lugar a medida que se remonta alrededor. Entonces ahora mismo debería aparecer. Se desplomó. Veamos qué tipo de animación de bucle tenemos ahora. Por lo que ahora sin el cambio de escala, se
puede ver que realmente bucle bien. Estás siendo capaz de contar la historia. Y tienes tu primera carrera a través de una animación de logo.
13. Exportación y reflexiones finales: Está bien. Entonces, ahora que tenemos nuestra animación todo construida, el último paso es limpiar la composición y luego pasar por la fase exportadora. Entonces, lo que voy a hacer es que sólo voy a limpiar la composición, y una cosa a tener en cuenta es que cómo estamos fijando la duración de la composición en el mismo inicio de la clase. Eso también es algo que puedes ajustar ahora mismo si realmente querías. Entonces, puedo ir “Comando K” y tirarlo hacia arriba. Entonces, lo puse a 20 segundos pero realmente no vamos a pasar los cinco. Entonces, puedo seguir adelante y poner esto a cero seis, y verás que se ajustó a alrededor de seis segundos. Entonces, lo que voy a hacer es que luego voy a ir a aquí y voy a empezar a cortar todo para que todo se aline con este espacio de trabajo que tengo porque sé que ese es el bucle perfecto. Entonces, voy a mantener pulsado “Shift” y el corchete derecho para seguir adelante y cortar eso, y lo mismo con esta capa de aquí abajo. Esto es solo para que todo sea más ordenado si alguna vez tienes que volver y hacer ajustes. Entonces guarde, y ahora cuando exporte, una cosa a tener en cuenta es que la exportación sólo va a suceder dentro del área de trabajo que usted ha establecido. Entonces, si lo pusiera todo el camino hasta aquí, exportaría espacio vacío de nada que pasara. Entonces, queremos asegurarnos de que exporta justo donde eso va a bucle. Entonces, como ese es el bucle perfecto y tenemos el área de trabajo configurada y todo está más limpio de lo que estaba antes, vamos a subir a “Archivo”, vamos a ir a “Exportar”, y vamos a “Agregar a Render Queue”. Entonces, eso levantará otro panel y dentro de este panel, tendrás un par de ajustes. realidad solo hay dos de los que debes preocuparte. El primero es el módulo de salida. Entonces, vamos adelante y hacemos clic en “Lossless”, y vamos a asegurarnos de que sea QuickTime y luego vamos a entrar en “Opciones de formato”. Vamos a entrar en el “Códec de Video” y en realidad vamos a hacer ese Códec de Video Apple ProRes 422. Ahora, lo bueno de Apple ProRes es que se trata de una versión sin comprimir de tu archivo. Entonces, por lo tanto si eres capaz de usar esto o mandar esto a un cliente, podrían usar esto y reexportar y no tener ninguna pérdida de calidad. Esto es algo que normalmente envío a los clientes pero luego también envío un archivo H264 también que es un archivo comprimido que sería bueno para redes sociales y videos o YouTube o Vimeo. Haga clic en “Ok” en eso y luego vamos a hacer la salida también. Entonces, dice “aún no establecido”, entonces lo que vamos a hacer es hacer clic en eso. Entonces, vamos a entrar en esa carpeta maestra que hemos creado. Entonces, Fathom Motion Design, vamos a entrar directamente en eso. Entonces, vamos a hacer otra carpeta llamada Exportar. Escojamos “Fathom Motion Design” y luego pongamos también lo que es. Entonces, vamos a asegurarnos de que sabemos que este es
un archivo de progreso y vamos a seguir adelante y hacer clic en “Guardar”. Entonces, ahora tenemos eso etiquetado, lo
tenemos bajo QuickTime y vamos adelante y hacemos clic en “Render”. Entonces, ahora la animación se renderizará, vamos a saber que está hecho. Entonces, ahora cuando abramos nuestra carpeta, veremos que si entramos en la exportación, tenemos nuestro archivo de progreso de fathom. Podemos seguir adelante y jugar eso y reproducirlo, y verlo. Entonces, eso es todo. Usted vio todo, desde recibir un diseño de un diseñador o un cliente, pasando por el proceso de storyboarding todo el camino a través de la animación, y luego hasta la exportación final para un lockup de animación de logotipo completo. Algo que quiero quitarle a esta clase es que esta es una clase que se puede usar como escalón para realmente poder conseguir los fundamentos
del diseño de movimiento y realmente aprender a transmitir emoción, características, impulso, todo a lo largo de una experiencia de branding. Entonces, si terminas creando algo por tu cuenta usando esta clase, siéntete libre de subirlo a la galería de proyectos para que podamos comprobarlo. Entonces, gracias por unirse a la clase. Espero que de verdad te haya sido útil y estoy emocionado de ver lo que creáis todos.
14. Explora más clases en Skillshare: manera.