jairogarcíarincón

Ejercicios propuestos: Assets y Configuración


681

Creación de Tiles



Para realizar los ejercicios propuestos, lo primero que haremos será diseñar en Photoshop los 3 sprites de 384x384 correspondientes (con sus 9 celdas de 128x128) y exportarlos en PNG.

A continuación se muestra el resultado final de los 3. Puedes descargar tanto el PSD original como los assets en PNG al tamaño adecuado haciendo clic AQUÍ.

Random Tile

Rule Tile

Waterfall Tile


Configuración del proyecto



1. Para empezar, crearemos un nuevo proyecto en Unity 2D y nos aseguramos en Window > Package Manager > In Project de que tenemos añadidos al proyecto los paquetes 2D Sprite y 2D Tilemap Editor. Si no fuera así, los buscamos en Window > Package Manager > registry y los añadimos.

2. A continuación, de nuevo desde el Package Manager y pulsando en + > Add package from Git URL, introducimos la dirección: https://github.com/Unity-Technologies/2d-extras.git y pulsamos el botón Add para añadir el paquete de Extras 2D a nuestro proyecto:

Package Manager


3. Renombramos la escena y la llamamos Tiles. Creamos un Tilemap en la escena haciendo clic derecho y Create > 2D > Tilemap y lo llamamos Tilemap Random.

4. Repetimos el proceso anterior para crear un Tilemap Rule y un Tilemap Waterfall. El aspecto final de la Hierarchy Window debería ser similar a este:

Escena


5. Una vez configurada la escena, creamos una nueva carpeta en Project llamada Spritesheets y arrastramos dentro de ella los 3 PNG creados en Photosop.

6. Para finalizar la configuración, creamos otras dos carpetas en Project llamadas Tiles y Palettes y abrimos las ventanas Tile Palette y Sprite Editor (ambas desde Window > 2D).

Configuración de los tiles



1. Seleccionamos el spritesheet Random Tile y, desde su Inspector Window, modificamos Sprite Mode a Multiple, Pixels per Unit a 128 y hacemos clic en Apply:

Inspector window


2. A continuación, con el spritesheet Random Tile seleccionado, desde la ventana de Sprite Editor seleccionamos Slice y modificamos Type a Grid by Cell Size, Pixel Size a 128x128 y hacemos clic en Slice y en Apply:

Spite Editor


3. Para finalizar, repetimos los dos pasos anteriores para la Rule Tile y la Waterfall RuleTile.

4. Si ahora despliegas los spritesheet, verás que se han generado sprites para cada celda de 128x128:

Spritesheets


Publicado el 19 de Enero de 2022

unitytiles