Pular para o conteúdo

Empacotador de atlas de sprites

Solte uma pasta de sprites e receba uma textura bem empacotada, com um arquivo de dados que diz ao seu motor onde está cada sprite. Nada sai do seu dispositivo.

Criado no seu dispositivo. Suas imagens nunca são enviadas.

  • Nunca são enviados
  • PNG e arquivo de dados
  • Uma pasta inteira de uma vez

Como funciona

Como empacotar sprites em um atlas

  1. Passo 1: Adicione seus sprites

    Escolha, solte ou cole as imagens, ou solte a pasta em que elas estão. Todas podem ter tamanhos diferentes.

  2. Passo 2: Escolha o empacotamento

    Defina o espaçamento, apare as bordas vazias e escolha o arquivo de dados que o seu motor lê. A folha se atualiza enquanto você ajusta.

  3. Passo 3: Baixe o ZIP

    Ele traz o PNG do atlas e o arquivo que diz onde está cada sprite.

Empacotador de atlas de sprites

Uma textura em vez de cem arquivos

  • Empacotamento justo

    Sprites de qualquer tamanho são encaixados com pouco espaço desperdiçado, nunca girados, nunca redimensionados.

  • Apara as bordas vazias

    O espaço vazio em volta de cada sprite é deixado de fora e registrado, então o atlas fica menor e nada sai do lugar.

  • Dados que o seu motor lê

    JSON para Phaser, PixiJS e importadores de motores, ou um .meta do Unity que fatia a textura para você.

  • Nunca são enviados

    Tudo acontece no seu navegador, então suas imagens ficam no seu dispositivo.

Em detalhes

Atlas de sprites na prática

Para que serve um atlas

Cada imagem separada que um jogo desenha custa à placa de vídeo uma troca de textura. Juntar muitos sprites em uma só imagem, o atlas, permite ao motor desenhá-los juntos, o que roda mais rápido e carrega antes do que cem arquivos pequenos.

O empacotador encaixa sprites de tamanhos diferentes como um quebra-cabeça, começando pelos maiores, e anota onde cada um ficou. Os sprites nunca são girados nem redimensionados, então ficam exatamente como você os desenhou.

Ajustes que importam

  • Espaçamento: 1 ou 2 pixels vazios entre os sprites impedem que a borda de um apareça no vizinho quando a textura é ampliada ou filtrada.
  • Aparar bordas vazias: deixa de fora a borda vazia em volta de cada sprite. O arquivo de dados registra quanto foi removido, então o sprite continua no mesmo lugar.
  • Tamanho em potência de dois: arredonda a folha para 256, 512, 1024 e assim por diante. Motores modernos raramente precisam disso; alguns destinos mobile e web ainda preferem.
  • Nomes: cada sprite recebe o nome do arquivo, sem a extensão; então nomeie os arquivos do jeito que você quer se referir a eles no código.

Arquivos de dados

JSON, quadros por nome é o formato que o TexturePacker tornou comum. Phaser e PixiJS o carregam direto, e há importadores para Godot, GameMaker e a maioria dos outros motores. JSON, lista de quadros guarda os mesmos dados como uma lista ordenada.

Godot (.tres) grava um arquivo AtlasTexture por sprite, com o mesmo nome dele. Copie-os para o projeto na mesma pasta do PNG e use qualquer um como textura, em um Sprite2D por exemplo. Não é preciso nenhum plugin importador, e os sprites cortados mantêm o tamanho original.

Unity (.png.meta) é o arquivo de importação do próprio Unity. Copie-o para o projeto ao lado do PNG e a textura chega fatiada em sprites com nome, com filtro de ponto e sem compressão, como a pixel art precisa.

Empacotador de atlas de sprites

Perguntas frequentes

Minhas imagens são enviadas para algum lugar?

Não. Tudo roda no seu navegador, no seu próprio dispositivo. Suas imagens nunca são enviadas ao Moriqa nem a ninguém, e nada é mantido depois que você fecha a página.

Como faço um atlas de sprites?

Adicione seus sprites, escolha um espaçamento e um arquivo de dados, e baixe o ZIP. Ele contém a imagem do atlas e os dados dela.

Até que tamanho o atlas pode ir?

Até 4096 × 4096 pixels, um tamanho que todo dispositivo atual carrega, e até 1000 sprites. Se os sprites não couberem, a ferramenta avisa.

Isso é diferente de uma sprite sheet?

Uma sprite sheet costuma ser uma grade de quadros iguais de uma animação. Um atlas empacota imagens de qualquer tamanho onde elas couberem, e precisa do arquivo de dados para ser lido.

Por que meus sprites não são girados para economizar espaço?

Sprites girados encaixam um pouco melhor, mas muitos importadores não os aceitam. Deixar todo sprite em pé mantém o atlas legível em qualquer lugar.

Posso empacotar os quadros de uma animação?

Sim. Nomeie os arquivos em ordem, como walk_01 e walk_02, e eles mantêm esses nomes no arquivo de dados. Para uma grade simples de quadros iguais, use Sprite sheet para GIF e salve como sprite sheet.

Ainda desenhando os sprites?

Abra o editor de pixel art do Moriqa para desenhar e animar os sprites e depois exporte sprite sheets para Godot, Unity e GameMaker. Grátis no seu navegador.