Isaque Criscuolo
Isaque Criscuolo
@isaque.criscuolo
3d & animação

O que é tileset e tilemap no desenvolvimento de games?

  • por Isaque Criscuolo @isaque.criscuolo

Descubra o que é tileset e tilemap no mundo dos videogames, para o que servem e dicas para criar suas próprias composições

O que define um bom game design é a capacidade de oferecer aos jogadores desafios contínuos, mas não impossíveis de vencer, que levam a outros desafios gradativamente mais difíceis e complexos.

Tudo isso, claro, num ritmo que mantenha a atenção e o engajamento do jogador sem ser repetitivo.

O conjunto de escolhas de um videogame passa também pela construção do cenário, elemento crucial para dar vida a um universo de personagens e oferecer uma experiência completa aos jogadores.

Exemplos de tilesets de videogames
Exemplos de tilesets de videogames

No desenvolvimento de games 2D, em especial os baseados em pixel art, é utilizada a técnica do tileset e tilemap. Ambas ajudam a construir cenários através de um processo simples, ágil e capaz de facilitar a vida de milhares de game designers.

Inclusive, esta é uma das técnicas mais utilizadas até hoje, sendo peça chave de grandes jogos como Super Mario Bros, Pacman, Zelda: Link's Awakening, Starcraft, e Sim City 2000.

O que é tileset?

Um tileset é um conjunto de texturas reunidas numa mesma imagem, uma composição. Estas texturas formam as peças gráficas que compõem um cenário de um videogame: pisos, paredes, escadas, telhados, etc.

Para criar este conjunto, usamos uma grade composta de quadrados do mesmo tamanho. Neste caso, 16x16px. Cada quadrado desta grade é chamado de tile, a menor parte da composição.

Exemplo de tileset e como se transforma num tilemap
Exemplo de tileset e como se transforma num tilemap

Essa coleção de peças (ou texturas) precisa estar organizada de forma que seja possível visualizar objetos como uma parede, um toldo, várias portas, um pedaço de piso e um par de cores lisas, por exemplo. É a partir destes elementos que um cenário será criado.

Um tileset é super importante para o desenvolvimento de um jogo, pois é o arquivo que servirá de consulta durante todo o processo, ajudando a diminuir o tempo de desenvolvimento através da criação modular dos cenários.

O que é tilemap?

Tilemap é o cenário, um mapa de como os tiles devem ser organizados. Chamamos de mapas (e não cenários) por que no universo dos games é muito mais comum utilizar a expressão 'mapa'.

"É importante entender que, com o mesmo tileset, podemos criar um número infinito de mapas. Quanto melhor desenhado for o tileset, mais possibilidades de criação teremos", diz o diretor de arte Daniel Benítez (@dabntz).

Um mesmo tileset pode servir de base para diversos tilemaps
Um mesmo tileset pode servir de base para diversos tilemaps

De acordo com a game artist Chu Yamasaki, tilesets e tilemaps são muito utilizados no desenvolvimento de jogos por vários motivos, dentre eles:

  • Permitem a rápida criação de níveis com um número limitado de imagens.

  • Permitem uma otimização dos arquivos de arte, por fazerem com que menos arquivos individuais sejam carregados na memória durante o gameplay.

  • Facilitam a criação de um visual coeso e elegante, por serem necessários menos assets.
Exemplo de tileset com peças de Lego
Exemplo de tileset com peças de Lego

Aplicações práticas

Para Ariel Velloso, game developer e produtor digital brasileiro, um tileset é uma maneira comum de facilitar o desenvolvimento de jogos 2D, principalmente vistos de cima (top down view) ou side-scrollers (visão lateral, como jogos de  plataforma).

"Tilesets também podem ser usados para montar ambientes 3D. Você pode usar partes do tileset manualmente, recortando em softwares de imagem, ou pode se utilizar de um software como Crocotile ou Sprytile, que agilizam a aplicação de tilesets em ambientes 3D. Essa técnica é interessante se você quiser fazer um protótipo rápido em 3D,  ou se quiser dar ao seu projeto uma estética "32 Bits", como aqueles jogos do começo da era Playstation 1", diz Ariel.

