Transcripciones
1. ¡Hola! Comienza aquí: Bienvenido a UI Animation
After Effects, donde
aprenderá a dar vida a
los diseños estáticos con gráficos en movimiento limpios y con parada de
desplazamiento. After Effects es una de las
herramientas de movimiento más poderosas del planeta. Pero seamos honestos, puedo
sentirme totalmente abrumador. Se abre el
software y se congela. Demasiados paneles, demasiadas herramientas, ningún
punto de partida claro, te quedas atascado. Pierde la motivación y nunca
termines tu proyecto. La clase está hecha para
diseñadores, creadores, cualquiera que sienta
curiosidad por la animación de la interfaz de usuario, especialmente si los efectos posteriores se sintieron abrumadores o demasiado
complejos para comenzar. Pasé más de una década
editando videos, administrando dos de los
canales más grandes de sus nichos y construyendo
sistemas creativos que impulsen resultados He construido sistemas de edición que generan millones de
vistas, en esta clase, te
estoy mostrando exactamente cómo
llevar el mismo nivel de artesanía y pulido a
tus propias animaciones. Juntos, cubriremos
tres áreas principales, configurando tus diseños de interfaz de usuario, animando con flujos de trabajo profesionales y efectos posteriores,
y terminando una pieza
con diseño de sonido y
creando un proyecto de animación de interfaz de usuario pulido listo para los cortos de Tik Tok, Instagram y YouTube He incluido UI
descargables gratuitas, plantillas y archivos de práctica
para ayudarte en el camino Recomiendo ver
videos en Adi porque cada lección se
basa en la anterior. Puedes controlar la velocidad de
reproducción y el volumen de cada video
para aprender a tu propio ritmo. Si te quedas atascado necesitando ayuda, asegúrate de dejar tus preguntas
en la sección de preguntas y respuestas a continuación Solo asegúrate de verificar primero
las preguntas existentes porque es muy probable que
la
pregunta a hacer ya haya sido
respondida en detalle. En algún momento, se te
pedirá que dejes una reseña. Por favor, espere hasta que haya tenido la oportunidad de
experimentar realmente el material. Tus comentarios
me ayudan a mejorar el curso y servirte mejor a tu estudiante. Gracias de nuevo por
unirse a esta clase. Estoy realmente emocionado de ayudarte
a crear hermosas animaciones de
UI profesionales y darte la confianza, utilizarla en proyectos reales donde se base
el personal o los clientes. Vamos a saltar a
la primera lección.
2. Descarga todos los recursos de la clase, los kits de interfaz de usuario y los archivos de práctica: Ahora, en algún lugar alrededor de
este reproductor de video a
continuación o al lado de él, encontrarás recursos
descargables Estos recursos te
ayudarán a aprender mejor. Además de eso,
obtendrás algunas de mis plantillas que podrás
usar en el futuro. Entonces realmente te recomiendo
que vayas allí, lo hagas rápido, y luego saltemos
al siguiente video y
hablemos de tu animación.
3. Dónde encontrar diseños gratuitos de UI para proyectos de animación: Habla sobre cómo obtener diseños de
UI gratis. Hay una gran variedad de
formas de cómo podemos hacer esto, pero en los
próximos videos, quiero mostrarte las formas más
fáciles y
convenientes de hacerlo. Tendremos dos enfoques
con efectos posteriores, y tendremos dos
enfoques con Illustrator. Entonces, si no tienes
el Illustrator, podrás usar los
enfoques con After Effects. Pero si tienes acceso
a Illustrator, o puedes obtener acceso
a Illustrator, que puedas comprarlo
o tienes un subíndice simplemente
va a
mejorar drásticamente toda la experiencia Así que de veras, de verdad te
recomiendo eso. Ahora, la
parte más difícil con los diseños de interfaz en realidad no
es la animación. Es la preparación del diseño de
la interfaz de usuario en sí. Las animaciones son
bastante simples. Al igual que, aunque tengamos que animar 100
posiciones y capas diferentes, no
es un problema en absoluto
porque hay algunas herramientas Te voy a mostrar cómo
usarlos, y podemos ponerlo en tres
D. Es súper,
súper fácil, pero entonces
la parte de preparación es en realidad la que más tiempo
lleva. De los siguientes cuatro videos,
podemos hablar de eso, y vamos a saltar a los
siguientes cuatro videos. Ver.
4. Flujo de trabajo 1: anima capturas de pantalla con máscaras en After Effects: El enfoque más fácil pero bastante lento
que podemos usar, y este es el primero que va a
ser
una captura de pantalla
más después de los efectos. Por ejemplo, tomé una
captura de pantalla de la página de Massagm, y si queremos animar esto, entonces todo lo que tenemos que hacer es descomponerlo en trozos pequeños Puedes tomar tu propia
captura de pantalla o
puedes usar esta. No
importa para nada. Sólo voy a poner la
captura de pantalla en after effects, y voy a crear una composición del
tamaño que quiera. Voy a hacer click
va a ser 1920 por 1080, y funciona absolutamente
igual para hablar
del video horizontal, así que eso será 1080
por 920, pero de todos modos. Y en términos de longitud, realmente no
importa. Pero en este caso,
es el tiempo de 8 segundos. Voy a presionar
bien. Y luego voy a poner la
captura de pantalla aquí, y voy a entrar en el espacio de trabajo
horizontal. Ahora, voy a
seleccionar nuestra captura de pantalla. Voy a presionar
Shift Option Command o Control H. Y
va a encajar nuestra captura de pantalla básicamente en el lateral para
que el lado de la
captura de pantalla esté tocando este lado de la composición y el lado de la captura de pantalla esté tocando este lado
de la composición. Puedes presionar Mayús
opción comando G, y va a encajarlo en la parte superior e inferior,
pero estamos haciendo lado. Voy a presionar en S, turno P para abrir la
posición y escala. Y en realidad, me
encantaría moverlo un poco, así para que
no tengamos el lado a la izquierda y potencialmente
como acercar un poco. Tenemos la misma cantidad de espacio a la izquierda
y a la derecha. Y luego en la parte inferior, podemos aplicar un efecto de recorte. Entonces voy a
buscar efectos. Esto se llama consola FX, y puedes
buscarla en línea. Es solo un pop up que nos
permite buscar efectos en lugar de que yo tenga que ir
al panel Efecto
y Presets Bien, entonces sólo
voy a buscar un cultivo. Efecto de bordes de recorte. Y se puede ver que
tenemos la cosecha. Entonces, si lo aumento o disminuyo, sucede en los cuatro lados. Y porque tenemos
esta parte de hilo, significa que aquí tenemos
una expresión. Y si hago clic en
Option o Alton PC, voy a deshabilitarlo. Ahora voy a poder hacerlo de
forma independiente LO. Así que en realidad voy a hacer
clic en cada uno de estos, y voy a hacer clic en Restablecer, restablecer y restablecer Leo. Y luego lo voy a
aumentar desde abajo y podemos acercarnos para
asegurarnos de que sea perfecto. Entonces probemos 28. 29 29 en realidad es perfecto. A lo mejor 29 coma uno. Sí. Creo que esto
va a ser aún mejor. Para que veas lo
cortamos con precisión. Voy a presionar
Shift slash para volver a
la pantalla completa Y ahora mismo, en realidad, podemos
bajarlo un poco, como para que tenga el
mismo tamaño en la parte superior. Aquí, tenemos suficiente espacio en
la parte superior y en la parte inferior. Y otra cosa que
podemos hacer es presionar Comando Y
para crear un sólido. Podemos agregar un sólido blanco y ponerlo en el fondo para que ahí vaya.
Tenemos nuestra interfaz de usuario. Ahora, para descomponer esto en muchos trozos pequeños, tenemos que usar máscaras. Y antes de hacer
eso, en realidad es mejor renombrar nuestras capas. En este caso,
va a ser re genole. Ahora voy a duplicarlo, y voy a
desactivar el original, y vamos a tener el original también. Ahora, tenemos que seleccionar
nuestra herramienta de forma o
simplemente podemos presionar sobre Q y
va a seleccionarla también. Y ahora solo necesitamos
cortar era por partes. Entonces, por ejemplo,
seleccionemos nuestra capa original, y hagamos una selección.
Entonces ahí tienes. Tenemos una selección. Ahora,
voy a duplicarlo presionando Comando D o Control G. Pulsa en M
para seleccionar la máscara, eliminar la máscara, y
luego presionar Q nuevamente. Y vamos a seleccionar este icono de engranaje. Entonces una vez más,
Comando D, M, eliminar. Y seleccionemos
piso en grado D. Ahora, una vez más, comandar D M, eliminar, y hagamos esta parte. D M, suprimir. Esta parte. D, suprimir. Acercar seleccione esta parte. Y ahora necesitamos pasar por cada cosa que
tenemos en la pantalla
y recortarla, crear una máscara, básicamente. Después de eso, tendremos como 50 capas
diferentes, tal vez más, tal vez menos, y luego
podremos animarlo fácilmente Entonces hagamos un par
de cosas más aquí. Sólo para ahorrarle un
poco de tiempo. No voy a hacer una
muy buena selección, pero sólo voy a acelerar
esto un poco. Entonces, por ejemplo,
voy a seleccionar dos en lugar de cada uno
de ellos por separado. D, suprimir. Seleccionemos esta parte también. Vamos, D, M, borre. Seleccionemos esta
parte en la parte inferior. Como, más o menos tan genial. Entonces si deshabilito,
sí, ahí vamos. Una cosa que sí te recomiendo que hagas es cambiarle el nombre correctamente. Esto va a ser
asa IG, por ejemplo. Esto va a ser,
como, icono de engranaje. Este va a ser el nombre. Y para el texto, en vez de simplemente decir el
nombre, por ejemplo, podemos poner mi nombre real, que es Vlocity, que es
lo que tenemos en el Instagram No hay bien o mal.
Es lo que funciona mejor para ti y es más fácil de entender
para ti. Entonces para esta parte,
esto es posts. Esto es seguidores siguiendo
Avatar Imagen de Avatar, botones, destacados, y
esto va a ser publicaciones. Esto lo hace mucho mejor. Otra cosa que podemos
hacer es, por ejemplo, podemos seleccionar todos estos y establecer un color específico,
como, por ejemplo,
naranja para que sepamos
que todo lo que
tenemos el naranja va a
ser como aquí en la parte superior. Y luego, por ejemplo, para los botones, podemos establecer
los botones de otro color. Y digamos que teníamos, como, un par de botones diferentes, entonces sería
rosa o en realidad, pongamos fucha, va a ser solo un
poco más de contraste Para los aspectos más destacados
y las publicaciones, esa puede ser otra. O, por ejemplo, si tuviéramos
como diez reflejos diferentes, tendríamos diez capas diferentes, y pondríamos
diferentes colores. Entonces así es como lo haces. tiene alguna duda, házmelo saber. A que eso para ti
en el siguiente video.
5. Flujo de trabajo 2: recrea interfaces de usuario a partir de capturas de pantalla directamente en After Effects: Para el segundo enfoque
para crear diseños de UI, también
tenemos que
usar after effects, pero en este caso, tenemos que
recrear el diseño de UI Usemos exactamente
la
misma captura de pantalla que teníamos en el video anterior. Voy a crear
otra composición, que va a ser
horizontal y voy a poner nuestra captura de pantalla
aquí o en realidad, podemos simplemente copiar
nuestro original más el sólido blanco del
anterior, pas aquí. Y habilite la captura de pantalla. Y tal vez te estés
preguntando, ¿cuál es el motivo de esta recreación? Y hay una muy buena razón porque si entramos en
la comp anterior, voy a crear
un nulo presionando Mayús Opción Comando Y y
luego seleccionarlo todo, clic en el nulo
presionando Comando o Control, y voy a padre de
todo al nulo, presione en S, aumente la escala, y hagamos como P también. Y podemos ver que
cuando acercamos el zoom, tenemos mala calidad. Esto no es de buena calidad. Pero si lo recreamos nosotros mismos, entonces podremos
esturizar capas Y te voy a mostrar
lo que eso significa. Vamos a hacer zoom un poco atrás. Escribamos esta palabra taffy, que es el nombre del perro No Tafo sino taffy. Bien. Y vamos a hacerlo
un poco más pequeño, solo para asegurarnos de que le quede a P
y lo voy a poner aquí. Y se puede ver
que la capa de texto tiene este botón aquí, rasterizar Ni siquiera soy capaz de desactivarlo. En realidad lo voy a
poner un poco a la izquierda para que
tengamos una buena comparación. Y voy a ser padre de este
taffy al nulo también, y voy a
aumentar todo en tamaño. Se puede
ver la diferencia. Esto tiene una calidad increíble. Esto tiene una
cualidad terrible porque esto es screentot y esta es una capa de texto
rasterizado Entonces esa es toda la
razón por la que tenemos que hacerlo. Así. O sea,
no tienes que hacerlo, pero es una muy buena manera de
mantener la calidad. Y por ejemplo, si realmente
quieres acercar algunos de los textos o algunas de las capas, así es
como lo haces. Y también
te voy a mostrar después cómo puedes guardar todo como plantilla para que no tengas que
recrear cada vez Vamos a la comp número dos, y vamos a seleccionar la herramienta de rectángulo
redondo, y vamos a acercar. Entonces aquí, tendríamos que ir
por algo como esto. Por cierto, no tiene que
ser, como, súper perfecto. Voy a abrir el camino
rectangular y disminuir
un poco la redondez para que encaje perfectamente. Todo lo que estoy haciendo aquí
es decir, ¿encaja con esta línea o no? Y cuando lo hace,
es bueno para ir. Genial. Esto va
a ser más moldeador. Y para el color, sólo
voy a
seleccionar este color. Entonces podemos
duplicarlo, presionar sobre P, moverlo hacia la derecha, y podemos acercarnos para
asegurarnos de que sea perfecto. Mmm, más o menos así. Una vez más, no
tiene que ser perfecto. Cuando la gente ve estas líneas de animaciones
Yo, gente ni siquiera
se da cuenta de que no se registra, cosas como esta porque es solo la forma en que funciona nuestro cerebro. Entonces tendríamos que
llamar a este botón a la izquierda. Esto va a
ser botón derecho. Y deshabilitemos esto. Ver lo que tenemos
en términos de texto. Editar perfil y ver archivo. Bien. Entonces, pongamos nuestro texto. Voy a desactivar
estos botones por ahora. Edita perfil, y voy a acercar el zoom. Sí, ahí tienes. Este es un
ajuste perfecto. Y ahora, si habilito el botón izquierdo, póngalo aquí y
seleccione estos dos. Entonces, si lo deshabilito o habilito, ni siquiera
podemos decir
la diferencia, antes y después,
antes y después. Por supuesto, hay un poco de muy
poco de diferencia,
pero una diferencia tan pequeña, gente nunca se da cuenta. Entonces voy a duplicar el perfil de
edición, presionar en P, y cambiemos el
texto para ver archivo, presionar en P una vez más
y moverlo hacia la izquierda. Ahí vas. Y ahora
voy a padre el archivo ver al botón derecho y editar perfil
al botón izquierdo. Y voy a
habilitar también, así. Porque lo criamos, yo uso
si muevo el botón izquierdo, se
puede ver que tenemos el movimiento de
texto con el botón, lo cual es súper conveniente, y así es como debería ser Para este texto, es
bastante fácil de replicar. Es exactamente lo
mismo. Simplemente creas una capa de texto
y la pones, asegúrate de que encaje perfectamente. Las fotos, es
un poco más difícil. Los largos son cortos, nunca
podremos
rasterizar imágenes a menos que sea
IA o algo así Las fotos siempre
van a perder calidad. Entonces, si usted
mismo tiene una imagen de
alta calidad , sí, puede hacerlo. Entonces lo harías así. Crearías un círculo. Bien, digamos que
va a ser así. Y entonces todo lo que tienes que hacer
es track mat la foto de ti mismo a esa capa de forma y va a ser
este recorte, ¿verdad Pero entonces cada vez que
vamos a aumentar de tamaño, sigue siendo el panorama va a disminuir en calidad. Si quieres
pasar por la molestia de hacerlo por
cada foto, puedes. Pero con las imágenes, está
bien crear máscaras. Todo lo que tenga fotos, sólo
vamos a
mantenerlo como está. Y solo por el texto
y para los botones de la interfaz de usuario, tenemos que recrearlo. Y si estamos
hablando de estos botones aquí, podemos recrearlo
usando la capa shape Entonces tendríamos que
crear en realidad, vamos a seleccionar el rectángulo
redondeado podamos hacerlo así. Y al presionar shift, voy a asegurarme de
que sea rectángulo cuadrado, camino
rectángulo,
disminuir
un poco la redondez para que encaje En lugar del color sólido, vamos a usar
un trazo sólido y lo haremos de este color, disminuiremos el
ancho del trazo, por ejemplo. Dentro de esta capa de forma, vamos a crear
otra forma yendo de aquí a aquí y
voy a presionar al turno. Se va a crear
la capa de forma. Y voy a dibujar
voy a seleccionar la capa de forma, dibujar una línea de aquí para
aquí y de aquí para aquí. Y luego en el medio,
necesitamos crear la striangle que
podemos hacer con el startol Entonces todo lo que tenemos que hacer es
crear el startol y luego
con el desplazador de un mouse, disminuir el número de ángulos
para crear la Solo necesitas hacerlo
mucho más pequeño en tamaño. Como, ¿qué tan grande es este? Más o menos así. Y
luego para este polystr solo
necesitamos abrir sus
propiedades, y quiero decir, podemos moverlo
así, o podemos abrir las propiedades de transformación del mismo y luego
moverlo de derecha e izquierda Y ahora, si muevo
toda esta capa de forma, que va a ser este
botón. Ahí vas. Nosotros solo recreamos este
botón nosotros mismos. Y si
lo hiciéramos en la
posición anterior donde estaba, ni siquiera se
puede decir
la diferencia. A lo mejor podemos disminuir un poco
el trazo seleccionando todas las capas
y luego el ancho del trazo, pongámoslo a dos,
hazlo un poco más pequeño. Y luego para la S, podemos disminuir en realidad, necesitamos poner el
punto de anclaje al centro. Para eso, necesito
seleccionar tu capa y presionar en comando y
luego hacer doble clic aquí, va a centrar
el punto de anclaje aquí. Ahora bien, si disminuimos la escala, esto es lo que va a pasar. Voy a abrir el contenido de la capa de
forma PolyStarf la
propia polistía, el color del trazo, vamos a usar el color de
relleno sólido y necesitamos que sea de este color, Y, bien, podemos aumentar un poco
la escala de esta
cosa. Ahí vas.
Así es como puedes recrear cada botón Este es mucho más fácil. Este es un poco más difícil, pero es exactamente lo mismo. Es exactamente el mismo proceso
de sólo recrearlo. Una vez que tengas todas estas capas, listas para ser animadas, los
próximos dos videos, te
mostraré cómo usar Illustrator. Entonces, si no usas Illustrator,
puedes saltarte esos videos. Pero si quieres saber
cómo
llevarlo al siguiente nivel, entonces realmente
te recomiendo que veas el siguiente video. Entonces si tienes alguna duda, avísame, agrega eso
en el siguiente video.
6. Flujo de trabajo 3: animación de diseños Figma con Illustrator + AE: Bienvenida. En este video,
exploraremos cómo usar Illustrator con FIGMA. FGMA es una aplicación donde
puedes obtener todo tipo de diseños
interesantes, y es absolutamente gratis No tienes que pagar
por ello ni nada. Entonces solo tiene Figma
instalado, inicie sesión. Y luego una vez que inicias sesión, si descargas una app
o usas el navegador, es muy similar, por lo que
necesitas entrar en la comunidad. Y aquí tenemos que
buscar todo tipo de UI. Entonces, por ejemplo,
podemos buscar interfaz de usuario
MAC Se va
a abrir muchas cosas aquí. Pero en realidad me
gusta bastante este. Entonces, si hago doble clic en él, y después hago clic
en Abrir Infigma, va a tomar
algún tiempo cargarse Tenemos muchos diseños de
interfaz de usuario diferentes aquí. Y si me acerco
presionando comando o control y usando la rueda de
desplazamiento del mouse, realmente
puedo acercar el zoom y puedo ver la calidad se mantiene muy buena. ¿Verdad? Puedo acercarme a
absolutamente todo. La calidad es una locura porque
estamos usando archivos S SVG. Y estos son los archivos que básicamente
son los mismos que
el texto y después de los efectos, que pueden sturizar Entonces por eso tenemos
esta muy buena calidad, aunque realmente,
realmente nos acercamos. Entonces tenemos muchas cosas. Y necesitamos seleccionar uno de los
diseños que nos gusten. Seleccionemos esta
primera. Podemos seleccionar el negro
o el blanco. La forma en que seleccionas Figma es
que necesitas hacer doble clic y puedes mover las cosas
alrededor de lo que hayas seleccionado Pero seleccionamos ambos,
y podemos cualquiera de los dos tipos de ir
aquí y seleccionarlo así. Ahora, seleccionamos el Negro. O digamos que simplemente lo
disecto todo, puedo hacer doble clic en seleccionar
ambos de nuevo, y puedo duplicar aquí otra vez, y ahora va a seleccionar
el de la derecha Por lo que puede hacer clic aquí la izquierda hasta seleccionar
exactamente lo que necesita, o simplemente puede
hacer clic en la pantalla. Y digamos que quiero
seleccionar como música. Tengo que hacer click, Duble click, doble click hasta
seleccionar la música Pero no necesitamos
ir tan lejos,
así que voy a
alejar un poco, seleccionar seleccionar. Este es
el que necesito. Y voy a hacer click derecho copiar y pegar como SVJs
realmente importantes Ahora, necesitamos abrir
Illustrator y dar click sobre ti. Web Grande, 1920 por 1080. Si quieres cuatro K, siempre
puedes hacerlo, pero 1920 por 1080 va
a ser muy, muy bueno. Por cierto, cuanto mayor sea
la resolución, más difícil va a ser en tu computadora porque esto
va a tomar bastante energía para tu computadora, sobre todo en after
effects.
Entonces eso es genial. 1920 por 1080. Y porque copiamos a SVJ, sólo
voy a
presionar el Comando V, y va a
llevar algún tiempo Ahí vas. Se puede ver que el tamaño es
ligeramente diferente, y tenemos que buscar obras de arte que
se ajusten a los límites Entonces necesitamos entrar en
objeto, mesas de trabajo, encajar a los límites de la mesa de trabajo, y va a
ajustarlo automáticamente a la pantalla, lo que simplemente facilita mucho
las cosas Ahora, la forma en que funciona en
Illustrator es que tienes capas. Ahora mismo, esto
es todo una capa. Pero si la abro y la
abro y la abro, tendremos
bastantes capas más. El problema es que
cuando tenemos una capa, esa capa controla todo. Y si queremos
separarlos en diferentes capas, necesitamos seleccionar todas estas. Así que tenemos que abrirlo
hasta que básicamente
obtengamos muchas capas
pequeñas diferentes, y luego necesitamos
rastrearlas en la capa número uno. Y ahora seleccionando
la capa número uno, necesitamos dar click en los
tres puntos aquí y dar click en liberar secuencia de dos capas. Ahora, necesitamos
seleccionarlos una vez más, seleccionar todo y luego
arrastrarlos fuera de esa capa. Y así ahora verán que
tenemos esta parte separada. Tenemos esta parte separada, esta parte separada, ya sabes, este botón separado,
el fondo separado. Mientras que antes lo teníamos
todo en debajo de una capa. Y digamos que quiero que estos
también se separen. Entonces tenemos que seleccionarlo, y va a
ser la capa número 19. Vamos a abrirlo, abrirlo, abrirlo. Ahí vamos. Y
ahora tenemos muchas cosas. Así que sólo voy
a seleccionar todo esto, todo lo
que está debajo de esto. Seleccione todo.
La máscara de recorte no
es algo que
tengamos que seleccionar Es sólo una máscara que era una máscara que ocultaba
estas partes en la parte inferior. Ahora que lo arrastramos
hacia fuera a una capa deshecha, solo
seleccionamos una
vez más nuestra capa, damos
clic aquí una vez más, liberamos a la secuencia de capas Y ahora, una vez más,
selecciona todo esto, 181 capas y
arrástralas fuera de esa capa. Y ahora cada pieza
va a estar separada. Entonces ahora puedo mover
música, esta parte, este fondo,
este fondo, cada botón,
mover cada cosa. Ahora bien, para estas partes
en la parte inferior, porque solo son un
poco raras en este punto, podemos o bien
seleccionarla y eliminarla. Así y esta parte también. O podemos hacerlo más adelante
en después de los efectos. Pero en este punto, lo que
vamos a hacer, voy a presionar el Comando
cero para que se ajuste a la pantalla. Y ahora necesito presionar el
Comando S para guardar
esto como un archivo. Voy a guardarlo en escritorio. Como archivo de Illustrator, sí, guarda y presiona Bien. Ahora, cuando lleguemos
a after
effects, voy a simplemente
arrastrar nuestro archivo aquí. Y aquí hay una parte muy
importante. Tienes metraje y tienes composición en el tipo de importación, y necesitamos
importarlo como composición, súper importante este paso. Ahora, en las dimensiones del metraje, tenemos que hacer el tamaño de la capa. La diferencia
entre la capa y el tamaño del documento es cuando
tenemos el tamaño de capa, significa que
cada capa estará limitada a su tamaño original. Básicamente, el mouse
será del tamaño del mouse. Y si trato de
tocarlo, va a ser del
tamaño del ratón. Pero entonces si tenemos el
tamaño de capa como el tamaño del documento, imagina que el mouse que
vemos es así de pequeño, pero luego cuando intente tocarlo, voy a mover
toda la habitación a mi alrededor porque va a ser
del tamaño del documento. Básicamente, cada cosa aquí va a ser del
tamaño del documento, y no queremos
que eso suceda. Queremos ser el tamaño de la capa. Entonces voy a presionar Bien, y tardará algún tiempo en cargarse. Eso generalmente no
toma mucho tiempo, tal vez un par de segundos,
a veces como 20, 30 segundos, a veces incluso un minuto, dependiendo de
cuántas capas tengas porque tiene que
pasar por cada
capa para importarla. Ahí vas. Y ahora, si hago
doble clic en nuestro Sin título, lo
tendremos aquí Solo necesito cargar un poco porque tenemos
una gran cantidad de capas. Y ahora, verás que tenemos cada cosa
como una capa separada. Pero si presiono el Comando K, verás que el ancho
es de 14 40 por altura, 900. Entonces el tamaño es bastante pequeño, y luego si me
acerco, podemos ver que la calidad no es súper buena. Pero honestamente, no
importa porque podemos aumentar el tamaño a 1920 por 1080, vamos a presionar K, p persona
shift slash para que encaje Y así recuerda cuando lo
importamos, fue más o menos
así en Illustrator. No fue un ajuste perfecto. La mesa de trabajo, el fondo era
un poco más grande Y ahora, lo que podemos hacer aquí, algo súper interesante
es que podemos crear un comando null, shift option Y, seleccionar todo
pulsando Comando A, y luego manteniendo presionado
comando o control, seleccionar el nulo para deselecciónarlo Y luego padre todo a la n. va
a llevar algún tiempo. En realidad,
seleccionemos todo y hagamos clic en este botón
para rasterizar Una vez más, tardará
algún tiempo en cargarlo. Pero luego una vez que aumentemos
el tamaño de todo en los efectos posteriores,
aumentemos. Ahí vas.
Se puede ver que la calidad se mantiene absolutamente
igual para todo. La calidad es
muy, muy buena. Es casi imposible
conseguir este tipo de quiero decir, es
imposible obtener este tipo de calidad
a partir
de la captura de pantalla. Ahora que tenemos todas
estas capas, podemos aumentar o disminuir la escala de
cada capa. Podemos decir que selecciono a
esta persona P, puedo moverme por
cada pieza. Entonces así es como creas tus diseños
I en Illustrator. Vamos a saltar al siguiente video. También otra forma de crear
I diseños en Illustrator. Y poco después de eso,
saltaremos a animar todo Entonces si tienes alguna
duda, avísame, y eso a ti en
el siguiente video.
7. Flujo de trabajo 4: importa archivos de UI PDF a Illustrator y After Effects: Bien, hablemos de la
última forma de crear diseños de UI. Imagina tomar una
captura de pantalla y luego tener que cortar
cada palabra, cada ícono justo aquí, va a tomar
bastante tiempo. Y podemos acelerar este
proceso de manera significativa. Te voy a mostrar dos formas, una en Mac y otra en Windows. Si vamos a Safari, realidad
podemos entrar en Archivo
y luego exportar como PDF. Ve a Escritorio, Google, llamémoslo, Mac aquí. Y luego lo mismo, si entramos en Chrome, tenemos que entrar en Archivo. Imprima, guarde como PDF y guardémoslo como PDF. Y vamos a venir al escritorio
y llamarlo Windows. Ahora, descubrí que funciona
mucho mejor en MAC a través Safi por la forma en que
Safi crea un PDF Básicamente, lo que
hacemos es crear PDF de la página en
lo que sea que estemos. Y esto es, si tengo una vista previa, así es como se ve la
página. Pero entonces si entro en Windows, así es como se ve la
página. Ligeramente diferente.
Entonces esto es de Chrome y esto es de Safari. Ahora, lo que tengo que hacer
es, entonces esta es Mac. Esto es Safari, haz clic derecho en
abrir con Illustrator. Algunos de los
objetos PDF han sido reinterpretados porque no
siempre es perfecto, solo presiona Nook Reemplazar fuentes, está
bien. Simplemente haga clic en Reino Unido. Puede seleccionar la fuente con la que
desea reemplazarla. Y ahí tienes. Esta es toda la página.
Es así de simple. Ahora, obviamente podemos
seleccionar todo. En realidad, seleccionamos la capa,
pulsamos sobre liberar
capa para secuenciar. Selecciona todo
y solo sácalo. Y entonces podemos mover
cada cosa. Cada cosa es
su propia capa ahora, que es súper,
súper conveniente, ¿
verdad? Exactamente lo mismo. Simplemente guárdalo como un archivo
illustrator, póngalo en after effects. Bueno para ir archivo, sálvanos. Illustrator, Adobe
Illustrator, y sí, guárdalo. Genial. No obstante, si hago lo
mismo con Windows, es exactamente el mismo proceso. Así que abre con Ado
Illustrator, presionando bien. Esta es nuestra página, que definitivamente
puedes decir se ve
ligeramente diferente, pero sigue siendo lo suficientemente buena
para la animación. Y tenemos que hacer
exactamente lo mismo, liberar capa a secuencia, seleccionar todas las capas,
arrastrarlas hacia afuera. Y entonces una vez más,
cada cosa se convierte en lo
suyo para animar. Entonces hagamos exactamente
eso, sálvanos. Illustrator, y
lo guardamos en escritorio,
va a haber ventanas. Y ahora, si seleccionamos nuestro MAC, por ejemplo, y
lo metemos una vez más, composición
tamaño de capa, súper importante, pulsamos N k Va a
tomar algún tiempo para cargarlo, y luego
tendremos que hacer exactamente lo mismo para el Windows. Ahora bien, si hago doble
clic en éste, algo muy parecido a
lo que teníamos antes, tenemos, una vez más, cientos y cientos de capas. Cada capa es móvil, y ahí tienes. Sólo tenemos que
seleccionar la correcta. Perfecto. Y luego podemos
mover cada texto aquí solo para mostrarte que
tenemos exactamente lo mismo para el de Windows. Aquí composición tamaño de capa, haga clic en Bien,
haga doble clic sobre ella. Ahí vas. Este es un color un poco
interesante, así que voy a añadir un sólido. Vamos a hacerlo blanco,
y voy a ponerlo al fondo,
y ahí tienes. Y una vez más, aquí podemos mover
cada parte. Entonces es solo la
diferencia entre el safari y el chrome
es el formateo. El formateo de
safari es mejor, pero podemos hacerlo para
diferentes sitios web. Algunos de los sitios web no
funcionan muy bien porque si yo, por ejemplo, voy a YouTube, y hago
lo mismo con YouTube. Exportar SPDF. Sí, hagámoslo en la pantalla de inicio. Y luego esto es YouTube. Voy a abrirlo con
Illustrator, persona k. puede ver que en realidad, todo el texto
se ve raro. Es por los diferentes
formatos que utilizan. Si lo hiciéramos, así, todo lo que tenemos que hacer
es, por ejemplo, seleccionar nuestro texto,
algo como esto,
como smartphone Awards 2025, entrar en Illustrator, Zoom in. En tramposo, como el texto, ponlo, y ahí tienes. Es exactamente
lo mismo. Es solo que
tenemos que
trabajarlo un poco, pero ahorra bastante tiempo. Entonces cada enfoque es bastante bueno, pero cada enfoque
tiene sus ventajas, desventajas, y es
solo la forma en que funciona. Si tiene alguna
duda, házmelo saber. Agregar que eso te veo
en el siguiente video.
8. Crear plantillas de UI reutilizables para futuros proyectos en movimiento: En este video,
déjame mostrarte cómo crear plantillas reutilizables. Siempre que tenemos una captura de pantalla, acabamos de crear máscaras
alrededor de after effects o
volvimos a crear una
captura de pantalla en after effects o usamos un
Illustrator o PDF. La forma en que podemos reutilizar esto en el futuro es guardar el archivo
después del efecto. Con esto, todo lo que tengo que hacer es presionar Comando S y me
va a pedir
que guarde el archivo. Sólo voy a
guardarlo en una prensa de escritorio y guardar y voy
a cerrar este proyecto. Si creo otro proyecto, va a ser, por ejemplo, con esta nueva composición, todo lo que tengo que hacer es seleccionar
nuestro proyecto Aftereffects Esta va a ser plantilla, y solo voy a
arrastrarla y soltarla aquí, y va a tener nuestras
diferentes composiciones. Y así todo lo que tenemos que hacer es arrastrar nuestras composiciones aquí
y va a funcionar. Siempre que hacemos cambios aquí, por ejemplo, tenemos
las diferentes capas. Aumentamos algunas de las capas. Tal vez seleccionemos algunos más. Persona S, aumentar
un par de partes. Quiero decir, puedes ver que hemos hecho algunas diferencias
aquí, ¿verdad? Y voy a ser persona
y como dicen este proyecto, va a
haber
como proyecto de video, y voy a
cerrar este proyecto, y voy a
abrir nuestra plantilla. Y nuestra plantilla,
nada ha cambiado, pero todo lo que
ha cambiado solo ha cambiado en este proyecto de after
effects. Entonces esta es la forma en que
puedo crear plantilla. Obviamente guarda los archivos de
Illustrator. Es particularmente muy
útil si estás usando el screentot porque si
estás usando los archivos de illustrator,
obviamente, puedes
simplemente arrastrarlo y soltarlo en el proyecto y crear
una composición con No necesariamente
tienes que guardar un
proyecto de after effects con él, pero aún así vas a agregar solo un poco más de
comodidad para ti porque no tienes que
importarlo la próxima vez. Y por ejemplo, si moviste
un par de cosas por
ahí, todavía va a
ser bastante útil. Entonces así es como lo haces.
Si tienes alguna duda, hazme saber que
te veo en el siguiente video.
9. Cómo usar Animation Composer para diseñar movimiento en UI: Bienvenida. En este
video, me gustaría presentarte a
Animation Composer, una increíble herramienta gratuita que nos ayudará a
animarlo Entonces este es un sitio web de Mr . Horse, misterhors.com, y aquí tenemos al compositor de
Animación, que puedes obtener entrando en las marcas de productos
para after effects, y vamos a tener
el Ahora, el enlace va a estar
en la sección de recursos, por lo que podrás
acceder fácilmente allí a él. Esta es una versión gratuita, pero hay una opción
para obtener una versión de pago, que va a
tener mucho más. Pero honestamente, la versión gratuita es increíblemente buena, y
yo uso la versión gratuita Por cierto,
también es para estreno, así que puede ser muy,
muy bueno. De todas formas, puedes echar un
vistazo a en qué consiste esto, pero te voy a mostrar cómo vamos a animar
nuestros diseños de UI con él Entonces, cuando te metes en después de
EFFXs una vez que lo instalas, la instalación
es bastante simple Sigue las
instrucciones, yendo a la ventana y
compositor de animación aquí en la parte superior, y luego tendrás
esta ventana emergente. Acabo de poner aquí a
la derecha
porque es conveniente
para mí estar aquí. Y en la vertical, la
tengo aquí. Digamos, voy a importar este video
aquí composición, tamaño de
capa, y persona K, y lo voy a abrir. Entonces tenemos 100 capas diferentes, y digamos que queremos que todas estas capas aparezcan
en la pantalla una tras otra para que tengamos este efecto muy interesante
donde es una por una, casi como una ametralladora. Para hacer eso, solo
necesitamos
encontrar la capa con la
que comienza, y en este caso,
esto tendría que
encontrar tal vez esto. Vamos a revisar. Entonces capa diez. Y luego si selecciono
esto, bien, genial. Genial. Genial, genial, genial. Bien, así que hasta aquí. Y voy a marcarlo
con otro color. Vamos por el naranja.
Solo comprobemos que cada vez que
seleccionemos capas T, va a ser otra cosa. Bien, entonces vamos a
animar todo lo que
empiece como todo lo que está
por debajo de este punto y
por encima de este punto, básicamente todo lo que
tenemos aquí Básicamente, así. Vamos a animar
todo así. Y para ello,
seleccionamos todos estos. Marcarlos con otro color para
que sea fácil para
nosotros identificarlo. Y ahora tenemos que
volver a seleccionar todo, y tenemos que ir al compositor de
animación, y tenemos que
buscar ajustes preestablecidos de movimiento Básicamente, es solo la forma una cierta capa va
a aparecer en la pantalla, y tienes muchas opciones
diferentes. El momento del compositor de
animación muchas veces viene
del punto de anclaje, y podemos ver
que el punto nc, está aquí para déjame mostrarte
realmente Entonces para esta capa, está aquí. Para esta capa, el punto ancho está justo ahí en el medio. Para esta capa,
está en el medio. Pero a veces
no siempre es perfecto. El punto ancho podría
estar un poco apagado. Entonces digamos, para palabras
específicas, el punto ancho podría ser que
podemos cambiar el
punto ancho presionando aquí y puedo mover el punto ancho un
poco hacia la izquierda. Y lo que va a pasar es, déjame presionar sobre S. Si
disminuyo o aumento
el tamaño de esa capa, va a disminuir o aumentar con base en
el punto ancha, que es lo que
no queremos que suceda. Quiero asegurarme de que el punto ancho
esté en el medio. Y la razón por la que te
estoy diciendo esto es porque si digamos que el punto ancho está
un poco a lado y presionamos en
algún tipo de animación. Bien, vamos por esta. Sí. Para que veas que va a aparecer un
poco de lado, que es algo que
no queremos que suceda. Entonces para evitar eso, si nuestro punto de anclaje está un
poco a un lado, todo lo que tenemos que hacer es
hacer clic en el taburete y simplemente mover el
punto de anclaje hacia la mitad. O si está un
poco a un lado, podemos presionar en comando o Control y luego hacer
doble clic aquí, y va a estar justo
en el medio de esa capa. Ahora que tenemos
eso fuera del camino, vamos a seleccionar todas nuestras capas, y vamos a navegar y vamos a
hacer este exceso Y vamos a hacer click en I. Yo sólo voy a
encajar en la pantalla. Y ahí tienes. Tenemos todas estas capas aparecen en la pantalla
todas al mismo tiempo. Ahora bien, si quiero que cada capa
aparezca una por una, así que una tras otra, necesitamos seleccionar
todas estas capas. Y luego si entramos en la pestaña de edición en el compositor de
animación, verás que
tenemos selección de capas. Aquí, tenemos que pasar
esto un poco, digamos, como un fotograma. Entonces solo voy a agregar aquí uno al final
y presionar Enter. Y verás que
moverá cada capa, un poco hacia un
lado para que
tengamos esta animación muy suave. Ahora, juguémoslo
y veamos cómo se ve. Genial. Y aquí realmente podemos personalizar
cuál nos gusta. Entonces podemos hacerlo al azar. Podemos hacerlo en orden
de selección o podemos
hacerlo ascendente, descendente. Entonces, si quisiera que esto
sucediera al revés, haríamos exactamente
lo mismo, y yo solo pondría asombro
al final, persona entra. Entonces en vez de que sea
desde abajo, sería desde arriba. Déjenme deseleccionar. deseleccionar todo donde
persona Shift Comando A. Así que si tienes, como,
muchas selecciones, puedes presionar Mayús Comando
A y vas a deseleccionar Sí, ahí tienes. Muy,
muy bueno, muy suave. Con compositor de animación, quiero
decir, hay mucho más. Hay todo tipo
de animaciones de texto, pero vamos a
hablar de texto en un par de videos
donde usaremos el texto Evo en una increíble herramienta
gratuita también Entonces tenemos títulos,
transiciones, componentes
gráficos, suena
muy bien, también. Así que definitivamente puedes explorar. Es solo que realmente
quería
mostrarte que puedes animar a granel y algo que te
va a ahorrar una cantidad de
tiempo increíble También podemos ir y hacer al azar. Ver la diferencia. Entonces ahora, como puedes ver, es solo
un poco aleatorio. Pero la diferencia no
es significativa. Así podemos seguir adelante y hacer
al azar pero un poco más. Vamos por, como, 14 Ahí tienes. Se ve muy, muy
bien. Imagínese hacer esto a mano con
cada capa, tomaría un montón de tiempo. Así que realmente, muy grande ahorrador. Ahora, tal vez te estés
preguntando, bien, ¿cómo ponemos eso en el video? Y luego en un par
de videos, una vez más, te
mostraré cómo
creo realmente un video completo a partir de esto usando el
compositor de animación y todas las capas y, como, todos los
métodos que usamos. Entonces cubriremos esos próximos videos. Agrega que eso, si tienes
alguna duda, házmelo saber. Agrega eso, te veré
en el siguiente video.
10. Añade profundidad 3D con este complemento imprescindible de After Effects: En este video,
hablaremos sobre cómo
llevar nuestras animaciones Yo
al siguiente nivel. Si tienes una
interfaz de usuario de palabras animaciones en línea, entonces verás que
a veces estas animaciones se convierten en tres D. Y la pregunta es, ¿cómo lo hacemos tres D? Hay una manera muy fácil de
hacerlo en after effects, realidad
es con el
plugin llamado depth. Una vez más, es
absolutamente gratis. Sólo tienes que seguir adelante y lo vendí. Entonces déjame mostrarte
cómo se hace. Cuando llegues a este sitio web, solo tienes que seguir adelante y dar
clic en el precio cero y luego hacer clic en comprar este estuche de nuevo porque lo
he comprado antes. Adelante, cógelo. Hay que ponerlo en carpeta
Adobe After Effects en scripts. Script tus paneles y sólo tienes que arrastrar y soltar aquí se puede
ver la profundidad. La tengo aquí. Y luego una vez que llegues
a after effects, solo tienes que entrar en Window, y necesitamos tenerlo habilitado aquí profundidad. Entonces lo pongo junto al compositor de
animación aquí, y una vez más, necesitamos identificar qué
capas están donde exactamente e identificar
qué capas queremos hacer tres D, qué capas queremos separar en tres D. En este caso, quiero separar
todo lo que va a estar aquí en el medio, como dentro del buscador,
dentro de esta carpeta. Quiero asegurarme de que
encuentre bien a cada uno, así que tenemos algo aquí. Entonces tenemos este texto, ¿de acuerdo? Podemos marcar esto con naranja. Básicamente, solo necesitamos
encontrar todo lo que es así que
vamos de arriba a
abajo. Bien, hasta aquí. La forma en que estoy haciendo esto es
que solo estoy tratando de encontrar la capa que
no está en el medio. Y empiezo con capa ahí es donde está
con esta capa, que es la primera capa
dentro de este marco, dentro de la carpeta
porque esta es, como, es otra cosa, ¿verdad? No estoy seguro de qué es exactamente, pero definitivamente es
algo diferente. De todas formas, así que tenemos que
marcarlas con color. Seleccionemos todo
presione en naranja. Bien. Entonces ahora tenemos
todo en naranja. Genial. Así que cada vez que convertimos algo en
tres D y después del
efecto y creamos espacio
entre tres capas D. Si movemos la capa
un poco más lejos o más cerca de la cámara, la capa se vuelve un poco más grande o
un poco más pequeña. Y este plugin
nos permite básicamente mantener el mismo tamaño
cada vez que lo movemos un poco más o
más cerca de la cámara. Déjame crear otra
composición para mostrarte esto. Digamos que tenemos
algo así. Y digamos que giramos ambos de estos tres D dando clic
en este botón aquí. Por cierto, si
no tienes las tres D, puedes simplemente cambiar
haciendo clic en este botón aquí
a Toggle Switch, y puedes hacerlo tres D. Muévelo un
poco hacia la izquierda, y voy a agregar
un segundo visor. Y este espectador va
a ser desde arriba. Y para simplificar un
poco las cosas, vayamos a Advanced
three D, el renderizador, y agreguemos un poco
de la profundidad de extrusión para que podamos ver las cosas
un poco mejor Este es nuestro círculo, y
este es nuestro rectángulo. Y si hago clic en R, puedo mostrártelo
así, ¿verdad? Entonces puedes ver esta es
la vista desde arriba. Esta es la vista
justo desde el frente. Vamos persona P. Digamos que
quiero crear algún
espacio entre estos dos, así que muevo nuestro círculo un poco más
lejos de la cámara. O, en este caso, todavía no
tenemos la cámara, pero en realidad no importa. Lo movemos más,
y se puede ver aquí, se vuelve un poco más pequeño. Entonces, cuando la persona ordena
eso, se hizo un poco más grande. Este se hizo un
poco más pequeño, y también se puede ver que
se mueve dentro de la pantalla. Y si digamos que quiero
acercar este un poco más a la
pantalla o a la cámara. Entonces ahora tenemos algo de
espacio entre ellos. Se puede ver que
éste se hizo mucho más grande y también cambió
su posición. Ahora, en realidad podemos evitarlo teniendo el plugin depth. Apaguemos los
tres D. Digamos que es como debería
ser desde el
principio, ¿verdad? Y hago clic en dispersar. Bien. Entonces actualmente, estos
están en la misma posición, pero si vuelvo a hacer clic en
dispersar, verán
que sí se
movió un poco. Entonces este está ahora más
lejos. Este está más cerca. Pero a pesar de que estos
cambiaron la posición, ya
sabes, en la pantalla, permanecen igual, ¿verdad? Entonces antes y después antes,
después antes y después. Y si echamos un
vistazo a lo que está sucediendo, la escala cambia y la
posición también cambia. Para esta, la posición es cero porque ahí es
donde está el cero. Pero para esta, para la plaza, está un
poco más lejos. Es a mil, y eso es
exactamente lo que tenemos aquí. El espaciado de capas es de 1,000. Y si queremos que las capas
se alejen más, más cerca a la
misma distancia, todo lo que tenemos que hacer
es criarlas. Así que impresiona y lo ordena, y vamos a crear la capa de forma. Esto va a ser por cierto, es otra parte importante es que va
a ir desde arriba. Entonces, cualquier capa en la
parte superior se va a quedar más cerca de la cámara
y cualquier capa que esté más abajo aquí, va a ir más
lejos de la cámara. Así que simplemente lo dupliqué. Lim press y P, se movieron un
poco hacia un lado, así que ahora tenemos dos de estos. Y voy a simplemente padre, digamos, capa
uno a capa tres. Básicamente uno
al cuadrado con otro. Déjame decirte la cámara. Voy a seleccionar
todos estos, y voy a dar click en dispersar el mismo
número. Haga clic en dispersar. Y se puede ver porque
teníamos estos parentales, ahora
están más lejos en la misma posición
aquí en la cima Entonces un par de cosas que podemos hacer. Tenemos esta parte que
podemos guardar aquí en la parte delantera, y por lo tanto, vamos a padre de todo esto
a la capa número uno. Entonces seleccionamos todas las
capas de parentado a la capa número uno. Así. Entonces cuando vayamos
al fondo, también
haremos pan esa
capa número uno. Sólo tenemos que subir
un poco. Bueno, no la capa número uno, sino la capa número siete, ¿verdad? Entonces tenemos todo en capas puesto a la capa número
siete, genial. Y ahora podemos hacer capa
básicamente todas las capas naranjas. Haremos pan a la
primera capa de naranja. Ahí vas. Ahora cuando seleccionamos estos y damos
clic en dispersar, deberíamos tener exactamente
lo mismo que suceda. Entonces, si entro en el segundo
Visor, lo hizo perfecto, pero en realidad necesitábamos que todos estos botones estuvieran al
frente en lugar de en la parte posterior. Entonces para eso, lo que haría
es seleccionar esta capa 52 y ponerla por encima de la
capa número uno. Y luego
volvería a seleccionar todo y dar
clic en dispersar. Perfecto. Entonces ahora tenemos el
fondo más lejos, como se puede ver en
la pantalla aquí, y tenemos básicamente toda la parte naranja
aquí en la parte delantera. Y si seleccionamos nuestra cámara para abrir la opción de cámara
profundidad de campo, si la habilitamos y
aumentamos la apertura, déjame mostrártela
con un solo visor. Verás eso porque tenemos todas las capas anaranjadas
mucho al frente, podemos aislarla
con el fondo. Otro
aspecto importante por el que estamos haciendo esto es por
lo que se llama paralaje paralaje es básicamente cada
vez que conduces con un auto, verás que las
montañas permanecen en una posición y casi nunca cambian porque está
muy lejos. Pero, por ejemplo, como una casa que va
a estar frente a
las montañas y
tú mismo te vas a mover un poco más rápido
porque estás manejando. Pero las cosas que están
muy cerca de ti como las flores al costado de la carretera se van a mover aún más rápido. A esto se le llama paralaje. Déjame mostrártelo rápidamente. Entonces las nubes que
están muy lejos, mueven muy poco en
comparación con algo
que está al frente y algo que está entre las nubes muy lejanas
y el mismo frente, se mueve
en algún lugar en el medio. Y en realidad podemos lograr exactamente lo mismo,
exactamente el mismo efecto. Entonces tenemos nuestra cámara
y nuestra cámara está conectada al controlador de la
cámara. En este caso, es un nulo. Si hago clic en P, y si la muevo un
poco hacia un lado, verás que tenemos
exactamente este efecto. Si nos movemos hacia arriba o hacia abajo, el fondo no cambia
tanto como cambia el primer plano Y las capas
anaranjadas están en primer plano. Y por eso, tenemos este movimiento ligeramente
diferente, lo que nos dice que hay un poco de espacio
y este tres D, que lo hace mucho más caro cuando se trata
de este tipo de videos. Entonces este es el plugin de profundidad. Ahora, imagina armar
eso con compositor de
animación
con presets de movimiento, vamos a usar este, y luego podemos seguir adelante y aleatorizar hacer
algo Entonces tenemos todas estas cosas
apareciendo en la pantalla. Oh, ya veo lo que pasó. No funcionó porque todas estas capas están asociadas
a la capa número uno, así que necesitamos ordenar Z, seleccionar todas las capas, todas las capas naranjas, y luego hacer clic en non Entonces va a ser
apadrinado a ninguno, pero ahora cuando lo seleccionamos, y digamos que vamos a navegar y hacemos exactamente
lo mismo en,
luego vamos a editar
apilar aleatoriamente, agregamos un poco
de esta aleatoriedad
y deseleccionamos todo agregamos un poco
de esta aleatoriedad y deseleccionamos Genial. Y ahora,
digamos que también animamos la cámara
para que vaya, digamos, de hecho, podemos pasar de un poco más abajo
a un poco más alto Entonces solo estoy agregando fotogramas clave y haciendo que
aparezca en la pantalla También podemos presionar selectivamente N F nueve para que sea un
poco más suave, personalizar el gráfico para que el gráfico también sea un poco
más suave, así. Y ya verás que tenemos este interesante
movimiento de tres D y apareciendo. Se ve muy, muy caro. Obviamente, tendríamos que jugar un poco con el
fondo. Muévelo un poco a una posición ligeramente diferente para que se vea un
poco mejor. Entonces de todos modos, si tienes alguna
duda, avísame. A que nos vemos en
el siguiente video.
11. Acelera tus animaciones de texto con TextEvo: La última herramienta súper útil que nos va a ayudar a acelerar las animaciones y
hacer nuestras vidas
mucho más fáciles es texto Evo. Cuando vengas a este sitio web, verás que son $30, pero luego si pones un cero
aquí, puedes obtenerlo por $0. Entonces solo nombra su propio precio. Quiero decir, obviamente, si
eres un negocio, entonces necesitas leer
la descripción, pero si eres un individuo, entonces puedes simplemente seguir adelante y
agregar una tarjeta y usarla para. Una vez que lo instalas, una
vez más, es algo muy
parecido. Todo lo que necesitas hacer
es ponerlo en paneles de interfaz de usuario de
script y simplemente seguir adelante y soltarlo
aquí para que puedas decir que tengo texto E dos aquí. Y luego cuando llegues
a after effects, Ventana y texto
Ear en la parte inferior, y luego simplemente puedes soltarlo. Lo tengo aquí, en el espacio de trabajo
horizontal, y en el
espacio de trabajo vertical, lo tengo. ¿Por qué usamos esto? Es porque para
animar en texto y después de
efectos, claro, se
puede aplicar algún tipo
de efecto sobre el texto, por
ejemplo, como un efecto de máquina de
escribir, que va a ser genial Pero si quieres tener una personalización muy interesante
para el texto, es animación, entonces textiv
va a ser súper útil Pongamos algo de texto
en la pantalla, hazlo mucho más grande,
hazlo blanco. Genial. Y
pongámoslo justo en el medio. Entonces podemos
buscar efectos como, una vez más,
efecto de máquina de escribir, derecho, y va a escribir el texto, que es un efecto interesante, u otra cosa que podemos hacer
es que podamos animar el texto Entonces podemos agregar un desplazamiento de
caracteres. Tenemos el selector de rango,
luego podemos animar el final y el inicio y luego podemos personalizarlo. Tipo de útil. Pero luego texto Evo hace
las cosas mucho más fáciles. Entonces para poder utilizar el texto Evo, todo lo que tenemos que hacer
es hacer clic en Plus. Cuando tengamos nuestro texto seleccionado, necesitamos dar click
en Plus, y
va a agregar el
texto efecto Evo. Si no tenemos nada seleccionado, solo
vas a
agregar una capa de texto. Y entonces podemos seguir adelante y personalizar esto
exactamente lo mismo. Podemos hacer clic en Plus,
y cuando abrimos, tenemos dos fotogramas clave Uno es el fotograma clave inicial
y el otro es el fotograma clave final. Lo que podemos hacer es
cambiar el movimiento, la opacidad, la borrosidad, lo que sea
del
primer fotograma clave Siempre que lleguemos
al segundo fotograma clave, va a pasar de ese
conjunto a este estado original Por cierto, ni siquiera tenemos que estar en el fotograma clave Entonces, por ejemplo, si
cambio la posición, y vamos a cambiar la
digamos Y, ¿verdad? Va de
abajo a arriba. Ahí vas. Súper simple
y ya animada. Un par de cosas que podemos hacer.
Algunas de las grandes cosas que me gustan es tener la
opacidad a cero Entonces va a pasar
así. Ya se ve genial. Entonces podemos hacer el desenfoque, así podemos personalizar el desenfoque. Pongámoslo a 101
cientos aquí también. Entonces va a aparecer así entonces puedes personalizar
el retraso o la dirección que podemos
personalizar si vamos aquí y si entramos en texto si hacemos pop up o panel necesitamos
cambiar en base a. Podemos hacerlo en letras. Se trata de letras
palabras sin asadas, líneas o cancelar. Entonces, si quieres que suceda por palabras,
simplemente haz clic en palabras, y necesitamos que la
selecciones, ¿verdad? Sí, éste, digamos palabras. Y en lugar de
ser por caracteres, ahora es por palabras, así que ahora aparece toda
la palabra. Y si tenemos un
par de palabras, el texto anima. Bien,
¿qué pasó? Animación de texto, selecciona el texto, hazlo un poco más pequeño. Ahí vas.
Animación de texto. Perfecto. Así de simple como eso. Hay muchas cosas
que puedes personalizar aquí. Entonces solo
te animaría a que sigas adelante y exploraras, ver lo que te gusta, a
ver lo que te gustaría usar. La mayoría de las veces, solo uso una especie
de animación de caracteres o palabras y algo tan simple como
aparece en la pantalla Y por cierto,
también puedes guardar los presets aquí. Así puedes seleccionar texto y
puedes hacer clic en preset, y puedes agregar un preset de cualquier animación
que tengas en la pantalla, y luego va
a aparecer aquí. O puedes aplicar una animación
que hayas guardado antes. Se puede quitar. Digamos, da clic en
éste, y lo elimino, pero no voy a
hacer eso, o puedes refrescar si necesita un
poco de actualización. También puedes copiar el efecto, por
ejemplo, si
selecciono esta capa, así voy a
duplicar, dar click sobre ella, borrar el texto Evo pulsa en P, moverlo un poco más alto. Selecciona la animación de texto, para que pueda copiar esta animación, y luego la puedo pegar aquí y tenemos las cosas
exactamente iguales. Y por cierto, puedo
presionarte para que reveles los fotogramas clave y luego mover
los fotogramas clave alrededor Entonces puedo seleccionar
así y sólo voy a aparecer a partir de este
punto. Entonces así es como lo haces. Cuando recreemos el texto va a ser súper útil tener otra capa de animación de texto animado lo va a
hacer mucho mejor, y esta herramienta nos va a
ahorrar mucho tiempo Entonces, si tienes alguna duda, avísame y
te veo en el siguiente video.
12. ¡Felicidades!: Enhorabuena. Si
estás viendo esto, significa
que lo lograste
a la mitad del contenido del curso, fuera mucho cubierto,
así que felicidades por hacer este punto Y pronto hay mucho más contenido
valioso, pero antes de que lleguemos
al siguiente video, simplemente
quiero preguntarte si
encontraste valor en este programa
hasta este punto, tómate 60 segundos en
dejarte una reseña honesta. Por supuesto, voy a apreciar
inmensamente esto, y los comentarios ayudarán masivamente a los
futuros estudiantes a decidir
el mejor programa para ellos Así que déjalo
ahora mismo, y por supuesto, si hay algo en lo
que pueda ayudarte, por favor házmelo saber en
la sección de preguntas y respuestas a continuación Lo estás haciendo genial. Sigan adelante. Sin que se diga.
Pasemos al siguiente video.
13. Usa ChatGPT para crear una lluvia de ideas de animación de UI viral: Bienvenida. En este video,
exploraremos el uso HGPT para crear ID, para hacer una lluvia de ideas sobre
los ID Entonces, ya sea que estés usando
JTPT para trabajar con tus clientes o para crear
videos por ti mismo, va a ser súper
útil. Empecemos. Lo primero que voy a
hacer es platicar con JGPT explicarle lo que quiero hacer, y luego veremos
qué hace JGPT Oye, JTPT, estoy creando
video sobre diseños de UI. En realidad, no se trata
necesariamente de diseños de interfaz de usuario, sino de usar diseños de interfaz de usuario. Así que eso va a ser paneles de interfaz de usuario, va a
haber sitios web, va a haber interfaces,
todo tipo de cosas. En concreto, quiero crear
un video sobre Steve Jobs, la persona que creó y quiero crear
un video de cortometraje, que va a ser, digamos, como de 30 segundos de duración, y
necesitamos usar paneles UI, y necesitamos contar una historia interesante sobre él que o bien
no se ha contado todavía, que probablemente tenga, pero al menos eso no
es tan popular, pero es muy interesante y,
como, un tope para el pulgar. En primer lugar,
necesito que me des ideas
interesantes de
lo que podemos hablar. Potencialmente, si no
hay ideas, podemos hablar de su patrimonio neto, cuánto dinero ha
hecho, cosas así. Tener algún tipo de
dato interesante sobre él sería genial. Así que adelante y antes que nada, cuéntame los
datos interesantes sobre él, y después de eso,
decidiremos qué hacer a continuación. Entonces, cuanto más contexto le dé a JDPT mejor
porque va a entender lo que voy a buscar y realmente grandes, grandes resultados Sí, en realidad esto es cierto. Fue despedido. Esto es cierto, así
como si estos
hechos no son ciertos. Me gusta el hecho de que
su salario era de $1, así que creo que podemos
apoyarnos en eso y podemos usar diferentes
UI. Eso es correcto. Así que vamos a crear el
guión para un video 32, comenzando con un gancho
muy fuerte, luego la parte de valor, luego el muy buen final, final
satisfactorio Sigamos adelante y
creamos el guión, y te voy a dar comentarios. Puedes ver que me escribió
todo tipo de cosas, y solo estoy dando
comentarios a ATPT Hmm. En realidad, ahora que lo
estoy viendo, no me gusta cómo se está desarrollando
la historia. Bien, vamos a crear un video
sobre su patrimonio neto. Hablemos de su
patrimonio neto cuando murió. No hablemos de, como, el hecho de que murió, pero
vamos a hablar en general de, ya
sabes, que valía
no recuerdo lo que era, pero como diez más
mil millones de dólares. Y que el dato interesante
es que en realidad hizo, como, mucho de eso de Pixar Bien, primero hablemos
solo de la narración, del guión en sí Y luego en términos de DOI, lo
resolveremos más adelante. Creo que esta parte es buena. Entonces creo que podemos usar esta parte. No me
gusta la parte final. Todo el mundo asume que Steve Jobs
hizo su fortuna con Apple, pero eso no es realmente cierto Pero eso es en realidad, ¿qué tengo razón? Pero
eso en realidad está mal. Cuando murió, su patrimonio neto era un poco más de $10 mil millones, pero la mayoría que Mm hmm. Creo que esto va a ser este va a ser un guión
muy bueno. Entonces usaremos este script. Esta es una muy,
muy buena idea, y solo tenemos
que hacerla realidad. Entonces si tienes alguna
duda avísame, aparte de eso
te veo en el siguiente video.
14. Preparar activos y diseños de UI para la animación: Bienvenida. En este video,
necesitamos crear nuestros diseños de UI usando nuestro script. También le pediremos al ITPT que
nos ayude un poco con esto. Y definitivamente podemos
usar nuestra propia creatividad, y tengo un par de pensamientos
sobre cómo podemos hacer esto. Pero también me gustaría ver
si hay algo que IDPT sugiera que potencialmente lo
haremos aún mejor HITPT. Entonces usemos
esto como guión. Creo que esto va a
ser muy, muy bueno. Así que básicamente nos estamos
deshaciendo del final. Y para esto,
necesito que sugieras qué tipo de
diseños de UI podemos usar. Entonces, para cada línea o por cada
cambio del diseño de la interfaz de usuario, necesito que me digas qué es
exactamente lo que se necesita usar. Bien, no
agreguemos tantos textos. Vamos a acortar tu
respuesta en un 75%. Lo que necesito que hagas
es que al lado de la línea, simplemente después de un guión, escribas qué tipo de interfaz de usuario
deberíamos estar usando porque lo que estás haciendo
es un poco demasiado. ¿Se puede dar un
ejemplo de una tarjeta? Estás hablando de algún
tipo de tarjeta financiera mostrando apologo y
luego estás
hablando de una Entonces, ¿puedes explicar lo
que eso significa o mostrar visualmente como encontrar visualmente una imagen en línea para mostrarla como ejemplo? Bien, esto es muy interesante. En fin, hagámoslo nosotros mismos. Entonces para esta parte,
en realidad usaré el logotipo de Apple, ah en mente, donde está
apareciendo trabajos paso a paso. Entonces esta va a
ser una superposición
de abridor del diseño de cuentas bancarias. No tiene que
ser así exactamente porque podríamos cambiar un par de cosas un poco más tarde. Vino de Pixar. Logotipo animado de Pixar
en la pantalla. Aquí necesitamos artículo de
Internet y otro artículo. Y aquí, gran pregunta.
¿Qué podemos usar? Pensaremos en éste.
Potencialmente, podemos usar como un iPhone oralmente o
algo así. Ya veremos. Ya veremos. Así que el logotipo de Apple. Iré solo un
lejano y solo buscaré el logo de Apple Lo mejor es tenerlo
Bing gi. Esto es genial. Va a descargarla.
Diseño de cuenta bancaria, esto es en realidad
algo que
ya tengo en uno de
los diseños de UI. Entonces esta es la
cuenta bancaria que tengo. Simplemente lo copiaré y lo
pondré a descargar. Entonces busquemos el logotipo animado de
Pixar. Bien, genial. Entonces sólo
voy a copiar el enlace. Vaya a un sitio web, que es tdwn punto TO y
descargue este video No importa
qué herramienta uses, es solo algún tipo de descarga. Puedes buscarlo en Google,
y podrás descargarla fácilmente.
Va a llevar algún tiempo. Genial. Simplemente lo descargué. Perfecto. ¿Y
qué más tenemos aquí? Artículos. Entonces para eso, solo
voy a
buscar un artículo Bien, esto en realidad es bastante bueno. Yo solo voy a
hacer una captura de pantalla aquí y la voy a poner a descargas que
tenemos la captura de pantalla. Perfecto. Y ahora necesitamos
tener otro artículo, y voy a hacer una
captura de pantalla aquí también, y se va a poner
aquí también, ¿verdad? Entonces tenemos dos capturas de pantalla. Perfecto. Ahora solo
necesitamos grabar un audio, y estaremos listos
para editar este video. Si tiene alguna
duda, házmelo saber. Aparte de eso nos
vemos en el siguiente video.
15. Anima tu diseño de interfaz de usuario en After Effects (parte 1): Video, vamos a crear
las animaciones. Entonces lo que hice fue
grabar el audio, cortarlo en Premiere Pro, y al seleccionar, hacer clic
derecho,
reemplazarlo por composición After
effect, lo
puse en after effects. Solo partes importantes que
cada vez que haces esto, tienes que agregar algún
tipo de gráfico. De lo contrario, no
podrás importar solo el audio. Una vez que puse eso
en after effects, acabo de borrar el gráfico, y ahora tenemos nuestra composición, que es 1080 por 1920, 30 fotogramas por segundo, y es
exactamente del mismo tamaño que nuestro
audio en segundo plano. Vamos a seleccionar
todo el audio y pulsar Shift Command C o Shift
Control C para precomponer Esto va a ser audio, así que voy a llamarlo
audio solo para asegurarme de
que esté organizado
hay menos capas. Voy a entrar en vertical, y también voy a
entrar en UI Designs, que es nuestro pago con el logotipo de Apple, las capturas de pantalla y el video. G seleccionar todo,
ponerlo aquí, y de hecho voy
a ponerlo en una carpeta, y lo llamaremos diseños de interfaz de usuario. Y ahora, todo lo que tenemos que
hacer es simplemente editar el video tenemos nuestro texto
aquí, nuestra transcripción Todo el mundo asume que Steve Jobs hizo su fortuna con Apple,
pero eso en realidad está mal Por cierto,
olvidé por completo encontrar una foto de Steve Jobs PNG. Veamos qué tenemos aquí. ¿Por qué no usamos este? A pesar de que es un poco peor calidad, sigue siendo bastante buena. Yendo al dragón soltarlo aquí
y ponerlo en diseños de interfaz de usuario, aunque no es un diseño de interfaz de usuario. Lo primero,
voy a presionar el Comando Y para crear
una capa sólida, que va a
ser sólida blanca. Y entonces necesito poner un PNG de trabajos
empinados aquí y logo de Apple. Entonces voy a disminuir el logo de Apple y este va a ser
el comienzo mismo. En realidad, lo que podemos hacer
es copiarlos, pegarlos aquí, y
luego poner marcadores. No recuerdo
cómo poner marcadores, así que sólo voy a
abrir atajos de teclado. Simplemente puedes abrirlos
buscando atajos de teclado, y esto va
a ser un atajo para que puedas abrir los atajos. Entonces busquemos marcador, y va a ser Control ocho en mi
caso, Control ocho. Para que sepa donde
tenemos capas y grados. Entonces ahora tenemos aquí, aquí, aquí, aquí, aquí. Entonces tenemos
cada nuevo discurso que sucede en el
marcador, lo cual es genial. Entonces, al principio,
tenemos este discurso que
todo el mundo asume que Steve Jobs
hizo su fortuna desde Apple Bien, en realidad
voy a comenzar con el segundo con el
diseño de la interfaz de usuario con el pago. Por cierto, no lo
importó correctamente, así que voy a
eliminar el pago, y voy a arrastrarlo
y soltarlo así. Cuando lo pones con otras
capas o con otros archivos, no lo
importa como lo
importamos antes. Entonces este va
a ser nuestro pago, y voy a cambiar 1080
para 1920, entonces es como. Yendo a crear un
nulo presionando Mayús Opción Comando Y, seleccionamos todo
presionando el comando A, y manteniendo el comando,
voy a presionar en nulo para que
lo deseleccionemos, y voy a padre de
todo a ese nulo Entonces ahora, cada vez que aumente
o disminuya la escala, todo va a
disminuir o aumentar. Ahora, necesitamos encontrar este texto, y tendremos que
poner otros números
aquí porque tenemos 134 mil y el patrimonio
neto de Steve Jobs era un poco más Entonces tenemos esta línea aquí. Cuando murió, su patrimonio neto era un poco más de $10 mil
millones, 10 mil millones. Es este número de aquí.
Eso es bastante. Y lo que voy a
hacer es que voy a crear un texto donde
voy a poner uno, en realidad, y voy a buscar un preset el cual puedes encontrar en la sección de
recursos descargables Simplemente puedes aplicar este preset, y básicamente preset que nos
permite controlar los números y podemos
animar los números Este tiene que estar en cero porque lo
hace en círculos. Básicamente, un círculo
es de 360 grados. Y cuando voy
al siguiente círculo, puedes ver que solo agrega un
poco más y puedo simplemente en hacerlo más grande
o más pequeño si quisiera. Para poner un número
específico, tenemos que poner este a cero y poner aquí como 10 mil millones. Si va a
funcionar, claro, tal vez sea un poco
demasiado para el sistema. A lo mejor necesitamos
deshacernos de las comas. Ahí vas.
Ahí están nuestros mil millones. Ahora sólo tenemos que hacer el
texto un poco más pequeño. Y obviamente,
no queremos que
sea , como, precisamente eso. Podemos hacerlo solo un poco más grande o tal vez significativamente
más grande, algo así. Voy a presionar en P, moverlo un poco
disminuirlo de tamaño. Muévelo un poco hacia arriba. Un poco a la derecha
y un poco abajo. Veamos cómo
estaba el texto antes y ahora. Bien, entonces para moverlo un
poco hacia la derecha. Y por cierto, ahora
necesitamos también padre de este número
uno al nulo. Podemos ponerlo a lo
más alto. No es un problema. Para que sepamos que tenemos nuestros números al lado del nulo. Entonces nuestro texto aquí
es cuando murió, su patrimonio neto era un
poco más de $10 mil millones. Genial. Así que
sólo podemos animar esto Podemos presionarte para que
tengas el control del ángulo. Entonces ponemos el control de ángulo.
Lo sé, pongámoslo aquí. Pero esta, tenemos
que hacerla un poco más pequeña y va
a funcionar algo así. Entonces vamos a tener números
cada vez mayores. Ahora para el Sam Smith, necesitamos desactivar un par de partes que podamos llegar
al texto. Suma Smith. Este es el texto. Cuando
selecciono la capa, si creo una capa de texto, va a estar justo
encima de esa capa. Pero si no tengo ninguna capa seleccionada y empiezo a escribir, va a crear una capa que va
a ser la número uno. Pero sí queremos
asegurarnos de que todo esté
muy unido. Entonces se va a
seleccionar la capa 71, luego presentar T y
presentar T aquí. Entonces aquí escribimos Steve jobs, P y S, y yo sólo
voy a ponerlo ahí. Ir a deshabilitar Steve
Jobs. Esto es bueno. También necesitamos padres de
Steve Jobs para que nulo. Y ahora cuando aumentemos
el tamaño del nulo, todo va a escalar. Podemos eliminar esta
parte y esta parte, entonces va a ser así. Por cierto, para Steve Jobs, que también podemos
poner en la parte superior, presionando comando shift y corchete
derecho va a
convertirse en la capa muy superior. Podemos asegurarnos de que esté en
la parte superior no sea fácil de encontrar, podemos agregar texto Evo. Sólo voy a aplicar
uno de los presets, que va a ser como
arriba opacidad más personajes, así que va a ser
algo así Entonces entraré en la
posición de transformación y solo cambiaré para que no sea un movimiento
tan grande al principio. Sí, esto se ve bien. Básicamente, podemos animar
cada una de las partes aquí. ¿Por qué no solo usamos
el compositor de animación para crear algún tipo de movimiento? Vamos a presionar y
hacer un poco de
selección aleatoria de todo, ¿de acuerdo? Entonces Oh, interesante. Habilitó todas las capas, toda la visibilidad
para todas las capas. Así que déjame
desactivar algunos Smet. Y esto selecciona todas las capas. Muévelo un poco
a la derecha para que
no tengamos ninguna capa que aparezca
desde el principio. Bien, esto es bastante bueno. Ahora también necesitamos
animar la opacidad de este texto aquí para asegurarnos
porque al principio, es visible de inmediato Entonces podemos hacer algunos así. Como puede ver, tenemos muchas partes
de la interfaz de usuario animadas
al mismo tiempo. Al igual que, no nos tomó
mucho tiempo hacer esto, pero se ve muy bien. Quizá un poco
caótico en este punto, pero luego veremos
que podríamos cambiarlo. No es un problema en absoluto.
Bien, entonces para esta parte, en realidad
es muy bueno. Entonces es esta parte. Y veamos qué
tenemos así. Vas a seleccionar esta parte y moverla al frente mismo, y acabamos de desactivar
el Bgon. Sí, así. Entonces abramos nuestro video de Steve
Jobs , Steve Jobs, y
pongamos nuestro pago aquí, que va a ser voy a cortar esta parte por
opción de precios corchete derecho, así que solo voy a
cortarlo hasta el cursor. Y yo sólo lo voy
a poner aquí. Cuando murió, su patrimonio neto
era de más de 10 mil millones de dólares. Por cierto, tiene que
ser diez y no mil millones. Es para ser como
este número, sí. Entonces necesitamos copiar este
número y no mil millones. Ahora, entramos en nuestro texto, que va a ser
uno, poner esto a cero, poner esto a 10 mil millones. Mm. Y tenemos que
eliminar comas. Así. Perfecto. Eliminar el
fotograma clave presione Mayús P para revelar los fotogramas clave de
posición, muévalo un
poco hacia la derecha Como, tan genial. Ahora,
hagámoslo no precisamente, como, mil millones, sino un
poco más que eso. Voy a seleccionar esto. Ven
al primer fotograma clave, pon este a cero, y este a este número, pero también borra las
comas. Ahí vas. Esto es lo que tenemos.
Se ve muy bien. Entonces, cuando murió, su patrimonio neto es un poco más de $10 mil millones. Genial. Sólo voy a mover este fotograma clave un
poco más allá Al menos uno de los diseños de
UI es bueno. Pero la mayor parte de eso
no provino de iPhones, Max o acciones de Apple Entonces busquemos acciones de Apple. Son dos, cinco años. Un año, cinco años, tal vez podamos encontrar Sí, algo así como esta
gráfica estaría genial. Este es un gran diseño de interfaz de usuario. Y aquí podemos hacer todos los años, vamos a tomar
captura de pantalla de eso. Entonces también necesitamos iPhones y Max porque de eso es de
lo que estamos hablando Y para eso, podemos usar Mmm. podemos usar capturas de pantalla, iPhone 17 porque esta
es la última versión, 17 PNGs van a También podemos usar capturas de pantalla,
iPhone 17 porque esta
es la última versión,
17 PNGs van a
hacer nuestra vida un poco
más fácil si la tenemos en PNG Si no lo hacemos,
siempre podemos sí, esto es bueno. Entonces voy a descargarla. Mac, PNG. Esta es una buena.
Podemos usarlo. Entonces ahora solo necesitamos
seleccionar todos estos, y pongámoslo en nuestro proyecto y luego simplemente
arrastrarlo y soltarlo aquí. S para disminuir la escala. Y ahora vamos a
crear una máscara aquí. Y voy a crear una máscara. Así. Genial. Entonces
tenemos las acciones de Apple, luego tenemos los iPhones
y tenemos el mak Genial Entonces solo lo pondré aquí, y luego pensaremos en
cómo animar eso un
poco más tarde Vino de Pixar, así que este va a ser el logotipo de
Pixar Animated Encontremos este video de Pixar. ¿Fue éste? Sí. Comando Opción de Cambio G H para ajustarlo a la pantalla. Me gustaría cortarlo
hasta este punto. Aquí lo tenemos vino de Pixar, y ahora vamos a tener trabajos comprados pixel en algún
tipo de fecha y hora Entonces sólo voy a ponerlo aquí como para disminuir un poco la
escala. Ahora podemos usar el efecto crop. Pongámoslo a cero. Ahora lo hizo así. Bien. Ahora esto es genial. Así que
ahora podemos recortarlo desde arriba o abajo
sin perder nada. Bien, así que recorta desde
arriba o desde abajo. Bien, entonces parece que es
viceversa , pero no es un problema. Y luego a la izquierda y a la derecha. Esto se ve bien.
Podemos cortar esta parte. Y ahora tenemos
otra captura de pantalla, unos 20 años después. Y en realidad podemos, creo. Puedes tomar la captura de pantalla
anterior, copiar todo esto, pegarlo aquí. Ahora solo necesitamos ajustar un poco
los cultivos, solo un poquito
desde abajo, un poco más a la
derecha, así. Y desde arriba o
encontremos la parada. Así. Entonces
veamos qué tenemos. Al principio,
esto es lo que tenemos, entonces tenemos esta animación. Entonces tenemos esto, y luego
tenemos esto, esto, que es, por cierto,
probablemente podamos movernos un
poco hacia la derecha y hacerlo un
poco más alto para que estos sean algo
similares entre sí. Y luego al final, no
tenemos nada
porque aún
no hemos decidido qué
vamos a hacer con éste. En realidad, para esta, porque estamos usando el para
la primera línea, porque estamos usando
el estilo Apple, podemos seguir siendo simplistas,
como lo hace Apple Podemos mantenerlo minimalista. Y podemos tener texto
apareciendo en la pantalla. Todo el mundo asume que Steve Jos hizo su fortuna con Apple. Vamos a copiar este texto, abrir la herramienta de texto,
pegarlo aquí, hacerlo negro,
ponerlo en medio, seleccionar todo,
hacerlo un poco más grande. Podemos tener un par de formas
interesantes de hacer esto. Así que vamos a cortar esto un
poco, ponlo, así. Genial. Así que vamos a crear una
animación para el texto. En realidad, solo voy a
aplicar preset de inmediato, así que voy a aplicar por palabras. En realidad, me gusta
hacerlo un
poco más grande porque solo
un poquito demasiado pequeño. Genial. Y ahora podemos tener trabajos
rígidos que aparezcan en la pantalla. Entonces este es el logo de Apple el
cual podemos desactivar por ahora. Podemos ver que los trabajos rígidos realmente cortan un
poco del fondo, y queremos que sea suave. Entonces, antes que nada, lo
haré un poco más grande y lo pondré
por encima del texto. Y voy a
crear Comando Y, crear un sólido blanco, que
podemos marcar como blanco. Y voy a
bajarlo un poco. Cortarlo, ponerlo o, y
voy a disminuir la escala. También le voy a aplicar el desenfoque
rápido de caja. Vamos a aumentar el desenfoque y hacer clic en repetir píxeles de borde para que no se repita y
vamos a aumentarlo de tamaño, presione en P, y
bajarlo un poco. Entonces esto es lo que
vamos a tener. Y podemos animar a Steve jobs
para que aparezcan en la pantalla. Se trata de Steve Jobs.
De hecho podemos renombrar a Steve Jobs. Podemos simplemente renombrar la
captura de pantalla para que sea rígida puede ser padre de este
sólido blanco a Steve Jobs. Entonces lo vamos a ser padres. Entonces ahora, cada vez que
movemos a Steve jobs, esto es lo que va a pasar. Voy a presionar en P
para crear un fotograma clave. Este va a ser
el fotograma clave final, muévalo un poco más allá Pero en el primer fotograma clave,
va a estar fuera del fotograma Al ir a seleccionar esto,
pulse en N F nueve. Voy a abrir
el editor de grafos y hacerlo de una manera
interesante. Al final, queremos
que sea suave, así que vamos a suavizarlo. Pero al principio,
queremos ser lo contrario, queremos ser lo más
abruptos posible Y en realidad, me
gustaría mover el paso cae
un poco más bajo porque voy a cambiar un poco el
punto de ingreso. Y luego para el logo de Apple, pensemos
dónde podemos
ponerlo y qué
debemos hacer con él. Se puede poner un poco más alto, hacerlo un poco más pequeño,
ponerlo así. En realidad, hay un efecto muy
interesante, recuerdo cómo se llama. Después de
excavar un poco, lo encontré. Se llama toallita irlandesa entintada,
sí, toallita irlandesa entintada Ahí vas. Entonces, al presionarte para que tengas
los fotogramas clave, esta va a
ser la transición. Steve Jobs hizo su
fortuna con Apple. De hecho me gusta que cuando
tenemos esta cobertura completa, en realidad
podemos simplemente esconder todo detrás
y luego desactivarlo para que podamos mantener
el fondo blanco, pero entonces todo lo
que tenemos en pantalla va a desaparecer, y luego podemos deshacernos de este círculo
porque no es bueno. Así que sólo podemos hacer clic aquí
y desactivar el círculo. Genial. Creo que en este punto, es una buena idea
descansar un poco para resetear el cerebro y luego
volver con un ojo fresco y ver si algo va
a ser mejor o no. Entonces, si tienes alguna
duda, avísame, y te veré
en el siguiente video.
16. Sigue animando y añade efectos de interacción (parte 2): Sigamos
editando el video. Veamos qué hemos conseguido hasta ahora. Todo el mundo asume que Steve Jobs
hizo su fortuna con Apple, pero eso en realidad está mal. Entonces aquí es donde tenemos que
decir que en realidad está mal. Entonces tenemos esta
animación apareciendo en la pantalla, lo cual está bien. Por cierto, podemos
poner la foto de Steve Jobs aquí en la parte superior. Y entonces potencialmente podemos
hacer Zooming aquí. Pero la mayor parte de eso
no vino de acciones de Max, Apple o Apple. Entonces aquí es donde tiene que estar. Vino de Pixar. Empleos compraron Pixar en
1986 por 5 millones de dólares. Y luego, y luego decimos ese
solo trato, Bien, genial. Entonces tengo un par de ideas sobre qué es exactamente lo que podemos hacer aquí. Entonces, antes que nada, me
gustaría destacar el hecho de que se compró por una determinada
cantidad de dinero. Entonces esto es lo que voy a hacer. Voy a crear
una capa de forma, que voy a resaltar con la
capa de forma, esta cosa. Básicamente, solo estoy creando
una forma encima de eso. Y luego para el color, vamos a hacerlo amarillo. Hagámoslo así. Y luego para el modo, vamos a usar multiplicar para que
podamos ver a través él y lo conseguimos ya arriba, voy a aplicar un
efecto llamado borrado lineal. Y luego si lo hacemos, para que podamos ver podemos pulverizar
cómo se resalta el texto. Voy a cambiar el ángulo a menos 90 que pasa de izquierda a derecha
en lugar de derecha a izquierda. Y ahora podemos crear un
fotograma clave, pulsar en U. Así que este va a
ser el fotograma clave final Si nos movemos un
poco hacia el frente, podemos hacerlo de la
manera opuesta así que es Seleccione esto, presione F nueve para que sea suave, y podemos hacerlo como también
para hacerlo aún más suave. Perfecto. Y luego lo
voy a duplicar, presionar sobre P, moverlo un poco más abajo y
moverlo un poco hacia la izquierda. Así. Hay un par
de cosas que podemos hacer. Podemos disminuir
la forma misma. Entonces camino rectángulo, disminuye
el tamaño, tamaño horizontal, luego presiona sobre P, y
muévalo hacia la izquierda, así y luego disminuye
el tamaño aún más. Entonces ahora debido a que las toallitas
lineales están en diferentes posiciones y animamos en
diferentes posiciones, vemos el efecto donde
esta está resaltada, aunque ésta no lo esté Y eso es exactamente correcto. Entonces necesitamos cambiar un
poco
estos números para que funcione. Bastante bien. Aunque en realidad
yo precompondría esto porque
si aumentamos la escala, puedes verlo porque
tenemos este efecto de borrado lineal, que es básicamente te lo voy
a mostrar rápidamente Si aplico, como, un gris, sí, ahí vamos. Si aplico un gris, solo sólido, y luego aplico una toallita lineal, se
puede ver qué tipo
de efecto es. Y así básicamente lo estamos
animando para que vaya a partir de aquí, que puedes ver nuestro
punto culminante para ir hasta aquí Pero entonces cada vez que
aumentemos la escala, déjame darte un ejemplo rápido. El resaltado permanece
en la misma posición. El texto cambia su posición con respecto al borrado lineal. Entonces es por eso que obtenemos
este extraño efecto, y así en realidad sería un poco mejor
simplemente precomponerlo Y ahora, si
aumentamos alguna balanza, se queda exactamente igual, que es exactamente lo que necesitábamos. Y entonces lo
llamaremos Artículo 1, y lo cortaremos
de aquí a aquí. La forma de cortar es con
Shift Command D, crea corte en la capa. Entonces tenemos esto, por
cierto, para este pixer, también
podemos aplicar un efecto de tecla de
color y luego seleccionar el borde delgado de los negros por uno, aumentar la tolerancia Pero entonces lo que también haremos
es crear una máscara. Entonces voy a
seleccionar la capa, haga clic aquí en nuestra
capa de forma. Crea una máscara. Después iremos a
la tecla de color de efectos en las opciones de composición Da click en más, crea una máscara, y luego necesitamos invertir
la máscara para que no cortemos ningún
negro de aquí Entonces ahora es perfecto. 20 años después, Disney la
compró por 7 mil millones, por lo que podemos destacar
esta línea aquí. En realidad podemos simplemente seguir adelante
y copiar esta capa de forma, pegada aquí, así Entonces el Este es nuestro punto culminante, que vamos a poner
en el principio mismo. Vamos a aumentar
el tamaño del rectángulo, desplazamos
horizontal y
verticalmente P para revelar la posición
y moverla un poco. Y sólo tenemos que
cambiar esta parte. Y tenemos que
cambiar esto también un poco, y
esto debería ser bueno. Definitivamente haciendo
algunos avances aquí. Todo el mundo asume que Steve Jobs
hizo su fortuna con Apple, pero eso en realidad está mal. Entonces para eso en realidad, creo que podemos acercarnos aquí. Y para eso, voy a
crear un objeto Shift Option Command Y.
voy a cortarlo y hacerlo forrado de esta parte aquí. Voy a conectar todo esto aparte
de, sí, necesitamos todo esto
para luego P y S, y comenzaremos desde aquí. Y siempre que vea
en el fondo, pero eso es realmente incorrecto, vamos a hacer zoom en esa parte para enfatizarla aproximadamente así, y luego podremos presionar FNF nueve Por cierto, si
tienes esta opción, el plugin de flujo
también es realmente bueno porque solo
puedo seleccionarlo. En lugar de que
yo lo haga manualmente, sólo puedo seleccionar una de
las gráficas, por ejemplo ,
como esta, va
a hacerla suave. Así. Y una cosa más que
me gustaría hacer aquí al final es crear otra transición
aquí para que hagamos transición de esta
vista a nuestro video de UI, y podamos hacerlo con el compositor de
animación, también, para que podamos
buscar transiciones. Aquí, podemos hacer algo
como un Zoom Alejar. Creo que como Zoom in
va a funcionar bastante bien, y tenemos que
ponerlo en la parte superior. Entonces haremos algo como Tenemos este tipo de salto aquí de este
color a muy negro. Sólo tenemos que añadir algún
tipo de transición. Y para eso, presionaré
algo de T para esta transición. Va a pasar de
este súper negro a apenas visible
a muy visible. Se va a ir tal vez
podamos hacerlo así que
solo tratando de crear una transición suave
que nos va a permitir crear
un movimiento suave. Sí, esto es
realmente bueno. En primer lugar,
podemos venir aquí y encontremos esta parte.
Donde esta esta. Capa 76, y
podemos usar una foto de él
que usamos antes. Bien, sólo voy a copiar
a este steve y ponerlo en pago aquí. No necesito ningún fotograma clave de
posición. Podemos simplemente ponerlo
ahí, presionar sobre S, disminuir un poco su escala, y luego
rastrearlo a la capa 76. Y, ya veo. Entonces no es la capa 76. Es la capa 78 porque la capa 76 es el
resaltado azul a su alrededor. Entonces necesitamos rastrearlo
a la capa 78 y habilitarlo. Eventualmente, hazlo un
poco más pequeño, muévelo un
poco hacia un lado para
que quede ahí.
Entonces ahí vamos. Tenemos nuestras caídas empinadas, y en realidad haría que
esta capa cree formas a partir de la capa vectorial. Y me gustaría hacer esta
capa blanca para que podamos
llenarla persona y luego llenarla blanco para que
solo haya un poco más de contraste. Podemos ver a steve cae
un poco mejor. Bien, entonces tenemos
este muy buen zoom fue un poco más de $10 mil millones. Entonces aquí, me gustaría hacer
zoom en este punto. Entonces voy a crear un nulo. A ver si
no está animado en absoluto, no tiene ninguna
gama de regalos porque si presiono en U, no aparece nada. Así puedo presionar en P y S, y luego puedo acercar un
poco estos números. Entonces va a ser
así como pueden ver, nuestro trabajo de paso se mantiene en
la misma posición. Entonces, lo que tenemos que
hacer es encontrarla Steve jobs, y tenemos que
criarlo para que nulo el número uno. Antes empieza a moverse, así que ahora se queda en la
misma posición, genial. Voy a
seleccionarlo, ahora voy a presionar on flow en lugar
de hacerlo manualmente, así que
me va a ahorrar un poco de tiempo y luego crear un
poco más de espacio. Entonces veamos qué tenemos. Y voy a mover
los fotogramas clave
un poco más rápido para
comenzar un poco más rápido. Para este último fotograma,
podemos sacarlo
del marco, así. Entonces va a ir de
aquí a salir del marco. Y para estos donde también solo
voy
a hacer click para que sea un
poco más suave. Voy a abrir la gráfica
y al principio, quiero ser suave,
pero al final, realidad
queremos que sea
rápido para que
suceda así. Por lo que se sale
del marco rápidamente. Veamos qué tenemos aquí. Bien, y aquí estoy diciendo la mayor parte de eso no vino de iPhone Max o Apple Stock, voy a
ponerlo al fondo y acortar estos un poco Los iPhones solo van a disminuir un poco todo
en tamaño Pero la mayor parte de eso no vino de donde la
tenemos aquí? Y por aquí,
en realidad podemos usar algo así
como un efecto de máquina de escribir. Siento que va
a ser un buen cambio de situación porque teníamos algunas animaciones diferentes
aquí en el principio, para esta parte, podemos usar algo un
poco más diferente. Máquina de escribir, y luego
podemos iniciarla desde aquí. Y sólo voy a
acelerarlo un poco porque en realidad
puedo escuchar mi
voz en mis auriculares. No se puede oír, pero
por el bien del tiempo, voy a hacerlo rápido aquí. Pulsa sobre P, muévala
un poco más alto y potencialmente disminuye
el tamaño solo un poco. Las acciones de Apple apenas son visibles. Tenemos que hacer algo
con potencialmente aumentarlo de tamaño, así, porque la
gráfica es simplemente demasiado pequeña. Y entonces si
vamos a ¿por qué no
creamos como otra máscara o
esta tiene una máscara? Sí, lo hace. Así que
en realidad podemos simplemente cambiar la máscara. Podemos seleccionar esto y luego moverlo un poco, así. Entonces estoy seleccionando
la máscara usando la herramienta de selección y
simplemente poniéndola ahí. ¿Y por qué no
lo movemos un poco más abajo? Potencialmente
ponerlo en el medio, como así ahora estoy diciendo
que vino de Pixar Podemos poner aquí este texto diciendo que vino y luego Pixar
será como un texto Nuestro video actuará como
leyendas de alguna manera. Entonces déjame ponerlo así. Bien, entonces tenemos un par
de cosas aquí apareciendo. Tenemos este gran texto aparecer. Vamos a presionar en P
y S y crear fotogramas clave. Y me gustaría
partir de esta línea, que es como Steve Jobs se
metió en Pixar y
seleccionarlos, hacerlo suave Y en realidad, para
esta parte de aquí, me gustaría estos fotogramas clave, potencialmente solo moverlo un
poco porque no me gusta la forma en que se está
animando aquí. Mueve esto un
poco más rápido, también. ¿Por qué no encontramos aquí una foto de Steve Jobs
para esta última parte? Ese único trato lo
hizo más rico. Ooh, esto se ve
muy interesante. ¿Por qué no tratamos de
usar algo de esto? Bien, entonces por desaparecer, sólo
voy a animar
la opacidad para que sea como, así Y aquí también podemos intentar usar una transición de compositor de animación para ver si
tal vez algo así Y luego agregar leyendas aquí
al final, voy a copiarlo. Por qué no agregamos texto E aquí y voy
a pegar el texto. Simplemente selecciona el texto, la persona P, cambia su posición y vamos a crear algún tipo de posición de transformación de
animación. Vamos a bajarlo. Disminuye la opacidad y
aumenta el desenfoque en
100, 100 va a presionar nuevo y hacer las cosas
un poco más rápido, y luego disminuir el
retraso a digamos 0.5 En realidad, tiene
que empezar aquí. Y creo que el desenfoque es
solo un poquito demasiado. Entonces podemos disminuirlo a 50. Y vamos a crear
fotogramas clave de opacidad aquí también. Entonces este va a ser uno
y va a estar en cero, entonces éste por alguna
razón está a las cinco. En realidad, me
gustaría precomponer esto y hacer zoom en eso un
poco, también P y S. Crear fotogramas clave, acercar un poco Al igual que, así que selecciona estos dos. Hazlo un poco más suave. Bien, vamos a verlo desde
el principio.
17. Añade música, efectos de sonido y pulido final del audio: Bienvenida. En este video,
vamos a hacer diseño de
sonido justo
en After effect. Y para hacer eso,
necesitamos encontrar nuestro archivo de audio, que va a
estar en la parte inferior, y tenemos que presionar
L y L dos veces. Y entonces vamos a
obtener las formas de onda de audio. Esto es súper importante
porque solo va
a hacer que nuestra flotación
viva sea más fácil. Podremos
ver dónde tenemos
ciertas palabras donde termina el discurso y comienza el otro
discurso, básicamente el final
de la oración y el inicio de
la nueva oración. Ahora, para poder hacer
el diseño de sonido, necesitamos conseguir audio, el mejor lugar que encontré a lo largo los años es Epidemic Sound. Epidemic Sound es una compañía
que se especializa en producir música,
efectos de sonido, voces en off Y si llegamos a su página web
y le echamos un vistazo, veremos que tenemos
el tipo de descubrimiento que va a ser
como todos a la vez. Entonces tenemos el tap musical
donde podemos buscar en la parte superior o ordenar por diferentes
géneros artistas, cosas así,
súper convenientes. Y para los efectos de sonido, tenemos muchos efectos de
sonido aquí, y como puedes ver, también
tenemos interfaz de usuario. Entonces venimos aquí y
buscamos muchas interfaces de usuario. Lo que hago es entrar en
la interfaz y
solo busco alguna falla B. Esto es realmente bueno. Va a haber un enlace
en la descripción para
la prueba gratuita de 30 días
para sonido epidémico. Te recomendé que
intentaras ver cómo trabajar con herramientas
profesionales. No obstante, para ahorrar tiempo,
ya tengo una carpeta
con sonidos de interfaz de usuario, todos los
cuales están recopilados
a partir del sonido epidémico. Como puedes ver aquí, tenemos sonido
epidémico en la parte superior. Para que puedas encontrar todos estos
sonidos en sonido epidémico. Y vamos a
escuchar un poco lo que tenemos aquí. Sí. Sí. Bien, entonces este va a ser el primer sonido
que vamos a usar, y para hacer nuestra vida
un poco más fácil, en realidad
podemos simplemente seleccionar
todo aquí y podemos precomponerlo presionando el comando
Shift o Control C, y
se va a llamar visuales Podemos usar el audio aquí. Así que en realidad podemos crear
otra carpeta y llamarla audio para mejorar aún más
las cosas, y luego poner audio aquí, y luego cada vez que pongamos cualquier
otro de los efectos de sonido, simplemente lo
pondremos en la carpeta para asegurarnos de que las cosas
estén organizadas. Entonces ahí vamos.
Este es nuestro sonido. Sólo voy a
arrastrarlo y soltarlo. Pulsa en L, L otra vez, y ahí tenemos nuestro sonido. Entonces podemos ver que
tenemos dos sonidos. Todo el mundo asume que Steve Jobs
hizo su fortuna con Apple, pero eso es Y podemos
acortarlo haciendo justamente así Y luego cuando Steve Jobs esté a punto de aparecer
en la pantalla, sólo
vamos a
ponerlo más o menos aquí mismo. Steve Jobs M Así que todo el mundo asume que Steve
Jobs hizo su fortuna. Yo diría que es un
poco más fácil hacer efectos de
sonido en algo
como Premiere Pro, pero todavía podemos
hacerlo en after effects. Entonces tenemos el sonido cuando Steve Jobs
viene a la pantalla. Zoom Steve Jobs hizo su Y para poder
trabajar con el audio, hablando aquí de fondo, es un poco demasiado ruidoso. Zoom Steve Job. Nosotros para entrar en el audio de Window. Entonces vamos
a tenerlo aquí arriba, y solo necesitamos arrastrarlo
y soltarlo aquí solo para fines de
organización
porque es un poco más
organizado de esta manera. Y entonces todo lo que tenemos que hacer
es bajar la acuposa. Por ejemplo, para esta, yo
diría que tenemos que ir a, como, menos diez.
Vamos a probarlo. ¿El trabajo rígido de Tom? Todo el mundo asume un trabajo rígido. Mm hmm. Vamos a
darle una oportunidad para probar-12. Todo el mundo asume que Steve Jobs
hizo su fortuna con Apple. Pero eso Si todavía es
un poco ruidoso, podemos bajarlo aún más por, digamos, actualmente está
en menos diez. Podemos hacerlo a -20 y
este -20, también. Entonces vamos a darle una oportunidad. Todo el mundo asume que Steve
Jobs hizo su Sí. Por lo que se asienta en el
fondo. Bastante bien. Todo el mundo asume que Steve Jobs
hizo su fortuna con Apple. Así que aquí para este Zoom, en realidad
puedes usar compositor de
animación y buscar sonidos. Y aquí,
en realidad podemos simplemente buscar un swoosh vamos a darle una oportunidad a
este Oh, pero eso es en realidad de
Apple. Pero eso es en realidad. Hmm. No estoy seguro si está
funcionando muy bien aquí. Vamos a darle una oportunidad a este.
Eso es un poco más largo. Su fortuna de Apple, pero eso es en realidad rom. Mm hmm. Bien, esto es mejor. Para este
Zoom muy interesante que está sucediendo
en la pantalla, realidad
podemos usar
algo similar. Podemos simplemente duplicar este
y luego crear Swishliko. En realidad oh Cuando
murió, no es de Apple, pero
eso en realidad es rom. Cuando murió, es
patrimonio neto de Apple. Pero eso está realmente
mal cuando murió. Genial. Entonces lo que estoy
tratando de hacer es simplemente apoyar el momento que tenemos
con algún tipo de sonido. Entonces para este de aquí, en realidad
podemos usar
algo así como un trinquete, que creo que tengo aquí. Sí, esto puede ser bastante bueno. Pongamos el trinquete aquí y veamos a Presson L para
ver las formas de onda Yo su patrimonio neto era un
poco más de $10 mil millones. Pero la mayoría de
eso no llegó pixel. ¿Trabajos? ¿Qué foto eres? Sí, sólo voy a usar una parte que es un
poco más tarde. Empieza aproximadamente aquí cuando veamos los números
por primera vez. Su patrimonio neto era un
poco más de 10 mil millones. Dólares, pero lo
vamos a terminar aquí. Voy a presionar
Option Right Bracket para terminarlo aquí. Mil millones de dólares. Pero la mayoría de
eso no lo hizo de. Bien, para este, podemos
usar el efecto máquina de escribir, que también tenemos máquina de escribir. Vamos a ponerlo y
desactivar las imágenes porque en realidad
es video, y vamos a buscar un lugar donde tengamos el
inicio de la primera letra y lo vamos
a poner ahí Pero la mayor parte de eso
no vino de iPhones, Max o Applest. Sí, perfecto. Y luego por
cada una de las imágenes que tengamos uppe,
podemos usar algún tipo de,
como, un hit o algún
tipo de pop up, que en realidad podemos
para compositor de animación Esto es bueno.
Vendré de iPhones Entonces solo estoy encontrando un
punto en el que cambia, y luego lo voy
a usar de nuevo. Máx. ¿Y dónde está aquí? Y agreguemos. Escuchemos. Vengo de iPhones,
Mac o stock de Apple. Vino de Pixar.
Josh Dobbs compró Pixar en 1986 por
tan solo 5 minutos Y aquí, podemos usar un efecto de sonido de marcador
porque estamos una especie de, como,
resaltarlo con un marcador. Entonces busquemos un marcador. Esto va a ser bueno para ir. Por cierto, olvidé agregarlo al audio.
No es un problema. Pongámoslo aquí,
asegurémonos que las cosas estén un poco más organizadas y luego pongamos
aquí también el trinquete. Perfecto. Bien, para el marcador, intentemos dejarlo caer. ver cuando tengamos que empezar la
palabra. Más o menos aquí. Apenas 5 millones de dólares.
Bien, esto es bueno. Y luego para este marcador, vamos a usar marcador aquí también. Voy a duplicarlo
presionando Comando D o Control D, y luego me voy a mover
a este lugar donde
también voy a presionar y
cambiar para asegurarme de que se ajuste perfectamente al cabezal de reproducción 20 años después, Disney
cuerpo cuatro por 7 mil millones. Para estos movimientos, también
podemos usar un swoosh. Entonces sabemos que esto es un swoosh. Podemos duplicarlo, ponerlo arriba, ponerlo aquí. Empezamos en 1986 por solo
5 millones de dólares la apuesta diminuta. 20 años después,
Disney cuerpo cuatro. Y luego usa otro aquí, así que voy a
duplicar éste, ponerlo arriba,
ponerlo a la derecha. Pongámoslo así. Por cuatro por 7 mil millones. Muévete a bit
a la izquierda para comenzar más rápido. Disney cuerpo cuatro por siete. Posteriormente, Disney cuerpo
cuatro por siete. Quizá un poco a la izquierda. Disney lo compró por más de 7
mil millones. Eso es un buen trato. Y aquí necesitamos usar
algo así como un Swoosh rápido. Así que va a una vez más, ir a Compositor de animación,
buscar a Swoosh Un poco más rápido, veamos. Ese único trato
le hizo ganar 7 mil millones. Ese solo trato lo hizo más rico que
toda su carrera en Apple Todo el mundo asume que Steve Jobs hizo su fortuna con Apple,
pero eso en realidad está mal. Cuando murió, su patrimonio neto era un poco más de $10 mil millones. Pero la mayor parte de eso
no vino de iPhones,
Max, o las acciones de Apple.
Vino de Pixar Empleos compraron Pixar en 1986 por solo 5 millones de dólares,
una pequeña apuesta 20 años después, Disney la
compró por más de 7 mil millones. Ese solo trato lo hizo más rico que
toda su carrera en Apple Ahora solo necesitamos bajar
todo en aproximadamente 20. Entonces si abro el audio, lo
tenemos a -20. Bien, así que solo voy a
poner -20 aquí y voy a copiarlo y luego presionar en tabulador y poner -20
más allá también. Apple, pero eso es
en realidad Oh, bien. Esto es demasiado silencioso. Entonces
intentemos menos diez menos diez. Básicamente, la de la izquierda es la oreja izquierda y la de la
derecha es la oreja derecha, y en realidad podemos simplemente
quitársela de la
oreja derecha o de la oreja izquierda. De Apple, pero
en realidad eso está mal. Cuando Bien, entonces esto tiene que ser menos diez
y menos diez, también. Murió, ¿su patrimonio neto? Esto definitivamente necesita
ser mucho más silencioso, menos diez y menos diez.
Vamos a probarlo. Cuando murió, su patrimonio neto era un poco más de un poco más de
mil millones de dólares. Pero la mayoría de
eso lo hizo Oh, sí. Esto tiene que ser como -20. Pero la mayor parte de
eso no vino de iPhones, Max o Apple Ah, y esto es,
como, muy ruidoso. Bien, así que da clic en esta. -20 -20. A ver. ¿Qué tan fuerte es?
iPhones. Bien. Esta es una buena cantidad de sonoridad, -20 -20 es básicamente en
términos de los decibelios. Quieres
asegurarte de que el audio esté en algún lugar aproximadamente en el menos entre cero y -30 en términos de
los efectos de sonido, las voces en off,
cosas así Qué picks están en 19 Esto
tiene que ser a menos diez, también, para que podamos escucharlo, pero no está
dominando la voz ¿Qué picks hay en
1986? ¿Acabamos de pelear? Esto es demasiado ruidoso,
lo sé, enseguida, tiene
que ser a -25, más o menos, porque es muy ruidoso Es por sólo 5
millones de dólares. Una pequeña apuesta. 20 años después, Disney. Entonces una vez más,
necesita estar en -25. 20 años después, Disney la
compró por más de siete. Y esto tiene que ser a los -15. Disney lo compró
por más de 7 mil millones. Ese único trato lo hizo. Y esto tiene que
ser intentemos -15. Ese solo trato lo hizo más rico que
toda su carrera en Apple Todo el mundo asume que Steve Jobs hizo su fortuna con Apple,
pero eso en realidad está mal. Cuando murió, su patrimonio neto era un poco más de $10 mil millones, pero la mayoría de eso no lo hizo. En realidad, el movimiento
que es cuando va a bajar, en realidad, me gustaría agregar
otro efecto de sonido aquí. Lo cual sería como un swoosh. Podemos ir a
Compositores de animación buscar
Swoosh Para este swoosh, moverlo a Mil millones de dólares.
Pero la mayoría. Y muévelo a más o menos aquí. Cuando está a punto de desaparecer
y pasar a súper rápido. Mil millones de dólares.
Pero la mayoría. Un poco más rápido. Mil millones de dólares.
Pero la mayoría. Poco más de 10 mil millones de dólares. Pero la mayoría. Mayoría. Shalin. Aquí es mejor. Bien, entonces audio, hagamos
menos diez para este,
menos diez, menos diez fue un
poco más de $10 mil millones. Pero la mayor parte de eso
no vino de iPhones, Max o las acciones de Apple Vino de Pixar. Trabajos
compraron Pixar en 1918 Pixar, creo, podría ser una buena idea para
permitir las imágenes, permitir que el audio
aparezca aquí también Bulltk. Vino de Pixar Empleos Compró Pixar? Entonces
vamos a escuchar. Fullstok Vino de Pixar.
Empleos compraron Pixar en 1986 por solo 5
millones de dólares la pequeña apuesta 20 años después, Disney la
compró por más de siete. Mil millones. Ese solo
trato lo hizo más rico que
toda su carrera en Apple Todo el mundo asume que Steve Jobs hizo su fortuna con Apple,
pero eso en realidad está mal. Cuando murió, su patrimonio neto era un poco más de $10 mil millones, pero la mayor parte de eso
no provenía de iPhones, Max o acciones de Apple Vino de Pixar.
Empleos compraron Pixar en 1986 por solo 5
millones de dólares la pequeña apuesta Diez años después, Disney la
compró por más de 7 mil millones. Ese solo trato lo hizo más rico que
toda su carrera en Apple Todo el mundo asume Bien,
este video es perfecto. Me encanta la
forma en que resultó. Tenemos muchos
buenos efectos de sonido, y es muy, muy bueno. Entonces ahora la última parte,
lo único que tenemos que hacer es
exportar el video. Vamos a hacer
ese siguiente video. Si tiene alguna
duda, házmelo saber. Aparte de eso, nos
vemos en el siguiente video.
18. Cómo exportar tu animación de UI desde After Effects para las redes sociales: Bienvenida. Y este video se envía para que exportemos el video. Entonces todo lo que tenemos que hacer es entrar al archivo en la esquina
superior izquierda, hacer clic en Exportar y
agregar a Render Queue. Para los ajustes,
te recomiendo que mantengas los mejores ajustes aquí en los ajustes de renderizado
y para el módulo de salida. Recomiendo establecer alta
calidad con Alpha. Básicamente, en términos
de estos ajustes, si hay algo
específico que necesites, definitivamente lo
sabrás
porque o un cliente solicitará o una plataforma lo solicitará o
algo así. Si no, entonces solo
déjalo en el mejor de los casos y ponle una alta
calidad con Alpha. Entonces solo hazlo así. Lo que esto hace es, si hay algo así como un fondo, va a mantener
el fondo. Pero si hay
algo transparente, va a ser transparente. Es simplemente algo que
me puse a mí mismo, y siempre tengo alta
calidad con Alpha. Es sólo un poco más fácil porque
no tengo que cambiarme. Entonces por eso siempre
exporto con estos ajustes. Y luego si hago clic aquí,
necesitamos dar el
nombre del video, que va a ser el nombre de la composición que
queremos exportar. Podemos cambiarlo
aquí en la parte superior. Haga clic en Guardar y luego haga clic
en Render. Y eso es todo. Después de que lo renderiza, podremos
ver el video completo para asegurarnos de que todo esté bien. Si es así, entonces este
video está hecho. Vayamos al escritorio
y veamos el video. Todo el mundo asume que Steve Jobs hizo su fortuna con Apple,
pero eso en realidad está mal. Cuando murió, su patrimonio neto era un poco más de $10 mil millones. Pero la mayor parte de eso
no vino de iPhones,
Max, o las acciones de Apple Vino de Pixar.
Empleos compraron Pixar en 1986 por solo 5
millones de dólares, una pequeña apuesta 20 años después, Disney la
compró por más de 7 mil millones. Ese solo trato lo hizo más rico que
toda su carrera en Apple Hermoso, absolutamente
hermoso. Me encanta este video, y estos videos listos
para ser publicados. Entonces si tienes alguna duda, avísame y
te veré en el siguiente video.
19. ¡Último paso!: Enhorabuena a ti.
Estás casi 100% terminado con el curso de animación de interfaz de usuario
después de los efectos. Solo hay dos
pequeños pasos que debes dar. Primero, tomar medidas. Como dijo Confucio, un viaje de 1,000 millas comienza
con un Entonces, si aún no lo has hecho, da tu primer paso creando
tu primera animación de UI. Toda la mejor información
del mundo no
significa nada si
no actúas en consecuencia, e incluso pequeños pasos conducen
a resultados masivos. E. Si encontraras valor
en este programa, realmente te
agradecería que tomaras 60 segundos en
dejarte una reseña honesta. Te estaré inmensamente agradecido y tus comentarios ayudarán masivamente a los futuros estudiantes elegir
el mejor
programa para ellos Aunque este
curso está completo, tu viaje acaba de comenzar. Asegúrate de mantenerme informados a mí y
a mis compañeros. Recuerda, estoy aquí
para tu éxito, así que si tienes alguna duda, asegúrate de comunicarte en
la sección QN a continuación Gracias de nuevo por
elegirme como tu instructor, deseándote todo
lo mejor y esperando verte
en futuros cursos.