Alternativa ao Tilesetter — Gerador de Tileset e Editor de Mapas Online e Gratuito

O Tilesetter monta um tileset a partir de uma única imagem base e exporta o nível que você monta para Unity, Godot e GameMaker Studio 2. Essa é a proposta, e é uma boa proposta. A entrega em desktop é a parte que trava as pessoas: um aplicativo que você instala, licencia por máquina e não consegue rodar em uma aba do navegador. Se você está procurando uma alternativa ao Tilesetter, as duas perguntas que importam são se a geração do tileset ainda funciona e se você consegue ver o resultado se mover sem abrir uma engine.

O Neta Studio é a alternativa baseada no navegador. O mesmo ponto de partida — uma imagem base vira um tileset alinhado à grade que você pinta na hora —, mas o nível roda como uma cena Three.js jogável quando você aperta play. Sem instalador, sem ida e volta de arquivo de projeto, sem esperar uma build da engine para descobrir se o pulo de um jogo de plataforma passa por um vão de três tiles.

O que o Tilesetter faz bem

A função central do Tilesetter é a geração de terreno a partir de uma pequena imagem base. Você desenha de três a cinco tiles representativos — normalmente um preenchimento central, uma borda reta e um canto externo — e o gerador deriva o resto do conjunto: cantos internos, variantes de borda e peças de preenchimento. Criar à mão um conjunto completo de terreno com 47 peças é tedioso e inconsistente; derivá-lo de uma imagem base mantém os cantos alinhados. Esse é o recurso pelo qual as pessoas realmente trocam de ferramenta, e ele funciona.

A segunda metade é a construção de níveis. O conjunto gerado alimenta um editor de grade com comportamento de autotile, então arrastar uma linha de terreno produz bordas conectadas em vez de uma fileira de quadrados idênticos. Isso é autotiling feito no nível da ferramenta, e não no código da engine.

A terceira parte é a exportação. O Tilesetter grava diretamente nos formatos de projeto de Unity, Godot e GameMaker Studio 2, então os dados do nível chegam como tilemaps nativos da engine em vez de um PNG que você precisa fatiar à mão. Em um fluxo de trabalho com Tilesetter, esse é genuinamente o caminho mais curto de uma imagem até uma cena de engine jogável.

Onde o Tilesetter fica devendo para a maioria das pessoas

É um aplicativo de desktop que você instala e paga. Seus termos de licença e preços são definidos pelo fornecedor e mudam com o tempo, então confira na fonte em vez de confiar em uma página de comparação. A restrição prática é mais estreita que o preço: se você trabalha em um Chromebook, em um notebook corporativo gerenciado ou em qualquer máquina onde não pode instalar software, você não consegue rodá-lo. Não há nenhuma versão de navegador descrita pelo fornecedor.

Não há saída jogável. O Tilesetter entrega um nível; não entrega um nível em execução. Para descobrir se seu arco de pulo passa por um vão, ou se uma borda de tile é legível na distância de câmera em que você pretende lançar, você exporta, abre a engine, conecta o tilemap a uma cena, aperta play e olha. Toda pergunta de design custa uma ida e volta.

A exportação também é o fim da linha. Mude o design de um tile e as dimensões da folha mudam junto; a engine reimporta, o atlas se religa e qualquer referência de tile baseada em deslocamento de pixels precisa ser verificada. O ciclo é: regerar, reexportar, reimportar, reverificar. É viável, mas o ciclo de feedback é medido em minutos, não em segundos.

Tilesetter vs Neta Studio — Tabela de comparação completa

Cada linha do Tilesetter abaixo é escrita a partir da descrição pública do próprio produto. Onde eu não sei um número — preço, requisitos de plataforma —, descrevo o mecanismo em vez de chutar.

Gere um Tileset completo a partir de uma só imagem base (demonstração ao vivo)

O gerador desta seção faz a única coisa pela qual o Tilesetter é mais conhecido: recebe uma imagem base e devolve um tileset alinhado à grade com o qual você pinta imediatamente. Solte um PNG, defina o tamanho da célula em 16, 32 ou 48 pixels, e a ferramenta o fatia em uma folha mais um índice de tiles. Sem instalação, sem licença, sem projeto de engine para criar primeiro.

A primeira coisa que quebra é um tamanho de célula que não divide a imagem. Uma folha de 1023 pixels de largura com células de 32 pixels dá 31 colunas completas e uma coluna de 31 pixels; essa última coluna é renderizada com uma emenda porque a GPU faz amostragem do tile vizinho. Confira se largura e altura se dividem exatamente antes de pintar qualquer coisa. A ferramenta informa o resto em vez de arredondar silenciosamente, o que é justamente o ponto.

A segunda falha é a filtragem. Faça amostragem da folha com filtragem linear e tiles adjacentes se misturam, deixando um halo de um pixel em cada borda. Duas correções: defina o filtro de textura como nearest na engine, ou extrude cada tile em 2 pixels na exportação para que os pixels de limite se repitam para fora. A extrusão é mais segura porque sobrevive a um projeto em que alguém esquece a configuração de filtro.