Projeto em 3D criado com tileset e tilemap
Projeto em 3D criado com tileset e tilemap
Animação de jogo em 3D criado com base em tilesets e pixel art
Outro exemplo das possibilidades de criação de cenários em 3D
De cenários mais simples a mais complexos, as possibilidades são infinitas com a técnica do tileset

Chu Yamasaki, game artist, também destaca um outro exemplo:

Nesse tileset do Bedtime Fright, todos os objetos de cenário da primeira versão do jogo couberam nesse arquivo de 128x128 pixels.

Tileset do jogo 'Bedtime Fright'
Tileset do jogo 'Bedtime Fright'

Exemplo do tileset aplicado:

Print do jogo Bedtime Fright com tileset aplicado
Print do jogo Bedtime Fright com tileset aplicado

Softwares úteis

Criação de tilesets

Pyxel Edit

Este software se destaca pela simplicidade e facilidade de uso, além das ferramentas para criar e animar tilesets. Além disso, o preço é acessível.

Aseprite

Um dos melhores programas do mercado, utilizado por diversos profissionais, seu design é excelente e está sempre recebendo atualizações. Embora seja mais caro do que o Pyxel Edit, vale o investimento, pois oferece mais recursos com mais simplicidade.

Photoshop

Se você já possui uma licença do Photoshop, pode criar os seus tilesets por ele, pois oferece diversas opções avançadas para a criação de diversos elementos de pixel art.

Criação de tilemaps

Tiled

Este programa é focado na criação de tilemaps para videogames, por isso oferece uma quantidade imensa de opções de criação de mapas, dos mais simples aos mais complexos. Além de tudo, é grátis.

Pyxel Edit

Além da criação de tilesets, o Pyxel serve também para criar tilemaps e é uma das melhores escolhas de software disponíveis. Sua versatilidade compensa o preço.

Recursos extras

Se você quer criar um tileset, mas não sabe por onde começar, Ariel recomenda o site Itch.io. Nele você encontrará tilesets já prontos e com preços baixos. Além disso, é possível encontrar arquivos gratuitos.

Ariel deixa também a dica de dois tilesets gratuitos e de boa qualidade que você pode baixar, pagando a quantia que quiser para contribuir com o trabalho dos desenvolvedores. Clique aqui e aqui.

Exemplo de tileset e tilemap do jogo 'Super Mario Bros. 3'
Exemplo de tileset e tilemap do jogo 'Super Mario Bros. 3'

Saiba que você pode aprender com Daniel Benítez a construir tilesets em Pyxel Edit e criar cenários para um jogo 2D no curso online Criação de cenários pixel art para videogames.

Ver cursos recomendados

Introdução ao After Effects. Curso de 3D, e Animação por Carlos "Zenzuke" Albarrán
Domestika Basics · 5 cursos

Introdução ao After Effects

Um curso de Carlos "Zenzuke" Albarrán

Aprenda o After Effects sem ter conhecimentos prévios e domine o melhor software de motion graphics e pós-produção do mercado

  • 279414
  • 97% (4.8K)
84% Desc.
Preço original R$199
Blender para iniciantes. Curso de 3D, e Animação por Carlos Sifuentes Haro
Domestika Basics · 7 cursos

Blender para iniciantes

Um curso de Carlos Sifuentes Haro

Aprenda a dominar as ferramentas básicas do software para criar conteúdos audiovisuais 2D e 3D como um profissional

  • 61490
  • 94% (1.1K)
84% Desc.
Preço original R$199
Introdução ao SketchUp. Curso de Arquitetura, Espaços, 3D, e Animação por Alejandro Soriano
Domestika Basics · 5 cursos

Introdução ao SketchUp

Um curso de Alejandro Soriano

Aprenda do zero a criar e modelar em 3D de maneira rápida, eficiente e profissional

  • 94172
  • 100% (2.7K)
84% Desc.
Preço original R$199
0 comentários