Cómo animar en Adobe Flash

Desde el nacimiento de Flash -primero Macromedia, ahora Adobe-, se le ha dado usos diversos: sitios web, juegos, presentaciones, reproductores de video, series animadas, entre otros.

Si bien esta aplicación es bastante intuitiva y fácil de usar, puede que al principio cueste arrancar (sin un manual, claro). Hoy veremos como realizar una sencilla animación, yendo directo al grano y sin largas explicaciones de por medio.

Lo importante aquí es manejar un par de conceptos. Una vez aprendidos, créanme que el resto será cuestión de talento y paciencia.

La línea de tiempo

Como su nombre lo indica, desde este módulo controlaremos cuando comienza y termina cada fotograma -digamos, cuadro-. Allí reciden las pequeñas fracciones que harán a nuestra animación (en definitiva, no es magia).

Las capas

Este elemento es útil y molesto a la vez. ?til porque permite editar ciertas partes sin afectar a otras (el personaje en la capa 1 y el fondo en la capa 2). Decimos molesto porque si la animación requiere una mínima complejidad, debemos usar una capa para cada parte del objeto (cuerpo, brazo, cabeza, etc).

Ejemplo

Ahora que ya sabemos lo básico, vamos con un ejemplo donde aplicar todo ello:

1) Dibujá un círculo y convertílo en simbolo gráfico (botón derecho del mouse sobre el objeto, "Convertir en simbolo..."). Si prestás atención a la línea de tiempo, verás que se creó un punto negro en el fotograma 1 de la capa 1. Esto implica el inicio de nuestra animación.

2) Colocá el puntero sobre la celda 5 de la línea de tiempo, luego botón derecho del mouse e "Insertar fotograma clave". El fotograma clave vendría a ser una pausa o stop (metafóricamente), aunque desde lo técnico implica un cambio en el curso de la animación.

3) Repetí el paso anterior sobre la celda 10.

4) Ahora tendrás 3 fotogramas claves exactamente iguales (el circulo en la misma posición). ¿Qué hacemos? Vamos al 5 y movemos el circulo hacia arriba. Si presionás la tecla enter se producirá un movimiento, aunque bastante rustico; pues sólo reproducirá los 3 fotogramas.

5) Para darle verdadera animación, debemos aplicar la interpolación de movimiento. Ubicate sobre el fotograma 1 en la línea, luego bóton derecho y seleccioná "Crear interpolación de movimiento". Desde el 1 al 5 verás que el fondo se volvio violeta. Después hacemos lo mismo sobre el fotograma 5. Probá reproducirlo nuevamente y verás la diferencia en cuanto a la calidad de la animación (algo así como una pelota picando).

Conclusión

Siguiento este ejemplo puede llegar a hacerse una animación completa. La única diferencia estará en crear más fotogramas sobre más capas, siempre teniendo en cuenta la calidad en si del dibujo.

Por lo tanto, animar no es lo difícil, sino montar todo un entorno gráfico, con movimiento medianamente sutiles. Del resto, por suerte, se ocupará Flash.

Categorías

Publicado por: Mauro Borione

12 ComentariosComentar

[...] TechTear :: T_T :: Blog Magazine de Tecnologia » Cómo animar en Adobe Flash (tags: flash) [...]

Vie, 2007-07-27 12:20

Gracias, no sabia lo del motion tween.... muy buena explicacion un abrazo

Dom, 2008-05-11 18:27

excelente tu tutorial!:D
felicitaciones

Dom, 2008-10-19 18:01

buena explicacion, nunca me habia resultado con otro tutorial, muchas gracias

Vie, 2008-11-28 21:32

hola, un gusto, mira te kiero consultar algo por que la verdad que no me hubico como hacerlo yo x eso, como hago para escribir mas de un texto en flash (con su animacion adecuada), o sea, escribo el 1º texto y todo bien, barbaro el movimiento, pro cuando inserto otro texto, y le kiero dar movimiento me toma el primero, osea que pongo reproducir y me reproduce los dos, no se si me entendes, yo kiero que cada uno tengan distintos movimientos. Desde ya muchas gracias por tu tiempo.

Lun, 2009-07-27 21:25

ustedes dan asco hijuputas zorras tres dedos

Mar, 2009-08-18 09:52

soy bobo para esto pero tu explicacion es la mejor y sencilla que he leido...gracias..

Lun, 2009-10-12 12:24

hey che exelente amigo sigue explicando de flash con otros ejemplos porfa

Mar, 2010-02-09 13:10

gracias por la ayuda espero me sirva de mucho puesto que es para realizar un proyecto gracias de corazon sigue adelante

Mar, 2010-04-13 11:39

hola hola oie muchisimas gracias ja ja mañana tengo examen de flash y no tenia idea de como usarlo pero ahora cn esto ya tengo la idea j aja gracias de nuevo

Dom, 2010-05-23 23:51

Noooooooo!!!!!! en serio.. EL TUTORIAL es super sencillo, pero interesantísimo... COINCIDO... el mayor trabajo está en la Apariencia Gráfica...Felicitaciones Man... Escribe más tutoriales

Vie, 2010-11-19 13:39

Muy buen aporte gracias por tus conocimientos...

Mar, 2011-01-25 14:07
El contenido de este campo se mantiene privado y no se mostrará públicamente.