After Effects: animaciones en UI/UX

1. Introducción: Oye, esto es Green, Bella, soy parte de diseñadora de Ottawa, Canadá. Esta va a ser una clase rápida que cubrirá un montón de trucos que utilizo para crear muchas demos de productos usando Adobe after effects iban a crear una transición hermosa, suave entre dos pantallas. Y te mostraré mis técnicas y trucos que podrían estar disponibles para tu flujo de trabajo. La capacidad de mostrar cómo es verde se mueve en el draft es una parte crucial del proceso, y esta clase está pensada para ayudarte a llevar ese juego al siguiente nivel. 2. Atajos: antes de empezar, quería tener un video dedicado. Eso va a ser una rápida visión general de mi configuración de after effects y de los atajos clave y enchufes que estaré usando a lo largo de este curso. En primer lugar, tipo de mi, um mi espacio de trabajo general que usé personalmente se ve algo como esto, que en su mayor parte, probablemente se vea bastante similar a la mayoría de ustedes. Pero, um, así es como lo tengo configurado así puede afectar algunos proyectos encima. Obviamente, todos mis archivos estarán aquí en 1000 composiciones y mis capas y línea de tiempo por aquí. Y me encanta tener mi panel de efectos y presets fácilmente accesible aquí. Entonces si sí quiero encontrar rápidamente cierto efecto cierto, por ejemplo, por ejemplo, quieren un desenfoque gaussiano. Solo puedo buscarlo y, uh, uh, click en click y arrastrar sobre él a claro específico, solo una manera rápida de agregar efectos específicos. Um, un enchufe de llave en que uso se llama movimiento V a. No necesitas esta sangre para seguir adelante en este tutorial, pero es bastante útil, sobre todo para facilitar y tener control completo de la flexibilización. Y en cierto modo, eso es más fácil de usar que el editor de gráficos de aquí es este movimiento v dos. También viene con un montón de otros efectos que son bastante cool, para ser honesto y podrían agregar mucho valor a tus proyectos. Pasaré por esto muy pronto, Pero déjame seguir con estos tipos. Además, al patrón de alineación obviamente le gusta tenerlo realmente fácil accesible, porque es muy usado y cosas de tipografía rápida aquí, otro plug in que usa aux y este es un plug in para si usas catch, que que sí. Y hace importar tus diseños desde boceto hasta efectos posteriores. Ah, mucho más fácil. En lugar de exportar las cosas manualmente desde el sketch y traerlas aquí, esto prácticamente no es todo para ti, y mantiene todo posicionado en el lugar correcto. Mantiene las cosas comestibles. Las formas siguen siendo formas y el tipo sigue siendo tipo y todas esas cosas. También como que quiero repasar mi tipo de atajos esenciales que voy a estar usando lo largo de este curso. Andi, me imaginé que llegaríamos a correr a través de ellos ahora. Eso no eran una especie de cepillarse en todos los sentidos. Aplicarlos a lo largo del curso. Entonces solo voy a crear una nueva composición y voy a dibujar un círculo. Um, una cosa. También me gusta un barco. Este movimiento V para enchufar es que me permite un control rápido sobre mi punto de anclaje. Notarás que mi punto de anclaje ahora mismo no está centrado o sus nudos en la parte inferior justo después de cualquier lugar. Es sólo en un lugar raro. Esto me da control para posicionarlo rápidamente donde quiera esto. Voy a tener un centrado aquí, y también voy a tener todo mi círculo centrado en mi composición en solo voy a hacer una animación rápida y sólo algunos atajos clave que son bastante básicos o como, el P r S t. ¿Y sabes cuáles son? Es p rápido. Es la posición después de estar aquí, T transparencias son los activos de rotación para escala y se muestra sólo los fotogramas clave activos de la forma en que típicamente animaría algo. Diga, yo quería hacer esta mudanza de aquí a aquí. Yo rápidamente pincharía p gota en un, uh, un fotograma clave Scrub a través de mi línea de tiempo un poco aquí. Normalmente mantendría mi ojo en esto, lo que me dirá exactamente dónde estoy en términos de mi tiempo. Y si sí quiero control, digamos que quería estar exactamente un segundo y estoy aquí fuera, no lo dejaría aquí mismo en nuestra bodega. Comando impresionar a mi héroe par de veces, lo que me da control para moverme exactamente 11 enmarcado. Entonces ahora que se me cayó aquí, sé que mi marco clave está justo aquí. Entonces, um, ahora sé que estoy exactamente en un segundo voy a mover esta pelota allá arriba. Y eso ha tardado exactamente un segundo en mudarse de aquí a aquí. Um se Yo también quería cambiar la escala. Presionaría s por habilidad y dejando caer un marco clave y luego con lo habitual podría entrar. Si te hago clic, me muestra solo los fotogramas clave activos, lo cual es súper práctico para mantener aquí tus capas luciendo todas limpias. Entonces también voy a usar J y K, que salta entre fotogramas clave. K sube un marco clave, y Jake lo estaba respaldando. Es una manera realmente genial de navegar rápidamente por la línea de tiempo a solo unos momentos clave en. Y, ya sabes, estás exactamente en el lugar correcto. Entonces me voy a llevar esto. Voy a hacer la báscula aquí. 50 eso. Ahora, estamos pasando de grande a pequeño en exactamente un segundo. Um, y aquí es donde entra la flexibilización. Ahora bien, si quisiera que esto tuviera una fuerte opinión, como relajar que relajar, podría seleccionar todos mis fotogramas clave y puedo usar mi movimiento V para enchufar aquí. Entonces esto controla que está en este controles que está al final, y esto controla que está fuera. Entonces digamos que quiero tener un Él está dentro y fuera en algún lugar por aquí. Y ahora si presiono aviso espacial, tiene, como, un agradable fácil al mismo me podría haber ido más extremo. Esto es, como, ahora muy fuerte no es muy fuerte. Está fuera, o en algún lugar en el medio o de nuevo podrías tener el control completo jugando con esto exactamente a tu gusto. Otra cosa rápida de la que quiero hablar es el efecto de crianza justo aquí o dos. O debería decir, um qué hace eso que da control sobre, um, um, sobre hacer que dos cosas animen de la misma manera exacta. Entonces solo voy a caer en una plaza aquí. Voy a arreglar sus puntos de anclaje. Y ahora, claro, si vuelvo a mi línea de tiempo en Lee, mi círculo se está moviendo. Pero digamos, yo quería tomar esta posición queer aquí mismo. Digamos que quería que esta plaza hiciera exactamente lo que está haciendo el círculo. Podría tomar mi plaza, tomar este látigo aquí y arrastrarlo y soltarlo a la capa. Yo quería hacer exactamente lo que está haciendo. Entonces ahora que hice eso, puedes decir aquí que es capa aparente es esta capa. Ahora hacen exactamente lo mismo, lo cual es súper práctico. Vamos a estar usando esta herramienta en este curso, esto también hace otras cosas como, digamos, digamos quería que la rotación dijera que giré un poco esto y ahora te darás cuenta de ambos rotados. Es herramienta muy, muy útil, sobre todo para ti. ¿ Eres X trabajo? ¿ A dónde camino? Tipo de querer minimizar la cantidad de fotogramas clave que estaban usando. Por lo que ahora mismo, pesar de que todos estos aire se mueven de esta manera si los únicos fotogramas clave que se están utilizando son solo estos dos en esta capa, solo hace que sea más fácil mantener y administrar todos estos fotogramas clave. Y hace que después de los efectos tengan que trabajar un poco menos duro para no manejar, ya sabes, especie de todos estos marcos clave diferentes. Por lo que de nuevo, menos empiezan a usar los fotogramas clave antes que usted. Trabajo donde nuestras composiciones podrían complicarse bastante rápido porque pasa mucho , cuanto más podemos usar ciertas herramientas que lo hacen más fácil, mejor. 3. Planificación para la animación: Entonces tenemos un diseño aquí que creó y su estricto para los efectos de este curso . Y es sólo una forma de que nosotros, uh, presumir. Algunas de nuestras micro interacciones son transiciones, um, de nosotros yendo de esta pantalla de exploración donde estamos en la pantalla de auriculares inalámbricos y vamos a hacer clic en uno de estos ítems y vamos a hacer la transición a esta detallada página. Vamos a tomar algunas cosas en consideración aquí. Por ejemplo, la forma en que van a venir los auriculares de aquí a aquí, va a crecer. Esta desesperación pasa, va a llegar al centro de la pantalla, van a crecer, Nos vamos a deslizar. El resto de los artículos iban a deslizarse por los arcos locales justo aquí. Entonces es un poco más alto, y se va a convertir en blanco, y todo el fondo va a pasar de este color gris claro a este color oscuro. Um, todo va a pasar bastante rápido. Probablemente tal vez alrededor de un segundo o así, pero se va a quedar súper estilizado. Um, así que esto es todo en boceto, claro. Y voy a estar usando una herramienta llamada U X, que nos va a ayudar a importar esto de boceto a secuelas. Es importante que nuestros artículos sean términos bastante limpios de cómo se organizaron sus otros, pero no tiene que ser del 100%. Probablemente vas a tener un diseño A podría ser similar a esto. Podría ser diferente si quieres algún tipo de marcar algo parecido a esto que también es genial. Pero sí, siempre y cuando estén organizados de una manera donde sea fácil darle sentido a cómo se organizan y estructuran estas , creo que solo va a hacer que sea más fácil para ustedes chicos darle sentido y después de los efectos una vez que sea ahí dentro. 4. Importación y inicio: ahora por la parte divertida. Pongamos estos diseños en después de efectos y empecemos a enemigarlos. Como dije, voy a estar usando este enchufe llamado una u X. Si sí quieres Teoh, descárgalo, es gratis. Es solo en un e u ex dot io Puedes descargarlo gratis, instalarlo, y te diré cómo funciona esto. Una vez que lo tengas instalado, um, vas a querer ir a tus, uh, uh, enchufes e ir a una U X y hacer clic en patrón abierto. Y se ve así. Es súper pequeño. Um, pero, uh, eso muy útil cuando haces click en cualquier cosa. Pero por ahora, vamos a hacer clic en el tablero de arte en general aquí. Por lo que tenemos nuestra primera pantalla. A los primeros son pobres seleccionados. Voy a hacer clic, Enviar selección a A y lo que esto va a hacer es que va a copiar todos los atributos aquí en sus posiciones correctas, y va a prepararlos para que lo peguemos en after effects. Ahora, algunas de las cosas son imágenes. Por ejemplo, estos cuatro para auriculares y los toros bajan imagen de los que van a necesitar para ser exportados. Pero esta herramienta lo hace todo por nosotros. Entonces voy a dar click. Enviar selección T e. me va a preguntar ¿dónde quiero exportar esas imágenes? Tengo carpeta aquí llamada Activos, que está justo al lado de mi archivo aftereffects y voy a dar clic en seleccionar. Entonces lo que esto hizo en este momento es que exportó esas imágenes y tenerlas listas para que las importemos . Entonces voy a volver a las secuelas y te darás cuenta en mi enchufe AUX aquí. Ya se sabe que ya he copiado esta placa de arte de audífonos inalámbricos. Y me está preguntando si quiero que Teoh lo exporte a una nueva composición o ocurrencia ahora, porque no tengo logro creado, voy a dar click nuevo lo voy a hacer al doble de tamaño. Um, y voy a hacer clic en este botón aquí y ahora está haciendo lo suyo que importó estas imágenes thes. El nombre es un poco funky, pero creo que está bien. No necesitamos que tengas que preocuparte por eso y mira eso. Exporta todo a la derecha, tamaño y en la posición correcta, y todo está en capas, cual es bastante cool. Ahora hay unas cuantas que notarás son capas aquí. Aquí hay algunos ítems, que son los grupos que podemos eliminar, y uno que puede hacer eso es simplemente seleccionando todo aquí y luego haga clic en eliminar capas de grupo . Debe esa rápida espera hasta liderar a todos esos grupos? Um, sí. Entonces eso se ve bastante bien. Y tenemos todo aquí bonito y en capas. Ahora es un poco desordenado. Hay algunas de estas cosas, pero notarás que todo está en capas y el texto sigue siendo texto. Um, así que esto va a ser fácil y divertido de trabajar. Entonces la pantalla inicial aquí, queremos que venga de una manera rápida, pero de una manera agradable, interactiva que consiga que los usuarios se emocionen un poco. Después de todo, se trata de toros ahí una empresa bastante cool. Son bastante innovadores. Y creo que esta aplicación debería sentirse bastante interactiva, bastante atractiva, y tal vez no súper estática. Entonces, um, pensemos en cómo queremos hacer esto. En primer lugar, voy a seleccionar a estos tipos sólo para verlos aquí. Una cosa que suelo hacer sólo para que esto sea fácil para mí hacer un seguimiento, cambiaría los colores. Entonces, por ejemplo, voy a seleccionar todos estos, y voy a dar clic en el color aquí. Les voy a dar un color rojo. Es decir, vamos a darle un color diferente. Es algo que destaca. Ahí vamos. Y yo voy a hacer lo mismo por estos. Y voy a dar grupos como dejar a todos y les voy a dar un color apagado, digamos, azul. Y luego voy a hacer lo mismo por estos. Y un melocotón y estos. Está bien. Uh, Ugo. Entonces lo que me gusta de esto es que fácilmente puedo mirar estos y decir qué? Qué sección son. ¿ Sabes qué parte de qué tarjeta hay? Um, una cosa. Yo más cambia a este tipo. Voy a darle un color diferente, para que no sea confuso. De acuerdo, eso es sólo una señal visual que yo personalmente uso. Simplemente me ayuda a agrupar estas cosas rápidamente. Entonces vamos a empezar aquí con una pantalla vacía y este aire va a entrar muy rápido y, um, um, manera interesante. Entonces primero voy a tomar, um me voy a llevar todos estos. Voy a mover un poco mi cursor y voy a hacer el corchete abierto que movió todos estos pedacitos Y la única razón por la que hice esto sólo para no verlos enseguida de estos. Ahora está limpio. Y Aiken, me preocupo sólo por estos tipos y hacerlos entrar. Vamos a hacer que esto se desvanezca muy rápido. Entonces este es mi ícono de búsqueda y mi flecha hacia atrás algo tanto Presti como yo voy a dar click en la capacidad, hacer ese cero y hacerlo en la, uh, media segunda marca. Voy a hacer que sean 100. Tan sólo un rápido desvanecido para estos tipos y voy a hacer que el arco entre de un lado. Presione la p para posición en soltar una tecla para él aquí y suelte otro marco clave aquí. Entonces solo estoy presionando J y K saltando entre mis marcos clave y el primer tee desde aquí. Voy a hacer que esté afuera, y ahora se anima así. Um, obviamente, es muy lineal. Muy aburrido. Pero tomemos estos dos fotogramas clave y déjenme darle un lindo en el que está. Se retiene alrededor del 60%. Repita eso. Está bien para este tipo, déjame también, um, déjame hacer lo mismo por él. Esa caída en posición justo aquí y luego otra posición. Todo bien ahí. Y me voy a llevar ambos cuadros Volsky y solo dar clic en esto aquí mismo, que va a aplicar la misma flexibilización exacta que los toros. Entonces vienen y así así, y, um, hagámoslos un poco más largos. No lo tenemos medio segundo. Hagamos que sea exactamente en un segundo. Ahora, si quiero arrastrar estos dos fotogramas clave para estar exactamente en la marca de un segundo que vas a sostener con mi línea de tiempo estando aquí mismo, voy a sostener turno y trapo estos y ahora son exactamente ese segundo. Entonces es sólo un poquito, uh, uh, es la repetición de Brenda Explosive. Se ve bien, pero creo que quiero que el El está fuera al final sea un poco más fuerte. Que esos buenos por ahora. Lo revisitaremos inhibe. Una vez que vemos fue la pantalla completa. Entonces esto aún se quedó y luego estos chicos, necesitamos que entren rápido, y, um, um, una manera interesante, cosa que voy a hacer aquí, Así que no estoy animando a cada uno de estos. Voy a hacer que cada una de estas tarjetas tenga una capa de padres que va a ser la base sobre el resto estará hablando con esa capa de padres. Entonces todo lo que tengo que preocuparme es el moodiness. Entonces me voy a llevar a estos tipos, y sé que el rectángulo aquí es mi base. Entonces voy a seleccionar a todos estos tipos, y voy a llevar este látigo aquí y arrastrarlo al rectángulo. Y voy a hacer lo mismo por esto y seleccionar a todos estos tipos arrastrados rectángulo. Lo mismo para esta bebida. Y ahora lo que hace esto es si solo selecciono solo esta capa y la muevo. Todo se mueve con él, lo que va a hacer que sea mucho más fácil mantener juntos a estos tipos. 5. Interacción de tarjetas: Ahora hagamos que entren estas cuatro partes y de una manera interesante. Lo que voy a hacer es que los voy a hacer que todos se deslicen desde sus costados. Por lo que éste lo desliza de este lado. Este fue igual de este lado en este de aquí en éste de aquí en éste de aquí. Lo que voy a hacer es seleccionar esto y lo voy a mover justo al borde de, uh, el exterior del aeropuerto. Lo mismo con esto. Y visto con esto y esto, En realidad, déjame deshacer esto antes de hacer eso. Déjame caer en el marco clave correcto. Entonces déjame tomar estos cuatro rectángulos aquí y presionar la P y dejar caer una llave para él. Entonces terminan aquí y arrastrará este marco clave aquí mismo. Y entonces hagámoslo. Hagámoslo otra vez. Tomemos esto. Pásalo a un lado. Este lado, Ver, Ver, eso es crear instantáneamente la animación para nosotros. Entonces por lo menos entran como ese canal. Si hago esto, entran así, que obviamente es lineal. Nosotros queremos darle a esto un poco de la flexibilización correcta, así que voy a tomar estos cuatro y darles esa misma facilidad que hicimos. Entonces todos entran así un poco más despacio aquí sólo porque se está renderizando. Entonces obviamente se ve bastante robótico, el todo entrando a, um, a la misma hora exacta. Y, uh, una especie de velocidad aburrida, pero vamos a darnos un poco más de vida. Déjame volver a este marco clave aquí y déjame llevar a este tipo y presionar. En realidad, déjame ir a esta llave desde aquí y presionar, uh, seleccionar todas estas tres. Perdón. En primer lugar y la prensa son para la rotación en esta caída en una rotación manteniendo aquí. Por lo que en este punto del tiempo, queremos que todos sean 0% de rotación. Cero grados es decir eso está alineado muy bien. Pero entonces cuando sea rápido, vas a apurar a Jay para volver al marco clave aquí, y voy a hacer que todos realty un poco, así que les da un poco más de una sensación orgánica cuando hago clic en esto y me estoy poniendo un rotar a este tipo un poco así, y luego voy a moverlo un poco. Entonces está fuera del campus, lo mismo para éste. Voy a hacer que gire así y moviendo un poco de ayuda. Y luego este tipo, lo mismo. Y luego tomemos todos estos y también se aplica. Yo soy fácil de ello. Por lo que ahora te darás cuenta de que tipo de realeza y se meten. Y entonces démosles un poco de rebote a ellos con movimiento v dos. Aquí hay una característica excita. Ese tipo de les da un poco de buen rebote. Entonces la semana que vamos a hacer eso es que vamos a seleccionar todos estos marcos clave finales aquí, y voy a presionar, mantener el comando y hacer clic en ellos. Y eso va a matar la flexibilización que tuvo. El motivo de eso es porque cuando hacemos click en esta herramienta Excite, hace lo suyo, y es la flexibilización no puede interferir con eso. Vamos a dar click en eso. Está haciendo lo suyo ahora mismo. Y permítanme también hacer clic en todos los fotogramas clave iniciales. Déjame cambiar la forma en que entran. Voy a dar click en este tipo, que nos da otro conjunto de flexibilización, solo para que si sí queremos tener un par de ajustes diferentes. Debilitar. Haz eso. Yo voy a hacerlo. Este realmente alto, ¿no? Está fuera. Por lo que ahora vienen y crecieron en un tipo alto de facilidad en facilidad fuera. Y luego tienen un pequeño rebote y ven cómo se ve eso. Está bien, eso está bien. El rebote es probablemente un poco demasiado fuerte. Veamos que de nuevo rebota un poco demasiado fuerte. Arreglemos eso. Podemos seleccionar a estos tipos y luego ir a nuestros efectos aquí mismo, y te darás cuenta de que hay. Aquí hay algunos ajustes. Ahí hay rebasamiento, equilibrio y fricción sobre la razón por la que hay dos de ellos, porque uno de ellos es para la posición y el otro para la rotación. Voy a hacer que el rebasamiento solo sea 10 y el saldo en el beat 10 y lo voy a hacer por todos estos. Entonces tomémonos un minuto. Pero vale la pena, y me di cuenta de que me olvidé de hacerlo el 2do 1 aquí. Esa es otra cosa genial de esta moción. V dos es que viene con un montón de configuraciones fáciles, y son bastante altamente configurables para ciertos efectos que son bastante comunes, como esto lo excita, su herramienta de salto y solo un rápido de agregar algunos efectos. En este caso, soy como un poco de efecto de primavera, que es bastante común. Por lo que sólo hace que sea mucho más fácil trabajar con estas cosas. Entonces vamos a previsualizar esto ahora. Un poco lento ahora mismo. ¿ Esto está renderizando? Pero esto se ve bien. Este no es un rebasamiento loco como lo era antes, así que y no hay mucho de un rebote ahora, por lo que se ve bien. Ahora, lo único que todos entran en el mismo segundo exacto, lo cual es un poco raro. Entonces voy a hacer que todos entren inicialmente. Entonces ahora todos vienen al principio, incluso con las cosas del encabezado, y luego los vamos a hacer a todos un poco compensados. Voy a dar click en el 2do 1 aquí. Presionan Comando que comprimió la flecha derecha dicen, por crimen, es 1234 Entonces presione el corchete abierto 234 y el mismo para éste. Hazlo antes de lo que esto hizo está ahí y los hizo un poco compensados. Por lo que entran en momentos ligeramente diferentes. Eso se ve bastante guay. Ahora bien, esto puede ser un poco por la borda. Si estuviéramos haciendo esto por una aplicación de verdad, no hace falta que sea este funky. Pero el objetivo principal aquí es que estamos aprendiendo un montón de técnicas para algunas micro interacciones de alta fidelidad . Por lo que esto se ve bastante cool para esta pantalla inicial inicial. Eso todo esto está sucediendo exactamente en un segundo un poco más con porque los compensamos . Entonces a pesar de que nos llevó un poco de tiempo poner todo esto en marcha, realmente es ofrecer eso un segundo. Pero el diablo está en el detalle. Creo que una vez que haces estas pequeñas cosas aquí con el tiempo, hace una gran diferencia. Siguiente video, vamos a estar repasando cómo vamos a pasar a la segunda pantalla. 6. Transición a la pantalla de detalle: ahora que tenemos intro configurado aquí donde entran estos tipos así que pensemos en qué pasa exactamente cuando vamos a dar click en este tranquilo confort 35. Um, vamos a querer una transición a esta pantalla, y queremos hacerlo de una manera elegante donde este par de auriculares crezca para ser así y nos desvanecemos, los otros, los demás artículos restantes. Traemos el fondo negro sobre ese tipo de cosas. Entonces déjame volver a After Effects. Um, así que tengo una mayor que esta imagen de aquí es en realidad ah, imagen de alta resolución de este par de auriculares. Eso cuando sí quiero escalar su se puede escalar y quedarse y filete bastante buena calidad. Entonces si quieres hacer un efecto similar solo para asegurarte de que tienes una versión de alta resolución de ese activo y simplemente se encoge hacia abajo, así que cuando sí crece y se mantiene de buena calidad. Entonces una vez que esto entre, estoy pensando que tal vez alrededor de la marca de cuatro segundos, vamos a darle un toque a este tipo. Entonces, um, tomemos eso en consideración y hagamos que estos tipos se desvanezcan en ese punto, voy a seleccionar todas estas capas. Uh, los todos estos líderes impresionaron t ante la capacidad y caen en un marco clave justo aquí. Y lo vamos a hacer pies a un cinturón para, digamos, 15 Aquí, hazlos todos B cero. Excepto por el par de audífonos. Como notan MBS porque vamos a querer que eso crezca. Por lo que estos se desvanecerán así, y un par de auriculares va a crecer. Entonces déjame volver aquí y que me Caer en la báscula para los auriculares y soltar uno aquí y también la posición Dejar caer un marco clave ahí, y luego ir justo aquí. Vamos a hacer que presione use arma, ver ambos fotogramas clave. Voy a tomar todas estas y presionarte para que no tengamos que mirarlas. Um, y vamos a hacer que los auriculares sean bonitos y grandes aquí y suavizar este Teoh por aquí mismo , que se ve bastante cerca de cómo lo tenemos configurado en nuestro diseño. Uh, vale, eso se ve genial. Uh, déjame simplemente darle eso mismo. Fácil rápidamente. Probablemente le dará a esto un poco de equilibrio también. Por ahora este tipo de chicas como esta, hagamos que tome un poco más de tiempo. Enfriar. Um, déjanos el destino que está haciendo que este tipo se deslice. Entonces déjame caer en un marco clave de posición para este tipo, y a medida que crezca un par de audífonos, vamos a hacer que este tipo sea hasta el final. Y también le demos que está usando. Entonces, cuando te toca esto, pasa este tipo de cosas, lo cual es bastante guay, ¿de acuerdo? Y luego hagamos también que la, uh, la búsqueda, uh, se desvanezca. Entonces déjenme dar click en esa búsqueda desde la transparencia. Y, uh, vamos aquí a caer en un marco clave y luego vamos aquí a caer en un marco clave. Como usted nota. Estoy usando lotes J y K, que es solo una forma rápida para mí de saltar entre fotogramas clave. Ahora sé que en este marco clave es la opacidad es de 100 y este marco clave a cero. Entonces eso desaparece. Y así, hasta ahora, se ve algo como esto. Vamos a hacer que esto se vea mucho más fresco. Tomemos rápidamente como te das cuenta cuando estoy en mis auriculares. Aquí, déjame renombrar esto a audífonos uh, notan que puedo ver mis pequeños estos puntos aquí mismo. cual puedo agarrar este nodo aquí mismo y moverlo así. Lo que esto va a hacer es que esto lo va a hacer animar esta semana. Entonces ahora esto es un poco de, ah, de una curva a ella. Y también vamos a darle a esto un poco de equilibrio. Entonces voy a mantener el mando y matar lo fácil en esos últimos fotogramas clave y excitar y en realidad hacer aquí. Creo que ya tenía algunos. Déjame eliminar estos y dar click en esto y dar clic en Excitar y déjame dar esto. Mantengamos el rebasamiento un 20 año pero hará que el rebote 20 también. Y tomemos los primeros fotogramas clave. Hagamos que esos tengan un realmente fuerte fácil y fácil de ahora se ven algo como este Bastante cool. Entonces mira, algo así como este vehículo. Um, Así que hagamos también eso el fondo. Ahora cambia de colores. Déjame volver a mi archivo de boceto y déjame, um, déjame agarrar un par de cosas aquí, así que déjame tomar ese color de fondo, así que voy a venir aquí, tomar esta copia de color de fondo. Y lo que voy a hacer es que voy a crear un círculo que va a crecer de tamaño y llenar la pantalla ya que esto va creciendo. Entonces déjame, um, sólo ir, derecha Crea un círculo y vamos a ir este tamaño y déjame darle el color que acabo de copiar y déjame hacer su ancla Punto B escribe en el medio y déjame centrar. Está justo aquí, y voy a hacer el corchete abierto. Tráelo aquí mismo. Y lo que más voy a hacer aquí es que voy a hacer que el acero sea cero el escenario, y voy a hacer que la báscula sea realmente grande ya que llena toda la pantalla. Uh, aquí mismo y voy a darle lo mismo fácil. Y claro que lo voy a mover todo el camino hasta la parte de atrás. Haz esto y eso es mover Una capa más hacia atrás. Se llama a ese fondo negro. Entonces ahora voy a presionar shift forward slash. Y así ahora, cuando yo haga clic en eso, te darás cuenta de que todo sucedió. Entonces sucede demasiado rápido. Pero arreglemos eso. Entonces haremos que eso suceda. Entra justo por aquí. Entonces como estos pies fuera esto hace esto. Entonces está pasando un poco demasiado rápido. Déjame que lo despacio. Boom. ¿ Quién? Y creo que no soy un gran fan de la noche sobre mí. Déjame cambiar este tipo de bits más suave en la facilidad en facilidad de salida. Está bien. Y además, lo que estoy pensando en hacer es hacer que parezca algo así con los auriculares. Entonces déjame ir aquí y hacer clic en la posición y mantener la posición ahí mismo. Pero déjame volver al marco clave inicial donde empezó y hacer que venga en siguiente Hoy se había formado aquí mismo, así que se abre con ellos. Y mantengamos esa misma flexibilización. Y hagámoslo un poco más fuerte que fácil en un poco más rápido. ¿ De acuerdo? Es hora. Mira genial. Um, en realidad, creo que me gusta la forma en que viene de su lemming. Tráelo de vuelta al medio. Voy a quitar esa primera posición. Sigue entrando eso desde el medio. Algo así. Además, lo que voy a hacer es que vamos a volver a nuestro diseño aquí. Um, los rollos de cabeza son en realidad bastante más grandes. Déjame hacerlos más grandes en realidad déjame traer a estos tipos primero. Entonces voy a tomar, um esto y esto, y voy a ir a mandar selección a una E. Y no me pidió que exportara ninguna foto, porque todas son solo formas y formas y colores. Eso me dejó ir aquí. Y en realidad voy a importar esto como una nueva composición. Uh, porque los voy a animar a todos juntos. Entonces y van a venir por aquí. No cocino nueva composición y dejo caer a estos tipos para que Gil, también es seleccionar todos estos e ir a eliminar jugadores de grupo. No necesitamos ver a todos esos Googlers. Y, um, te voy a mostrar una técnica que solía agrupar todo juntos. Por lo que daría clic en claro nuevo, sin objetos y tomaría todas estas otras capas y los voy a padres para escuchar o tener esto de los padres. Y luego me voy a llevar esto Ahora, los motores que han ganado todo objeto aquí. Entonces si tomo esto y lo muevo por el todo se mueve con él, lo cual es genial, lo hace súper conveniencia. Ups. Aquí vamos. Entonces vamos a caer en un marco clave de posición justo aquí y ese Otro marco clave de posición aquí, todo el camino hacia abajo. Ver? Y vamos a darle a esto algo de flexibilización. Por lo que esto se desliza. Ahora, se nota esto. Ponga esto en su propia composición. Volvamos a nuestra composición principal y veamos cómo Dejemos caer esos pequeños proyectos. Entonces este es mi otro logro llamado auriculares inalámbricos detalles. Y voy a hacer que esa gota por aquí. Entonces cuando esto crezca, esto entra, voy a moverlo un poco, algo así. Entonces ahora se ve algo como esto. Entonces esto es demasiado lento como estamos viendo. Vamos, uh, ahora mismo, puedes notar que empieza a cero y luego es 1 46 Son casi dos segundos, que es demasiado largo. Déjame hacer esto mucho más rápido. Probablemente se tome alrededor de medio segundo. que me mueva esto a unos 35 y luego volver aquí, esto es probablemente fue mejor. Enfriar. Um, a lo que voy a hacer aquí es que siento que la animación viene en un poco demasiado aquí. Entonces lo voy a hacer no va a hacer que venga todo el camino desde abajo. Va a venir sólo de aquí. Se va a deslizar en tan sólo un poco como este, pero eso es un poco raro. Entonces lo vamos a hacer es voy a hacer que todos sean y, uh, uh, completamente invisibles al principio, y luego los, uh ellos aparecen así que va a verse algo como esto. Muy sutil, un poco menos de animación, en realidad va a hacer aún menos. Voy a hacer que se mueva justo desde aquí. Es un muy ahora se está moviendo un poco menos. Eso es mucho más bonito. ¿ De acuerdo? Y hagamos que nuestros auriculares sean un poco más grandes. Vuelve aquí a nuestra escala y hagamos esto alrededor de este tamaño y aquí mismo. Entonces van a crecer un poco más grandes. Y hagamos que ese Bo se deslice un poco. Voy a tomar este licor y va a deslizarse por ahí. Carrera aquí va a empezar a deslizarse. No estoy presionado esa posición p y dejando caer un fotograma clave mover justo aquí y se va a deslizar a justo aquí, y se va a poner blanco. Entonces déjame entrar aquí y ir carpa, que es mi carpa de color y arrastrar y soltar eso justo después del logo de ese Bo y voy a Teoh , déjame caer en una, uh, voy a hacer que espere, pero Voy a hacer que la cantidad sea cero y dejando caer un fotograma clave para luego pasar y luego hacerlo 100%. Entonces ahora se va a ver algo así. Así que deslice, Así rebanada de un poco demasiado rápido. Déjame frenar eso ahora. Se ve bien, creo. Deslizando un poco demasiado. Déjame bajar eso un poco. Entonces ahora lo hace esto Muy sutil, pero es manera bastante cool. También quieren el tiempo aquí para cambiar de color. Entonces voy a tomar este efecto de tintes que acabo de hacer una copia, y lo voy a pegar en este tipo de aquí, pasta de dedos. Y si te presiono ahora, puedo ver que, uh, no lo aplicó. Déjame comprobar por qué? Ah, porque no remolcamos Espera. Entonces déjame cambiar esto a blanco. Ahí vamos. Entonces ahora ese tiempo también cambia a blanco Y luego lo mismo para esta flecha. Aquí te dejamos seleccionar esta flecha y solo presiona cuota de comando. Y también es asegurarse de que esto es lo que es Así que ahora cuando esta chica era thes change, creo que los auriculares son un poco demasiado grandes. Afirma que haces un poco más pequeño, filete a estos chicos y haz que la báscula sea un poco más pequeña. Mucho mejor. Y vamos a subirlo sólo un poco aquí mismo. De acuerdo, Así que vamos a ver cómo se ve esto. Vamos a hacer clic en eso, y esto crece y esta transiciones. Pero déjame arreglar eso. Se ve bastante guay. Entonces esa es la transición básica pasando de pasar de esto a estos animando y luego haciendo click en eso y se abre. Una cosa que voy a intentar es por el fondo en lugar de ese círculo. Déjame ver si se ve bien con él, sólo cambiando de colores y sin que el círculo crezca causa tal vez eso sea un poco exagerado. Entonces déjame venir aquí y agarrar mi círculo. Y en lugar de que crezca la báscula, déjame mantenerla a lo grande y luego déjame hacer que se alimente desde cero 200 lo cual también se ve bastante cool. También se ve bastante guay. Voy a hacer que los audífonos sean un poco menos de un fuerte, fácil en fácil fuera slamming cangrejo, mis auriculares aquí y déjame agarrar la flexibilización inicial. Y vamos a hacer esto más como alrededor de esto? A lo mejor un poco más. Hagámoslo. Vamos a ver esto a toda velocidad. Es bastante guay. Hagámoslo un poco más rápido también. Selecciona a estos chicos. Vamos todos en la temporada y sí, eso va a la escuela. Entonces esto es más o menos para la transición aquí. Siguiente video, vamos a estar buscando agregar algunos pequeños gestos. Entonces solo el tapping en esto, además de ponerlo en un simulacro arriba en un teléfono y solo prepararlo para la demo. 7. Mockup para una demostración: Preparémoslo para un propósito demo. Pongamos un pequeño gesto de tap a este tipo y ponerlo dentro y marcado de iPhone. Sólo para que se vea bien para la fecha límite, voy a crear una nueva composición. Y, uh, vamos yo iba a lograrlo. Square lo va a hacer 2000 para el 2000 y llamémoslo Demel. Y luego voy a caer en mi, uh quiero decir, composición. Y obviamente, es bastante grande, lo cual es bueno, porque siempre es mejor tenerlo. Ganso grande que podemos hacer. Podemos hacerlo más pequeño. Escuela Eso. Entonces ahora es Ah, está justo aquí. Y antes de que hagamos eso realmente durará. Incluso yo. Déjame caer en el marcado de iPhone. Sólo voy a hacer doble clic en algún lugar aquí. Y tengo una marca telefónica aquí arriba iba a dejarla caer, y voy a dejarla caer justo en la parte inferior aquí y en realidad me deja moverla arriba aquí arriba, y voy a bajar la báscula aquí mismo. Diga tal vez alrededor de 73 para mi tal vez 73. 25. Ahí vamos. Um, sí. ¿ Y sabes qué? También voy a atar estos juntos así que voy a hacer que ese marco de iPhone sea aparente. Entonces si sí muevo estos grupos juntos s Oh, eso es genial. Para que tengamos esto pasando aquí. Voy a hacer un gesto de tap aquí mismo. Entonces vamos, um es crear un círculo y dejar que sus puntos de anclaje se centren. Voy a acercarme esto. ¿ Sabes qué? Voy a ponerlo blanco. Voy a darle, uh, voy a bajar un poco su transparencia y voy a darle una sombra de gota. Llevemos la distancia en un poco Y ha sido suavidad como esta. Y ahora tenemos este pequeño cursor de pies. Entonces vamos a hacer que este cursor venga por aquí mismo. Voy a hacer que sea invisible al principio y luego ser visible y voy a hacer que la posición ligera y un poco así que tu ojo ah, lo atrapa. Vamos un poco fácil Así que esto entra así y luego vamos a darle un toque a este tipo. Entonces voy a hacer la báscula sólo para hacer la ilusión de un grifo Voy a hacer la escala B 100 luego voy a hacer que la escala sea 70 y luego volver a 100 y luego voy a tomar estos y moverlos a Ah, la policía estaba, uh tal vez Mira, eso se ve bien, y también voy a hacer que desapareciera. Una vez que haga clic en eso, voy a volver a dar clic en la capacidad, dejando caer un fotograma clave, mover un poco y hacer que el marco clave sea el cero. Um, lo único que normalmente haría para mantener mi archivo lo más limpio posible. Yo cortaría esto aquí mismo, así que yo, uh tengo esto, así que no necesito ver el resto de la línea de tiempo. Entonces entra esto. Se aprovecha de esto y de su gasto. Ah, creo que hice mi teléfono un poco demasiado grande. Déjenme desvincular. Estos tipos hacen mi teléfono. A lo mejor 73 fue el número correcto. 70 años. Entonces ahora mis demos así, esto entra y tengo esta presión falsa que viene y toca esto y luego se abre. Voy a hacer eso un poco más grande. Hagamos que el cursor siga siendo 120 y quiere uno. Creo que los medios más 1 50 No, tú. Esto viene en grifo en esto en la extensión. Eso se ve bastante guay. Haz este poquito más pequeño. Uh, tomemos esto Ir un poco más pequeño. Todo lo que estuvo genial. Tan bastante simple. Um, espero que disfruten de este curtito. Esperemos que tome algunas técnicas que yo personalmente uso. Um y ojalá te ayude con tu y estás tras los efectos. Tú yo interacciones. Si tiene alguna pregunta, por favor siéntase libre de enviarme un mensaje. Y estaré encantado de ayudar. Y si sí disfrutó de la clase, por favor dale una opinión sobre realmente apreciar eso y muchas gracias y tener un día maravilloso.