Assim que a grade está limpa, a pintura é imediata. Camadas, sinalizadores de colisão e posicionamento de objetos vivem todos na mesma grade, e o modo de jogo roda o resultado como uma cena Three.js. Os mundos de exemplo The Cyclops' Island e Mini World são construídos assim, se você quiser ver a escala de nível que a grade suporta.

• Fatiamento exato em gradeLargura e altura são divididas pelo tamanho da célula. Qualquer resto é informado em vez de ser absorvido por uma coluna final quebrada.
• Extrusão de bordasSangramento opcional de 2 pixels ao redor de cada tile para que a amostragem com filtro nearest nunca pegue os pixels de um tile vizinho.
• Manifesto de índice de tilesUm mapa JSON de coordenada de célula para ID numérico de tile, para que o código da engine enderece tiles por índice em vez de deslocamento de pixels.
• Geração de variantes de terrenoVariantes de borda, canto e preenchimento derivadas de um pequeno conjunto de tiles desenhados à mão, com os cantos externos mantidos consistentes.
• Origem de sprites na mesma gradeO Agent Sprite Forge emite sprites alinhados ao mesmo tamanho de célula, então a arte de personagens e objetos entra na grade sem reescalonamento.

Exportar para Unity, Godot e GameMaker — Lado a lado

A importação na engine é onde o trabalho de tileset normalmente se perde. A folha está boa; as configurações estão erradas. Cada engine quer um conjunto diferente de números, e as falhas aparecem de forma diferente em cada uma.

Unity

Defina Texture Type como Sprite (2D and UI), Sprite Mode como Multiple, Filter Mode como Point e desligue Generate Mip Maps. Para pixel art, Compression deve ser None. Depois abra o Sprite Editor e use Slice, Grid By Cell Size, com o tamanho da célula igual ao dos seus tiles — 16, 32 ou 48 pixels.

A falha clássica é Pixels Per Unit. Deixe no padrão 100 com tiles de 32 pixels e cada tile fica com 0,32 unidades de mundo de largura; se a grade do seu tilemap assume 1 unidade por célula, você tem um vão ou sobreposição visível em cada limite de linha. Defina Pixels Per Unit igual ao tamanho em pixels do tile, ou defina o tamanho da célula do tilemap como o recíproco. A outra configuração que as pessoas erram é o pivô: Center para mapas de cima para baixo, Bottom Left para side-scrollers em que os tiles se alinham à linha do chão.

Godot

Crie um recurso TileSet com Tile Size igual às suas células, adicione um TileSetAtlasSource apontando para a folha e defina Margin e Separation explicitamente se a folha tiver preenchimento, em vez de depender da detecção. No Godot 4, a opção de preencher tiles a partir da região não transparente da textura economiza uma passagem manual lenta. A pintura acontece em um nó TileMapLayer.

Uma nota de migração que pega as pessoas: o Godot 4 substituiu o sistema de bitmask de autotile do Godot 3 por conjuntos de terreno baseados em bits de vizinhança. Uma folha gerada para autotiles do Godot 3 é importada como tiles simples no Godot 4 — os pixels estão bons, a fiação de terreno não. Você reconstrói o conjunto de terreno, não reexporta a imagem. Verifique também Rendering > Textures > Canvas Textures > Default Texture Filter; se estiver Linear, seu pixel art tem halos independentemente do que a folha contenha.

GameMaker Studio 2

O GameMaker quer um sprite cujo tamanho de quadro seja igual ao tamanho do seu tile, depois um asset Tile Set criado a partir desse sprite. A restrição rígida é a divisibilidade: se o sprite tem 130 pixels de largura e o tamanho do tile é 32, o tile set é rejeitado. Corte ou extrude a folha até que as dimensões sejam múltiplos exatos. A origem é o canto superior esquerdo para tile sets, e a pintura acontece em uma camada de tile no editor de salas, então a ordem das camadas importa mais aqui do que nas outras duas engines.

Se sua folha tem preenchimento entre os tiles, o GameMaker não vai inferi-lo a partir do sprite. Ou exporte uma folha sem preenchimento para este destino, ou divida a folha com preenchimento em quadros individuais antes de criar o tile set.

Como migrar do Tilesetter em 5 minutos

Você não precisa redesenhar nada. Um tileset é um PNG e um nível é uma grade de índices nesse PNG. Ambos sobrevivem à mudança. A única coisa que não sobrevive é a exportação no formato de projeto, porque não há um formato de intercâmbio neutro no fluxo de trabalho — conte com repintar o nível, não convertê-lo.

Para uma sala de tela única, isso é alguns minutos arrastando. Para um mapa grande com várias camadas, é uma tarde, e ainda assim é menos tempo do que reconstruir uma folha do zero.

Entre no mundo ao qual ele pertence

Um sprite é um personagem sem lugar para ficar em pé. O último passo é o que ninguém mais oferece: pegue a folha que você acabou de montar e coloque-a em um mundo onde alguém pode andar — uma pequena ilha, um planeta, uma esquina de rua chuvosa. Cada mundo neste site foi feito a partir de uma descrição escrita e publicado como uma página que você joga.

FAQ