DESIGNAID

Herramientas claves para representar tus ideas

FLASH CS5: Anima tus personajes con BONES

Y  llegó la hora de otro tut de flash! Al fiiiiinn la última versión de la herramienta élite para animar y crear contenido interactivo de Adobe se suma a la lista de actualización de Designaid. (ya le tocaba hace rato jeje)

En esta oportunidad vamos a conocer cómo podemos animar un personaje fácil y rápidamente para crear movimientos. La herramienta se llama BONE (hueso en inglés) y permite crear un esqueleto al personaje usando kinematica inversa, en otras palabras podemos animarlo con  extremidades como si fuera un títere. Esta herramienta también la puedes encontrar en Flash CS4 y de verdad no sé porqué no la habían incluido en Flash desde hace años atrás cuando otras aplicaciones como Moho ya la usaban hace rato.

Haz click en la imagen para ver el resultado de la práctica: (se abrirá una ventana nueva)

Con lo golpeadito que se mueve Chebacca y baila mejor que yo!😄 Recuerdan este personaje? tal vez lo hayan visto antes. Lo usé anteriormente para mostrarles como usar puppet warp en Photoshop CS5. (El reciclaje de personajes se debe a la crisis…. ya saben, en Designaid y tequeños con soya Inc. se maneja un presupuesto limitado y el disponible es para el fondo parrillero jeje)

Gracias a la siempre bien ponderada Tequeños con Soya Inc. por el arte una vez más. (no te quejes jessi al menos tienes publicidad gratuita por aqui 😉😄 )

Listo? empecemos…

PASO 1: Inserta o dibuja tu personaje en Flash. Para lograr el mejor resultado en la animación debes tener cada parte del cuerpo del personaje en una capa independiente. Yo por mi parte modifiqué el arte en Photoshop para crear las partes del cuerpo en capas independientes. Una para la cabeza, tronco, brazos y antebrazos, y piernas y pies. Guardé el PSD y luego lo importé en Flash usando FILE > IMPORT… > IMPORT TO STAGE… selecciona el PSD y verás las opciones de importación.

En estas opciones de importación selecciona "import images with editable layers" eso creara capas independientes y transforma la imagen en un movie clip. Haz esto con cada imagen a la izquierda hasta que todos sean movie clips.

PASO 2: Ahora tienes cada parte del cuerpo en capas independientes. Usa la herramienta de selección (flecha negra) y haz click en una parte del cuerpo del personaje para seleccionarla. luego selecciona BONES del panel de herramienta de Flash.

Parece una llave de tuercas no?. Naahh son huesos.

Ahora con haz click en una parte del cuerpo que tenias seleccionada y mantén sostenido el click para soltarlo en el otro movie clip que quieres conectar. Aquí te muestro como quedó la conexión del brazo de Chewy con el antebrazo:

Asi queda el brazo biónico de Chewy. Fijate como creamos la conexion de un movie clip a otro.

Cuando hagas la conexión las capas donde estaban los elementos se unirán y ahora serán una capa “Armature” (armazón o armadura en español) y los fotogramas ahora se mostrarán en verde. Para ubicarte mejor cambiales el nombre para ponerles Piernas, brazos, etc. No sé porqué pero para nombrar las capas Armature no uses espacios. Al parecer a Flash no le simpatizan. x_x

Nombrando las capas Armature con nombres bonitos para Flash.

Ahora viene la parte divertida, porque una vez que lo tengas conectado es cuestión de mover una pieza para ver cómo la otra parece moverse como una parte corporal de verdad!  No es sólo util para animar personajes, también lo puedes usar para similar piezas mecánicas y animarlas muy fácil y rápidamente.

PASO 3: Solo falta crear la animación. Ubicate en la capa del brazo, selecciona el numero de fotograma hasta el cual quieres crear la animación. Yo lo hice en el 10. Presiona la tecla F6 para insertar un fotograma clave y mueve el movie clip hasta donde desees. Es el mismo proceso para crear un Motion Tween o interpolación de movimiento. Repite los mismos pasos con cada extremidad del personaje.

1...2..3... Enseñandole a Chewbacca a bailar.

Listo! fácil no? una de las recomendaciones que te puedo dar cuanto estes creando tu personaje es separarlo por capas en Photoshop asi será mucho mas fácil la creacion de la animación. También cuando hagas estas capas trata de definir claramente el movimiento que quieres crear para que sepas como crear cada parte de las extremidades del personaje.

Espero t ayude. saludos y nos vemos en la próxima!😀

Luis S.

No comments yet»

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: