Créer des sprites 2D avec l’IA (mais surtout avec méthode)

Dans un précédent article, nous nous interrogions déjà sur l’omniprésence de l’intelligence artificielle et comment elle a progressivement investi des domaines entiers : du software engineering au creative writing, en passant par le digital marketing, et bien sûr, le développement de jeux vidéo.

L’idée de générer des assets graphiques avec l’IA pour les intégrer dans des jeux n’est pas nouvelle. Dès lors qu’on est capable de produire des images ou même des vidéos à partir de simples prompts, la question arrive naturellement : pourquoi ne pas générer directement des séquences exploitables dans un jeu vidéo ?

Chez Coding Park, cette question ne s’est pas posée de manière théorique. Elle est apparue très concrètement, au contact des élèves et des ateliers. En travaillant sur des jeux, on se rend vite compte que le développement d’un jeu vidéo, même en 2D, mobilise normalement toute une chaîne de compétences : character design, animation 2D, intégration, développement… Un processus lourd, même pour des projets simples.

Forcément, l’IA apparaît alors comme un raccourci potentiel.

L’IA seule ne suffit pas.

C’est alors qu’on s’est lancé à expérimenter des outils basés sur des modèles de type LLM pour générer de courtes séquences vidéo.

L’idée c’est quoi ?

Il s’agit d’arriver avec une image d’un personnage et puis demander à l’IA de générer une animation de cinq secondes à partir de cette image. Et dans un deuxième temps, extraire depuis la vidéo générée les frames qui vont nous servir comme base pour la création des assets.

Dit comme ça, ça semble évident. En pratique, ça demande… une méthode.

Assez vite, on s’est rendu compte d’une chose : oui, l’IA peut générer des animations de grande qualité. Mais non, ça ne donne pas automatiquement quelque chose d’utilisable dans un jeu : caractère imprévisible d’un LLM, non respect des consignes, déformations non voulues, ce qui produit des sprites incohérents, des tailles variables, des animations qui ne bouclent pas, des arrière-plans compliqués à gérer…

On se heurte rapidement aux contraintes très concrètes du game dev.

La méthode avant l’outil

Très rapidement, on s’est rendu compte qu’il fallait respecter un certain nombre de contraintes dès le prompt, puis tout au long du pipeline, pour obtenir une animation réellement exploitable. Sans cadre clair, les résultats sont aléatoires et difficilement réutilisables.

C’est ce travail de synthèse, construit progressivement à force de tests et de pratique en atelier, que nous avons décidé de formaliser dans un repository GitHub public. On y documente une démarche complète pour faire un usage pertinent de l’IA dans la création d’assets 2D destinés à de vrais jeux, avec de vraies contraintes techniques.

Mettre la démarche noir sur blanc

Le repository ne se veut ni un outil magique, ni une solution industrialisée.

C’est une recette, au sens le plus simple du terme : une suite d’étapes que l’on suit lorsqu’on veut créer un sprite animé exploitable dans un jeu 2D.

Le repository est pensé comme un support de travail :

pour nos ateliers
pour des élèves autonomes
pour des enseignants ou formateurs
pour toute personne curieuse de comprendre comment on passe d’une idée à une spritesheet utilisable

Un exemple concret : Chipset

Plutôt que de rester abstraits, on va dérouler la méthode sur un exemple précis : l’animation du personnage de Chipset.

Chipset est un perroquet robot, personnage du jeu Golden Quest de Coding Park. C’est lui qui indique à Cody où se trouvent les trésors. Au plus profond de ses circuits endommagés, il détient d’ailleurs un savoir-faire ancestral : la capacité de coder… sans IA 😉

Le README déroule toute la démarche pas à pas, presque comme un tutoriel, en expliquant à chaque étape ce que l’on fait et pourquoi on le fait.

1. Prompt IA utilisé pour générer l’animation

Animate this parrot hovering in place in a cartoonish style. He floats gently as if flying in place moving his wings up and down, as if stabilizing himself in the air. Keep it fun, playful, and cartoon-style. Make the loop seamless for reuse as an idle flying animation.

2. Extraire les frames de la vidéo générée

ffmpeg -i examples/chipset/02_ai_videos/chipset_fly.mp4 -vf "fps=12" examples/chipset/03_frames_raw/frame_%04d.png

Astuce : 8–12 fps suffisent souvent pour une boucle.

3. Redimensionner les frames

mogrify -path examples/chipset/04_frames_resized -resize x240 examples/chipset/03_frames_raw/frame_*.png

4. Supprimer le background

mogrify -path examples/chipset/05_frames_clean -fuzz 10% -transparent white examples/chipset/04_frames_resized/frame_*.png

Si vous voyez un halo blanc, lissez les bords :

mogrify -path examples/chipset/05_frames_clean -fuzz 10% -transparent white -morphology Erode Disk:1 examples/chipset/04_frames_resized/frame_*.png

5. Sélectionner les meilleures frames

On peut utiliser un logiciel gratuit comme TexturePacker pour cette étape.

Étape manuelle :

Importer examples/chipset/05_frames_clean/*.png
Prévisualiser l’animation
Garder les 12 meilleures frames
Exporter les PNG individuels dans examples/chipset/06_frames_selected

6. Exporter un spritesheet

Enfin, on se propose d'exporter les 12 frames sélectionnées en une grille (un spritesheet) de 4 lignes et 3 colonnes.

magick montage examples/chipset/06_frames_selected/*.png \
  -background none -alpha set \
  -tile 3x4 -geometry +0+0 \
  examples/chipset/07_spritesheets/spritesheet_3x4.png

Et voilà, un dernier passage dans GIMP (ou tout autre éditeur) permet d’ajuster les détails avant intégration dans le code Python.

Un vrai support pédagogique

Ce qui nous intéresse le plus dans cette démarche, ce n’est pas le résultat final, mais le chemin parcouru.

Un élève qui suit cette recette comprend :

ce qu’est une frame
pourquoi une animation doit boucler
comment post-traiter des images
comment construire une spritesheet
comment l’intégrer dans un programme Python

Grâce à l’IA, l’étape de création graphique et d’animation est largement accélérée. Mais la compréhension, elle, reste centrale.

Ce n’est pas parfait, et ce n’est pas le but

Nous ne prétendons pas que cette démarche est universelle, ni industrialisée, ni sans effort. Elle demande un minimum de rigueur, quelques outils, et surtout l’envie de comprendre ce que l’on fait.

Mais en échange, elle permet de reprendre la main sur la création d’assets, en faisant un bon usage de l’IA et des outils de traitement d’image en Python.

En conclusion

Nous avons construit une démarche outillée et accessible, qui utilise l’intelligence artificielle comme un moyen efficace qui accélère le processus de création. Cette démarche, nous la transmettons dans nos ateliers, en montrant non seulement comment créer des assets 2D, mais aussi comment les intégrer proprement dans des jeux écrits en Python.

La suite, comme souvent, se passe dans la pratique.