Vidéo en sprite sheet

La plupart des convertisseurs vidéo vers planche de sprites capturent des frames à intervalle fixe et s'arrêtent là. Ça suffit pour un effet ponctuel. Pour un cycle de marche, vous obtenez une planche qui saccade à la jonction de la boucle, un halo vert sur chaque contour et un personnage qui tremble parce que chaque frame a été recadrée séparément. Cet outil règle ces trois problèmes : il trouve la période du mouvement, détoure le fond avec suppression du débordement de couleur sur les bords, et recadre toutes les frames avec un seul cadre commun.

Comment utiliser l'outil Vidéo en sprite sheet

1. Déposez un MP4, WebM ou MOV. Un personnage filmé ou rendu sur un fond uni vert, magenta, bleu ou blanc donne le résultat le plus propre. Un WebM avec canal alpha garde sa transparence dans Chrome et Edge.
2. Définissez le début et la fin du passage voulu (jusqu'à 30 secondes) et la taille de capture, puis appuyez sur Extraire les frames. Le clip est lu une fois pendant que chaque frame décodée est capturée.
3. Si le mouvement se répète, l'outil trouve un cycle complet et le sélectionne. Choisissez le nombre de frames de la planche : elles sont réparties uniformément sur le cycle, et la frame de fermeture est écartée pour que la boucle n'ait pas d'à-coup.
4. Vérifiez le détourage du fond. Le mode auto lit la couleur du fond sur le bord de la frame. S'il se trompe, cliquez sur le fond dans la frame source. Ajustez la tolérance, l'adoucissement des bords, la suppression du débordement et le rétrécissement de 1 px pendant que le résultat se met à jour en direct.
5. Réglez la taille max. de frame et activez Pixeliser si vous voulez des bords nets et une seule palette commune à toutes les frames.
6. Exportez la planche PNG avec des données Aseprite, Phaser/TexturePacker, Godot ou CSS, un GIF animé, ou un ZIP qui contient tout cela plus les frames séparées.

Ce que vous obtenez

• Sprite sheet PNG à fond transparent, disposée en grille (colonnes auto ou fixes, marge facultative).
• Données de frames au format JSON Aseprite, JSON Phaser/TexturePacker (hash ou array), SpriteFrames Godot 4 .tres, classes de sprites CSS avec une animation keyframe par étapes, ou réglages de découpe Unity.
• GIF animé à n'importe quelle échelle entière, transparent ou sur noir/blanc.
• ZIP avec la planche, le GIF, tous les formats de données et chaque frame dans son propre PNG.

Moteurs compatibles

• Godot 4 : placez le PNG et le .tres dans le même dossier, puis assignez les SpriteFrames à un AnimatedSprite2D. Si le PNG est ailleurs, modifiez le chemin res:// sur la première ligne.
• Unity : importez le PNG en Sprite (Multiple), réglez le Filter Mode sur Point, puis découpez avec Grid By Cell Size en reprenant les valeurs du fichier de réglages Unity.
• Phaser 3 et PixiJS : chargez le PNG avec le JSON TexturePacker (hash) comme atlas. Le JSON liste aussi les noms des frames de l'animation dans l'ordre.
• GameMaker, Defold, Construct, RPG Maker : importez le PNG en bande ou en grille avec la taille de frame indiquée sous les réglages d'export.

Conseils tirés de nos propres jeux

• Filmez ou faites le rendu sur une couleur absente du personnage. Le magenta est le plus sûr pour les héros en vert ; le vert pour tout ce qui est rouge ou rose.
• Laissez de la marge autour du personnage. Si un membre sort du cadre, le recadrage commun ne peut pas le récupérer.
• Pour les cycles de marche et de course, 8 frames à 10–12 fps rendent bien en 32–64 px. Les animations idle peuvent se contenter de 4 à 6 frames jouées en ping-pong ; vérifiez le timing dans Sprite sheet en GIF.
• Si les contours gardent une teinte après détourage, augmentez légèrement l'adoucissement des bords et laissez la suppression du débordement activée. N'activez le rétrécissement de 1 px que s'il reste un liseré coloré.
• Pixelisez à la taille finale en jeu. Réduire une frame de 512 px à 48 px avec une palette commune donne un bien meilleur résultat que redimensionner une planche déjà pixelisée.

Cas d'usage

• Transformer des images de référence rotoscopées en animation provisoire pour un prototype.
• Extraire un cycle en boucle d'un clip généré par IA de votre personnage sur fond vert.
• Convertir un rendu Blender ou Spine en sprite sheet sans mettre en place de pipeline de rendu.
• Intégrer dans un jeu, sous forme de sprite sheet, des effets (fumée, magie, eau) rendus en vidéo.

FAQ