Générateur de Sprite Sheet
Combinez des images en sprite sheet avec glisser-déposer pour réorganiser, mise en page en grille, remplissage, modes d'échelle. Exportez en PNG/WebP/JPG avec données JSON atlas pour moteurs de jeux et CSS.
Qu'est-ce qu'un sprite sheet et pourquoi en utiliser un?
Un sprite sheet est une image unique contenant plusieurs petites images (sprites) organisées en grille. Utiliser des sprite sheets réduit les requêtes HTTP, améliore les performances de chargement et rend le rendu de jeu plus efficace.
Quels formats d'image sont supportés?
Vous pouvez télécharger des images PNG, JPG, GIF, SVG et WebP. L'outil prend en charge le téléchargement par lot et le collage depuis le presse-papiers (Ctrl+V) pour un flux de travail rapide.
Quels formats d'exportation sont disponibles?
Exportez des sprite sheets en PNG (avec transparence), WebP (format moderne avec fichiers plus petits) ou JPG (meilleur pour les photos sans transparence). Choisissez selon les exigences de votre plateforme.
Comment réorganiser les images dans le sprite sheet?
Glissez-déposez les miniatures des images pour réorganiser leur position dans le sprite sheet. Vous pouvez également coller des images directement depuis le presse-papiers avec Ctrl+V.
Que sont les données JSON atlas et quels moteurs les prennent en charge?
Les données JSON atlas contiennent la position, la taille et les informations de chaque sprite. Elles sont compatibles avec des moteurs de jeu populaires comme Phaser, PixiJS, Unity, Cocos2d et bien d'autres pour l'extraction automatique de sprites.
Quels sont les différents modes d'échelle?
Le mode Ajuster met les images à l'échelle en maintenant le rapport. Remplir met à l'échelle pour couvrir toute la cellule et recoupe l'excès. Étirer déforme les images pour remplir la cellule sans maintenir le rapport.
L'outil prend-il en charge la transparence?
Oui, les exportations PNG et WebP préservent la transparence des images originales. Vous pouvez également définir une couleur de fond personnalisée pour le sprite sheet, utile pour les exportations JPG qui ne prennent pas en charge la transparence.
Comment le remplissage affecte-t-il le sprite sheet?
Le remplissage ajoute de l'espace entre les sprites individuels dans la feuille, empêchant les saignements visuels lors de l'échantillonnage des textures. C'est particulièrement important pour les moteurs de jeu utilisant le filtrage linéaire.
Puis-je utiliser des sprite sheets pour CSS?
Oui, les sprite sheets fonctionnent très bien pour les sprites CSS. Les données JSON atlas peuvent être utilisées pour générer des règles CSS background-position, réduisant les requêtes HTTP et améliorant les performances de chargement.
Quelles sont les meilleures pratiques pour les dimensions des sprite sheets?
Gardez les dimensions comme puissances de 2 (256x256, 512x512, 1024x1024) pour une manipulation optimale des textures GPU. La plupart des moteurs de jeu préfèrent ces dimensions pour de meilleures performances.
Comment les sprite sheets améliorent-ils les performances du jeu?
Les sprite sheets réduisent les appels de dessin en regroupant plusieurs sprites dans une seule texture. Cela minimise les changements d'état GPU, réduit la surcharge mémoire et permet un rendu plus efficace.
Quelle est la différence entre sprite sheets et atlas de textures?
Les sprite sheets organisent typiquement les frames dans une grille uniforme, tandis que les atlas de textures peuvent empacter des sprites de formes irrégulières plus efficacement en utilisant des algorithmes comme le bin packing.