Que programas usais para gestionar las animaciones de sprites 2d?, he mirado por inet y he visto algunos metodos pero hay uno llamado sprite sheet que parece ser que se usa bastante, es necesario un editor para gestionarlos o se puede hacer mas facilmente.
SpriteSheets es para mi lo mejor, pq en una textura puedes tener todas las animaciones del personaje. Es cómodo y lo más rápido para la tarjeta.
Y una buena base es el sample de microsoft sobre sprite sheets http://create.msdn.com/en-US/education/catalog/sample/sprite_sheet
Y tambien te puedes hacer tu propia aplicacion para gestionar los sprite sheets http://www.youtube.com/watch?v=UCfPFn4OLhk 8)
Thx, peña, esto de empezar es muy lioso no paro de mirar liks hyperlinks y documentación y de todo y me va a estallar el cabezón!!!
Yo utilizo spritesheets para cargar muchas imágenes pero no animaciones específicamente, los utilizo más bien como contenedores masivos. Esto lo hago porque XNA (al menos antes, ahora no sé cómo andará con el 4.0) si tu juego tenía muchas texturas (nuestros juegos 2D no bajan de 2000) y pretendías cargarlas te podías pasar minutos en ello (por ser muchos accesos a disco individuales para el disco duro de la consola que ya de por sí es lentísimo). Yo las meto todas en spritesheets (usando el ejemplo de creators, lo máximo que quepa en cada uno) y luego las cargo-desempaqueto al principio en un diccionario (o varios) a los que accedo y así paso de minutos a segundos.
Las únicas texturas que no empaqueto así son las tochas (1024x1024) para arriba, más que nada porque caben 4 y casi no se gana en velocidad de carga. Y si el juego no tiene demasiadas texturas tampoco lo hago.
Bueno, eso es algo mas de como funcionan las graficas que XNA en si. Es mucho mas rapido cargar algo grande y recortar una textura que andar cargando trozos pequeños todo el rato.
Y para los sprites animados?
Yo no tengo animaciones como tal en un único fichero, sólo uso los spritesheets para empaquetar texturas (que a veces son animaciones en forma de secuencias de imágenes). Pero siempre tengo todo separado en texturas, cada frame de cada animación es siempre una textura separada. Esto para los grafistas es comodidad pura y dura.
Bueno, pues alla voy yo...
yo me base en el sample del sprite sheet para hacer un solo archivo con toda la informacion necesaria.
el archivo actualmente lo genero automaticamente... haciendo una busqueda automatica en el directorio sprites, y añadiendo todos los .png que encuentre, y si el fichero termina en _strip_xxx.png significa que es una animacion, asi que genero la secuencia correspondiente.
Luego cargo el sprite sheet y puedo acceder a la region a traves del nombre del archivo.
<SpriteSheet xmlns="http://www.w3.org/2001/XMLSchema-instance">
<Files>
<File id="0" columns="3" rows="1">Sprites\Disparos\spr_bomba_strip3.png</File>
<File id="1">Sprites\Disparos\spr_disparo.png</File>
<File id="2" columns="8" rows="1">Sprites\Disparos\spr_espadazo_strip8.png</File>
<File id="3" columns="5" rows="1">Sprites\Disparos\spr_explosiondisparo_strip5.png</File>
<File id="4" columns="6" rows="1">Sprites\Disparos\spr_explosion_bomba_strip6.png</File>
<File id="5" columns="4" rows="1">Sprites\Enemigos\spr_bola_energia_normal_strip4.png</File>
<File id="6" columns="4" rows="1">Sprites\Enemigos\spr_bola_inestable_gigan_strip4.png</File>
<File id="7" columns="2" rows="1">Sprites\Enemigos\spr_cthulhu_cara_strip2.png</File>
<File id="8" columns="10" rows="1">Sprites\Enemigos\spr_cthulhu_tentaculos_strip10.png</File>
<File id="9" columns="6" rows="1">Sprites\Enemigos\spr_explosion_cthulgu_strip6.png</File>
<File id="10" columns="4" rows="1">Sprites\Enemigos\spr_fantasma_strip4.png</File>
<File id="11" columns="6" rows="1">Sprites\Enemigos\spr_moscardon_strip6.png</File>
<File id="12" columns="2" rows="1">Sprites\Enemigos\spr_muro_enemigo_strip2.png</File>
<File id="13" columns="8" rows="1">Sprites\Enemigos\spr_mva_gigante_suelo_strip8.png</File>
<File id="14" columns="6" rows="1">Sprites\Enemigos\spr_mva_muerta_strip6.png</File>
<File id="15" columns="8" rows="1">Sprites\Enemigos\spr_mva_strip8.png</File>
<File id="16" columns="6" rows="1">Sprites\Enemigos\spr_mva_suelo_gigan_muerta_strip6.png</File>
<File id="17" columns="9" rows="1">Sprites\Enemigos\spr_mva_voladora_gigante_dead_strip9.png</File>
<File id="18" columns="4" rows="1">Sprites\Enemigos\spr_mva_voladora_gigante_strip4.png</File>
<File id="19" columns="4" rows="1">Sprites\Enemigos\spr_mva_voladora_strip4.png</File>
<File id="20" columns="12" rows="1">Sprites\Enemigos\spr_mva_vol_aparece_strip12.png</File>
<File id="21" columns="20" rows="1">Sprites\Enemigos\spr_ojo_muerto_strip20.png</File>
<File id="22" columns="5" rows="1">Sprites\Enemigos\spr_ojo_strip5.png</File>
<File id="23">Sprites\Fondos y portada\back_fondo_general.png</File>
<File id="24">Sprites\Fondos y portada\back_fondo_naves.png</File>
<File id="25">Sprites\Items\spr_botas.png</File>
<File id="26">Sprites\Items\spr_botas_cogidas.png</File>
<File id="27" columns="6" rows="1">Sprites\Items\spr_espada_strip6.png</File>
<File id="28" columns="3" rows="1">Sprites\Items\spr_estrellas_strip3.png</File>
<File id="29">Sprites\Items\spr_gafas.png</File>
<File id="30">Sprites\Items\spr_gafas_cogidas.png</File>
<File id="31">Sprites\Items\spr_item_bombas_dest.png</File>
<File id="32" columns="3" rows="1">Sprites\Items\spr_item_bombas_strip3.png</File>
<File id="33">Sprites\Items\spr_llave_cogida.png</File>
<File id="34" columns="12" rows="1">Sprites\Items\spr_llave_strip12.png</File>
<File id="35" columns="5" rows="1">Sprites\Items\spr_moneda_cogida_strip5.png</File>
<File id="36" columns="5" rows="1">Sprites\Items\spr_moneda_strip5.png</File>
<File id="37">Sprites\Items\spr_pistola.png</File>
<File id="38">Sprites\Items\spr_pistola_cogida.png</File>
<File id="39">Sprites\Items\spr_rayo_espada.png</File>
<File id="40">Sprites\Items\spr_reloj_cogido.png</File>
<File id="41" columns="8" rows="1">Sprites\Items\spr_reloj_strip8.png</File>
<File id="42">Sprites\Muros\spr_bloque_oculto.png</File>
<File id="43">Sprites\Muros\spr_mask.png</File>
<File id="44" columns="2" rows="1">Sprites\Muros\spr_muelle_strip2.png</File>
<File id="45" columns="3" rows="1">Sprites\Muros\spr_muro_aparece_strip3.png</File>
<File id="46">Sprites\Muros\spr_muro_bomba.png</File>
<File id="47" columns="8" rows="1">Sprites\Muros\spr_muro_deshaz_strip8.png</File>
<File id="48">Sprites\Muros\spr_muro_espada.png</File>
<File id="49" columns="4" rows="1">Sprites\Muros\spr_muro_normal_strip4.png</File>
<File id="50">Sprites\Muros\spr_muro_rompible.png</File>
<File id="51" columns="10" rows="1">Sprites\Muros\spr_muro_rompible_rot_strip10.png</File>
<File id="52" columns="8" rows="1">Sprites\Muros\spr_muro_temporal_strip8.png</File>
<File id="53">Sprites\Prota\spr_mask_prota.png</File>
<File id="54">Sprites\Prota\spr_nave_mask.png</File>
<File id="55" columns="4" rows="1">Sprites\Prota\spr_prota_andando_strip4.png</File>
<File id="56">Sprites\Prota\spr_prota_disparando.png</File>
<File id="57" columns="4" rows="1">Sprites\Prota\spr_prota_espada_strip4.png</File>
<File id="58" columns="11" rows="1">Sprites\Prota\spr_prota_luminoso_strip11.png</File>
<File id="59" columns="12" rows="1">Sprites\Prota\spr_prota_muerto_strip12.png</File>
<File id="60" columns="13" rows="1">Sprites\Prota\spr_prota_nave_muerta_strip13.png</File>
<File id="61" columns="4" rows="1">Sprites\Prota\spr_prota_nave_strip4.png</File>
<File id="62">Sprites\Prota\spr_prota_quieto.png</File>
<File id="63">Sprites\Prota\spr_prota_salta.png</File>
<File id="64" columns="8" rows="1">Sprites\Prota\spr_stranger_strip8.png</File>
<File id="65" columns="30" rows="1">Sprites\Puertas\spr_portal_strip30.png</File>
<File id="66" columns="4" rows="1">Sprites\Puertas\spr_puerta_abierta_strip4.png</File>
<File id="67">Sprites\Puertas\spr_puerta_cerrada.png</File>
<File id="68">Sprites\Puertas\spr_puerta_enemigo.png</File>
<File id="69">Sprites\Puertas\spr_puerta_llave.png</File>
<File id="70" columns="8" rows="1">Sprites\Puertas\spr_puerta_temp_strip8.png</File>
<File id="71" columns="4" rows="1">Sprites\Trampas\spr_bola_inestable_strip4.png</File>
<File id="72">Sprites\Trampas\spr_bola_lava.png</File>
<File id="73" columns="10" rows="1">Sprites\Trampas\spr_lava_strip10.png</File>
<File id="74" columns="2" rows="1">Sprites\Trampas\spr_lanzabolas_strip4.png</File>
<File id="76">Sprites\Trampas\spr_pinchos_abajo.png</File>
<File id="77">Sprites\Trampas\spr_pinchos_arriba.png</File>
<File id="78">Sprites\Trampas\spr_pinchos_derecha.png</File>
<File id="79">Sprites\Trampas\spr_pinchos_izquierda.png</File>
<File id="80" columns="4" rows="1">Sprites\Trampas\spr_plasma_strip4.png</File>
<File id="81">Sprites\Trampas\spr_laser_energia_vertical.png</File>
<File id="82">Sprites\Trampas\spr_laser_energia_horizontal.png</File>
</Files>
<Sequences>
<Sequence>
<Name>spr_bomba_strip3</Name>
<Frames>0.0 0.1 0.2</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_espadazo_strip8</Name>
<Frames>2.0 2.1 2.2 2.3 2.4 2.5 2.6 2.7</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_explosiondisparo_strip5</Name>
<Frames>3.0 3.1 3.2 3.3 3.4</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_explosion_bomba_strip6</Name>
<Frames>4.0 4.1 4.2 4.3 4.4 4.5</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_bola_energia_normal_strip4</Name>
<Frames>5.0 5.1 5.2 5.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_bola_inestable_gigan_strip4</Name>
<Frames>6.0 6.1 6.2 6.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_cthulhu_cara_strip2</Name>
<Frames>7.0 7.1</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_cthulhu_tentaculos_strip10</Name>
<Frames>8.0 8.1 8.2 8.3 8.4 8.5 8.6 8.7 8.8 8.9</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_explosion_cthulgu_strip6</Name>
<Frames>9.0 9.1 9.2 9.3 9.4 9.5</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_fantasma_strip4</Name>
<Frames>10.0 10.1 10.2 10.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_moscardon_strip6</Name>
<Frames>11.0 11.1 11.2 11.3 11.4 11.5</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_muro_enemigo_strip2</Name>
<Frames>12.0 12.1</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_mva_gigante_suelo_strip8</Name>
<Frames>13.0 13.1 13.2 13.3 13.4 13.5 13.6 13.7</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_mva_muerta_strip6</Name>
<Frames>14.0 14.1 14.2 14.3 14.4 14.5</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_mva_strip8</Name>
<Frames>15.0 15.1 15.2 15.3 15.4 15.5 15.6 15.7</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_mva_suelo_gigan_muerta_strip6</Name>
<Frames>16.0 16.1 16.2 16.3 16.4 16.5</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_mva_voladora_gigante_dead_strip9</Name>
<Frames>17.0 17.1 17.2 17.3 17.4 17.5 17.6 17.7 17.8</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_mva_voladora_gigante_strip4</Name>
<Frames>18.0 18.1 18.2 18.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_mva_voladora_strip4</Name>
<Frames>19.0 19.1 19.2 19.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_mva_vol_aparece_strip12</Name>
<Frames>20.0 20.1 20.2 20.3 20.4 20.5 20.6 20.7 20.8 20.9 20.10 20.11</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_ojo_muerto_strip20</Name>
<Frames>21.0 21.1 21.2 21.3 21.4 21.5 21.6 21.7 21.8 21.9 21.10 21.11 21.12 21.13 21.14 21.15 21.16 21.17 21.18 21.19</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_ojo_strip5</Name>
<Frames>22.0 22.1 22.2 22.3 22.4</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_espada_strip6</Name>
<Frames>27.0 27.1 27.2 27.3 27.4 27.5</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_estrellas_strip3</Name>
<Frames>28.0 28.1 28.2</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_item_bombas_strip3</Name>
<Frames>32.0 32.1 32.2</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_llave_strip12</Name>
<Frames>34.0 34.1 34.2 34.3 34.4 34.5 34.6 34.7 34.8 34.9 34.10 34.11</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_moneda_cogida_strip5</Name>
<Frames>35.0 35.1 35.2 35.3 35.4</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_moneda_strip5</Name>
<Frames>36.0 36.1 36.2 36.3 36.4</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_reloj_strip8</Name>
<Frames>41.0 41.1 41.2 41.3 41.4 41.5 41.6 41.7</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_muelle_strip2</Name>
<Frames>44.0 44.1</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_muro_aparece_strip3</Name>
<Frames>45.0 45.1 45.2</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_muro_deshaz_strip8</Name>
<Frames>47.0 47.1 47.2 47.3 47.4 47.5 47.6 47.7</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_muro_normal_strip4</Name>
<Frames>49.0 49.1 49.2 49.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_muro_rompible_rot_strip10</Name>
<Frames>51.0 51.1 51.2 51.3 51.4 51.5 51.6 51.7 51.8 51.9</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_muro_temporal_strip8</Name>
<Frames>52.0 52.1 52.2 52.3 52.4 52.5 52.6 52.7</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_muro_temporal_strip9</Name>
<Frames>52.0 52.1 52.2 52.3 52.4 52.5 52.6 52.7 52.0</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_prota_andando_strip4</Name>
<Frames>55.0 55.1 55.2 55.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_prota_espada_strip4</Name>
<Frames>57.0 57.1 57.2 57.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_prota_luminoso_strip11</Name>
<Frames>58.0 58.1 58.2 58.3 58.4 58.5 58.6 58.7 58.8 58.9 58.10</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_prota_muerto_strip12</Name>
<Frames>59.0 59.1 59.2 59.3 59.4 59.5 59.6 59.7 59.8 59.9 59.10 59.11</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_prota_nave_muerta_strip13</Name>
<Frames>60.0 60.1 60.2 60.3 60.4 60.5 60.6 60.7 60.8 60.9 60.10 60.11 60.12</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_prota_nave_strip4</Name>
<Frames>61.0 61.1 61.2 61.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_stranger_strip8</Name>
<Frames>64.0 64.1 64.2 64.3 64.4 64.5 64.6 64.7</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_portal_strip30</Name>
<Frames>65.0 65.1 65.2 65.3 65.4 65.5 65.6 65.7 65.8 65.9 65.10 65.11 65.12 65.13 65.14 65.15 65.16 65.17 65.18 65.19 65.20 65.21 65.22 65.23 65.24 65.25 65.26 65.27 65.28 65.29</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_puerta_abierta_strip4</Name>
<Frames>66.0 66.1 66.2 66.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_puerta_temp_strip8</Name>
<Frames>70.0 70.1 70.2 70.3 70.4 70.5 70.6 70.7</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_bola_inestable_strip4</Name>
<Frames>71.0 71.1 71.2 71.3</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_lava_strip10</Name>
<Frames>73.0 73.1 73.2 73.3 73.4 73.5 73.6 73.7 73.8 73.9</Frames>
<Duration>1</Duration>
</Sequence>
<Sequence>
<Name>spr_plasma_strip4</Name>
<Frames>80.0 80.1 80.2 80.3</Frames>
<Duration>1</Duration>
</Sequence>
</Sequences>
</SpriteSheet>
La hostia, puede repetirmelo? Thx
Solo era por hacer ver que ahorra mucho curro hacerlo asi... ^_^'
Perdonad si os pregunto cosas obvias pero yo voy por los GFX y me estoy haciendo un cacao tremendo, imaginaros que solo quiero mostar un fondo de pantalla, que resolucion ha de tene, la 360 es 720p no?, es decir que mi fondo de pantalla tendria que tener 1280x720? para que quedase perfecto no?, es decir si le hago en los 4 extremos una especie de L quedaria cada una en una esquina perfectamente?.
Hice la prueba pero en lugar de L en las esquinas puse cuadrados, uno por esquina y en el win queda bien, pero en la xbox con una tele, los cuadrados casi no se veian, solo un lado por cada esquina de la pantalla, supongo que es por el tipo de televisión y habrá que tener en cuenta unas safe region o como se llamen para según que tipo de juegos.
Cita de: makaimura en 01 de Octubre de 2011, 03:28:22 AM
Hice la prueba pero en lugar de L en las esquinas puse cuadrados, uno por esquina y en el win queda bien, pero en la xbox con una tele, los cuadrados casi no se veian, solo un lado por cada esquina de la pantalla, supongo que es por el tipo de televisión y habrá que tener en cuenta unas safe region o como se llamen para según que tipo de juegos.
En consola tienes que trabajar con el area segura de pantalla ya que las televisiones no muestran todo el buffer de pantalla. Mirate este ejemplo del AppHub para que lo pruebes en la consola y en Windows:
http://create.msdn.com/en-US/education/catalog/sample/safe_area
Por norma, todo el material importante del juego, como el HUD por ejemplo, debe quedar si o si dentro de ese area para asegurarte que todo el mundo lo vera tenga la tele que tenga. El resto del espacio lo puedes llenar con lo que quieras.
Salu2...
P.D.: Seria interesante que te leyeras esta guia de "buenas practicas" para desarrollar para XBox Live Indie Games :) http://create.msdn.com/en-US/education/catalog/article/bestpractices_31
Nosotros tenemos una opción en los juegos para adaptar el safe area de los juegos haciendo que el jugador estire una imagen de "control" para indicar manualmente los límites. Por defecto creo que lo dejaba al 90% de la resolución, más o menos.
Ya te digo si me lo voy a leer tu manda manda que quiero saber.
Pues más de lo mismo: Para Arson & Plunder nosotros nos desarrollamos nuestro propio "spritizador" para gestionar mediante XML y las menores texturas posibles hordas de animaciones de distintos personajes y elementos, con sus correspondientes pivotes, cajas de colisión y cajas de ataque.
http://spritesheetpacker.codeplex.com/ (http://spritesheetpacker.codeplex.com/)
Esa fue la herramienta que usamos nosotros para Iredia, va bastante bien :)
Yo tambien he usado esa, aunque poco puedo opinar, ya que la use solo para un par de cosas y la he tocado poco, pero parecia sencilla y muy util.
En el engine que estoy haciendo, voy a darle una parte muy importante a este aspecto:
1. El grafista recuadra los gráficos y usa las texturas del tamaño que quiera. La ventaja de recuadrar es que ya te está indicando el desplazamiento que hay entre cada frame.
2. Recortar para obtener el desplazamiento y después dentro de cada uno, quitar todas las zonas que no tienen textura, de forma que el sprite que se pinta esté lo más ajustado posible a los gráficos.
3. Empaquetar el resultado en una textura utilizando el algoritmo que se utiliza para empaquetar lightmaps.
A ver si puedo avanzar rápido y enseño alguna cosa... :P