Gerador de Sprite Sheet
Combine imagens em sprite sheet com arrastar para reordenar, layout em grade, preenchimento, modos de escala. Exporte PNG/WebP/JPG com dados JSON atlas para motores de jogos e CSS.
O que é um sprite sheet e por que usar um?
Um sprite sheet é uma imagem única contendo múltiplas imagens menores (sprites) organizadas em grade. Usar sprite sheets reduz requisições HTTP, melhora o desempenho de carregamento e torna a renderização de jogos mais eficiente.
Quais formatos de imagem são suportados?
Você pode carregar imagens PNG, JPG, GIF, SVG e WebP. A ferramenta suporta upload em lote e colar da área de transferência (Ctrl+V) para um fluxo de trabalho rápido.
Quais formatos de exportação estão disponíveis?
Exporte sprite sheets como PNG (com transparência), WebP (formato moderno com arquivos menores) ou JPG (melhor para fotos sem transparência). Escolha com base nos requisitos da sua plataforma.
Como reordenar imagens no sprite sheet?
Arraste e solte as miniaturas das imagens para reorganizar sua posição no sprite sheet. Você também pode colar imagens diretamente da área de transferência usando Ctrl+V.
O que são dados JSON atlas e quais engines os suportam?
Dados JSON atlas contêm posição, tamanho e informações de cada sprite. É compatível com engines de jogos populares como Phaser, PixiJS, Unity, Cocos2d e muitos outros para extração automática de sprites.
Quais são os diferentes modos de escala?
O modo Ajustar escala as imagens mantendo proporção. Preencher escala para cobrir toda a célula e corta excesso. Esticar deforma para preencher sem manter proporção.
A ferramenta suporta transparência?
Sim, as exportações PNG e WebP preservam transparência das imagens originais. Você também pode definir uma cor de fundo personalizada para o sprite sheet, útil para exportações JPG que não suportam transparência.
Como o preenchimento afeta o sprite sheet?
O preenchimento adiciona espaço entre sprites individuais na folha, prevenindo sangramentos visuais quando as texturas são amostradas. Isso é especialmente importante para engines de jogos que usam filtragem linear.
Posso usar sprite sheets para CSS?
Sim, sprite sheets funcionam muito bem para sprites CSS. Os dados JSON atlas podem ser usados para gerar regras CSS background-position, reduzindo requisições HTTP e melhorando o desempenho de carregamento.
Quais são as melhores práticas para dimensões de sprite sheets?
Mantenha as dimensões como potências de 2 (256x256, 512x512, 1024x1024) para manuseio ótimo de texturas GPU. A maioria dos engines de jogos preferem estas dimensões para melhor desempenho.
Como os sprite sheets melhoram o desempenho do jogo?
Sprite sheets reduzem chamadas de desenho ao agrupar múltiplos sprites em uma única textura. Isso minimiza mudanças de estado GPU, reduz sobrecarga de memória e permite renderização mais eficiente.
Qual é a diferença entre sprite sheets e atlas de texturas?
Sprite sheets tipicamente organizam frames em uma grade uniforme, enquanto atlas de texturas podem empacotar sprites de formas irregulares mais eficientemente usando algoritmos como bin packing.