Comunidad de diseño web y desarrollo en internet

Animación con easing y sin código en Flash 8

Una de las características menos mencionadas de Flash 8 es que ahora, para los diseñadores, ya no es necesario recurrir a largas líneas de tiempo, llenas de keyframes con números de desaceleración o incluso usar ecuaciones de tween matemático como las de Robert Penner y similares si quieren hacer animaciones con aceleraciones y desaceleraciones complejas.

Para este minitutorial debes tener instalado el Flash Player 8, puedes descargarlo de esta dirección e instalarlo en tu navegador:
http://www.macromedia.com/go/getflashplayer

El proceso es muy sencillo, creamos una animación normal de un objeto que recorra un punto a otro con Motion Tween (Interpolación de movimiento) tal como haríamos en cualquier versión de Flash, de modo que la línea de tiempo quede así:

Linea de tiempo

Como ven, solo un objeto (En mi caso, un dibujo dentro de un MovieClip) que inicia en un punto y se mueve a otro, nada raro.

Ahora, si damos click al primer keyframe de la animación, veremos que en el panel de propiedades, en la sección de las propiedades del Motion Tween, sale "Edit", tal como se ve acá

Editar movimiento

Si lo abrimos veremos un panel similar al de la edición de volumen al editar efectos de sonido, que viene desde Flash 4; pero este panel, nos permite editar nuestra animación de aceleración y desaceleración, pueden jugar con el y ver que hace cada curva.

Easing personalizado

En mi caso, dejare las curvas así:

Curva personalizada

Y el efecto es este:

Claro, esto tambien lo habrias podido hacer sin Flash 8, pero en MX2004 o anteriores, te habria quedado asi la linea de tiempo

Linea de tiempo MX

Sin contar con el monton de numeritos para el easing :P

Un detallito para diseñadores.

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Descargar Archivo

Publica tu comentario

El autor de este artículo ha cerrado los comentarios. Si tienes preguntas o comentarios, puedes hacerlos en el foro

Entra al foro y participa en la discusión

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate