Tal y como comenté en la charla sobre arte en videojuegos para móvil del CDV, cuando empezamos ha desarrollar juegos para móviles java hace cosa de 5 años, tuvimos que dar un nuevo enfoque a la animación de sprites debido a los altos requisitos de optimización de estos dispositivos.
Para animar cualquier sprite de la forma más óptima posible, es necesario:
- Los fotogramas de la animación (sprites) sin espacios en blanco. Cada sprite tiene el tamaño mínimo posible y normalmente cada uno tiene un tamaño diferente.
- Identificador o nombre de la animación (por ej., “prota_corre”, “prota_muere”, lo que sea…)
- Script de animación para definir la secuencia de fotogramas (Por ej., 1, 2, 1, 3, 2…), para no tener que repetir gráficos.
- Coordenadas de referencia para cada sprite. Esta coordenada dentro del sprite se utiliza para concatenar fotogramas de diferentes tamaños, además de ser utilizada por el programador para colocar el sprite en pantalla.
- Total independencia del programador. Si se consigue separar código y arte ¡es increíble lo que favorece la productividad!
Algunos fotogramas de la animación “andar” del juego Mr. Bean. Los puntos de referencia (en rojo).
Las dichosas coordenadas de referencia
Hay que tener en cuenta que cada sprite puede tener su coordenada de referencia en un lugar diferente.En este punto nos planteamos cómo disponer de dicha coordenada de forma visual y rápida, sin tener una incomoda y larga lista de coordenadas.
Lo más práctico y rápido en ese momento fue crear una 2ª imagen por cada sprite para indicar la coordenada (o coordenadas) mediante un pixel de color. Esa imagen se procesaría posteriormente para extraer la coordenada.
Esto nos permitía poder realizar montajes más complejos de animaciones dependientes unas de otras.
El fogonazo del fusil (b) y los casquillos (c) depeden automáticamente del fúsil (a) gracias a este sistema de puntos (Storm Gunner).
Y entonces llegó “Flash”…
Pronto este sistema no fue suficiente para crear animaciones más complejas. En ese momento se nos ocurrió usar directamente algún programa de animación. Flash fue la solución. Las ventajas son incalculables…
- Es el programa de animación más utilizado del mundo. El animador sólo se preocupa de animar. Aumenta el rendimiento y la producción se mejora.
- La especificación del los ficheros SWF es pública. Es posible extraer la información de coordenadas y sprites del fichero. (gracias Josep!)
- Permite reutilizar sprites.
- Permite las transformaciones básicas (rotaciones y volteos)
- Es posible combinar sprites con imágenes vectoriales.
- Es posible crear diferentes paquetes de gráficos mediante el uso de capas. Por ejemplo, si necesitamos eliminar cierta animación para un paquete de gráficos en concreto, sólo hay que colocarla en una capa y ocultarla antes de exportar.
- Todo el proceso es 100% independiente del programador. Se pueden hacer cambios de forma fácil y sencilla. Los cambios se puede probar al instante en el juego.
Sprites finales del protagonista de “Livingstone, Lost Again“.
Animación creada en Flash con sprites
No obstante, sigue siendo necesario disponer de un sencillo script para definir las animaciones y las secuencias de fotogramas:
STANLEY_IDLE = 1,1,1,1,1,2,3,3,3,3,3,2; //quieto STANLEY_WALK = 4-11; STANLEY_JUMP = 14-20; STANLEY_CHANGIDLE = 31,31-35,35,35,35-31; //colgado del techo quieto STANLEY_CHANG = 40-47; //techo moviéndose STANLEY_BHANGIDLE = 50,50,50-55,55,55,55-50; //colgado del borde quieto STANLEY_BHANG = 58-64,20; //colgado del borde salta STANLEY_SHOT = 23-29; //látigo STANLEY_CROUCH = 99, 102; //agachado STANLEY_CRAWL = 100-105,104,103,102,101; //arrastrándose STANLEY_WAKE = 102, 99; //levantarse STANLEY_WHANG = 110-116; //colgado del látigo STANLEY_CLIMB = 67,67,67,67-70,70,70,70,69,68; //enredadera quieto STANLEY_CLIMBH = 80-84; //enredadera horizontal STANLEY_CLIMBV = 88-93; //enredadera vertical STANLEY_JUMPSHOT = 123-128; //látigo saltando STANLEY_DIE = 132-137; //muerte
