Transcripciones
1. Introducción: Motion Graphics toma mucho tiempo para hacer, y cada vez que quieres reutilizarlos, te encuentras necesitando ajustar tus animaciones. O quieres hacer una plantilla para vender en un mercado para ganar un dinero extra como creativo. Bueno, si ese es el caso, quieres asegurarte de que tu plantilla sea lo más fácil
posible de usar y al mismo tiempo también de que no puedan cometer ningún error. Eso es exactamente con lo que me encantaría ayudarte. Hola, me llamo Jordy. Soy cineasta, editor de video, artista de motion graphics, poquito de todo y lo hago junto con mi equipo aquí en Cinecom. En su mayoría hacemos videos de YouTube sobre edición de videos y fabricación de películas a una audiencia de más de 2 millones de suscriptores en YouTube. Ahora he creado toda una biblioteca de plantillas que utilizamos a diario en nuestros videos. Estos van desde tercios más bajos hasta tarjetas de redes sociales o una animación outro en la que podemos agregar comentarios de nuestro público. Lo único que tenemos que hacer es arrastrar y soltar las
plantillas personalizadas en Premiere Pro y cambiar algunas configuraciones. Esto nos ahorra una enorme cantidad de tiempo. En esta clase, te voy a enseñar a crear tipo de plantillas de gráficos animados tú mismo dentro de Adobe After Effects, que se pueden exportar para hacer uso de dentro de Adobe Premiere Pro. Vamos a trabajar con variaciones para que el usuario final tenga múltiples opciones. Esto a menudo se crea con expresiones, que va a ser una gran parte de esta clase. Aparte de eso, también aprenderás a construir
correctamente tus plantillas teniendo en cuenta al usuario final, cosas como automatizaciones y objetos enlazando para dar más flexibilidad en tus plantillas. Bueno, eso suena muy complicado se podría pensar, bueno, absolutamente no. Estas cosas avanzadas como expresiones y todo, en realidad
son muy fáciles. Solo necesitas empujar en la dirección correcta y estás bien para ir. Ahora sin embargo es recomendable que sí conozcas los conceptos básicos de Adobe After Effects. A pesar de que tengo toda una clase de principiante aquí en Skillshare también, a la
que dejaré un enlace en la descripción de la clase si te interesa. Ahora, realmente espero que te inscribas a esta clase porque estoy súper emocionado de
empezar a hacer plantillas gráficas en movimiento dentro de Adobe After Effects junto contigo. Empecemos y nos vemos de vuelta en la siguiente lección. Gracias por ver.
2. Crear una plantilla: Hola allá, ni siquiera te vi. Qué increíble que te hayas unido a la clase. Estoy súper emocionado de empezar. Soy como un chico de plantillas. Todo en mi vida son plantillas, y de esa forma puedo ahorrar tiempo. Por ejemplo, esta camiseta, esta es mi camiseta del lunes. También mi camiseta del martes, y mi miércoles y el resto de la semana. Me ahorra tiempo. ¿Sabes qué? Empecemos, chicos, porque estamos aquí para ahorrar tiempo. Aquí mismo, estoy dentro de Adobe Premiere Pro, y lo primero que quiero mostrarte es cómo funcionan realmente estas plantillas. Voy a ir rápido por esto porque voy a asumir que ustedes sí conocen los conceptos básicos tanto de Premiere como de After Effects. Podemos ir en la parte superior aquí, seleccionar “Ventana”, y desde ahí elegir “Gráficos Esenciales”. Desde la pestaña Navegar en la parte superior, podemos elegir una plantilla. Ahora probablemente vas a ver algunas plantillas más aquí porque con la instalación de Premiere, obtienes un montón de plantillas. No me gustan esos, así que simplemente los eliminé, pero aquí hay uno que he creado yo mismo, y solo puedo arrastrar eso a mi línea de tiempo para empezar a usar. Básicamente esta plantilla aquí es un tercios más bajos. En realidad puedo, desde la pestaña Editar aquí arriba, luego desde los Gráficos Esenciales, puedo elegir qué jugador quiero. Jordy es el equipo rojo y Yannick, mi colega, es el equipo azul. Podemos elegir si eso tiene que mostrarse en el lado izquierdo o en el lado derecho. Podemos cambiar el número aquí de la cantidad de victorias, por ejemplo, una victoria, se puede ver ese cambio por aquí, y tenemos algunas opciones más. Todo esto aquí ha sido creado dentro de Adobe After Effects. Podemos usar cualquier tipo de funcionalidad, cualquier tipo de efecto, y llevar eso a Premier a través de estas plantillas de motion graphics. Ya sabes qué, déjame borrar este ejemplo y vamos a
entrar en After Effects y mostrarles cómo funciona exactamente esto. Vamos a crear algo muy sencillo. Voy a ir a mi Herramienta de texto y solo teclear nombre de usuario, quizá pueda hacer eso un poco más pequeño, como así y colocar eso aquí en la parte inferior. Si estás haciendo terceros cielos bajados, asegúrate de habilitar las áreas Seguras de Título y Acción, para que puedas posicionar tus textos a cualquiera de estas pautas. Simplemente se siente o se ve mejor que si pegaras uno de tus textos contra la frontera aquí de tu Lienzo. Al lado de eso, quiero tener una imagen la cual tengo aquí en mi carpeta de Activos, Jordy, que soy yo, y sólo voy a colocar eso aquí junto al nombre de usuario. Tenemos una imagen, un icono de la persona, y ahí podemos teclear el nombre de usuario, esa es la idea. Ahora vamos a crear algunos efectos o animaciones también. Solo voy a desactivar por ahora las áreas de Título/Acción Segura. Por ejemplo, mi imagen de Jordy, solo
hagamos algo muy rápido aquí con esta escala. Sólo voy a dejar que eso se escale de 0-24 así, ¿y sabes qué? Para el texto, voy a revelar a cada personaje. Ahora para hacer eso, en realidad tenemos algunas opciones de animación. Si ampliamos capa, podemos ver aquí en el lado derecho Animate, estas son todas propiedades que podemos estimar. Por ejemplo, la Opacidad. Todas estas propiedades también vienen un Selector de Rango, y con eso, podemos animar la Opacidad por personaje. Pongamos la opacidad a cero porque eso es lo que queremos lograr. Ahora podemos animar el Inicio, y puedes ver aquí que revelará cada personaje por separado. Hagamos eso desde el principio aquí, Jordy keyframe avanza un poco en el tiempo, y llevemos eso a 100. Lo que tenemos en este momento es esto. Animación muy sencilla. Pero hagamos una cosa más, chicos. Añadamos un efecto de glitch a todo el diseño. Ahora en lugar de agregar ese efecto de glitch a las dos capas, voy a crear una nueva capa de ajuste desde el menú aquí arriba. Ahora con esa capa de ajuste, en realidad
podemos agregar muy fácilmente el efecto de glitch a esa. Voy a tomar el VR Digital Glitch y aplicarlo a la capa de ajuste, y de esa manera se aplicará a todo lo que hay debajo. Animemos también ese efecto. Para empezar, voy a animar la Semilla Random, que va a asegurarse de que la falla se esté moviendo, y también voy a animar la Amplitud Maestro, que es básicamente un toggle para poner el efecto encendido y apagado. Cuanto más amplitud, más glitch tenemos, si es cero, no vemos el fallo. Estas son dos grandes propiedades para animar. Con tener aquí ambas animaciones seleccionadas de los controles de efectos, ahora
puedo presionar la tecla “U” de mi teclado para revelar aquellas que he habilitado. Vamos un poco adelante en el tiempo, en algún lugar aquí tal vez, y voy a llevar la Semilla Aleatoria en una nota a algo así como 50, y la Amplitud Maestra a cero. Lo que tenemos en este momento es que tenemos este fallo aquí mismo ya que la animación también viene de la imagen y del nombre de usuario. Convertiremos esto aquí mismo en una plantilla para que podamos usar ese insight Premier Pro. Ahora para poder hacer eso, tenemos que traer una nueva ventana. Vamos a ir al menú Ventana en la parte superior y localizar los Gráficos Esenciales. Ese es el mismo panel que insight Premier, sólo que aquí se ve un poco diferente. El primero que quieres hacer es seleccionar una composición que quieras hacer una plantilla fuera. En este caso va a ser nombre de usuario. Sólo tenemos una composición. También puedes darle un nombre a eso si quieres. Simplemente voy a dejar eso a tus plantillas de nombre de usuario. Ahora en realidad podemos empezar a arrastrar propiedades en esta ventana, propiedades que queremos que cambie el usuario final. Si no sabes qué propiedades son compatibles, realidad
puedes hacer clic aquí en este botón, que dice Solo Supported Properties, y eso revelará todas esas propiedades que podemos usar. Eso es un poco demasiado, sólo
voy a derrumbar eso otra vez. También podemos buscar esas propiedades nosotros mismos por supuesto. Uno de los grandes consejos que puedo darles chicos es cuando se trabaja con capas de ajuste, una manera muy fácil de activar ese efecto en lo suficiente es simplemente agregar la propiedad de opacidad de esa capa de ajuste. Hagámoslo. Voy a ir a mi Capa de ajuste, arrastrar la propiedad Opacidad y arrastrarla al panel Gráficos esenciales. Esto simplemente pondrá la opacidad de esa capa desde el 0-100 y todo en el medio, que es ir a alterar el efecto que nos hemos aplicado a eso. Eso se puede ver aquí mismo. Voy a arrastrar eso a 0, el efecto glitch se ha ido. Llamemos a esto Efecto Glitch. De esa manera el usuario final sabe que podemos controlar el efecto final de eso. Ahora claro chicos, esto no es tan fácil de usar, más adelante en esta clase vamos a ver cómo podemos trabajar con casillas de verificación, lo cual va a ser mucho más conveniente para el usuario final, pero eso va a requerir algunos más avanzados pasos. Por cierto chicos, cualquier cosa que pongan en esta ventana
aquí mismo va a ser el valor por defecto. Si quieres que el Efecto Glitch esté activado por defecto, entonces solo tienes que aumentar eso a 100. También voy a arrastrar la imagen a esta ventana. Simplemente puedes arrastrar por completo esa capa al panel Gráficos esenciales, y eso me permite cambiar la imagen o el avatar. Chicos, si esto no te funciona, asegúrate de simplemente actualizar tus After Effects y Premiere, porque esta es una de las últimas características de los programas de Adobe. Por último, quiero asegurarme de que podemos cambiar la fuente Texto de esta capa aquí, el nombre de usuario. Arrastremos eso a este panel también. Dale un nombre, por ejemplo, Nombre de usuario, esta es la etiqueta, y también puedes darle a eso un nombre predeterminado. De nuevo, llamemos a eso Jordy, porque ese soy yo. Una opción interesante aquí es con textos y eso es Editar Propiedades. Si haces clic en eso, puedes darle algunas opciones más al usuario final. Si quieres que puedan cambiar la fuente, el tamaño de
la fuente y todo, puedes habilitar eso aquí mismo. Si no quieres eso entonces no habilites eso, claro. Por ahora, habilitemos eso para que veas cómo se ve eso. Ahí vamos. Estas son las opciones extra que estás dando con el usuario final también. Esto es más o menos eso chicos. Ahora llevemos estas plantillas a Premier Pro. Hit “Exporta plantillas de gráficos en movimiento”. Sí. Se desea guardar el proyecto. Siempre hay que hacer eso antes de una exportación. Ahora tenemos un par de opciones. En realidad podemos guardarlo a nuestras bibliotecas, que es una opción dentro de las Nubes Creativas. Normalmente solo me gusta guardarlo en mi disco local, eso depende de ti. Hagámoslo así. Puedes hacer clic en “Browse”, para guardar eso en una ubicación diferente, pero solo mantengamos eso en la carpeta Lecciones, que también son los chicos de carpeta que puedes descargar de los proyectos de clase aquí en Skillshare, creo, esa manera también tienes acceso a todos los archivos de proyectos que estoy creando
aquí mismo en After Effects así como a las plantillas que estoy cada vez de exportar. Eso es todo. Golpea “OK”, y ahora probablemente les va a dar una advertencia chicos. Eso es por la fuente que estoy usando. Estoy usando la fuente Arial Black, y está diciendo: “Oye, esto no es una fuente de Adobe”. Lo que significa que si vas a hacer una plantilla y lo vas a hacer, digamos que vendamos eso en un mercado, eso significa que mucha gente está haciendo uso de esas plantillas. Pero si estás haciendo uso de fuentes de Adobe, eso sincronizará automáticamente. Porque suponiendo que si tienes Adobe Premiere Pro o After Effects , también
tienes Creative Cloud, y eso viene con una biblioteca de fuentes. Puedes comprobarlo aquí en tu aplicación de escritorio de Creative Cloud. Aquí están todas mis apps que tengo instaladas. Pero aquí arriba, puedes hacer clic en “Fuentes” o aquí en “Examinar fuentes” para buscar más y sincronizarlas o instalarlas en tu computadora. Estoy usando algo fuera de Adobe, pero no lo veo como un gran problema, porque estoy usando Arial Black, que es una fuente predeterminada que todo el mundo debería haber instalado en las computadoras. Sólo algo a tener en cuenta, chicos, no solo empiecen a descargar cualquier tipo de fuentes de Internet, siempre piensen en su usuario final. Vamos a darle “OK” por ahora, y eso es todo. Está guardado por lo que ahora podemos volver a subir a Adobe Premiere Pro. Vamos a ir a la pestaña Navegar, porque aquí fuimos a instalar esa plantilla, que podemos hacer desde el botón de abajo, Instalar plantilla de gráficos animados. Entonces simplemente localiza ese archivo de plantilla que acabamos de exportar, que está justo aquí. Golpea “Abrir” y se agregará a tu biblioteca. Ahora chicos, muy interesante es que esta plantilla siempre estará ahí dentro de Premiere Pro. Esto no está fijo a tu proyecto, por lo que si estás abriendo un nuevo proyecto en el futuro, esa plantilla seguirá estando ahí. Eso hace que sea muy conveniente trabajar con. Ahora sólo podemos arrastrar eso a la línea de tiempo, y tengo este clip de acciones de este hombre aquí que se está revelando. A lo mejor una gran manera de trabajar con sus tercios más bajos para mostrar el nombre de usuario de este tipo. Pero de todos modos, si seleccionamos ese archivo de plantilla y vamos a la pestaña Editar desde los gráficos esenciales, ahora
podemos ver todas esas propiedades que hemos
dado con la plantilla de motion graphics dentro de After Effects. Podemos activar y desactivar el Efecto Glitch aquí, como puedes ver, así
como cambiar el avatar simplemente
haciendo clic aquí en el menú y arriba y decir Reemplazar desde Explorer, y en realidad tengo aquí en mi carpeta de Activos una foto de Yannick, mi colega también. Solo seleccionemos esa. Aquí puedes ver que simplemente reemplazará la foto por eso. Súper comodidad. Por supuesto que podemos cambiar el nombre de usuario a Yannick, y si lo deseas también cambia las fuentes y el tamaño y todo si así lo deseas. Pero eso es básicamente, chicos. Para esta lección, solo quería darte ese flujo de trabajo, la visión general de lo que es una plantilla en realidad y cómo funciona. partir de las próximas lecciones, vamos a sumergirnos en técnicas más avanzadas y empezar a trabajar con expresiones, que básicamente está programando dentro de After Effects, lo que nos permite crear plantillas más fáciles de usar como casillas de verificación menús
desplegables y todo, que va a ser realmente genial. Estoy súper emocionados chicos. Muchas gracias por mirar, y nos vemos en la siguiente lección.
3. Expresión 'If Else': Vamos a hacky, chicos. Vamos a escribir códigos de programación justo dentro de Adobe After Effects, que no suena tan ilegal como lo es. Ahora, estos códigos se llaman expresiones, y pueden automatizar ciertas cosas para nosotros. Para darles una idea, chicos, lo que tengo aquí mismo es un gran texto de título que está animado en la propiedad de escala. Ahora, quiero que este texto también rebote. Ahora, puedo seguir adelante y crear ese manual con cosas como los fotogramas clave y todo, pero también puedo usar una expresión muy simple. Ahora bien, si vas a nuestra página web, tenemos un artículo sobre expresiones. Te dejaré un enlace en las notas de la clase, pero verás si te desplazas hacia abajo en esa página que realidad
puedes encontrar algunos de estos fragmentos de código. No hace falta saber nada sobre estos códigos. Simplemente puedes seguir adelante y simplemente copiar esos códigos para la expresión de rebote. Ya ves, eso es lo que quiero lograr. Simplemente pulsa “Control C”, y volvamos a After Effects. Ahora bien, el código está escrito en propiedades específicas, en este caso, la propiedad scale. Para escribir códigos dentro de esa propiedad de escala, lo que tienes que hacer es simplemente mantener presionada la tecla Alt y luego hacer clic en el Cronómetro, y aparece un nuevo cuadro de texto donde podemos escribir esos códigos de expresión en. Simplemente borra todo ahí dentro y pega esa expresión que obtuve de nuestros sitios web, y eso es todo. Cuando ahora voy a reproducir esta expresión, verás que el texto grande está moviéndose o rebotando en los extremos mismos. Eso es lo que hacen las expresiones. Ahora, las expresiones también nos pueden ayudar a que ciertas plantillas sean más fáciles de usar. Al igual que hemos visto en la lección anterior, utilizamos un deslizador para controlar un efecto. Bueno, esta vez, vamos a crear una casilla de verificación. Simplemente agreguemos de nuevo ese mismo efecto de glitch al texto así, y animemos el Random Seed desde cero hasta los extremos hasta el 100, que
así tengamos este glitch pasando todo el tiempo sobre el gran título. Queremos que los usuarios puedan encender y apagar eso. Ahora, para hacer eso, necesitamos una casilla de verificación que también se pueda encontrar dentro de la biblioteca de efectos. Bajo Controles de expresión, podemos encontrar un montón de efectos que no hacen nada. Sólo son controles tontos; eso es todo. Pero con algunas expresiones, podemos hacerlos hacer cosas mágicas. Debajo de ahí, podemos encontrar ese Checkbox Control. Ahora, solo podemos seguir adelante y arrastrar eso a la capa de título grande, pero siempre sugeriría trabajar con una capa de controlador. Justo mucho mejor en tu flujo de trabajo. Yo sólo haría un hábito de eso porque una vez vas a trabajar con múltiples capas y todo, esa capa de controlador sólo te va a dar una mejor visión general de lo que estás haciendo. Vamos al menú en la parte superior, selecciona Capa, Nuevo. Yo sólo voy a tomar los Objetos Nulo, que también es sólo un objeto tonto nada. No hace nada. Voy a renombrar eso a Controller. Esta va a ser la capa a la que voy a aplicar todos
estos efectos de control de expresión a gustar la casilla de verificación. Arrastremos eso al Controlador, y eso es todo. Apenas la casilla de verificación. Simplemente comprueba eso o D comprueba eso. Eso es todo. Ahora, también podemos darle a ese efecto un nombre diferente pulsando la tecla Retorno. Ahora llamemos a esto efectos de Glitch. Ahí vamos. Ahora, volvamos al gran título, y voy a expandirme y buscar el efecto Glitch, que está aquí mismo. Sabemos que tenemos esta amplitud Master la cual
podemos usar para habilitar o desactivar esos efectos. Vamos a escribir una expresión sobre la amplitud Maestro, y esa va a ser la expresión If Else que viste del título de esta lección. Ahora, la expresión If Else es probablemente con la que más van a trabajar, y por eso también quiero que ustedes sepan realmente escribir ese código. Si Else, ¿cómo funciona eso? Bueno, si marcamos la casilla de verificación, entonces las amplitudes Master pueden ser de 100 o los efectos pueden estar presentes. Si no seleccionamos la casilla de verificación, entonces no queremos ver los efectos de glitch, entonces la Amplitud Maestro va a ser cero. Es así de sencillo. Si esto, entonces aquello. Si eso, entonces esto o esto, entonces aquello y esto. Solo lo estoy complicando ahora mismo. Sólo empecemos. Para empezar a escribir expresiones, vamos a tener que Alt click, pero primero chicos, también
voy a traer los efectos de casilla de verificación aquí en mi controlador porque voy a necesitar eso para escribir la expresión. Volvamos a la amplitud del Maestro. Golpea “Alt”, y da click en el Cronómetro. Puedo borrar el código, sea lo que sea que esté ahí porque vamos a empezar y escribir algo nuevo. En realidad vamos a escribir si, así que sólo vamos adelante y escribimos que si. Ahora, abramos los dos paréntesis y entre estos dos, vamos a escribir la declaración, entonces ¿qué pasa si. ¿ Qué tiene que ser si? Bueno, si esa casilla de verificación, así que vamos a usar esta pequeña herramienta de látigo de pick que no tengamos que escribirla realmente. Nos lo va a escribir automáticamente. Si vamos a usar esa herramienta pick látigo aquí desde el controlador de expresión hasta la casilla de verificación, ves aquí, va a escribir este código para nosotros, que simplemente significa, “Oye, esa casilla de verificación”. Tenemos la casilla de verificación, así que si eso está marcado, ahora para conducir eso, vamos a escribir doble igual. Ahora, la razón por la que escribimos doble igual es porque sólo vamos a comprobar cuál es el valor. ¿ Está comprobado o no está comprobado? Eso es lo que estamos haciendo ahora mismo. Si sólo usaríamos un igual, entonces vamos a guardar variables en eso. Eso es para más adelante en esta clase, así que no te preocupes demasiado por eso todavía. doble es igual a uno. Se quiere decir que está comprobado. Cero significa que no está comprobado. Es así de sencillo. También se podría escribir verdadero o falso. Eso también es una posibilidad, pero me gusta trabajar con uno y cero. Eso también funciona muy bien. Tenemos las declaraciones entre dos paréntesis. Ahora, vamos a escribir lo que tiene que pasar. Para ello,
vamos a trabajar con el punto y coma, que es esta pequeña figura de aquí, y que también tiene que parar en algún lugar. Ya podemos seguir adelante, poner algunos espacios ahí dentro y escribir el segundo punto y coma para cerrar eso. Siempre quieres abrir algo y cerrarlo de nuevo. Entre estos dos, vamos a escribir lo que tiene que pasar, o simplemente en otras palabras, el valor que tiene que estar dentro de las amplitudes Master. Podemos simplemente seguir adelante y escribir 100 aquí. Se va a usar 100 y ponerlo ahí dentro. Es así de sencillo. Ahora bien, ¿qué tiene que pasar si ese no es el caso? ¿ Y si no se marca la casilla de verificación? Bueno entonces, tiene que ser cero, claro. Vamos a escribir justo después de ese punto y coma ahí, de lo contrario, ¿qué más? Entonces otra vez lo mismo, abre el punto y coma. Vamos a escribir cero ahora,
y otra vez, cerrar el punto y coma. Ahí vamos. Si la casilla de verificación es una o está habilitada, entonces el valor en la amplitud Maestro tiene que ser 100. Si ese no es el caso, de lo contrario, entonces el valor tiene que ser cero en las amplitudes Master. Es así como podemos escribir una expresión If Else. Esta es la base, y vamos a ver más adelante en esta clase también, cómo vamos a utilizar este código para hacer muchas más cosas porque en lugar de 100, también
podríamos darle una acción completamente diferente a esta expresión, pero esto es por ahora. Vamos a hacer clic lejos de esto, seleccione nuestro Controlador. Ya verás si tenemos la CheckBox D marcada, no
tenemos los efectos de glitch. Si lo comprobamos, sí tenemos los efectos de glitch. Mira eso. Vamos a plantear el panel de gráficos Essential, que está aquí mismo. Voy a seleccionar la composición If Else. Sólo voy a arrastrar esa propiedad checkbox ahora a esta Ventana aquí mismo. Se le puede dar un nombre, por ejemplo, efectos de glitch. El usuario final tendrá ahora un botón de encendido muy fácil para activar y desactivar eso. Es así de simple, chicos. Podemos seguir adelante y exportar esto de nuevo a Premier Pro y usarlo allí, pero esta es la expresión If Else. Esperemos que esto fuera un poco claro. Definitivamente asegúrate de practicar eso un poco en ti mismo antes de ir a sumergirnos en las próximas lecciones porque vamos a trabajar mucho más con estas expresiones. Muchas gracias por mirar, y nos vemos en la siguiente lección.
4. Diseñar un tercio inferior: Hola, mi nombre es, y mi profesión lo es. Ya ves que estoy ahorrando tiempo aquí, ya ni siquiera tenía que decir mi propio nombre. Solo estoy usando una plantilla para eso, algo que creé de vuelta en los días y ahora solo lo estoy reutilizando. Creo que esta cosa de la plantilla está empezando a aclararse. Vamos a crear un tercio más bajo, chicos, igual que lo que acaban de ver. Estoy dentro de Adobe After Effects aquí mismo. Lo primero que voy a hacer, que ya se ha habilitado que veo aquí es mi título, zona
segura, que puedes hacer desde aquí. Vamos a crear algo divertido. Vamos a crear primero un fondo. Yo sólo voy a tomar la herramienta de rectángulo aquí arriba, y voy a dibujar un rectángulo como este. Este va a ser el fondo para el texto de mi nombre. Así que asegúrate de estar organizado también y simplemente cambia el nombre de tus capas de texto. Por ejemplo, este es el nombre de fondo rojo. Agradable, vamos a crear una animación para eso para la propiedad de posición así que aquí mismo en algún lugar, donde termine la animación. Entonces haz un fotograma clave para eso, retrocede en el tiempo, ahora empujémoslo hacia la izquierda. Ahí vamos. Ahora ese rectángulo entra de este lado, se ve muy bien. Ahora asegúrate de trabajar siempre con chico de fotogramas clave suaves. Asegúrate de que el fotograma clave final aquí, haz clic con el botón derecho en él, y dirígete a tu asistente de fotogramas clave y elige facilidad de entrada fácil, la animación está llegando así que de esa manera ahora tenemos una animación suave en marcha. Cosas muy básicas. Duplicemos esa capa para añadirle un efecto extra. Ahí vamos, y voy a renombrar ese top aquí a fondos blancos porque voy a cambiar el color de ese rectángulo a blanco. Ahí vamos. Ahora aquí hay algo interesante cuando vamos a compensar la capa superior aquí por un par de fotogramas, verás que ahora tenemos esta animación en marcha, donde tenemos este rectángulo rojo aquí en la parte inferior revelándose, tan poco tinte extra a eso. Se ve bien. Ahora también vamos a crear un nuevo campo de fondo para la profesión o los subtextos. Al igual que antes solo duplicar una de estas capas, puedes hacerlo por cierto pulsando “Control D” o “Comando D” en tu teclado si estás trabajando en un Mac. Voy a arrastrar esta capa aquí hasta abajo,
pulsa la tecla “U” de tu teclado para revelar
los fotogramas clave y si te paras en alguno de estos y seleccionas todo el resto, lo que puedes hacer ahora es en realidad tomar esa capa y arrástrala a un posición diferente, pero también asegúrate de que los fotogramas clave vienen con él. Ahora si mantienes presionada la tecla de mayúsculas a medida que la mueves, se bloqueará a un eje determinado, en este caso, el eje y por lo que solo tira de eso un poco hacia abajo, así. Esto va a ser, voy a renombrar eso a los subtextos fondo rojo. Nuevamente, duplicar esa capa, y ésta va a ser la blanca, así que vamos a renombrar eso a fondo blanco. Cambia el color de eso a blanco, ¿y sabes qué? Sólo para tener alguna diferencia aquí, voy a bajar esta capa así y esta vez compensar la capa roja en lugar de la blanca. Ahí vamos. Ahora tenemos esta animación pasando aquí, y para que se vea aún mejor, primero
vamos a revelar el nombre y luego los subtextos. Entonces toma estas dos capas aquí y muévalas un poco más a la derecha, así. En primer lugar entra el nombre, y después la profesión, luciendo preciosa. Pero para estar aún más organizado dentro de tu tercer diseño inferior, lo que yo también haría es darle diferentes colores a mis etiquetas. A los de aquí arriba, tienen colores azules aquí estas etiquetas, ¿y sabes qué? Para un subtexto, en realidad podemos darle a eso un color diferente, por ejemplo, naranja, [inaudible] saber manera que podemos ver claramente estas son las capas para el subtexto y estas son para los textos principales. El motivo por el que me parece tan importante estar organizado es porque estás haciendo una plantilla y tal vez en un par de meses
quieres hacer ajustes a esa plantilla, por lo que quieres volver al proyecto y entender lo que has estado creando esos dos meses atrás. Agarremos ahora la herramienta de texto y empecemos a escribir el texto, el tenedor del lugar. Para el top, ese va a ser nombre, ahí vamos. Voy a cambiar el color de eso a rojo quizá, ahí vamos. Hazlo un poco más pequeño, y voy a alinear eso aquí mismo junto a esta pauta. Ahora aquí hay algo súper importante, chicos, cuando están diseñando plantillas, que tener en cuenta que los campos de texto van a cambiar. Eso significa que si voy a teclear aquí en lugar de llamarme Yannick, que es mi colega, verás que ya no se alineará con la pauta de izquierda. Eso se debe a que mi alineación está mal configurada. A lo mejor eso no importaría en absoluto si solo estás trabajando con un texto fijo, si estás creando plantillas, es algo a tener en cuenta en todo momento. Por lo que bajo el párrafo panelado aquí, asegúrate de alinearlo al lado izquierdo porque también
tenemos un tercio inferior en el lado izquierdo. Ahora podemos arrastrar esa capa de texto aquí a la directriz de la izquierda, y si voy a volver a cambiar ese texto a su nombre, verán que empezará desde esa pauta de izquierda. Por ahora a los subtextos, creemos una nueva capa de texto y llamemos a este subtexto, hagamos de éste tus blancos, ahí vamos, y tal vez,
tal vez cambiemos un poco la fuente en lugar de Arial Black hacer esto audaz para que no sea demasiado audaz como el negro. Escala D eso para que quepa en el subtexto. Pero algo a tener también en cuenta chicos es lo que tus capas de fondo. Si por ejemplo, tienes a alguien con un nombre de profesión muy largo, ten eso en cuenta también porque si vamos a empezar a escribir en esta capa aquí, y va más allá de ese fondo, ya no se ve tan bien. Piensa en la palabra más larga que jamás vas a usar o tu usuario final podría estar usando y asegúrate de tener algo de espacio con tus capas de fondo. Ahora antes de que me vayas a sacar la pregunta, ¿puedo también hacer mi escala de capa de fondo con el texto? Bueno, sí. Pero es un poco complejo e implica algunas expresiones más complejas, y por eso tengo una lección separada para eso más adelante en esta clase. Por ahora, solo vamos a diseñar esto con un fondo fijo, el tamaño en mente. Vamos a nombrar esto de nuevo al subtexto, ahí vamos. Ahora vamos a crear también una animación de texto, y lo que tengo en mente es que cuando este bloque de aquí entra y está cubriendo los rojos del mismo color del texto, entonces
podemos revelarlo. Eso lo voy a hacer con una máscara, quizá desactive ahora el área de acción segura del título porque ya no lo necesitamos. Empecemos por crear una máscara en su punto final. Simplemente haga clic aquí bajo “Herramienta Rectángulo”, pero se asegura de tener seleccionada su capa de nombre. Arrastremos una máscara alrededor de ella y asegurémonos de que sea
lo suficientemente larga para que no corte nada por nombres largos. Tengan eso en mente, chicos, siempre lo hacen. Ahora volvamos a donde está terminando la animación en algún lugar justo aquí, y voy a alinear mi máscara junto a esa línea. Algo así. Ahora tomemos el camino de la máscara porque eso es lo que vamos a animar, y vamos a ir con ese par de marcos de vuelta a aquí y mover la máscara todo el camino de vuelta también. Ahora, porque tenemos ese fotograma clave suave, la facilidad fácil de seguir con los fondos. También queremos hacer eso probablemente aquí mismo, porque de lo contrario, se
puede ver aquí que la animación de la máscara y el rectángulo no se alinean. Haga clic derecho aquí el último asistente de fotogramas clave y elija facilidad fácil en y ahora sí coinciden. No tiene por qué ser perfecto porque tenemos este bloque de rectángulo rojo, sólo lo
estamos cubriendo. Esto se ve bien, se está revelando ahora por atrás. Hagamos lo mismo para los subtextos, creemos un rectángulo de máscara sobre él así. Asegúrese de alinear eso. Crear un fotograma clave para la trayectoria de máscara. Vuelve atrás en el tiempo, donde ese rectángulo está fuera del encuadre así, y mueve esto todo el camino hacia la izquierda. Ahí vamos. Haga clic con el botón derecho y elija “Fácil entrada”, y ahora también se está revelando este subtexto. Ahora una última cosa que hacer y que es habilitar el desenfoque de movimiento para todas estas capas. Para mirar eso, nos tenemos una animación muy moderna y de aspecto ajustado tercio inferior. A este me encanta. Ahora, como dije antes, cuando estés haciendo plantillas, ten
siempre en cuenta cada opción que el usuario pudiera querer cambiar. Cuando estoy pensando en tercios inferiores, también
estoy pensando en la posición de esos tercios inferiores,
por lo que en este caso está sentado en el lado izquierdo. Pero ¿y si tienes a tus sujetos también sentados en el lado izquierdo y quizás quieras tener tu tercio inferior en los lados derecho? Demos esa opción al usuario final. Vamos a crear un menú desplegable donde puedan elegir si tiene que pegarse en el lado izquierdo o derecho. Ahora, para poder hacer eso, vamos a tener que crear nuestro tercio inferior también en el tamaño correcto. Sí, podemos seguir adelante y seleccionar todas las capas aquí dentro y decir 'Control C, Control V' para hacer una duplicación directa de eso. Desafortunadamente, no hay control de interruptor para hacer que cambie automáticamente. Vamos a tener manualmente dirigir eso para sentarse en los lados derecho. Si bien ahora estoy cambiando todos esos fotogramas clave manualmente para que provenga del lado derecho. Es algo a tener en cuenta también, es que tu texto también necesita unas nuevas alineaciones. Eso significa que vamos a ir al párrafo ahora mismo y cambiar la alineación a los lados correctos, así, y simplemente llevar esto de vuelta a los derechos. Lo mismo para el nombre a los lados derechazos y traer eso de vuelta a los derechos. Lo último que tengo que hacer es simplemente cambiar la animación de los caminos de la máscara. Ahí vamos. Si ahora reproducimos esto de nuevo, podemos ver que tenemos un tercio inferior en ambos lados, que podemos usar como plantilla. Ahora bien, ¿cómo vamos a darle la opción al usuario final de alternar entre estos dos? Lo primero que voy a hacer es solo agrupar estos dos tercios inferiores juntos, que va a ser un pre-comp. Selecciona todo desde el lado derecho, haz clic con el botón derecho y elige precomponer. Vamos a llamar a eso la animación de los derechos. Golpea “Ok”, y entra lo mismo para el otro, haz clic derecho, precomponer y llama a esta animación izquierda. Tenemos dos capas ahora mismo. Si no vamos a ir a la propiedad de opacidad, podríamos crear una expresión para traer la opacidad desde 0-100 para habilitar o desactivar cada una de esas capas. Como hemos visto anteriormente, vamos a crear un nuevo objeto nulo y vamos a llamar a ese controlador. En ese controlador, voy a aplicar algo llamado menú desplegable, que también es un efecto de control de expresión. Ahí vamos, dirígete a los controles de efectos y
vamos a ir a editar aquí desde las propiedades del efecto. Simplemente eliminemos uno de estos ítems con el menos en la parte superior y cambiemos los otros nombres. El primero se va a dejar y el otro va a tener razón. Después golpea, “Ok”, así que tenemos dos elementos en mi menú desplegable, izquierda y derecha. Con eso, quiero cambiar entre estos dos. Llamemos a esto aquí la propiedad de posición. Ahí vamos. El posicionamiento de los tercios inferiores. Al igual que antes, solo abre eso, menú de posición de
efectos justo ahí. Eso tiene a lo que vamos a enlazar. Empecemos con el primero. La animación correcta golpea el “botón T”, en tu teclado para que aparezca la propiedad de opacidad y Alt haga clic en el cronómetro, borre el texto ahí dentro y empecemos a escribir algo nuevo. Como hemos visto antes, si, abre los paréntesis, vamos a enlazar al menú. Ahí vamos. Entonces el doble es igual porque vamos a ver qué hay dentro
del menú desplegable y creo que va a ser la posición 2, ¿tengo razón? Sí. Porque la izquierda es el primer elemento del menú desplegable y la derecha es el segundo elemento del menú desplegable. Por eso también tenemos que escribir en el segundo número aquí. Si eso es igual a 2, entonces, abra punto y coma, puede ser 100 de opacidad. Si no es el caso, vamos a escribir otra cosa ahora mismo, entonces tiene que ser cero. No queremos mostrar esa capa y cerrar los paréntesis. Ahí vamos. Si todo salió bien, cuando voy a cambiar ese menú desplegable a izquierda, ocultará esa capa y mostrará cuándo voy a ponerla en derechos. Ahora podemos escribir exactamente el mismo código para los tercios inferiores izquierdos, pero simplemente cambiar un pequeño parámetro. Para hacerlo nosotros mismos más fácil, voy a simplemente copiar este código completo aquí,
Control C, Alt click en la opacidad de la animación de la izquierda y simplemente pegarlo ahí dentro. Pero voy a cambiar la posición del menú a una de este ejemplo. Ahora solo podemos seguir adelante y cambiar entre izquierda y derecha. Como puedes ver, lo único que está haciendo es simplemente cambiar la opacidad, mostrando una capa u otra. Ahora saquemos nuestros gráficos esenciales. Voy a seleccionar los tercios inferiores de la composición, y voy a traer esa propiedad del menú justo ahí. Esta va a ser la propiedad posición izquierda o derecha. Eso es algo súper fácil de usar para el usuario final. todos les encantan los menús desplegables. Está bien, entonces hay una última cosa que tenemos que hacer y ese es el texto real. Ahora, hay un problema porque ¿qué propiedad de texto
vamos a agregar a los gráficos esenciales a las plantillas? Tenemos la izquierda y tenemos la derecha. ¿ Significa eso que tenemos que crear dos campos de nombres para izquierda y derechos? No, claro que no. Es así como funciona. Abramos las dos composiciones. Ahí vamos. Yo los tengo aquí mismo. A lo mejor para hacerla un poco más fácil, sólo
voy a arrastrar la derecha aquí hacia el lado derecho de mi pantalla y tener la izquierda aquí a la izquierda. Aquí están las dos composiciones. Lo que quiero hacer es solo hacer uno de estos campos de texto, el maestro y el otro va a seguir. Así funciona eso. Voy a empezar con los campos de nombre, y sólo abriré la propiedad de texto para fuente de texto. Aquí también, nombre, abre la fuente de texto. Esto también es una expresión, pero por suerte no tenemos que escribir mucho, sólo
tenemos que vincularlos,
así que el nombre 2 va a seguir lo que su texto fuente aquí. Toma el pick látigo 2 para los textos fuente, va a seguir a su maestro, que es el texto fuente de la animación izquierda, el otro campo nombre. Ahí vamos. Es así de sencillo. Ya verás que déjame simplemente agrandar por un momento esta composición. Dentro del texto fuente de forma automática, se ha escrito
algún código de expresión, que sólo apunta hacia el texto fuente de la otra capa. De acuerdo, así que hagamos lo mismo ahora para subtextos. Simplemente colapsar estos otros dos aquí, textos fuente, subtexto, ahí vamos y vinculamos eso o lo padre a la otra capa. Eso significa que ahora que ya no tenemos que preocuparnos por la animación correcta, solo
podemos seguir adelante ahora y tomar el texto fuente para subtextos para la animación izquierda, que es el maestro en los gráficos esenciales, y lo mismo va por nombre también. Pongamos eso encima y llamemos a este nombre y al otro subtexto. Ahí vamos. Es así de sencillo. Ya verás, puedes ir a cambiarte de nombre a Jordy, chico
muy ahorrador de tiempo. Ahora como puedes ver, ha cambiado la fuente de texto de los tercios inferiores izquierdos pero también la de los tercios inferiores derecho, porque sólo apunta a los otros campos de texto. Es así como puedes crear tu propia tercera plantilla inferior con muchas opciones diferentes,
pero aun así hacerlo muy fácil de usar para el usuario final, eso es algo que siempre debes tener en cuenta, que sea fácil de usar. Eso fue otra vez. Muchas gracias por ver y nos vemos en la siguiente lección.
5. Animaciones avanzadas: Ahora has estado haciendo un trabajo increíble hasta ahora. Ve lo que has estado haciendo hasta ahora. Has estado escribiendo expresiones, creando plantillas. Ya has aprendido una tonelada, así que sigue así. Todavía estoy súper emocionado, así que sigamos ahora en esta lección. Vamos a crear una animación de texto ligera, y vamos a trabajar con cosas como Object Linking. También te voy a enseñar a trabajar con curvas de animación, y finalmente, algunas técnicas de formato para crear una plantilla. Empecemos. Voy a ir a mi herramienta de texto arriba, como [inaudible]. Vamos a crear esta palabra estancia, y luego tenemos estos textos deslizantes que vienen como mantenerse creativos, mantenerse seguros, mantenerse frescos, o lo que quieras. Hagámoslo. Vamos a empezar con sólo escribir Stay, y voy a colocar eso aquí mismo. Voy a poner la alineación a la derecha. Ya está configurado correctamente porque si vamos a
darle al usuario final la posibilidad de cambiar también ese texto, esa persona podría escribir algo más. Entonces sigamos eso con Stay ahora, y lo voy a alinear en algún lugar justo aquí. También puedes usar las herramientas de alineación aquí arriba si quieres
posicionarlo exactamente en el medio aquí con ese botón. Ahí vamos. Este va a ser el texto principal, por lo que vamos a renombrar esa capa a TEXTO PRINCIPAL. A continuación solo voy a duplicar el texto principal, y de esa manera estoy seguro de que tenemos exactamente el mismo tamaño y todo de esa capa de texto. Este me voy a alinear hacia el lado izquierdo, y acercar eso más al medio así. Pero ¿sabes qué? Llamemos a este Creativo. Este va a ser mi Subtexto 1. Vamos a seguir haciendo esto. Voy a duplicar esa capa Subtext número 2, y voy a mover esa hacia abajo así. Vamos a llamar a éste, digamos Seguro. Vamos a duplicar eso otra vez, baje eso. Llama a ese Cool. Quizás, tal vez uno más Subtexto número 4. Quédate, no lo sé. Caliento. quieres mantenerte fresco cuando hace calor afuera, y quieres mantenerte caliente cuando hace frío afuera. Tiene sentido. Quiero que creéis animación ahora donde están estos textos van hacia arriba. Sólo vamos a animar una de estas capas de textos. Esa va a ser la forma más eficiente, y sólo vamos a vincular todas las demás capas de textos al maestro. Los otros van a ser los seguidores. Al igual que hemos visto en la lección anterior donde vamos a enlazar a textos fuente al maestro, esta vez sólo vamos a vincular toda la capa a ella. Eso se va a hacer con la herramienta padre, que podemos encontrar aquí mismo. Estos pican látigos aquí. Si no puedes ver eso por cierto solo tienes que hacer clic derecho aquí en tus columnas, y desde ahí puedes elegir tus columnas,
las opciones Parent & Link. Vamos a vincular todo al Subtexto número 1, así que solo selecciona todas las demás capas de subtexto. Basta con tomar la herramienta de látigo de pico, y vincularla al Subtexto número 1. Podemos simplemente seguir adelante y sólo animar al top. ¿Sabes qué? Esta es la última posición aquí, así que voy a ir un poco hacia adelante en el tiempo, crear un marco clave, luego retroceder en el tiempo y empujar este texto hacia abajo. Se puede ver aquí todo lo demás sigue con eso. Para estar seguros de que siempre nos estamos quedando exactamente en la misma línea, realidad
podemos traer a los gobernantes aquí en la composición. Si presionas “Control R” puedes ver esto aquí apareciendo, y en realidad puedes arrastrar hacia fuera una regla de eso. Eso voy a alinear con el texto
Stay, y de esa manera estoy seguro de que me estoy quedando exactamente en las mismas alturas. Vamos a jugar esto atrás y esto se ve bien, pero yo quería ir mucho más suave. Una cosa que podemos hacer es simplemente hacer clic con el botón derecho en ese marco clave final, solo tienes que ir a Key frame Assistant y elegir “Easy Easy In”. Ahora ya va un poco más suave, pero quería ir aún más suave. Aquí es donde entran esas curvas de animación. Para traer esas curvas de animación lo que sólo tenemos que hacer aquí es dar click en este icono, el Editor de Gráficos. Esto de aquí, lo que vemos ahora es esta curva de habla. Si no puedes ver eso, lo que quieres hacer entonces es ir a este pequeño menú aquí mismo y elegir un tipo de gráfico. Desea asegurarse de que está seleccionada la opción Editar gráfico de velocidad. Creo que por defecto se selecciona el Gráfico de Valor, por lo que ahí se puede cambiar eso. Si ahora empujáramos aquí o jaláramos de esa palanca, podemos hacer que los textos vayan más rápido en el principio y desaceleren
lentamente hasta que esté en posición final. Cuanto mayor sea esa línea de gráfico de velocidad, más rápido va tu animación. Cuanto menor sea, más lento va. Vamos a jugar esto de nuevo. Como puedes ver aquí viene rápido, pero también se detiene mucho más suave. También puedes tirar de esto un poco más a los lados correctos haciendo una buena animación solo más larga y cronometrada. Viene rápido y se detiene lentamente. ve genial. Si te gusta también puedes agregar esa expresión
ahí como lo hemos visto antes aquí en nuestra página web. The Bounce Expression, algo que uso muy a menudo. Alt/click en ese cronómetro. Hacer también basado en una expresión aquí. Ahí vamos. Ahora podemos tener ese rebote muy gentil ahí dentro. El motivo por el que ya no vemos ese rebote tanto es porque tenemos esta curva de animación en marcha. Cuanto más suavizes esa curva
de animación, menos rebotes ves. Pero algo digno de mención, si entramos en el código de expresión aquí mismo; permítanme sólo hacer un poco más de espacio para eso, hay algunas cosas que podríamos entender. Por ejemplo, aquí en la parte inferior podemos encontrar amplitudes; el valor del amplificador, la frecuencia, y la decadencia. Por ejemplo, la amplitud. Cuanto más altas sean las amplitudes tal vez más rebotará, así que intentemos cambiar eso. Quizás ponga eso a cinco o algo así. A ver qué hace eso. Ya se podía ver ahora que equilibra extra en el extremo mismo. No se ve tan genial,
así que tal vez disminuya un poco eso atrás. Es así como puedes jugar con estas expresiones también. Eso a dos, y creo que esto se ve bastante bien. Tenemos un equilibrio muy suave ahí dentro, lo que lo hace más dinámico. También puedes jugar con la frecuencia y
la decadencia para solo ver qué hace eso para tu animación. Ese es el primero que se ve bien. Pasemos al siguiente texto. Mantente Creativo, vamos a crear un nuevo marco clave. Adelante a tiempo, y trae esto a Stay Safe. Al igual que antes vamos a crear curvas de animación, así que bueno volvamos al Editor de Gráficos. Si no ves ninguna gráfica aquí por cierto, eso significa que no has seleccionado tu propiedad. Asegúrate de solo seleccionar eso, y eso traería las curvas. Hagámoslo otra vez. Voy a seleccionar el primer fotograma clave, bajar esto y tirarlo hacia el lado derecho. Trae también al otro, y llévelo al lado izquierdo. Vamos a acelerar a una velocidad muy rápida, luego volver a la posición de parada. Mira eso, luciendo impresionante. Sigamos haciendo este marco clave, avancemos en el tiempo y lo planteemos. Nuevamente, en el Editor de gráficos, tire de este fotograma clave hacia abajo hacia la izquierda, tire de este fotograma clave hacia abajo hacia la derecha. Ahí vamos. Echemos un vistazo a la animación final. Creo que esto se ve bastante guay. Ahora podríamos seguir adelante y eliminar esa pauta simplemente arrastrándola de nuevo y quizá también descomprobar el área de Title Safe, y ahí vamos. Lo siguiente que quiero hacer es resaltar todos los demás textos. Por lo que sólo muestra el que se sienta al lado de Stay. Para hacer eso, voy a agrupar todo. Simplemente selecciona todos tus subtextos, haz clic con el botón derecho y elige “Pre-componer”. Vamos a llamar a esto los Subtextos. Golpea “Ok”. Ahora es sólo una cuestión muy sencilla de arrastrar una máscara de rectángulo sobre esa composición, algo así. Es así ahora como podemos revelar estos otros textos debajo de la máscara. Esto se ve bastante guay, aunque tengo que decirlo yo mismo. Llevemos esto a una plantilla, y quiero mostrarles algunas opciones de formato más. Vamos a volver a la Gráfica Esencial. Voy a seleccionar mi composición primaria, que es el Rolling Text. Llamemos a esto también Rolling Text, y vamos a arrastrar aquí las propiedades que nos parecen importantes para cambiar. Ese va a ser el texto principal aquí, el texto fuente de eso. Démosle una etiqueta a eso, Texto Principal. Entonces el subtexto, vamos a tener que saltar al pre-comp para eso, y simplemente arrastrar cualquiera de estos hasta aquí. Ahí vamos. Subtexto 1, Subtexto 2, Subtexto 3, y finalmente, Subtexto 4. Podemos darle a eso un nombre, Subtexto 1, Subtexto 2 para que la gente vea lo que está cambiando. Esto es ahora algo que podríamos exportar como plantilla para el usuario final, pero podríamos hacer que esto sea un poco más fácil de usar agregando formattings. Aquí en la parte inferior, podemos encontrar un menú desplegable de formato. Hay dos cosas que podemos hacer, podemos agregar un comentario y podemos agregar un grupo. Empecemos con la adición de un grupo. Básicamente este grupo es como un bin. Podemos, por ejemplo, llamar a uno Principal, y vamos a arrastrar el Texto Principal ahí dentro. También podríamos hacer un grupo dentro de un grupo, van a ser los subtextos pero voy a arrastrar ese grupo fuera de ese grupo. Es como hacer carpetas chicos, también
puedes hacer subcarpetas obviamente. Sólo voy a traer todos estos subtextos aquí. Ahí vamos. Ahora tenemos dos grupos. También podemos derrumbarlos, expandirlos de nuevo. Esto es realmente útil si tienes muchas propiedades que dar a los usuarios finales, que tengan una mejor visión general de lo que es para qué. Por último, también tenemos una opción aquí llamada Añadir comentarios, que básicamente es solo la etiqueta. Se puede dar alguna información al usuario final. Por ejemplo, dale la etiqueta aquí Info, y vamos a decir Cambiar el texto de los subtextos y tal vez colocar eso aquí en la parte superior. Ahora la gente sabrá que estas opciones son para cambiar los subtextos. Este es un campo no editable por cierto. Simplemente actúa como etiqueta, como información para compartir. Algo que también puedes hacer definitivamente si vas a compartir tu plantilla en un mercado o algo es dar alguna información sobre el arquero. Creado por Jordy Vandeput. Dar alguna información de copyright tal vez con eso. Por lo general, tal etiqueta se coloca en la parte inferior, o todo el camino en la parte superior de tus plantillas así. Lo último que quiero mostrarles chicos es el Set Poster Time. Para eso, voy a volver a mi composición principal aquí, y elegir por un marco aquí en mi composición que siento que debería actuar como una miniatura para las plantillas. Por ejemplo, tal vez en algún lugar aquí entre dos, así que de esa manera también estás mostrando esto tiene una animación. Definitivamente son si vamos a habilitar el Desenfoque de Movimiento, solo mira eso. En realidad podemos decir, usa este marco como la miniatura
haciendo clic ahora aquí en Set Poster Time y también verás que lo actualiza aquí mismo. Eso es lo que la gente verá dentro de Premiere Pro cuando carguen en tus plantillas. Vamos a sentarnos en Exportar plantilla de gráficos en movimiento. Sí, guarde eso. A éste se le va a llamar el Texto Rolling. Ya tiene el nombre correcto. Vamos a darle a “Ok”. Sí, sé que no estamos usando un Adobe Font. Eso me parece bien, y ahora vamos a entrar a Premiere Pro. Desde el panel Gráficos Esenciales, voy a dar clic aquí en la parte inferior para instalar
unas nuevas Plantillas de Motion Graphics y elegir mi Rolling Text y ahí vamos. También podemos ver aquí la miniatura que hemos elegido. Podemos arrastrar eso a la línea de tiempo, y sus vamos. Se selecciona Minuto, entonces podemos cambiar todo lo que hemos establecido antes. Aquí puedes ver esas etiquetas creadas por Jordy Vandeput. Subtexto con algo más de información sobre qué hacer con eso. También puedes colapsar esos ahora porque hemos creado grupos o expandirlos de nuevo, y podemos cambiar el texto justo ahí. Es así como podemos agregar algunos formattings más hacia una plantilla, además de crear una animación más avanzada usando Object Linking y esas curvas de animación. Con eso, espero que hayas aprendido algo nuevo. Muchas gracias por mirar, y nos vemos de vuelta en la siguiente lección.
6. Controladores de color: Colores. ¿No los amamos simplemente? Oh, mira, rojo, es mi color favorito. ¿ Cuál es tu color favorito? Empecemos, chicos. Lo que tengo justo aquí, ¿dónde están mis alfombrillas de ratón? Perdí mis alfombrillas de ratón. ¿ Son alfombrillas de ratón o alfombrillas de ratón en inglés? No lo sé. De todos modos, sigamos. Esta es una animación muy simple de dos rectángulos. Tenemos una línea de fondo y línea alta. Básicamente, lo que está pasando es que se
animan entrando y saliendo y un texto revelará. No me importa demasiado el texto en este momento, me interesan más estos dos rectángulos de los que quiero cambiar su color. Todos sabemos que, por ejemplo, si sacamos la opacidad desde la línea superior, y vamos a Alt click en el cronómetro para escribir una expresión, que podemos escribir un valor aquí. Por ejemplo, 50. Dará salida eso como la opacidad, 50 por ciento. La propiedad de opacidad sólo va a echar un vistazo a cuál es el valor dentro de la expresión. Si estamos escribiendo una expresión if/else, ahora también sólo vamos a escribir cuál tiene que ser el valor. Es exactamente lo mismo. Cuando vamos a ir al color de este rectángulo, vamos a encontrarlo aquí. Contenidos, Rectángulo, Relleno, aquí mismo, el color. Cuando vamos a Alt haga clic en eso, entonces ¿qué debemos escribir ahí para el color rojo, por ejemplo? Probemos un rojo, pero no creo que eso vaya a funcionar. No, no puede leer rojo. Para los colores, también queremos leer un valor numérico, pero ¿cuál es el número de rojo? Bueno, hay una herramienta muy sencilla para eso. Si buscarías en Google el recolector de color, en realidad
puedes encontrar esta herramienta aquí mismo donde solo puedes arrastrar esta cosa para escoger el color que te gustaría, ¿y sabes qué? Agarremos algo que parezca rojo. Ahí vamos. Aquí en la parte inferior, luego
puedes encontrar un montón de números. Obtenemos el valor HEX de este color, también
obtenemos el valor RGB, el CMYK, etc. Todos estos generan un valor numérico diferente, y eso es algo que nos interesa. En particular, el valor RGB. Estos tres números, representan rojo,
verde, azul, al igual que el nombre RGB. El máximo, si solo voy a arrastrar esto hasta aquí en la esquina, rojo
puro, verás que el rojo ahora se sienta en 255, que es el máximo. Esto se puede ver como rojo 100 por ciento puro. No hay nada más cuando ese valor se sienta en cero por ciento o también en cero y su valor numérico, no
tenemos ningún rojo. Llevémoslo todo el camino hasta aquí al negro, ahora
es cero así como para todos los demás colores. Rojo, verde y azul son todos cero, negro. Pero si lleváramos eso hasta el blanco, todo es 255. Si todos los colores son iguales,
se suman el uno al otro y obtenemos el blanco. Pero si conseguimos algo en medio, vayamos por algo así, obtenemos un valor muy diferente. Si sumáramos todos estos, 153, 125 y 41, nos pondríamos este muy feo amarillo. Eso es algo muy interesante saber. Podemos simplemente seguir adelante y copiar y pegar el valor de aquí en After Effects. Vamos a escoger un color más hermoso sin embargo, algo así como el verde. Ahí vamos. Sólo voy a copiar esto y golpear “Control C” para copiar ese valor, luego volver a After Effects. Eso es algo que ahora podemos simplemente pegar en la expresión. Pero antes de hacer eso, primero
vamos a tener que escribir corchetes abiertos porque vamos a tener que definir cuatro puntos. Cada vez que vamos a hablar de sus puntos o múltiples valores, siempre hay que abrir un corchete. Si vamos a trabajar con la posición, por ejemplo, obtenemos dos valores; el y y y el eje x. Entonces también escribiríamos los corchetes abiertos. En este caso, van a ser cuatro valores. Sé que acabamos de copiar tres, pero entraremos en el cuarto en un momento. Por lo que el soporte abierto y va a pegar, los valores justo ahí. Simplemente podemos dejar las comas porque cada vez que agregamos una coma a nuestra expresión, eso significa que vamos a empezar con los siguientes puntos. Nos ponemos rojo, verde, azul, y va a haber un cuarto, coma, y ese es el canal alfa. Alfa simplemente significa opacidad. ¿ Cuál va a ser la opacidad del color? Si pondría esto a cero, entonces mi color sería transparente. No vemos nada. Si establecería esto en 255, que es máximo, entonces tenemos opacidad 100 por ciento. En este caso, vamos por eso. Basta con escribir 255, la opacidad máxima y cierre corchete. Veamos qué pasa. Si voy a hacer clic de distancia, realidad
verás que el color de esa línea superior realmente no cambia. Sigue siendo blanco, y eso se debe a que After Effects sí funciona en los valores RGB, pero no echa un vistazo a estos 0-255. Eso se debe a que After Effects mira sus colores desde 0-1 y todo lo
que hay en el medio, eso podría ser 0.7, 0.4, etc. El motivo de eso tiene que ver con la profundidad de bits de color. Pero como artista del motion graphics, no
nos importa tanto. No te voy a molestar con esa larga explicación. Simplemente vamos a hacer una ecuación matemática muy simple en expresión. Eso es correcto. También podemos usar esto como calculadora. Si 255 tiene que ser uno, eso significa que podemos simplemente dividir esto por 255. Es así de sencillo. Una vez que hayas anotado eso, obtenemos exactamente el mismo color que hemos escogido del recolector de color de Google, ese hermoso verde. Es así como podemos definir y escribir colores, y así podemos introducir un color en una expresión. ¿ Por qué es eso importante para usted podría preguntar? Porque sí, también podríamos ir a nuestro tutor de Gráficos Esenciales y muy simplemente simplemente arrastrando la propiedad de color hacia ahí y los usuarios solo tendrán la capacidad de cambiar el color a partir de ahí. Bueno, eso se debe a que a veces solo se quiere dar un color predefinido, un color que al usuario final no se le permite cambiar. Por ejemplo, permítanme volver a mis Controles de Efectos y voy a pasar
a Layer, New, Null Object. Este va a ser mi controlador. Vamos a renombrar eso a controlador. Voy a arrastrar un menú desplegable hacia él. Controlador de menú desplegable justo ahí. Pasemos a Editar, y voy a crear tres valores. Por ejemplo, hemos creado este tercio inferior justo aquí, pero cada persona tiene su propio color predefinido. Por ejemplo, Jordy tiene su propio color, tal vez rojo, entonces Yannick también tiene su color, por ejemplo, azul, y para el último tenemos a Lorenzo, que tiene un no verde como su color. Vamos a darle a “Ok”. Ahora vamos a volver al control de color aquí mismo, y vamos a volver a escribir esa expresión if/else. Si vamos a elegir a Jordy de ese menú desplegable o simplemente a mí, entonces vas a tener que mostrar ese color específico. Si es alguien más, entonces vamos a tener que mostrar otro color. Hagamos eso. Esta va a ser una expresión si/else más complicada por lo que va a ser realmente interesante. Déjame hacer eso aquí un poco más grande. Al igual que antes, voy a empezar por escribir si, así que si abres paréntesis, y podemos escoger con eso al menú aquí arriba para que el menú desplegable, si ese es el primer valor que es Jordy, entonces abre punto y coma, puede ser este color específico. Volvamos a ese recolector de color de Google, y tomemos el color rojo,
copiemos el valor RGB, volvamos a After Effects. Voy a sobrescribir que con estos tres números, el último es la opacidad. Simplemente deja eso al 255, y vamos a decir cerrar punto y coma. Ahí vamos. Ya verás que esto de aquí es rojo. Si vamos a cambiar eso a Yannick, por ejemplo, va a dar un error porque aún no tenemos esa opción ahí dentro. Pero verás que va a cambiar el color por lo que está funcionando muy bien. Vamos a devolverle eso a Jordy. Como puedes ver aquí en mi expresión, lo que estoy haciendo en realidad es también que estoy agregando rupturas en mi expresión. De esa manera, obtengo un poco mejor visión general de lo que estoy escribiendo aquí en cita, y tal vez, incluso
puedo compensar esto un poco con un toque a todo lo que se sienta un poco más allá o se sienta dentro de una expresión if/else. Pero ahora viene la parte complicada porque no podemos teclear más aquí. Porque si hacemos eso, diremos, si Jordy,
entonces ese color, y si lo demás, cualquier otra cosa que ese color. Pero porque tenemos tres valores: Jordy, Yannick y Lorenzo, no podemos hacer eso. Por eso solo voy a terminar la cotización si aquí mismo. Si hemos seleccionado el primer elemento en el menú, entonces cambia el color a este valor. Eso es todo. Ahora podemos seguir adelante y simplemente copiar esta línea entera aquí mismo, agregar unos descansos ahí dentro, y pegarla de nuevo porque sólo vamos a hacer una segunda expresión si para el menú número 2. Volvamos al recolector de color de Google y vamos por algo azul así, copie el valor RGB, vuelva a After Effects, y voy a cambiar el valor aquí a ese azul. Ahí vamos. De nuevo, copia todo, Control C, agrega un descanso, pega, y esta vez, menú número 3, que va a ser Lorenzo. Vamos al selector de color de Google, seleccione verde, copie ese valor RGB. Volvamos a After Effects y cambiemos aquí estos tres primeros números. Ahí vamos. Vamos a probarlo ahora. Jordy, rojo, Yannick, azul, y finalmente, Lorenzo, verde. Eso está funcionando perfectamente y muy interesante ahora es que
podemos seguir adelante y también cambiar los textos aquí mismo. Ahora dice minería. Copiemos sólo todo de esa expresión. Nos vamos a llevar todo. Voy a ir ahora a mi capa de texto aquí mismo, dirigirme al Texto de Origen porque eso es lo que vamos a cambiar, esa fuente de esa capa de texto, Alt haga clic en el cronómetro y simplemente pegue esa expresión entera ahí dentro. Simplemente agrandaré esto en pedacitos para que puedas ver mejor. Ahí vamos. No tenemos que dar valores RGB ahora mismo, vamos a dar valores de textos. Se podría pensar que sólo podemos seguir adelante y sólo escribir aquí Jordy Vandeput, pero desafortunadamente, eso va a dar un error. Si estamos hablando de texto como textos puros como mi nombre, por ejemplo, entonces siempre hay que poner eso entre comillas. Hagamos eso. Una cotización por ahí y una cotización por aquí. Ahí vamos, Jordy Vandeput. Ahora ve eso como un texto real. Hagámoslo aquí también. Yannick Theunissen, ese es su apellido. Por último, obtenemos Lorenzo Menz, con una z La expresión si ya ha sido escrita, ahora se
puede ver desde el controlador que si vamos a cambiar uno de estos valores aquí en un menú desplegable que también cambiará el texto. Eso va a ser muy útil si tienes, por ejemplo, un show en vivo donde siempre tienes a la misma gente en el show, entonces no des demasiadas opciones para el usuario final. Si solo pueden mover
un simple menú desplegable y se han establecido en el color correcto y en el nombre correcto, entonces eso es aún más fácil de usar que darles un controlador de color y un cuadro de texto. Eso se ve genial. Lo último que quiero mostrarles chicos es que todavía tenemos esa línea de fondo. Son muy interesantes es que podemos dar un color de tinte que es diferente al rojo pero aún rojo con una ecuación muy simple. Voy a ampliar la línea superior y tal vez hacer mi campo de expresión un poco más pequeño. Ahí vamos. También voy a hacer lo mismo con la línea de fondo, sólo abre eso. Lo que voy a hacer aquí para la línea de fondo es sólo un clic de Alt en el cronómetro. Voy a quitar los textos ahí dentro, y voy a vincular eso al color de la línea superior. Ahora mismo, sólo estamos tomando el control de ese mismo color, por lo que realmente no pasa nada. Pero si vamos a hacer un poco de ecuación matemática, así que solo por ejemplo, divida todo por dos, obtenemos un tono más oscuro de ese azul, lo cual es realmente interesante. No tenemos que seguir adelante y escribir expresiones y hacer todas estas locuras. Simplemente podemos dividir eso por dos y obtenemos un tono diferente. Para Yannick, eso va a ser azul más oscuro, y para Lorenzo, eso va a ser un verde más oscuro. Ahí vamos con un simple menú desplegable, podemos controlar un tercio más bajo con diferentes colores y diferentes textos, súper fácil de usar. Es así como funcionan los colores dentro de Adobe After Effects. Muchas gracias por ver, y estoy súper emocionado de verte de vuelta en la siguiente lección.
7. Manejo de campos de texto: lo he dicho muchas veces antes y lo volveré a decir, es súper importante que hagas una plantilla que sea fácil de usar, pero también que el usuario final no pueda cometer ningún error, que tengas un sistema de fail-over. Déjenme mostrarles a qué me refiero con eso. Voy a crear un campo de texto simple, y solo llamemos a este texto de ejemplo, y lo voy a alinear aquí en la parte inferior izquierda. Ahí lo tienes. Esta es mi plantilla, y voy a arrastrar el texto fuente a mis gráficos esenciales. Ahora bien, ¿y si el usuario final va a escribir aquí una frase muy larga? Por ejemplo, Jordy es súper impresionante, realmente genial. Ahora, a ver qué pasa aquí. Mi sentencia está siendo cortada en algún lugar justo ahí, y como creador de plantillas, queremos asegurarnos de que esas cosas así no sucedan. Entonces en lugar de crear un campo de texto, solo
voy a eliminar esto aquí, vamos a crear un área de texto. Ahora para hacer eso, de nuevo, toma la herramienta de texto en la parte superior, pero esta vez no hagas clic pero asegúrate de hacer clic y arrastrar para crear un área de texto. Escribamos algo aquí, texto de muestra. De nuevo, tomemos la propiedad de texto fuente, arrastrémosla a los gráficos esenciales, y ahora escribamos esa frase realmente larga. Jordy es super impresionante, increíble, coool. Tengo tres Os ahí, pero eso está bien. Ahí vamos. Sabemos que podemos ver que tenemos un salto de línea automático si el texto va a ser demasiado largo. Pero hay un pequeño error donde las dos líneas se superponen, pero podemos cambiar eso aquí con liderar, establecer el liderato así que solo aumente en un poquito, ahí vamos. Esto es genial. Nos hemos asegurado de atrapar ese fracaso. Déjame seguir adelante, y alinear esto un poco mejor. Nos hemos asegurado de que podamos escribir dos líneas aquí. Voy a arrastrar esto hacia abajo. Ahí vamos, así que ahora está mejor alineado. Pero ahora, ¿qué pasará si voy a escribir aquí en una frase más corta? Por ejemplo, sólo Jordy Vandeput, mi nombre. Bueno, ahora mi nombre se sienta un poco demasiado alto. Ahora quiero que esto esté aquí en el fondo. Entonces voy a arrastrar esto hacia abajo. Pero ahora el usuario final es ir a decidir escribir de nuevo en una frase más larga. Jordy Vandeput es impresionante, realmente coool con tres Os. Ahora, vemos que nuestro texto se está pegando demasiado al fondo. Queremos crear algo donde el campo de texto se va a alinear un poco más alto cuando estamos haciendo uso de dos líneas, y un poco más bajo cuando sólo estamos haciendo uso de una línea. De nuevo, eso se va a arreglar con una expresión. No se preocupen chicos, esta vez no quiero sepan
realmente exactamente cómo escribir esa expresión, vamos a copiar y pegar algo otra vez, porque después de todo eso es lo que las expresiones se reduce a mucho, sólo copiar y pegar fragmentos de lo que encuentres en la web. Déjame seguir adelante, y esta expresión necesita
ser pegada en la propiedad del punto de anclaje. Porque con el punto de anclaje, podemos ver que también podemos cambiar la posición de la capa de texto para que eso sea bueno. Déjame solo seguir adelante y Alt, haga clic en los puntos de anclaje, y voy a pegar en mi expresión. Ahora, esto también es que puedes encontrar aquí de los chicos de descargas. Si descargas todos los archivos del proyecto, encontrarás un pequeño archivo de texto ahí también donde solo puedes encontrar ese código, y también se asegurará de que puedas encontrar esa expresión aquí dentro de las notas de clase sobre el propio jugador. Podemos simplemente seguir adelante y copiar y pegar eso en la propiedad de puntos de anclaje. Básicamente, lo que está haciendo aquí mismo es hacer uso de una función llamada SourceRectatTime, y vamos a sumergirnos un poco más en eso en la siguiente lección. Por ahora, no te preocupes demasiado por eso. Lo que básicamente va a hacer es simplemente echar un vistazo al ancho y
la altura de los campos de texto, y va a ajustar la propiedad del punto de anclaje de acuerdo a la altura, en este caso, de mis campos de texto. Eso es básicamente todo, nada más de qué preocuparse tan solo haga clic de distancia, y ha hecho su trabajo. Ahora, podemos seguir adelante y simplemente agarrar ese campo de texto, y simplemente mover eso a una posición diferente. Estamos cambiando la propiedad de posición en este momento no la propiedad del punto de anclaje. Ahí vamos, se sienta en el lugar correcto. Déjame seguir adelante y cambiar el texto ahora a sólo Jordy, por ejemplo. Ahí vamos, y ahora verás que automáticamente se está ajustando mi campo de texto a la parte inferior. Sé que solo hubiera sido mucho más fácil si hubiera una opción de alineación vertical, pero no tenemos eso dentro de After Effects por lo que
tuvimos que crear eso nosotros mismos con una expresión. Ahí vamos. Dos cosas muy importantes, los campos de texto para asegurarnos de que podemos agregar una nueva línea, pero también la expresión de alineación vertical para asegurarnos de que siempre partimos desde la misma altura. En la siguiente lección, vamos a sumergirnos un poco más en la expresión sourceRectatTime porque eso es algo muy importante, y solo nos permite hacer muchas plantillas más dinámicas con muchas más funcionalidades. Los veré en la siguiente lección. Muchas gracias por volver a ver.
8. Vinculación de objetos: Objetos que enlazan, el acto de vincular objetos entre sí, lo cual es bastante obvio. Lo que tengo aquí mismo es un logo muy típico revelar animación. Esto es algo que podrías crear para vender en un mercado. Me aseguro de que sea fácil de usar. este momento, uno de los primeros temas con los que me encuentro es que el logotipo no está siguiendo realmente la animación del rectángulo de fondo. Esta va a ser mi primera forma de vincular objetos juntos. Vamos a hacer eso con las herramientas de padres y enlace aquí mismo. Esto lo puedes ver aquí en tus opciones de capa. Simplemente haz clic derecho en tus columnas, ve a “Columnas” y asegúrate de que el padre y el enlace estén habilitados. Entonces podemos seguir adelante y simplemente vincular esa capa con la herramienta padre a los fondos hexagonales, es así de simple. Lo que estamos haciendo en este momento es solo decir que nos apoderemos de todas las propiedades de animación, la posición, la escala, todo sobre desde los fondos hexagonales. Se va a seguir maravillosamente. Se ve bien. Arrastremos ese logotipo ahora a los gráficos esenciales y demos eso como una opción para cambiar al usuario final. Lo siguiente que quiero hacer es también dar la opción de
cambiar el color de fondo aquí del hexágono. Abramos las propiedades, y está justo aquí, color, debajo del relleno. Arrastremos eso a los gráficos esenciales también. Este va a ser el color del fondo. También tenemos un fondo de rectángulo de texto justo aquí. También podríamos darle eso como una opción para cambiar el color de, pero no quiero que lo haga un poco más fácil y solo le dé una opción al usuario final, y con esa opción aquí al color de fondo, es necesario cambiar ambas capas. Esta va a ser mi segunda forma de vincular objetos. Voy a abrir las propiedades aquí para mis fondos de texto y localizar el color de relleno, está ahí mismo. Déjame solo hacer esto un poco más grande para que podamos ver mejor. Lo que voy a hacer ahora es sólo vincular esa propiedad al color de los fondos hexágonos. No quiero vincular todo como lo hemos hecho antes, sólo el color. Para ello,
vamos a tener que Alt haga clic en la propiedad de color para escribir una expresión. No obstante, podemos escribirlo automáticamente usando ahora la herramienta pick whip del controlador de expresión, y lo vamos a vincular a la propiedad de color. Ahí vamos. Nos va a escribir la expresión, solo tienes que hacer clic de distancia, y automáticamente cuando vamos a cambiar el color de fondo ahora a otra cosa, tomemos rojo verás que los dos van a cambiar, la segunda forma de vinculación de objetos. Volvamos a poner eso a blanco. Ahora vamos a llegar a la tercera vía de vinculación de objetos, y de esto se trata la lección en realidad. Antes de que me olvide, también voy a arrastrar en los textos fuente del año nombre de la empresa a mis gráficos esenciales. Este va a ser el nombre de la empresa. Actualmente dice Company Incorporated, pero cambiemos eso a JORDY VANDERPUT ES COOL,
es lo mejor que se me ocurre. Al hacer clic de distancia, ahora notarás que el fondo
no se escalará junto con la longitud de mi texto. Eso es algo que tenemos que arreglar. Vamos a tener que vincular el tamaño de fondo al tamaño del texto, y eso lamentablemente no es fácil de hacer. Vamos a tener que trabajar con una expresión específica para que eso funcione, pero les voy a ayudar chicos con
eso, va a ser súper fácil. Localicemos el tamaño de esos fondos, esos fondos de texto aquí mismo y, voy a derrumbar la película. Ya no vamos a trabajar con eso, pero vamos a trabajar con el tamaño de tu trayectoria de rectángulo. Ya verás aquí, si voy a cambiar el valor para el ancho, que podemos cambiar eso para que encaje con mi tamaño de texto. Vamos a escribir una expresión para que eso suceda automáticamente. Alt click en la propiedad tamaño. Lo primero que quiero que entiendan es cómo vamos
a darle un valor a los lados. Bueno, como antes vimos también con los colores RGB, se
trata de valores de dos puntos, por eso vamos a tener
que escribir esto entre paréntesis. Abra un corchete. El primer valor, que, tal vez sólo escriba algo, 500, y luego el segundo valor va a ser color. Vamos a tomar aquí el mismo valor que ya tenemos,
172, y cerrar corchetes. Da clic de distancia, y verás ahora que automáticamente, se están tomando
estos valores. Sabiendo eso, ahora podemos dar un paso más allá y decir, también
voy a escribir mi código un poco más fácil de usar. También para ti, vas a tener que ser fácil de usar porque tal vez en el futuro, vas a volver a abrir tu proyecto para hacer cambios en tus plantillas. Voy a aquí mismo arriba, a. Esto puede ser cualquier cosa por cierto. También podrías escribir a tu nombre, Jordy, o lo que quieras. Vamos a crear una variable. Una variable es sólo un nombre personalizado. Simplemente asegúrate de que eso siempre se sienta en el color blanco porque si voy a escribir algo diferente, como por ejemplo, valor, que tiene una propiedad que se está utilizando también para escribir funciones y expresiones, verás cómo eso se vuelve amarillo por lo que eso significa que no puedo usar eso como variable por lo que tiene que ser un nombre único. Vamos sólo por ocho. Entonces el tipo es igual. Esta vez, sólo escribe uno igual, no dos, porque vamos a comparar y ver qué es. Ahora, en realidad vamos a poner un valor dentro de un, por eso sólo estamos escribiendo uno igual ahora. A va a ser 500, y b va a ser 172. Ahora que tenemos estos dos valores, a y b, significa que aquí podemos intercambiar el ancho y el valor de altura con a y b Espero que eso tenga sentido porque esta es una forma mucho mejor de escribir códigos porque el siguiente paso va para ser una frase mucho más larga, y si vamos a encajar eso en el valor final aquí dentro de los corchetes, esos datos ya no van a ser fáciles de usar. Ahora, vamos a hacer clic de distancia y a ver qué pasa. Ya verás que terminamos con un error. Este proyecto contiene un error de expresión. Bueno, eso es porque After Effects no reconoce los saltos de línea. En realidad está escrito justo aquí es esto, a es igual a 500 y b igual a 172. Vamos a tener que decirle a After Effects que
en realidad hemos añadido un salto de línea aquí mismo. Para ello, sólo vamos a tener que escribir puntos, coma al final de cada frase, es así de simple. Por lo general, siempre que veas un error, una de esas cosas probablemente va a ser el problema. Ahora, vamos a hacer click de distancia y verás que funciona perfectamente. Ahora podemos seguir adelante y cambiar los 500 aquí a 900, y verás también aquí el cambio de ancho de ese rectángulo. No queremos teclear sido un número manual aquí, queremos dejar automática o dinámicamente que cambie con el tamaño del texto. Para ello, voy a quitar 900 y voy a empezar por tomar la herramienta pick látigo de la expresión para el tamaño, y voy a vincular eso a toda la capa del nombre de la empresa. Ahí vamos. Ahora hemos escrito automáticamente un trozo de códigos que sólo está apuntando a esa capa, y ahora podemos llevar eso un paso más allá y en realidad hacer algo con eso más adelante. Para ello, teclea puntos. Vamos a ir un paso más allá con esa capa. Voy a escribir ahora fuente,
grabar a la vez, grabar a la vez, y After Effects realmente nos está ayudando aquí. Este es el inmueble con el que nos gustaría trabajar. El registro fuente en el momento va a echar un vistazo a cualquier momento dado dentro una línea de tiempo y simplemente agarrar cualquier propiedad de la capa objetivo. Eso significa que podemos cambiar dinámicamente el tamaño del rectángulo en cualquier momento dado, incluso si animaras el texto que entra por ejemplo, si animas la escala de la capa de texto, o haces que entren tus personajes, animar esa propiedad, siempre se asegurará de seguir los lados de su capa de texto. Tomemos eso. Podemos simplemente hacer doble clic en esta propiedad para hacerlo bien, y en esa muy anterior, ahora
vamos a ver qué propiedad nos gustaría tomar el control. En este caso, va a ser el ancho. También podríamos tomar la posición o cualquier otra cosa, y en este caso, va a ser el ancho. Basta con escribir ancho y eso es todo, hemos tomado el ancho de la capa de texto y lo hemos colocado en la variable a, y eso se va a generar aquí en el tamaño del rectángulo. Ahora, vamos a hacer clic de distancia, y notarás [inaudible] que el rectángulo tiene exactamente el mismo tamaño que la capa de texto. Para demostrárselo chicos, voy a cambiar mi texto a BAZINGA. Ya verás que mi tamaño de rectángulo ha cambiado junto con el tamaño del texto. Esto no es magia, chicos. No, esto es solo tú haciendo cosas increíbles dentro de After Effects. Un problema que estoy viendo aquí es que mi rectángulo realmente se está pegando aquí a mi texto como puedes ver. Yo quiero tenerlo como un poco de área de cría, un poco de [inaudible]. Lo que puedo hacer es justo aquí, en mi expresión, antes del punto punto, asegúrate
siempre de hacer eso porque ese es el final de la frase. Tipo en más 100. Simplemente podemos hacer eso porque después de todo, el tamaño son solo valores numéricos por lo que solo podemos escribir 100 aquí. Si hacemos eso, verás que el rectángulo se vuelve 100 píxeles más ancho. Enfriar. Esa es una tercera forma de vincular algo con otra cosa, ya sabes a lo que me refiero. En cuanto a ello el valor b, chicos, hay una última cosa que quiero mostrarles porque actualmente, no
puedo cambiar la altura de ese rectángulo, como pueden ver porque es fijo. La expresión que hemos dicho que debe ser 172, no puede cambiar. No obstante, si aquí vamos a escribir algo diferente, voy a quitar eso, y vamos a decir que b, y voy a llevar el látigo de pico a la libre expresión, va a ser ese valor aquí. Se puede ver sólo puedo vincularlo a su propia propiedad. Hagámoslo y nos va a escribir automáticamente la expresión. Siempre va a echar un vistazo a la entrada en este caso. Si ahora solo hago clic de distancia, se
puede ver ahora que lo hacemos puede cambiar la altura de esa capa. Mira eso, Bazinga. Eso es en esencia cómo trabajar con la fuente, registro, y función de tiempo. Voy a dejar un enlace aquí en las notas de clase aquí otra vez sobre el propio jugador a los sitios web de Adobe donde se puede leer más sobre esta función específica. Porque sí, hay mucho más que se puede hacer, pero eso va a necesitar una clase completamente diferente también porque es grande. En esta lección, solo quería que supieras qué es y un uso
muy básico de la fuente grabar una función de tiempo, así es como trabajar con eso. Esto también es algo con lo que te vas a tropezar mucho más al crear plantillas, un fondo que seguirías la longitud de un texto. Este es un ejemplo perfecto. Muchas gracias por ver chicos y realmente espero que encuentres esta codificación no demasiado aburrida. Una vez que te las arreglas, se puede poner realmente interesante y divertido hacer todas estas cosas automáticas y dinámicas en After Effects. Te veré en la siguiente lección.
9. Conclusión: Bueno, bueno, bueno, mira eso. Acabas de completar toda la clase. Ahora todas las bromas a un lado, puedes estar realmente orgulloso de ti mismo porque esta definitivamente no fue una clase fácil. Escribir expresiones, quiero decir, eso no es algo para artistas gráficos en movimiento, así que sí, definitivamente
puedes estar muy orgulloso de ti mismo por todas las cosas nuevas geniales que has aprendido de esta clase. Pero ahora mismo es el momento de practicar esas cosas nuevas que has aprendido. Lo que quiero que hagas es crear una plantilla dentro de Adobe After Effects. Quiero que tengas en cuenta que es fácil de usar, pero también que el usuario final no puede cometer ningún error
como tener un texto que sea más largo que el tamaño de Canvas. Adelante, crea tus plantillas, y haz uso de técnicas avanzadas como vinculación de objetos, expresiones
if-else, casillas de verificación, menús desplegables, etc. Luego sube tu plantilla aquí en Skillshare bajo la aplicación del proyecto para que puedo cargarlo en mi Premiere Pro y probar tus plantillas y luego te puedo dar retroalimentación. Tengo mucha curiosidad por ver lo que ustedes van a estar haciendo. Definitivamente haz eso. Realmente estoy deseando tus plantillas. Eso fue todo para esta clase. De verdad espero que lo hayas disfrutado y, por
supuesto, hayas aprendido un montón de cosas nuevas. Muchísimas gracias por ver. Como siempre decimos, mantente creativo.