de 2002
 
INTERNETE-CONOMÍAPRODUCTOSTELECOMSOCIEDADSEGURIDAD
suscripción | correo | foros | compras | diccionario | cursos
 
Estás aquí: MOUSE : Taller : Aprende a usar Flash MX (V)

Quinta parte :
Aprende a usar Flash MX

En las distintas secciones de este taller hemos visto las herramientas que forman la base de Flash. Mediante ejemplos revisamos como usar las capas, máscaras, interpolaciones de movimientos y otras alternativas presentes en el programa. En nuestra última entrega revisaremos las "guías de movimiento", función que utilizaremos para crear una jugada de gol.

Por Alfredo Morgan
08 Enero de 2003

1.- Antes que todo tenemos que definir un tema para usar las guías de movimiento. Personalmente –y siguiendo con los motivos futboleros- haré que el “Paragua” Campos lance un centro al “Rey Arturo”, mediante la ya mencionada función.

2.- Si bien lo ideal sería realizar mis propios dibujos de los monos, en este caso usaré una imagen importada. La gracia de realizar nuestras propias gráficas vectoriales es que una vez hechas mantienen su resolución sin importar el tamaño en que sean vistas. Por otra parte, al hacer nuestros monos vectoriales, los podemos animar o darles otro tipo de funciones incluidas en Flash.

Hecha la aclaración, lo primero que haré será realizar una capa que llamaré “cancha” para darle ambiente de estadio a nuestra creación. Posteriormente, y de la misma manera que se explicó en el artículo anterior, importaré a la librería las fotos de los dos jugadores que aparecerán en este ejemplo.

Una vez importados los arrastró hacia el escenario preocupándome de que cada uno quede en capas separadas. Por ejemplo: para arrastrar nora.gif debemos estar posicionados –justamente- en la capa llamada “nora”.

3.- Hice mi cancha, los jugadores ya están preparados y ahora daremos movimiento a la pelota. Jorge Campos (esquina superior izquierda) lanzará el balón de manera recta hacia Norambuena (esquina inferior derecha) pero en el trayecto hará un pequeño movimiento antes de llegar a la cabeza del destinatario, quien -con gran frentazo- la insertará en el arco (Fig. 01).

Guías de Movimientos (Motion guides)

1.- Con la pelota, y su respectiva capa ya incluida en el escenario, tomamos la imagen del balón, elegimos “Convertir a Símbolo” y luego elegimos “Gráfico”. En la parte superior del cuadro le ponemos un nombre que la identifique (Fig. 02).

2.- Ahora, con al pelota ya convertida en símbolo gráfico y ubicada en el primer cuadro de la capa, nos vamos al frame número 15, cuadro que determinará la extensión del movimiento por animar.

En el frame (cuadro) 15 insertamos un fotograma clave y realizamos una “interpolación de movimiento” (motion tween) tal como lo explicamos en el artículo anterior (Fig. 03).

Volvemos al frame número 1 y en la sección de propiedades nos tenemos que fijar que la opción “Tween” tenga la opción “motion” como elegida.

3.- Ya en tierra derecha nos vamos hacia la capa que llamamos “pelota” y con el botón derecho del mouse agregamos las guías de movimiento (add motion guide). Si lo hicimos bien, debería aparecer una nueva capa como la de figura número 4.

4.- Nos posicionamos sobre el frame número 1 del layer (capa) guía y dibujamos –con la herramienta lápiz- el trazado que queremos que recorra la pelota (Fig. 05). Para que la línea tome curvas y formas elegimos la opción “smooth” disponible en la parte de debajo de la barra de herramientas.

5.- Hecho lo anterior tomamos la herramienta flecha (la de color negro) y nos posicionamos sobre la pelota. Al mover el balón nos aparecerá un contorno de la imagen junto a un círculo en el centro. Debemos preocuparnos de que el círculo en el centro quede en el inicio (frame 1) y el término (frame 15) de la línea que acabamos de dibujar.

6.- Presionamos “Enter” para probar. Si resulta ya estamos listos, sólo debes apretar el ojo en la guía de movimiento para que la línea no se vea en el resultado final.

 


 portada mouse@latercera.cl
©Copyrigtht Medios Digitales Copesa 2002 

volver

 

 

 

Taller: Aprende a usar Flash MX

*Introducción
* La barra de herramientas
* Creando un banner
* El efecto Bond

 

Descarga los archivos usados:

- El código de nuestra animación