Quick Basix parpadeo animado al azar

Incluso cuando estás animando en la línea de tiempo, un toque de ActionScript puede mejorar lo que estás haciendo. En este Consejo rápido usaremos una sola línea de AS3 para agregar realismo animado En un parpadeo!


Paso 1: Abre los ojos

Coge los archivos fuente y abre "basis.fla". En el escenario se encuentra el movieclip "cabeza", que consta de dos capas que contienen los clips "cara" y "ojos".

Por supuesto, si desea comenzar desde cero, utilizando sus propios gráficos, puede hacerlo.?


Paso 2: Los ojos lo tienen.

Vamos a hacer que los ojos parpadeen periódicamente, así que comience haciendo doble clic en el clip de "ojos" para ingresar a su línea de tiempo.


Paso 3: Vista Blinkered

Amplíe la línea de tiempo agregando un fotograma clave en el cuadro 80 en la capa "ojos". Aquí es donde vamos a colocar los ojos en su estado de "parpadeo".

Elimina los ojos abiertos del escenario y dirige tu atención a la biblioteca. Allí encontrará "ojos cerrados" que puede colocar en el escenario donde anteriormente se encontraba el movieclip "ojos abiertos".

Con los ojos cerrados, presione F5 para agregar algunos marcos más. Agrega tantos como quieras; Al hacerlo, aumentará el tiempo que los ojos de tu personaje pasan cerrados durante cualquier parpadeo. 3 cuadros está bien en nuestro caso.

Pruebe su película (Comando / Ctrl + Intro) para tener una idea del efecto de parpadeo que ha creado.

La cabeza de reproducción se mueve a lo largo de la línea de tiempo causando un parpadeo periódico. ¡Perfecto! ¿Derecha? Bueno no exactamente. El parpadeo uniforme sugiere que nuestro personaje es un robot o falta su lóbulo frontal..


Paso 4: Randomeyes

Mejoremos el efecto aleatorizando el parpadeo..

Agregue una segunda capa al clip de "ojos", etiquételo "acciones" y bloquéelo. Seleccione el primer cuadro e ingrese el siguiente fragmento de código en el panel de acciones (Ventana> Acciones):

 gotoAndPlay (uint (Math.random () * totalFrames) +1);

Paso 5: Examen de los ojos

¿Qué hace realmente este fragmento? Bueno el gotoAndPlay (); La acción envía la cabeza lectora a lo largo de la línea de tiempo actual, a cualquier número de cuadro que definamos dentro de las llaves. El contenido dentro de nuestros frenos nos dará nuestro número de fotograma..

los Math.random () método devolverá un número entre 0 y (aunque no incluido) 1. Esto se multiplica por fotogramas totales, una propiedad de nuestro movieclip - la cantidad de marcos dentro de él (en nuestro caso 83). uint () aclara el resultado de nuestra número aleatorio * totalFrames, redondeando hacia abajo y dándonos un número entero.

El entero mas bajo podemos esperar que sea 0, ya que uint (0 * 83) es 0.

El entero mas alto podemos esperar que sea 82, ya que uint (0.9999999999 * 83) es 82.

por lo tanto, nosotros +1 para terminar, dándonos un marco de destino entre 1 y 83.

Una vez que la cabeza lectora llega al final de nuestra línea de tiempo, vuelve al fotograma 1 y se envía nuevamente a un fotograma aleatorio..

Mira la pelicula otra vez!

Nuestro personaje aún está parpadeando, pero ahora a intervalos irregulares, que parece mucho menos lobotomizado.

El efecto se vuelve aún más claro con dos instancias de nuestro personaje en el escenario. En el siguiente ejemplo, tenemos dos caracteres diferentes, pero ambos usan exactamente el mismo "clip" de "ojos":

No estoy diciendo que estos dos se vean como si lo tuvieran totalmente juntos, pero entiendes la idea?


Vista mejorada

Este es un resultado final muy simple, ¿por qué no ver si puede mejorarlo??

  • Jugar con el tiempo; modifica la velocidad de fotogramas y la cantidad de fotogramas dentro de tu película parpadeante.
  • ¿Por qué no intentar alterar el fragmento para evitar que la cabeza lectora salte a dentro la acción de parpadear en sí?
  • Tal vez incluso puedas evitar que la animación parpadee demasiado rápido en sucesión?

Conclusión

¡Has terminado! Esta es una técnica sencilla y de uso común, pero mover el cursor de reproducción a cuadros aleatorios se puede aplicar en miles de situaciones. Espero que encuentres útil para ello :)