|
Efectos Flash: Sensaci贸n de Velocidad. por Julio Laguna - redribera
1 Cap铆tulo 1.
1.1 Resultado final del tutorial en swf.
1.2 Creaci贸n del efecto visual de desvanecimiento.
1.3 Generar un movimiento desacelerado con sensaci贸n de velocidad.
1 Cap铆tulo 1.
1.1 Resultado final del tutorial en swf.
Vamos a generar un efecto de sensaci贸n de velocidad como el que os mostramos en el ejemplo que hay
bajo estas lineas.
Es necesario tener instalado Flash Player 7 o superior para poder visualizar correctamente este ejemplo.
Si no lo visualiza correctamente, puede obtener el plug-in correspondiente de la p谩gina de Adobe. En esta misma p谩gina
en el margen izquierdo existe un enlace para obtener el plug-in de flash Player adecuado para su navegador.
Para ver el efecto pulse tantas veces como desee sobre el bot贸n shoot de la pel铆cula flash, observar谩 una
bola moviendose con un suave movimiento decelearando hasta pararse.
El movimiento no es muy veloz para que pueda observar realmente al efecto que nos referimos.
1.2 Creaci贸n del efecto visual de desvanecimiento.
Para conseguir el efecto de velocidad, necesitamos proporcionar al objeto que estamos moviendo, un efecto de desvanecimiento,
para producir una sensaci贸n similar a la que se produce en nuestro ojo cuando observamos un objeto con una velocidad determinada.
Esto es f谩cilmente conseguible generando una clip de pel铆cula en Flash con el objeto que queremos mover y aplicandole una animaci贸n
que decremente la propiedad alpha del clip creado conforme avanzamos fotogramas en la animaci贸n.
Creamos un nuevo documento Flash (si no lo hemos hecho aun nosotros hemos utilizado una velocidad de fotogramas por segundo de 36 para el ejemplo).
En nuestro caso vamos a animar una simple bola (un circulo), pero el proceso
es similar para cualquier objeto que deseemos animar. Por tanto dibujamos un c铆rculo en el area de dibujo (de 100x100) y lo convertimos
en un s铆mbolo de clip de p茅licula (Modificar --> Convertir en simbolo o con F8 y el circulo seleccionado). Lo llamamos por ejemplo ball.
Ahora creamos un nuevo simbolo de pel铆cula al que llamaremos ball_anim .En el fotograma 1 insertaremos el nuevo simbolo ball.
En el fotograma 10 crearemos un nuevo fotograma clave en el que estar谩 insertado otra instancia del simbolo ball.
Ahora solo resta poner la propiedad alpha del simbolo ball del fotograma 10 a un valor de 0 y generar una animaci贸n de movimiento.
Adem谩s crearemos una nueva capa la linea de tiempo del clip ball_anim a la que llamaremos Acciones y en el fotograma 10 creamos
un nuevo fotograma clave. Desplegamos la carpeta de Acciones y escribimos la instruccion stop(); para que la animaci贸n pare al final y no se
reproduzca indefinidamente.
 | | Figura 1.1 - Linea de tiempo para el clip ball_anim |
Al final lo que hemos conseguido es generar una animaci贸n del objeto (un c铆rculo) similar a esta:
La animaci贸n de arriba es una animaci贸n infinita para que vea铆s el efecto, en nuestro caso nosotros debemos limitarla a una ejecuci贸n con la
instrucci贸n stop(); que insertamos en el fotograma 10 de la capa Acciones.
Esta animaci贸n es la que va a producir la sensaci贸n de velocidad al igual que en la retina de nuestro ojo, simulando un desvanecimiento del objeto
cuando este pase moviendos por un punto dado de la escena.
IMPORTANTE: Debemos asegurarnos de que el clip ball_anim se exporta para su uso con ActionScript. Para ello con el bot贸n derecho del rat贸n presionar sobre
el clip ball_anim en la biblioteca de elementos y seleccionar la opci贸n propiedades. Verificar que est谩 marcada la opci贸n Exportar para ActionScript y en el identificador
podemos llamarlo igual que el clip ball_anim.
|