Como vimos en el artículo anterior, el tileset es la imagen que contiene las porciones del escenario. A continuación veremos algunas reglas sencillas a tener en cuenta para dibujar nuestro tileset.
Dimensiones
Lo primero es decidir las dimensiones de cada tile: 16×16, 32×32, 48×48, … En realidad esto es bastante subjetivo y dependerá de cada videojuego, gustos personales y resultado esperado. No estamos limitados a usar el mismo tamaño para el alto y para el ancho de cada tile: podemos usar por ejemplo 128×64.
Un aspecto a considerar en este punto es la resolución de pantalla para la que se diseña el videojuego. Por ejemplo, si vamos a proyectar el videojuego a una resolución de 320×240 píxeles, podemos utilizar tiles de 16×16, mientras que si el juego está diseñado para 1280×720 interesaría usar tiles más grandes, por ejemplo de 64×64 o 128×128.
Editor gráfico
Se puede utilizar cualquier editor gráfico con el que nos sintamos cómodos. En mi caso, para pixel art suelo utilizar Aseprite y GIMP, aunque existen muchas aplicaciones en el mercado tanto de pago como gratuitas. Algunas diseñadas específicamente para pixel art, como pueden ser Aseprite o Piskel, y otras más genéricas pero que también nos servirán en esta tarea, como pueden ser GIMP o Krita.
Una de las cosas que ayuda bastante es que permita mostrar una rejilla o cuadrícula. Esto es una funcionalidad básica que ofrecen la mayoría de editores.
Paleta de colores
Aquí no tengo mucho que decir porque no tengo conocimientos sobre arte gráfico. Simplemente comentar que escoger bien la paleta de colores utilizados dará a nuestro juego un aspecto consistente, a la vez que lo dota de ese aspecto retro que a menudo se busca en los videojuegos pixelados.
Tileset con Aseprite
Desde que descubrí esta herramienta de pixel art, la he ido utilizando cada vez más en mis proyectos. En mi último proyecto, Rainbow Diamonds, prácticamente todo está dibujado con Aseprite. La aplicación posee una interfaz intuitiva que nos permite trabajar de forma sencilla.
Para este ejemplo, usaré una imagen de 128×128 píxeles con tiles de 16×16 píxeles, lo que me permite crear un total de 64 tiles. Una vez creado un nuevo archivo, lo primero que voy a hacer es configurar la rejilla para usarla como guía de cada tile. Esto lo hacemos desde las opciones View > Grid > Grid Settings. Establecemos el ancho y alto de cada casilla, en este caso 16 pixeles en ambos, y pulsamos OK. Automáticamente se mostrará la rejilla que nos servirá de guía para dibujar los tiles.
Utilizando las herramientas de dibujo, creamos los tiles que iremos necesitando. Para este ejemplo, como se puede ver en la siguiente imagen, he dibujado unos tiles para el suelo del escenario, otros para hacer agua, una casa y un arbusto.
Si nos fijamos, la casa y el arbusto ocupan más de un tile. Esto no es problema ya que simplemente a la hora de diseñar el escenario, colocaremos estos tiles juntos para se muestren estos elementos correctamente. Lo que sí hay que tener en cuenta es que en un mismo tile no haya trozos de imagen de elementos distintos.
Para finalizar, exportaremos el archivo con el nombre tileset.png.
A continuación diseñaremos el escenario a partir de nuestro tileset.