Transcripciones
1. Introducción: ¿ Te gustaría aprender a hacer un anuncio animado de historia con estilo? Entonces este curso es para ti. Hola a todos. Mi nombre es Diana Karlova. Soy diseñadora de movimiento con un fuerte trasfondo en videografía. Llevo 10 años en producciones de video en total. En este momento, trabajo con los diferentes equipos internacionales y a veces de manera individual. La animación siempre fue mi principal pasión. Es simplemente increíble que usando la animación pueda crear cualquier cosa que quiera. Puedo compartir mis pensamientos, ideas, ideología, sentido del estilo, y mucho más. Y tú también. Estoy súper emocionado de compartir contigo algunas de mis habilidades y ayudarte a sumergirte en el diseño de movimiento. En este curso, comenzaremos con una tarea sencilla, animación de historia de
15 segundos para Instagram. Este curso es para principiantes, ilustradores, diseñadores, o dueños de negocios que les encantaría saber cómo crear un anuncio corto único y elegante para el Instagram. Esta clase enseñará aquí cómo obtener inspiración usando recursos con contenido visual, cómo crear concepto de diseño para tu proyecto, combinando diferentes ideas inspiradoras, cómo preparar el guión gráfico para tu animación dinámica, y por último, cómo animar la historia de venta para tu Instagram en Adobe After Effects. Creo que el diseño de movimiento solo ganará impulso en el futuro. anuncio animado agarra nuestra atención de la manera más eficaz. Es por ello que las marcas grandes y modernas lo usan. Prueba a crear tus propias historias animadas para promocionar evento o servicio de marca. Empieza con la idea, concepto de tu estilo, crea dinámicas incluso para historia de 15 segundos, aprende técnicas sencillas que podrás utilizar en muchas otras variaciones diferentes. Bienvenido al curso. No puedo esperar a ver tu resultado.
2. Orientación de la clase: Hola amigos, en este curso, les mostraré todo el camino desde el principio, el proceso de lluvia de ideas AL resultado que construyen elegante profesional y transmitirán la idea. Este curso es principalmente para principiantes en diseño de movimiento. Si nunca has intentado trabajar en Adobe After Effects, te
daré algunos conocimientos muy básicos de este programa, y también te voy a inspirar para que continúes con tus aprendizajes. Pasaremos por la etapa de investigación para encontrar inspiración. Porque es diseño de movimiento, buscaremos un concepto de estilo. Para tu clase de proyecto, crearás dos historias diferentes en este curso. El primero es bastante simple, minimalista, y fácil de usar para diferentes propósitos. El segundo es un poco más complicado, pero sabiendo crear tal historia, podrás hacer tantas otras. Simplemente aprende las técnicas, sé creativo y usa tu propia imaginación. Por cierto, no me importa si creas la misma animación que la mía. Se puede copiar y practicar. Pero si tienes tu propio propósito y lo más probable es que sea diferente, por lo que cambiarás algunos detalles como fotos, texto y formas. Además, espero que al usar estas técnicas puedas encarnar tus propias ideas. Trabajaremos en Adobe After Effects y Adobe Photoshop. Es posible que también necesites un bolígrafo y un papel para el proceso de lluvia de ideas. La idea principal para este curso es mostrarte los instrumentos e inspirarte para tu propia creatividad. No puedo esperar a ver estos espléndidos resultados que tendrás.
3. Encuentra la inspiración: Hola chicos. En esta lección, vamos a hablar de encontrar la idea para tu historia animada. La historia es corta, por lo tanto, necesitamos que estos 15 segundos sean brillantes y coloridos, memorables, fáciles de ver y para entregar el mensaje. La idea no siempre cae sobre nuestras cabezas. Podemos crear nuevo concepto usando algo que ya existe e inspira. Podemos juntarlo todo y crear algo completamente nuevo. Empecemos con algunos ejemplos. Aquí, se pueden ver algunas historias industriales con diferentes ideas, propósitos y audiencia potencial. Esta tiene tres fotos, el texto está cambiando, tiene un sitio web en la parte superior y un llamado a la acción que es otra forma de decir, deslizar hacia arriba, descubrir, es realmente genial. Este anuncio es bastante simple en realidad y es realmente genial. Tiene algo de acción, bonitos colores brillantes y mucha información sobre ella. Aparece texto animado con el llamado a la acción, es simplemente perfecto. Este anuncio es una animación súper elegante. No tiene un llamado a la acción. Se parece más a que aquí estamos y aquí está nuestro estilo. Funciona mejor para las grandes empresas pero para los proyectos más pequeños, es mucho mejor decirle al público qué ofrece usando superposiciones de texto. Al igual que aquí, hay mucho texto, lees esto y sabes de qué se trata pero la velocidad de la animación es demasiado lenta. Podemos perder la atención de nuestro cliente potencial durante estos segundos sin muchas acciones. Recuerda, todo se está acelerando hoy en día. Este ejemplo se ve bien y tiene mucho texto pero son sólo dos segundos en lugar de 15. ¿ Por qué no usamos todo el potencial? No llama nuestra atención en una parte particular del mensaje. Similar al ejemplo anterior, se ve bien y la animación es agradable pero son solo unos segundos. El mensaje no está claro. Bueno lo bueno, tiene
es deslizar hacia arriba. Para encontrar algo de inspiración, suelo
ir a Pinterest. Desplazo el contenido hasta encontrar lo que realmente me gusta. Cuando creo un proyecto animado de pico, paso más tiempo en Behance u otros recursos. Pero para el cuento corto, encontraremos un montón de ideas en Pinterest. Esto es lo que buscas estilo en general, paletas de
colores, contenido de video/ animación, collages, fuentes y formas. El contenido que nos inspira. A mí me gusta este estilo, texto de
color parece inusual. Estoy bastante seguro de que puedo usar tal efecto en mi segunda historia y te mostraré cómo. Aquí vemos algunos productos arte, se ve muy inspirador. Esto es un stop motion. Queremos utilizar esta técnica en nuestra animación pero me gusta la idea del movimiento de productos. Podemos usar esto. Este es un gran ejemplo de movimientos y creo que voy a usar ese movimiento. Le añadiré algunas formas y colores diferentes. Para la segunda historia, me gusta mucho esa paleta de colores. Me gustan las formas que usan aquí y la forma en que ponen fotografías en ella se ve increíble. también me gusta este diseño, ilustración en blanco y
negro con un fondo brillante. Aquí tienes una foto en blanco y negro con formas de colores. No estoy seguro de cómo puedo usar algo como esto en mi animación pero este concepto está muy cerca del mío y me gusta mucho, lo cual es importante. A mí me gusta esta planta en la parte posterior y definitivamente voy a usar la flora en mi concepto, esto es increíble. En cuanto a la Skillshare por cierto, con los movimientos de foto y textos, simplemente perfecto. Por último, aquí están mis referencias para la primera animación. Voy a usar carpetas de producto similares a éstas y aquí me gustan los colores y las formas lisas y la fina línea blanca. En este video, me gustan los movimientos de objetos. Voy a tratar de hacer algo parecido. Siguientes referencias son para la segunda animación. Aquí los colores son geniales y una vez más, las fotos combinadas con diferentes formas. A mí me gusta esta idea de diseño. También me gusta esta pequeña planta en la esquina superior izquierda y también voy a dibujar plantas. Aquí podemos ver otras plantas y bonitos colores, me gusta. Antes de pasar a la siguiente lección, encuentra tiempo y haz tu investigación. La inspiración es una parte muy importante
del proceso creativo con la idea del resultado que queremos lograr, es mucho más fácil pasar a nuestra meta. Si ya tienes la idea y todas las referencias necesarias, entonces estás listo para la siguiente lección.
4. Storyboard para anuncios de productos: En esta lección, te mostraré el proceso de creación del guión gráfico. Sí, así es. Incluso durante 15 segundos de animación, es posible que necesites un guión gráfico. ¿ Por qué así? Porque necesitamos crear una animación dinámica que la gente verá de un solo aliento sin pensar en cambiar a la historia de otra cuenta. Crearé tres diapositivas, cinco segundos cada una, y me ayudará a visualizar el proceso. Dibujaré en mi iPad. Se puede dibujar usando iPad, tableta, ratón, o en el papel. Realmente no importa. ¿ Qué es importante? Para dibujar tres rectángulos, es un formato de historia, y para poner texto y objetos en él. Por qué es importante: porque necesitamos tener un concepto antes de empezar a animar. Aquí están los productos que voy a promocionar, y estos son mis principales referencias. Empiezo dibujando la primera diapositiva. Primera diapositiva es el inicio de la animación. Debe captar nuestra atención de inmediato, tener información importante que nos atraiga a seguir vigilando. Aquí, comenzaré con el tipo de logotipo, y el producto aparecerá también en la primera diapositiva. Muestro dirección por flechas. Segunda diapositiva debe contener la información principal sobre el evento, producto o servicio, y ahora aparecerá el producto. [ MÚSICA] O bien tener un texto aquí también: venta, 70 por ciento, y mostré la dirección. Tendré un tercer producto aquí. En los últimos segundos debe tener un llamado a la acción. El modo en que escribes estos puede ser muy diferente. Trata de ser original, simple, claro, y lacónico. O bien tener una superposición de texto al final: comprar en línea y el sitio web. Puede agregar un logotipo y el sitio web en la última diapositiva, y un enlace en el que se puede hacer clic con la opción de deslizar. En realidad es lo mejor. Aquí está. Mi storyboard está listo, y ahora será mucho más fácil animar porque todo está planeado. Pero claro, sigo abierto a cualquier cambio durante el proceso. Ahora, aquí tienes una tarea para ti. Dibuja el guión gráfico para tu propia animación. Planificar todos los movimientos, apariencia de objetos, describir todos los detalles. Cuando tu guión gráfico está todo planeado y cuando tengas la idea de cómo debería funcionar, puedes pasar a la siguiente lección. En el siguiente video, aprenderás a dar vida a tu idea y a crear una animación bastante simple para la promoción de productos. [ MÚSICA]
5. Anuncio de productos: posición, asociación y expresiones: Hola chicos. En esta lección, te
mostraré el proceso de crear un anuncio de historia simple para un producto. Puede ser cualquier proyecto que desee. La idea principal es demostrar el objeto. Todas estas imágenes tienen un fondo blanco. Para mi animación, necesito deshacerme de ella. Empecemos con el producto 1. Para deshacerme de este fondo blanco, usaré la herramienta Varita mágica. Necesito seleccionar fondo blanco y ya está listo. Funciona simplemente a la perfección. Solo necesito apretar el Botón Eliminar, ya está listo. Cuando vemos este tablero de ajedrez en el fondo, significa que no hay fondo en absoluto. Necesito guardar este proyecto como formato PNG. Vamos a nombrar este producto, product_1ready para animación. Hagamos lo mismo con el segundo. También elijo la “herramienta Varita mágica” y selecciono el fondo blanco. Pero aquí, puedo ver algo de rugosidad en esta parte del producto. Necesito cambiar la tolerancia aquí. Probemos 20 y 20 funciona simplemente a la perfección. Aquí hay una selección muy suave. Presiono el Botón Eliminar, y aquí hay un producto. Para eliminar esta sombra, necesito crear una nueva capa y necesito
usar una herramienta Paint Bucket y colorearla con color negro, que necesito empujar en la espalda detrás de nuestro producto principal. Para eliminar esta sombra, utilizaré la herramienta Lazo poligonal. Para eliminar esta sombra, necesito asegurarme de que la capa 1 esté seleccionada. Presione el Botón Eliminar en mi teclado, y aquí está. Ahora ya no necesito este fondo, solo
puedo borrarlo. Por último, tengo un producto sin ningún fondo. Guardo esta imagen como formato PNG. Yo lo nombro productive2_ready to animation, Save. Hagamos lo mismo con el último. Abrimos After Effects. Creamos Nuevo Proyecto, Nueva Composición. llamaremos Story Product Ad. Cambio estos perímetros, 1080 y este 1920, 25 cuadros por segundo, y la duración será de 15 segundos. Aquí tienes un formato para la historia. Vayamos a revisar mi guión gráfico. Empiezo con un logotipo y luego aparecen mis productos. Porque no tengo ningún logotipo específico, creo el mío propio. Yo lo llamaré ella. Usando una herramienta Tipo Horizontal, escribo esta palabra, y aquí, cambio el color. Será gris oscuro, entonces quiero hacerlo más grande. Entonces elijo “Herramienta de selección”. Quiero esta palabra justo en medio de mi pantalla. Podemos ir a estos parámetros, Align. Elijo aquí “Alinear horizontalmente” y “Alinear verticalmente”. Te puedo recomendar encarecidamente que uses rejillas, guías, o reglas. Lo puedes encontrar por aquí, elige y prueba diferentes tipos. Es herramienta muy útil. También hay rejillas que puedes usar para crear geometría decente de resumen. Por ahora, usaré sólo Título/Acción Seguro. Aquí mismo, se puede ver el centro de una pantalla, y aquí, se pueden ver bordes. Es mejor no colocar objetos o textos más allá de estos bordes. Escogeré “Herramienta de tipo”. Voy a cambiar tamaño de mi texto, 150, y escribiré cosméticos en línea. Volveré a cambiar de tamaño porque es demasiado grande. No me gusta esta fuente. Yo quiero más delgada en realidad así que elegiré otra fuente aquí. Yo quiero que este texto esté alineado así que necesito hacerlo un poco más pequeño. Voy a Alinear otra vez y me alineo horizontalmente. Necesito mover este texto un poco más cerca de mi logotipo. Abro los Ajustes, abro Transformar. Aquí podemos ver Posición y dos parámetros; x y egric. Ahora puedo cambiar mis parámetros y mover mi texto. Yo quiero que este segundo texto se conecte al principal. Aquí es muy importante también en Adobe After Effects, es parent pick látigo. Cuando selecciono aquí, necesito arrastrar un mouse o touchpad a la capa que quería estar conectado. Ahora mismo, está conectado. Puedes ver esta información aquí. Yo quiero empezar con el movimiento. Aquí está nuestra línea de tiempo. Abrimos esta configuración. Vamos a la Transformación, y aquí podemos encontrar posición. Para establecer el primer cuadro, necesitamos empujar aquí en un reloj. Tenemos el primer cuadro en el primer segundo. Cuando trabajo este Indicador de Tiempo Actual, puedo elegir otro lugar para establecer su marco. Aquí puedes encontrar zoom para tu línea de tiempo. Quiero poner mi Indicador de Tiempo Actual en un segundo y cambio de posición. Yo quiero que este texto se mueva hacia arriba. Este movimiento es muy robótico. Yo quisiera que este movimiento fuera más suave. Podemos cambiar los parámetros para estos fotogramas clave. Presione el botón derecho y verá este menú donde podrá encontrar Asistente de fotogramas clave. Para el primer fotograma, elijamos “Easy Easy Out” y para el segundo fotograma, elijamos “Easy Easy In”. Ahora vemos que este movimiento es un poco diferente. Para explicarte más, quiero mostrar al Editor Gráfico. Está por aquí. Simplemente empuja este Editor de Gráficos y verá la curva que muestra los cambios de velocidad. Aquí puedes cambiar esta curva y verás cómo cambia el movimiento también. Lento aquí, y es más rápido en el medio, y lento aquí otra vez. Siguiente cosa que vamos a hacer, vamos a sumar nuestros productos. Elegí mis productos aquí y lo arrastro al proyecto. Se pueden ver todos los productos en el medio, pero tienen diferente tamaño. En primer lugar, quiero que tengan el mismo tamaño. Vamos a la configuración del primer producto, vamos a Transformar. Aquí podemos ver Escala. Arrastre este número hacia la derecha y cambiará la escala. Para la primera diapositiva, solo necesito un producto. Ocultaré estos dos y los usaré más tarde. Quiero conectar esta capa a su capa de texto aquí. Este Indicador de Tiempo Actual debe estar justo aquí donde está el último fotograma. Necesito padre esta capa al texto aquí. Para comprobar esto, voy al principio mismo y veo que hay un movimiento. Conectemos el segundo producto aquí. Vamos a encenderlo. Pongo este Indicador de Tiempo Actual al tercer segundo. Elijo el primer producto, y agrego el primer marco para la posición aquí mismo. Mover este Indicador de Tiempo Actual a cinco segundos. Cambio la posición de este producto. Subirá y a la izquierda. El rumbo será así. Quiero cambiar un fotograma clave, vaya al fotograma clave y elija “Easy Easy Out”. Aquí, Asistente de fotogramas clave, Fácil de introducir. Vamos al Editor de Gráficos y vamos a cambiar poco esta curva. Ahora tendrá un movimiento muy bonito. Después muevo mi Indicador de Tiempo Actual al último fotograma y conecto mi segundo producto por parent pick látigo al producto 1. Vayamos al principio y veamos la animación. Genial. Empecemos con este tercer producto y revisemos el guión gráfico. El tercer producto debe moverse a la esquina superior derecha. ¿ Qué hago a continuación? Elijo el producto número 1. Mover mi Indicador de Tiempo Actual a los seis segundos y el fotograma clave aquí mismo. Después muevo mi indicador al ocho segundos y cambio la posición del producto. Lo arrastro hacia arriba y hacia la derecha. No podemos ver nuestro producto, pero aún veo el marco de distancia. Cuando mi Indicador Actual está aquí mismo en el último fotograma, elijo el número de producto 3 y hago clic en el “Padres pick látigo” y lo conecto al producto número 1. Otra cosa que tenemos que hacer para cambiar esta Configuración de fotogramas clave. Vamos al Menú. Elige “Asistente de fotogramas clave”, “Easy Easy Out” y Asistente de fotogramas clave”, “Fácil entrada” aquí, Easy Out, Easy On. Después vamos al Editor de Gráficos y cambiamos un
poco estas curvas para que el movimiento sea más agradable. Vamos a comprobarlo de nuevo. ¿ Qué hacemos a continuación? Necesitamos que este producto vaya a la esquina superior izquierda. Elijo el número de producto 1 y agrego fotograma clave a nueve segundos aquí a 11 segundos. Empuje aquí el Indicador de Tiempo, y cambio la vista. De esa manera puedo ver todo, y cambio la posición del producto número 1 a la esquina superior izquierda. Necesito cambiar Ajustes de fotograma clave. Voy al Asistente de fotogramas clave, Easy Easy Out, y aquí, Easy Easy In. Genial. Voy al Editor de Gráficos y aquí hago el mismo patrón. Voy a agregar texto usando esta Herramienta de tipo y hago clic aquí en el medio. Escribiré comprar en línea. Yo elijo un gris oscuro. Yo cambio el tamaño del mismo, luego voy a Alinear, y lo pongo justo en el medio. También necesito agregar otro texto. Doy click aquí y escribiré el sitio web. Elijo la fuente Evolventa y cambio el tamaño del texto. Quiero mover estas frases por posición. Empuje P en mi teclado. Veo ajustes de posición aquí, y necesito ponerme un poco más cerca para comprar en línea. También quiero poner comprar online un poco arriba. Voy a conectar el sitio web por parent pick látigo para comprar texto en línea. Me muevo comprar en línea y el sitio web se mueve arriba. Cuando el Indicador de Tiempo Actual está en el último fotograma, puedo agregar este texto al número de producto 1. Volvemos atrás y vemos que el texto se mueve también. este momento, quiero agregar Dynamic Damping que
cambiará el movimiento de los objetos y se verá más interesante. Para crear Dynamic Damping, usaré un script. Puedes encontrar este script en tus recursos, guardarlo y usarlo. La amortiguación dinámica también podría utilizarse para transformaciones de escala y rotación. Este guión es muy útil. Empecemos con el texto. Elija la posición y haga clic en el “Alt” de su teclado, y al mismo tiempo, haga clic en este reloj. Ves esta ventana donde puedes poner la expresión Copiándola e Insertar, desplázate hacia arriba. Si quieres saber un poco más sobre la expresión, esta es la explicación de lo que significan estos números. Este script sólo funciona cuando el segundo fotograma como se veía antes. Para ello, necesitamos hacer clic en “Comando” en el teclado y hacer clic aquí dos veces. Ahora vemos la forma anterior de la misma, y se puede ver un pequeño rebote en este momento. También necesito agregar este script al producto 1. Yo copio esto. Doy clic en “Alt” en el teclado y este reloj al mismo tiempo, e inserto esta expresión aquí. También necesito cambiar cada segundo fotograma aquí. Doy clic en “Comando” en el teclado, y hago clic aquí. Para cambiar los parámetros de este rebote, puedes cambiar estos números y experimentar con el resultado. En cuanto a mí, me gusta la forma en que está ahora mismo. Ya hemos cubierto, por lo que muchos aspectos interesantes en este video, intenta repetirlo en tu proyecto usando las mismas herramientas. practicar y siempre funciona muy bien además de reforzar la información recibida. Si ya has descubierto y practicado todas estas técnicas, estás listo para la siguiente lección.
6. Anuncio de productos: paleta de colores, Pen Tool, llenado y pincelada: En esta lección, seguimos creando un anuncio de historia simple para un producto. Ya he cubierto el inicio de este proceso en el video anterior así que veamos qué podemos hacer a continuación. Por ahora, necesito crear una paleta de colores. Lo crearé mediante el uso de la herramienta Rectángulo. Sostengo Shift en el teclado y dibujo un cuadrado, luego cambio el color haciendo clic en “Rellenar”. Aquí puedes elegir cualquier color que quieras o puedes dejarlo caer desde cualquier lugar. También puedes escribir el número aquí. Tengo unos colores particulares de mi referencia por lo que solo lo escribiré aquí. Este es mi primer color. Selecciono este rectángulo y hago clic en “Comando C”, “Comando V”. Nos limitamos a copiar pegar. Entonces abro este rectángulo y puedo encontrar otro dentro así que solo necesito ponerlo aquí. Ahora tengo dos rectángulos. Están justo aquí, uno sobre otro. Solo necesito tomar este rectángulo y arrastrarlo hacia la derecha. Entonces llegué a Rellenar otra vez. Escribiré otro número de mi referencia y voy a Rectángulo, Comando C, Comando V. Tengo el tercer rectángulo que se esconde aquí así que solo lo tomo y arrastre, lo pongo afuera. Tengo tres rectángulos, el tercero está aquí. Solo necesito arrastrarlo a la derecha y voy a Rellenar y la escribir el tercer color. Esta es mi paleta de colores para esta historia. Los colores se ven muy diferentes en combinación diferente. Es por ello que es importante pensar tu paleta para elegir los mejores colores que usarás. Pero para acelerar el proceso, puedes usar las paletas que ya existen. Por ejemplo, para esta historia, decidí usar la paleta para mi referencia. También puedes encontrar un montón de combinaciones en Internet. Ahora mismo, necesito cambiar el nombre de esta capa. Doy clic en “Enter” en el teclado y escribo paleta. Otra gran herramienta que quiero presentarles, es una herramienta Pluma aquí mismo. Este instrumento es uno de los principales en Adobe After Effects. Hay tantas formas de usarlo. Por ejemplo, se puede utilizar para crear una animación fotograma por fotograma. Lo usaré para crear una forma. Antes de esto, asegúrate de que aquí no hay ninguna capa seleccionada. Para anular la selección de esta capa, es
necesario hacer clic en alguna área sin capas. Por ejemplo, abro esta configuración, y puedo hacer clic aquí, entonces crearás una nueva capa dibujando la forma. Si nunca tuviste experiencia en Illustrator, será un poco desafiante para ti porque cuando dibujas con esta herramienta, haces clic y luego arrastras estos manejadores. Puedes cambiar estos manejadores haciendo clic aquí y cambiando la dirección. Voy a Rellenar y elegiré color de mi paleta. También le daré un nombre,
azul 1, y anulo la selección de esta capa. Yo creo otra forma, yo también la nombro azul. Anulo la selección de la capa y dibujo la tercera forma por aquí. Yo lo nombro azul 3. Entonces selecciono todas estas tres capas, y elegiré aquí el color. Será muy útil guardar estas capas en la línea de tiempo. Ahora mismo, necesito arrastrar estas capas detrás de todas las demás. Puedo ver el producto aquí. Necesito encontrar en la línea de tiempo el producto_1. Entonces tomo padre-pick látigo y lo arrastro al producto_1. Significa que estas formas se mueven con el producto. Genial. Ahora dibujaré formas similares para otros dos productos. Cuando uses una herramienta Pluma, puedes mantener presionado Alt en el teclado y verás que el cursor ha cambiado. Puede cambiar la dirección de todos los manejadores cuando comience a arrastrar el punto de anclaje, o puede cambiar solo un manejador. En este momento, tengo formas que están conectadas a cada producto. También añadiré formas en la última diapositiva aquí detrás del texto. Si es necesario agregar otro punto. Por ejemplo, aquí, se ve este plus y se agrega esto. Si necesita eliminar esto, haga clic en “Comando” o “Control” y lo eliminará. También necesito conectar estas tres formas al texto principal en la última diapositiva, que es comprar en línea. Quiero agregar animación a estas formas. Para esto, usaré la herramienta Pluma y tengo que elegir la forma en este panel. Entonces necesito abrir los Ajustes, Contenido, Forma, Ruta. Doy click en este temporizador y configuro el primer fotograma, luego muevo un poco mi Indicador de Tiempo Actual, pero mi forma sigue aquí, y luego necesito cambiar la posición de cada punto aquí. Para ello, necesito hacer clic en “Agregar herramienta de selección” o simplemente en V en el teclado. Cuando ves el cursor así, significa
que puedes elegir un punto en particular y cambiar solo un punto. Ya ves, éste está seleccionado y éste está en blanco. Significa que no está seleccionado. Cambio de posición de cada punto. Incluso puedo mover un poco mangos, y como resultado, veremos algún movimiento. Entonces puedo mover estos fotogramas en la línea de tiempo, la forma en que se puede ver mientras la forma sigue en la pantalla. También copiaré este primer fotograma y lo pondré aquí así tendremos tres cambios. Haré lo mismo con otras formas. En el último fotograma, me gustaría tener más de este amarillo en esta esquina por lo que moveré esto señala el camino para lucir bien. Para que este movimiento de un cuadro a otro sea más suave, necesitamos cambiar los ajustes de este marco para que los seleccione todos. Voy al Asistente de fotogramas clave haciendo clic en el botón derecho y elijo “Facilidad fácil”. Hago lo mismo aquí con la forma de color rosa y con el amarillo. También añadiré algo de movimiento en la última diapositiva. No olvides cambiar la configuración. Vaya a Asistente de fotogramas clave y elija “Facilidad fácil”. Entonces quiero agregar animación a estas pequeñas formas. Te voy a mostrar otra manera para esto. Cuando elijo esta forma, abro Posición Setting, sostengo Alt y doy clic aquí. Aquí puedo publicar o escribir cualquier expresión. Esta vez, escribiré una expresión muy sencilla que llamó wiggle. Cuando empiezo a escribir, se pueden ver sugerencias. Escribiré estos números. También puedes probar cualquier otra cifra. El primer número media frecuencia, y el segundo número significa amplitud. Puedes probar y experimentar con esto. Añadiré la misma expresión para otra forma pequeña. Ahora ya ves, tienen algún movimiento. Haré lo mismo con otras formas pequeñas. Ahora ya conoces otra expresión. Para encontrar más sobre expresiones, puedes hacer click aquí. Es el menú Lenguaje de expresión, y aquí puedes encontrar todas las expresiones posibles. Otra cosa que voy a hacer, me gustaría añadir aquí una delgada línea blanca así que elijo la capa azul. Doy clic en “Comando C” y “Comando V” que es copiar pegar por lo que tengo la misma capa. En la parte superior de esto, voy al Fill y elijo ahora llenar aquí. Después voy al Stroke y elijo el color blanco, y aquí, elijo “Anchos de trazo”. Probemos con cinco. No puedo ver este trazo porque mi capa ya está aquí. Fue copiado y apareció aquí. Ahora mismo, necesito cambiar de posición haciendo clic en “P” en el teclado, y luego lo arrastro hacia arriba. Pero también me gustaría rotarlo un poco. Doy click en la “Capa” y hago clic en “R” en el teclado. Abro Ajustes de rotación y giro cambiando estos números. Debido a que tengo una nueva capa, necesito parent esta capa como yo parent todas las demás formas al producto 4 también. Puedo arrastrar esto o también puedo simplemente elegir aquí “product_1". Pero lo bueno de esto es que este trazo tiene los mismos parámetros que otras formas. Cambia de forma. Añadiré las mismas líneas en otro producto. Es muy importante saber que esta forma tiene un centro y este centro es punto de anclaje. Significa que esta forma gira alrededor de este punto de anclaje, pero también puedes cambiarla haciendo clic en “Y” en tu teclado. Ves que tu cursor ha cambiado, y ahora, puedes cambiar un lugar para este punto de anclaje. Por ejemplo, si lo pones aquí, cuando rotes el objeto o una forma, girará alrededor de este punto de anclaje. Por ahora, se ve genial. Solo necesito agregar algunos detalles para estos textos. Por ejemplo, me gustaría añadir este Desenfoque de Movimiento, y también añadiré lo mismo para este texto. Lo último que me gustaría agregar una sombra para el producto. Voy a Efectos y presets, escribo shadow, y elijo “Drop Shadow” y luego lo arrastro al producto_1. Lo cambiaré como más me guste y cambiará la distancia, opacidad serán 15. También le añadiré algo de suavidad, y le añadiré el mismo efecto a otros. La parte crucial final es agregar la música adecuada a tu proyecto. Encontré esta pista. Voy a utilizar 15 segundos que van realmente bien con esta historia, añadir este tracto a la línea de tiempo. En realidad es un video así que hago click en este “i” y salgo el video. Ahora sólo tengo sonido. Abre esto, voy al audio y a Waveform. Aquí puedo ver estos patrones y es muy útil. Será más fácil encontrar el momento que necesito. Añadiré el fotograma clave al principio y será menos 30. Entonces en unos fotogramas, añadiré un fotograma clave cero. Yo hago lo mismo al final. Para la pista de audio, mejor usar audio sin derechos de autor. Utilizo el sitio web bastante popular, Artlist. También puedes encontrar una buena música de forma gratuita en la Audio Library de YouTube. Aquí está mi resultado final. Hiciste un gran trabajo. No olvides pasar tu resultado. Me encantaría ver lo que has hecho. En los próximos videos, iremos más allá y son una animación un poco más compleja que puedes usar para cualquier propósito.
7. Anuncio de eventos: storyboard: Hola amigos. En este video, te
mostraré mi storyboard para la siguiente historia que crearemos. Mi idea principal es crear alguna animación moderna y colorida. Utilizaré un texto, fotografías, y logotipo que voy a utilizar para promocionar este curso. Veamos cómo podemos ponerlo todo junto. En primer lugar, tengo una lluvia de ideas sobre la idea. Supongamos que quiero informar a los espectadores sobre el curso en Skillshare. Aquí están las frases que voy a usar. Cómo crear historias en After Effects. Toma un curso online con Diana Karlova. Empieza a aprender diseño de movimiento gratis con Skillshare. Por contenido, voy a utilizar fotografías. Tengo algunas fotos de una sesión de fotos. Solo necesito elegir las que tengan el ánimo apropiado para mi idea. Decidí usar fotografías personales porque muestra la personalidad, y tal apertura atrae más a la gente. También tengo un concepto de estilo. Esta es mi paleta de colores, y hay algunas ideas de otras imágenes de Internet, y ahora empiezo a dibujar mi storyboard. Tengo tres rectángulos y por supuesto, uso los mismos principios que ya abarcamos en la Lección 4. Aquí estará mi foto número 1. Cambiará la escala de toda la pantalla al tamaño más pequeño. Entonces tendré texto, “cómo crear historias en After Effects'”, y también añadiré plantas en las esquinas. Tendrán algunos movimientos, y cómo se moverá diapositiva hacia la derecha. Mi segunda diapositiva también tendrá una fotografía, y también tendré un texto, “Tome curso online con Diana Karlova”. Se trata de un llamado a la acción muy específico. Aquí también agrego plantas y algunas formas en la parte superior. Todas estas diapositivas se moverán hacia abajo. En la tercera diapositiva, tendré otro llamado a la acción. Aquí va a estar foto de mí que también cambiará el tamaño. En la parte inferior tendré plantas que tendrán algunos momentos también. Aquí tendré un logotipo de Skillshare y tendré un texto, “empieza a aprender diseño en movimiento gratis con Skillshare”. Es un gran gatillo de forma gratuita. La frase de búsqueda tiene más detalles y en este momento, puedo agregar el enlace a una fuente web concreta, por ejemplo, Skillshare. Puede tener un enlace clicable con estas cinco opciones. Entonces aquí hay tres principios que son muy importantes. Mi primera diapositiva llamará la atención. Por lo tanto, persona puede entender de inmediato el valor de este contenido por su propio interés. Segunda diapositiva contendrá la información principal sobre el evento, y la última diapositiva tendrá otra llamada a la acción. Cuando hayamos planeado todo el proceso, podemos avanzar a animar en la siguiente lección. Nos vemos ahí.
8. Anuncio de eventos: máscaras, Pen Tool y Alpha Matte: Hola. En esta lección, crearemos animación con textos,
fotografías, y formas para la primera diapositiva de nuestro anuncio. Ya creé un storyboard en mi lección anterior, así ya tengo todo lo que necesito, es momento de iniciar el proceso. Empezamos con la creación nueva composición. Yo le doy un nombre, Anuncio de Evento. Cambio los parámetros al formato de historias, fotogramas de 25, y la duración 15 segundos. Después caigo más al proyecto y cambio de tamaño haciendo clic en “S” en el teclado. Entonces también necesito cambiar de posición, hago clic en “P” en el teclado y lo arrastro hacia la izquierda. También encenderé Title/Action Safe para que pueda ver mejor la composición. También necesito arrastrar mi punto de anclaje a este centro de la imagen. Necesito hacer clic en “Y” en el teclado y arrastrarlo al centro. Ahora, añadiré algo de texto por Herramienta Tipo Horizontal y escribiré mi texto en diferentes capas. Después anula la selección de la capa, luego escribo Para crear, en la siguiente capa, Historias, y luego anula la selección de la capa, En After Effects en la última. Ahora tengo cinco capas de texto. Necesito tenerlos en el centro de esta pantalla,
entonces, ¿qué hago a continuación? Doy clic en “Y” en el teclado y pongo este punto de anclaje aquí en el centro y en la parte inferior. Hago lo mismo con cada capa. Ahora cuando tengo este punto de anclaje en el medio, puedo seleccionar todas las capas de texto y puedo ir a Alinear ajustes y Alinear horizontalmente. Doy clic en “P” en el teclado y lo arrastro al centro. Me gustaría agregar patrones de color a mi animación de texto como en este ejemplo, pero quiero que estos colores se muevan. Elijo la Herramienta Rectángulo y la sostengo abajo, aparecen
estas diferentes formas. Elijo Ellipse Tool, y cuando no tengo ninguna capa seleccionada, dibujo elipse manteniendo pulsado Shift en mi teclado para tener un círculo. No necesito un trazo para esto, así que escribo cero, y necesito cambiar relleno. Escogeré otro color de mi paleta de colores. Entonces necesito añadir más puntos suspensivos para crear un movimiento, en la máscara para estos textos. Todas estas elipses tendrán unos colores diferentes a los de mi paleta de colores. Por fin tengo siete elipses. Les daré un nombre. Es importante nombrar tus capas en el gran proyecto. Será simplemente más fácil para ti trabajar con las capas más adelante. Añadiré algo de movimiento a estos círculos. Porque quiero agregar marcos a su rotación, necesito que roten alrededor de su eje. Doy clic en “Y” en el teclado y arrastro este punto de anclaje en algún lugar cercano al centro de estas elipses. Después hago clic en “R” en el teclado y agrego marco de rotación. Doy click en el temporizador al primer segundo y aquí está el marco. Después muevo mi indicador de tiempo hasta el final, y escribo aquí tres. Este número significa tres rotaciones alrededor de su eje durante ese periodo de tiempo. Haré lo mismo con otras elipses. También puedo escribir menos tres, lo que significa otra dirección. Ahora vemos estos movimientos. Quiero estar seguro de que he cubierto todas las letras durante esta moción, por lo que también añadiré una gran elipse, y la pondré detrás de todas las demás elipses. Están geniales. Después selecciono todas estas capas, estas elipses, y hago clic en botón derecho y en este menú elijo Pre-componer. Escribo el nombre de la nueva capa precompuesta. Usaré esta capa como máscara para mi texto. Lo pongo detrás de los efectos de texto. Entonces voy al Track Matte, está justo aquí, y elijo aquí Alpha Matte. Ahora ya ves, como resultado, este texto es coloreado y estos colores tienen nuestros movimientos. Selecciono esta capa, Elipsis, y la copio y pego por Comando C, Comando V, luego la arrastro debajo de esta capa de texto. Voy al Track Matte, selecciono No Track Matte primero porque es una copia, y luego selecciono Alpha Matte en después. Ahora vemos que funciona. Hago lo mismo con todas las demás capas. En consecuencia, tenemos esta maravillosa animación de texto. Ahora, voy a añadir animaciones a cada capa por separado, así que empiezo con cómo? Doy clic en “S” en el teclado, y al hacer clic en el temporizador, pongo primero fotograma, luego lo muevo un poco a la derecha y escribo aquí cero. Voy a usar expresión que ya cubrimos en la lección de animación anterior, la misma amortiguación dinámica. Puedes encontrar este script en los recursos. Doy click al temporizador sosteniendo Alt, y aquí agrego el guión. Comprobemos cómo se ve. Me encantaría hacerlo un poco más rápido. Cerraré mi línea de tiempo y la pondré aquí. El primer fotograma, hago clic en botón derecho y elijo Asistente de fotogramas clave, Easy Out. A mí me gusta más este movimiento. Haré exactamente lo mismo con todas las demás capas de texto, pero aparecerán una por una. Esto es lo que parece, algún tipo de escalera hecha por fotogramas clave, y este es el movimiento. Genial. Quiero agregar movimiento para esta imagen, así que necesito seleccionar todas estas capas de texto con sus máscaras también y para partenarlo a su imagen principal. En el momento en que aparece el texto, quiero cambiar la escala de esta imagen. Por lo que hago clic en “Escala” en el teclado, luego agrego un fotograma clave en unos fotogramas, hago menos esta escala. También añadiré amortiguación dinámica al parámetro de escala. Haga clic en “Temporizador” con la sujeción Alt, y lo copio y pego por Comando C, Comando V. Luego hago clic en el Asistente de fotogramas clave y elijo Easy Easy Out en el primer fotograma, y hay un movimiento. Escojo Herramienta Rectángulo y cuando
se selecciona esta carpeta usando estos marcos de selección de teselas, empiezo a dibujar un rectángulo. De esta manera, esta herramienta de rectángulo funciona como máscara para esta fotografía. Genial. Ahora mi cuadro cambió de forma. Quisiera cambiar este fondo blanco por el amarillo. Cuando no hay ninguna capa seleccionada, empiezo a dibujar un rectángulo por Herramienta Rectángulo y tengo una nueva capa. Entonces cambio el relleno. Será amarillo de mi paleta de colores. Escribiré nombre, fondo. Elegí el color, y arrastro esta capa detrás de todas las demás. Genial. Ahora usaré Pen Tool y voy a dibujar bolígrafos solo usando esta herramienta. Si empiezo a dibujar en un nuevo punto en otra forma, tendré todas las formas aquí en el contenido. Cuando elijo mi planta, puedo cambiar el relleno o puedo cambiar el relleno de cada forma por separado. Mi planta está lista. Simplemente lo haré un poco más pequeño. Doy clic en “Y” en el teclado y muevo este punto de anclaje hacia abajo. Significa que esta planta girará alrededor de este punto. Pongo mi indicador de tiempo al último fotograma de movimiento. Después voy a la configuración de rotación de la planta haciendo clic en “R” en el teclado. Pongo el marco aquí. Vuelvo a este cuadro anterior y voy a la planta y pongo otro marco aquí pero cambio la rotación; lo giro a la izquierda. Entonces agrego expresión de amortiguación dinámica, una retención Alt en el teclado y lo copio y pego. También cambiaré este fotograma clave a Easy Easy Out, y ahora vemos que aparece mi planta. Entonces selecciono esta capa y la copio y pego y tengo la absolutamente similar. Yo solo quiero cambiar la posición para hacerlo un poco más pequeño. También cambiaré el relleno. Iré a cambiar esta forma, así que elijo nuevamente la Herramienta Pluma y selecciono la Planta 2, y luego solo edite esta forma. No quiero que sean absolutamente similares. Me gustaría agregar algunas plantas por aquí. Nuestros primeros cinco segundos de animación están listos. Prueba todos estos métodos en tu proyecto. Haz una pausa si lo necesitas o fíjate una vez más para descifrar todas las técnicas. Son realmente básicos e importantes. Practica tu nueva habilidad. Tan pronto como estés listo para continuar, únete a mí en la siguiente lección. Nos vemos ahí.
9. Anuncio de eventos: animación de textos: En esta lección, seguimos creando animación corta para la historia de Instagram. Ya creé la primera diapositiva. Empecemos a crear el siguiente. Ahora, quiero que esta primera diapositiva vaya a la derecha. Será transición a la segunda diapositiva. Para ello, necesito asegurarme de que todas mis capas estén conectadas a este fondo amarillo. Necesito conectar esta fotografía al fondo. También necesito conectar estas plantas. Cuando mi temporizador está justo aquí, elijo la posición de fondo, hago clic en P, configuro aquí el fotograma clave. Después muevo mi indicador de tiempo a la derecha, y cambio la posición, lo muevo a la derecha. Simplemente cambiaré este primer fotograma clave por el asistente de fotograma clave botón derecho. Escogeré fácil facilidad fuera. También añadiré mi expresión favorita a esta moción, que puedes encontrar en recursos. Sostengo Alt
y hago clic para posicionar, y lo copio pego por
comando C, comando V. Al final de este movimiento aquí mismo, quiero tener alguna parte de este fondo amarillo justo aquí. Tomo la herramienta de lápiz y hago clic aquí, y mantengo pulsado Shift, click aquí. Significa entonces seleccioné estos dos puntos y sosteniendo Shift, lo arrastro hacia la izquierda. Significa que tendrá líneas rectas. Si no sostengo Shift, será así. También quiero tener aquí un fondo gris oscuro. Elijo herramienta de rectángulo, cuando no hay capas seleccionadas, empiezo a dibujar un nuevo rectángulo y cambio el relleno, entonces puedo encontrar mi nueva capa. Yo lo llamé el fondo gris, y puse este fondo en la parte posterior de todas las capas. Este será el fondo de mi segunda diapositiva. Entonces elijo un látigo de pick parent y lo conecto al fondo amarillo. Significa que también se moverá. El siguiente paso, inserto mi segunda fotografía. Necesito cambiar el tamaño. Doy clic en S y luego arrastra estos números. Cambio el nombre de esta imagen y también
usaré una máscara que ya cubrimos en el video anterior. Elijo herramienta de rectángulo. Cuando se selecciona esta capa, empiezo a seleccionar la parte de la imagen que usaré. Entonces tomo padrino pick látigo y lo arrastro hasta el fondo gris. Ahora se mueve con el fondo gris. Si bien aquí puedo ver esta línea blanca, significa que necesito cambiar una forma. Ya sabemos hacer esto. Simplemente elijo la herramienta de bolígrafo. Selecciono este punto, y luego los selecciono, sosteniendo Shift, y luego lo arrastro. Genial. Utilizo el tipo 2 para la redacción del texto. Escribo tomar en línea, luego selecciono todo, y luego cambio el color. Ya está lista la primera frase. Entonces anulo la selección de las capas y empiezo a escribir curso. Será la segunda capa. Esta tercera capa será con Diana, y la última capa será Karlova. Necesito alinear todas estas frases. Empezaré con el primero. Será más fácil alinear a este título las líneas seguras de acción. Por lo que solo selecciono mi texto y muevo su posición. Entonces selecciono esta capa y cambio el tamaño. El siguiente capa, por supuesto, muevo a la derecha. Selecciono todas las letras y lo haré más grande que la tercera capa. Me paso a la derecha. Escogeré fuente más delgada en la última capa. A pesar de que también lo hago un poco más grande, voy a tratar de que sea ligero. Al final los apartaré el uno del otro porque ahora están demasiado cerca. También puedo experimentar y elegir la última capa y cambiar la [inaudible]. Cuando estamos en la segunda diapositiva, necesitamos este texto aquí arriba. Usaré la máscara para el movimiento del texto. Elijo herramienta de rectángulo, y cuando no se selecciona ninguna capa, empiezo a dibujar un rectángulo sobre el texto, lo
llamaré forma 1. Necesito poner esta capa antes de tomar en línea. Aquí, dije Alpha mate forma divertida. Selecciono tomar en línea y hago clic en B en el teclado, y configuro el fotograma clave de posición aquí. Entonces muevo un poco este indicador de tiempo a la izquierda. Yo muevo mi texto hacia abajo. Entonces copio de nuevo mi expresión favorita, sostengo Alt. Abro expresiones de posición y lo pego aquí. Ahora ves que el texto aparece con una amortiguación dinámica. Haré lo mismo con otras frases. Genial, pero me encantaría que estas frases aparezcan
una por una así que necesito crear algo como letra aquí. Mi segunda frase debería aparecer un poco más tarde, y la tercera frase debería aparecer más tarde que la segunda, y muevo también la última. Por ahora me gustaría agregar planta aquí, y un par de formas aquí. Copio y pego esta capa. Entonces muevo esta capa hacia arriba, porque será simplemente más conveniente para mí usarla aquí. Borro todos estos marcos. Abro ajustes de posición haciendo clic en P, y lo muevo hacia abajo, hago clic en R y lo giro. Después hago clic en rotación y configuro el primer marco, y luego roto esta planta así. También agrego mi expresión favorita, sostén Alt y lo pego aquí, rotación. Genial, también añadiré la segunda planta aquí, una pequeña y otra grande. Siguiente paso, selecciono estas capas y las conecto al fondo gris. Ahora vemos que se mueve con el fondo. Pero, también vemos estas plantas por aquí y no necesitamos que estén aquí. Sólo necesitamos cortar estas capas, y debe comenzar justo en esta posición. Para ello, tomo esta capa y la arro a este marco o solo puedo usar teclas de corte en un teclado. Entonces quiero que aparezcan aquí algunas formas así que selecciono herramienta de lápiz y empiezo a dibujar un triángulo. Entonces empiezo a dibujar elipse y otra diminuta. Me gustaría usar la misma máscara [inaudible] para mis formas. Encuentro la capa de esta elipses y la copio pego por comando C, comando V. Luego la arrastro hacia arriba y cambio la posición de esta capa. Doy clic en P en un teclado y lo pongo aquí, por lo que cubre mis formas. Lo puse detrás de todas mis capas de forma. Aquí, elijo sin mate de pista por ahora. Entonces necesito darle un nombre a mis capas. Entonces elijo estas elipses y elijo aquí Alfa mate a triángulo. Copio pegar esta capa y la arrastra. Elijo sin mate de pista, y luego elijo Alpha mate al círculo 2, y hago lo mismo con el último. Ahora todas mis formas, tienen esto [inaudible]. Por supuesto, tengo que seleccionar todas estas formas y elipses. Selecciono padrino pick látigo y lo arrastro hasta el fondo gris. Añadiré aún más movimiento. Elijo círculo 1, luego hago clic en Y y arrastro mi punto de anclaje al centro de esta forma. Hago lo mismo con otro círculo y con el triángulo. Después selecciono primer círculo y hago clic en S en el teclado. Cuando mis plantas tienen animación en los mismos marcos de tiempo, agrego fotograma a la escala, y hago lo mismo con otro círculo y con el triángulo. Establecí un fotograma clave, luego muevo mi indicador de tiempo hacia la izquierda, y establecí escala cero a todas las formas, y copio pegar mi expresión de amortiguación dinámica favorita. También puedo poner estos marcos a diferentes posiciones, no al mismo tiempo. Tendrá un movimiento aleatorio. Entonces selecciono triángulo, y me gustaría agregar algo de rotación. Doy clic en Shift y R en el teclado, así que tengo ajustes de rotación aquí mismo. Doy click al temporizador, configuro el primer fotograma. Después muevo indicador de tiempo al último segundo, y escribo dos. Selecciono esta capa y la copio pego. Ahora vemos que está justo aquí así que necesito hacer clic en P en el teclado y moverlo a la derecha. No podemos ver esta forma porque aquí no hay ojo. Doy click una vez y ahora podemos ver. Voy al relleno, selecciono ninguno relleno, y luego cambio el trazo, escribo cinco. Ahora vemos que se mueve juntos. Simplemente lo voy a poner atrás y también abro ajustes de rotación. Otra cosa que haré, voy al último fotograma y escribo aquí menos dos. Se moverá a otra dirección. A estas formas, añadiré otra expresión que ya usamos. Se trata de una expresión de movimiento. Doy clic en P en un teclado y sostengo Alt, y escribo aquí moviendo dos y cuatro. Hago lo mismo con el círculo 2, meneo 2, 4. Ahora vemos que todos tienen algunos movimientos. Hemos hecho la segunda diapositiva, y se ve realmente genial. Espero que estén disfrutando el proceso tanto como
yo y emocionado por completar nuestra animación. Cuando hayan practicado lo suficiente, todas estas técnicas, y estén listas para la parte final, invito a la siguiente lección.
10. Anuncio de eventos: transiciones.: Bienvenidos a la parte final. En esta lección, crearemos la última diapositiva y fusionaremos las tres juntas. Tendrá una transiciones orgánicas. Para la tercera diapositiva de esta animación, moveré todo desde aquí hacia abajo. Para ello elijo mi fondo principal, que es amarillo porque todo está conectado a este fondo. Pero antes de esto, tenemos que estar seguros de que todo esté conectado. Por ejemplo, necesito revisar todas las capas, y aquí veo que mis capas de texto no están conectadas. Voy al enlace de padres y elijo aquí fondo. Después abro los ajustes de posición, y hago clic en P en el teclado, y configuro un marco. Después muevo el indicador de tiempo y muevo el fondo hacia abajo. Este fondo de capa ya tiene una expresión de posición. Tendrá un rebote. Me acabo de poner en el primer fotograma clave y elijo
fácil, apaciguar y los pongo un poco separados. Cuando este fondo baja, inserto mi tercera fotografía y cambio su escala. Doy click en S y elijo la mejor báscula que necesito. Podría necesitar también cambiar su posición, mantengo presionado Shift y hago clic en P en el teclado por lo que
tengo ajustes de posición y escala abiertos aquí. Cambio el nombre de mi imagen y elijo la herramienta de elipse. Crearé una máscara para esta fotografía pero no hay ninguna capa seleccionada. Empiezo a dibujar un círculo, así que tengo una nueva capa de forma llamada máscara para foto 3, abro escala haciendo clic en S y también moveremos este
punto de anclaje un poco hacia arriba por lo que estará en el centro de este círculo. Pongo el primer fotograma clave, cambiaré el tamaño del fotograma clave así y luego muevo el indicador de tiempo y lo hago más pequeño. Entonces voy a la foto y elijo un mate de pista aquí, Alpha Mate “Máscara para foto 3.” También añadiré amortiguación dinámica a este cambio de escala. Ve a la máscara, hago clic aquí, sostengo Alt, y doy clic aquí y lo pego aquí. Por supuesto, elijo el primer cuadro y elijo fácil, fácil fuera. Otra cosa que tengo que hacer, tengo que elegir estas capas máscara para foto y foto 3 y parent estas capas a su fondo amarillo. Ahora cuando volvemos, todo
se mueve juntos excepto que no necesitábamos esta imagen para estar aquí en las diapositivas puras así que voy a mover un poco esta máscara en este momento. Abro posición y pongo aquí el fotograma clave, luego me muevo a la izquierda y muevo su posición. Cambio primer fotograma clave para facilitar la salida, y cambio el segundo a fácil, facilidad de entrada y hago clic en U en el teclado y todos mis parámetros, puedes ver aquí. Ahora puedo tratar de moverlo un poco y ver cómo se ve. Quizás cuando la imagen cambie su tamaño más tarde sea realmente mejor. A continuación, voy a añadir un fondo amarillo debajo de esta fotografía, elijo herramienta de rectángulo. En primer lugar, elegiré un color. Cuando no hay ninguna capa seleccionada, empiezo a dibujar rectángulo. Yo lo llamo segundo fondo amarillo, y lo muevo debajo de la fotografía. También necesito conectar esta capa
al fondo amarillo principal y tengo que comprobar cómo se ve en la diapositiva anterior. Simplemente voy a añadir unos marcos a su posición. Doy clic en P en el teclado. Después voy a este momento y pongo primero cuadro aquí, y luego vuelvo y lo muevo hacia arriba y cuando pase por todos los fotogramas, puedo ver algunos momentos a través de esto aunque, solo lo muevo y pongo el siguiente fotograma y también lo moveré un poco aquí abajo y aquí arriba. Cuando configuras todos estos fotogramas, significa que puedes controlar todos los movimientos del objeto. Lo último para hacer perfecta esta transición, necesito deshacerme de esta casa aquí mismo, bajo a la rejilla y fondo amarillo. Cambio su forma sin ningún marco, solo elijo herramienta pluma y selecciono este punto, y mantengo pulsado Shift y selecciono este punto y luego lo arro hacia arriba, manteniendo el turno. Volvamos atrás y comprobemos. Entonces haré lo mismo con este fondo amarillo. Selecciono este punto, mantengo pulsado Shift, selecciono este segundo punto, y luego arrastro estos dos puntos sosteniendo Shift hacia arriba. Increíble. Ahora tiene una transición perfecta. El siguiente paso, voy a crear círculos alrededor de esto. Tomo herramienta de elipse y cuando no hay capas seleccionadas, dibujo una nueva elipse. Después voy a la configuración de relleno, hago clic aquí y elijo, no relleno, y luego elijo un color de trazo. Escojo color de mi paladar, cambio su ancho. Entonces llamo a esta capa círculo 2, y copio y
pego este círculo, cambio su posición, hago clic en P y lo pongo aquí, escojo otro color de mi paladar y cambiaré un poco su ancho, luego copio pegar esta capa otra vez y elijo color blanco, y voy a hacer esta línea muy delgada. También cambio la posición. Selecciono estas cuatro capas y ahora necesito ponerlas detrás de mi fotografía. A pesar de que el trazo blanco me pondré encima. Ahora quiero que estos círculos tengan un ligero movimiento. Abro posición y hago clic en Alt y agrego expresión wiggle. Sí, creo que 2, 10 luce bien. Hago lo mismo con otras dos capas, moviendo 2, 10 y aquí posicion moviendo 2, 10. Entonces no debería olvidar seleccionar estos tres círculos y conectar esto al segundo fondo amarillo. Necesito cambiar la escala de este círculo blanco, abro escala y pongo el primer cuadro aquí, y vuelvo a la línea de tiempo y aquí pongo otro fotograma y cambio su escala. Ahora veo que sería más rápido así que muevo este cuadro a la izquierda y necesito agregar la misma expresión de amortiguación dinámica. Después vuelvo a la diapositiva anterior para revisar todo y aquí veo esta línea blanca. Necesito cortar esta capa desde aquí. Debe comenzar a partir de este momento. Desecho esta capa, o simplemente puedes tomar este borde y arrastrarlo hacia la derecha y cuando volvamos, aquí no
hay línea. A continuación voy a la diapositiva anterior y selecciono esta planta. Lo encuentro aquí en la línea de tiempo y lo copio pego. Es justo aquí así que tomo esta capa y la pongo aquí, y la muevo en la línea de tiempo. Tendré esta planta en la última diapositiva. Abriré posición, escala y rotación, manteniendo turno. Ahora solo trabajaré con esta configuración. Quiero que el sujeto repita el mismo patrón de rotación. Ahora tengo dos marcos. Selecciono el primer cuadro y lo pongo aquí. Estos marcos son los mismos y éste en el medio es diferente. Entonces elijo todos estos fotogramas y hago clic en botón derecho, y elijo asistente de fotogramas clave, facilidad fácil. Entonces voy a la rotación y tengo aquí Alt y escribo otra nueva expresión para ti, será loop out. Estos marcos están demasiado cerca, así que sólo los pondré lejos el uno del otro. Tendrá un movimiento lento. Genial voy a hacer más de estos planes y vamos a cambiar algunos de sus ajustes. A mí me gusta la forma en que se mueven ahora mismo, y solo quiero ponerlos detrás de esta foto así selecciono todas las plantas y luego las arrastra hacia abajo. Ahora aparecen en la foto. Lo último que voy a hacer con esta historia, solo
necesito agregar el tipo de logotipo de SkillShare y agregar un texto. En Internet, encontré un logotipo tipo de SkillShare. Se trata de un formato PNG. Significa que no tiene antecedentes. Acabo de arrastrar esta imagen, pondré aquí. Después tomo un tipo 2 y escribo empiezo a aprender. Será la primera frase, cambiaré a negrita. También voy a cambiar un poco el tamaño. Entonces escribo la siguiente frase, hashtag motion design. Tomo esta frase y la pongo abajo, y luego escribo la tercera frase. Será de forma gratuita. Ahora solo necesito agregar animación a estas frases. Utilizo la herramienta de rectángulo y luego dibujo dicho rectángulo. Yo cambio el relleno, no importa de qué color sea. Después elijo comenzar a aprender y voy a la pista mate y elijo Alpha mate, luego voy a la posición y configuro el marco. Después me muevo por la línea de tiempo a la izquierda y bajé mi frase. Entonces copio script, rebote expresión y lo pego a la posición. Yo muevo marco un poco y tengo este movimiento, entonces solo necesito hacer todo lo mismo con otras dos capas. terminé con las frases y el último paso será movimiento para el SkillShare y será súper fácil. Simplemente elijo la SkillShare, luego hago clic en Posición y configuro mi fotograma clave y vuelvo a la línea de tiempo y se irá a la izquierda y copio expresión,
mantengo Alt, abro posición, expresiones y lo pego a la posición y tendrá tal moción. Lo último que necesito hacer,
voy a agregar algunos triángulos aquí y capa de texto deslizar hacia arriba. Yo elijo herramienta de bolígrafo. Antes de empezar a dibujar, tengo que estar seguro de que no hay ninguna capa seleccionada, empiezo a dibujar triángulo justo en el centro de la pantalla. Entonces lo nombro flecha 1. Doy clic en S y cambio su tamaño. Después hago clic en B y luego lo arrastra hacia abajo. Entonces copio y pego esta flecha y hago clic en B y arrastro flecha 2 hacia arriba y copio pegarlo de nuevo y hago clic en B y arrastro flecha 3 hacia arriba. Después tomo el tipo 2 y escribo swipe hacia arriba, hago clic en P, y lo pongo en el medio. Después selecciono deslizar hacia arriba y lo conecto a la flecha 1, escojo flecha 2, flecha 3, y lo conecto a la flecha 1 también. Después hago clic en posición en el teclado y configuro el primer fotograma para la flecha 1, luego muevo indicador de tiempo, y muevo su posición, y el siguiente fotograma será el mismo que el primero. Entonces selecciono todos los fotogramas. Voy al asistente de fotogramas clave y elijo facilidad fácil y sosteniendo Alt, abro expresiones de posición y luego escribo aquí, loop y elijo aquí loop out. Yo uso esta expresión. A ver. Selecciono todas estas capas y yo [inaudible] desde el principio. Por último, tengo el resultado que quería, y refleja totalmente mi idea. Espero que hayas seguido todo el proceso y ahora estás realmente emocionado por crear tu propia animación. Por favor, publique sus animaciones y siéntase libre de hacer preguntas. No puedo esperar a ver lo que creas. También tengo un aguinaldo para ti. En el siguiente video, te mostraré cómo puedes mejorar tu resultado mediante el
uso de las mismas técnicas sencillas. Nos vemos ahí.
11. Reflexiones finales e inspiración: Enhorabuena, acabas de terminar la clase, la lograste. Ahora conoces un poco más sobre las técnicas básicas de diseño de movimiento. Quiero mostrarte alguna animación y darte pistas de cómo
crear sitios mediante el uso de las técnicas que cubrimos en esta clase. Para tal historia, necesitarás animar tu texto para crear un fondo tan coloreado, usar la herramienta Rectángulo y la animación de posición. Entonces puedes agregar videos en lugar de agua y usar máscaras. También puedes añadir fotogramas clave para la trayectoria de la máscara. Aquí utilizan animación de posición para objetos en formato PNG. También usan máscaras para las fotos en el fondo y animación de posición de texto. Aquí puedes ver animación de posición de imágenes en formato PNG. Los objetos tienen un hermoso movimiento que puedes editar en Editor de gráficos. También hay una animación de texto mediante el uso de máscaras. Esta forma en el fondo, igual que hicimos en un anuncio de producto, esta imagen también tiene una máscara. Para tener tales resultados, puede establecer fotogramas clave para la posición de la máscara. Aquí, vemos animación de escala y expresión de
amortiguación de rebote para el texto de entrenamiento con la pequeña amplitud. También hay máscaras para alguna animación de texto, y este círculo tiene fotogramas clave de posición. Para algún texto, usan efectos que simplemente puedes encontrar en el efecto Animación de texto. Espero que viendo estos ejemplos, te hayas dado cuenta de que usando las mismas herramientas simples, puedes crear tantos proyectos diferentes en Adobe After Effects. Muchas gracias por seguir mis lecciones. Espero que te diviertas viendo estos videos y experimentando con tu proyecto. Siéntase libre de hacer preguntas. Yo estoy aquí para ayudarte con ello. Lleva tus proyectos y obtén retroalimentación. Cuando compartes tus proyectos, inspiras a otros por su creatividad. Tendrás comentarios de personal directamente de mi parte, y también puedes tener un feedback de la comunidad de Skillshare. Avicio y Lester dice de nuevas ideas creativas. Muchas gracias por estar conmigo en estas clases y nos vemos en la siguiente clase.
Diana Charles, Motion designer | Videographer
