Todos os tutoriais

Como criar um tileset de pixel art sem emendas com IA (terreno com autotile em minutos)

Publicado em 4 de outubro de 2026

Os tiles de chão são a arte mais repetitiva de um jogo 2D, e a mais fácil de errar. Um tile de grama é simples. A transição da grama para a areia, em todas as combinações de cantos e bordas, é onde tilesets desenhados à mão devoram fins de semana inteiros.

Este tutorial mostra como criar um tileset de pixel art sem emendas com IA na PixelVibing: um conjunto de terreno com dezesseis tiles entre dois chãos, que se encaixam em qualquer layout, para você pintar um mapa à vontade sem nunca ver uma emenda.

Um conjunto de terreno pintado em um mapa: cais de paralelepípedos em cima, água do porto embaixo, uma borda baixa de pedra entre os dois.

O que é um conjunto de terreno

Um conjunto de terreno descreve dois chãos e a borda entre eles:

A PixelVibing desenha os dezesseis tiles que cobrem todas as formas como esses dois chãos podem se encontrar nos cantos de um tile. É o layout clássico de "autotile", ou Wang tiles, então qualquer engine ou editor de mapas que pinte com tiles baseados em cantos consegue usá-lo.

Passo 1: Escolha os seus dois chãos

Abra a página Terrain no Editor. Pinte os dois chãos sobre uma imagem com um pincel superior e um inferior, ou passe-os direto do seu mapa. Bons pares têm um contraste claro:

• Grama e areia
• Água e pedra
• Neve e terra congelada
• Lava e basalto

Uma referência ajuda. Se você já tem um level design ou um print de que gosta, tire os chãos direto dele: na Biblioteca, um conjunto de terreno pode ser feito a partir dos chãos de uma referência.

Passo 2: Dê forma à borda

É isso que separa um bom tileset de um genérico. Antes de qualquer cobrança, você define e pré-visualiza a borda:

• Qual a altura do degrau entre os chãos: plano, um ressalto baixo ou um penhasco alto.
• Quanto o chão superior avança sobre o inferior.
• Quão irregular é a borda: um muro limpo ou uma margem orgânica e recortada.

Depois, escreva uma frase sobre ela, como "um muro baixo de pedra com musgo", e gere.

Passo 3: Pinte o seu mapa

O conjunto de terreno vai para a sua Biblioteca. No editor de mapas do Editor, pinte com ele em uma grade de verdade, nível por nível. Como as dezesseis combinações existem, cada pincelada escolhe o tile certo automaticamente, sem emendas e sem cantos faltando.

Coloque objetos por cima (veja Como criar assets de pixel art para jogos com IA) e depois faça um personagem andar sobre o mapa para conferir a escala.

Passo 4: Dê movimento (água, lava, grama)

Água que ondula e lava que borbulha deixam um mapa vivo. No painel de terreno do Editor para desktop, um conjunto de terreno que já está no mapa pode ser animado em loop: descreva o movimento em palavras, e o chão que não deve se mexer fica exatamente como estava.

Passo 5: Exporte

Exporte o seu mapa e os tiles dele para PixiJS, Phaser ou Godot:

pixel-vibing-cli export godot

Dicas de tileset

1. Um conjunto de terreno por par de chãos. Uma praia é areia e água; as dunas atrás dela são um segundo conjunto, areia e grama.
2. Mantenha a escala no guia de estilo. O tamanho do seu tile fica lá, então todo conjunto combina com todos os outros.
3. Contraste importa mais que detalhe. Dois chãos de cor parecida deixam a borda difícil de enxergar no jogo.
4. Comece por um level design. Gere uma cena inteira primeiro, depois tire dela o terreno e os objetos, e tudo já combina entre si.

Perguntas frequentes

Os tiles são mesmo sem emendas? Sim. Os dezesseis tiles são desenhados para se encaixar em qualquer layout, na grade de pixels de verdade.

Quais engines conseguem usar? É um conjunto baseado em cantos (Wang), e a exportação gera sheets para PixiJS, Phaser e Godot, ou um formato padrão simples que qualquer engine consegue ler.

Preciso desenhar alguma coisa? Não. Pintar os dois chãos é uma seleção grosseira, não um desenho.

Próximo: pare de posicionar tiles à mão. Leia Vibe coding de um jogo com o Claude Code, e deixe a IA fazer toda a pixel art.