Croquis animation Inkscape + The Gimp

There is an english translation of this tutorial.
Les croquis de l’animation sont réalisés avec Inkscape, puis assemblé avec le greffon d’animation GAP pour The Gimp.
Sous Inkscape :
![]()
* On va utiliser le gestionnaire de calque (menu Calque=>Calques… (CTRL+MAJ+L)) pour travailler 1.
* Le premier calque d’Inkscape est utilisé pour le « décor ». 2
* Ensuite un calque est ajouté pour chaque étape croquée3.
* Les calques sont utilisés comme des pelures d’oignon (l’opacité du calque peut être réglé en bas à gauche de la fenêtre de travail, entre la couleur active et le nom du calque (o : 1,00 par défaut)).4
* Lorsque l’animation est prête, un rectangle vide avec bordure est ajouté pour préciser le champ de vue, il restera sélectionné pour faciliter le travail.5
* A chaque étape, le rectangle est déplacé avec l’outil transformation (menu Objet=>Transformer), ici verticalement.6
* Puis le calque à utiliser est affiché en ouvrant l’œil dans la fenêtre des calques, (les autres étant rendus invisibles en y fermant l’œil).9
* L’image est sauvegardée avec le menu Fichier=>Exporter en Bitmap, en choisissant l’option sélection dans la boite de dialogue ouverte.10
* On donne un nom contenant plusieurs chiffres representant les étapes (j’ai par exemple utilisé marche1.xx.png où xx va de 01 à 18).11
On passe alors sous The Gimp :
* On ouvre le fichier marche.01.png (dans mon cas).
* Puis on va dans le menu Video=>Frames flatten… (je ne sais pas pourquoi ca n’est pas traduit dans ma version, j’avais pourtant participé à la traduction de GAP en français ??? La traduction doit être quelque chose du genre aplatir les images ?) Toutes les frames contenant des numéros placés de la même façon que la première image seront automatiquement aplaties.
Et voila on à de quoi sortir une animation.
Pour sortir un gif animé comme je l’ai fait :
* On fait alors dans le menu VIdeo=>Frames to Image….
* On peut éventuellement réduire le nombre de couleur afin d’alleger le gif (j’ai fait du n&b 4 couleurs indéxées ici).
* De l’image « aplatie » multicalque crée, il suffit de faire Fichier=Sauvegarder (comme gif), puis de choisir animation. J’ai mis 250 millisecondes de pause pour chaque image, afin d’avoir 4 image par seconde.
This entry was posted on Friday, September 22nd, 2006 at 0:08 and is filed under Animation, Didacticiel, Gimp, Inkscape, vectoriel. Find similar posts by selecting any of the following tags: . You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.



on 23 September 2006 at 20:49 Le Monolecte wrote:
Merci, super bon tuto.
Toujours rien que le SVG animé?
Parce que quand ça va marcher, on pourra enfin oublier Flash!
on 23 September 2006 at 21:53 Administrator wrote:
Bon, visiblement, le SVG animé est en cours d’implémentation sous firefox :
http://www.mozilla.org/projects/svg/status.html
Et plus précisément, le suivit de l’implementation de l’animation :
http://brian.sol1.net/svg/status.php
Par contre, Inkscape ne le gère pas du tout pour le moment, et ca n’est à priori prévu que dans quelques versions (si personne ne met la main dans le cambouis avant ;) ), la conceptualisation étant prévu pour inkscape 0.51 (au rythme actuel de 2 inkscape par an, dans 3 ans et demi donc ;) :
http://wiki.inkscape.org/wiki/index.php/Roadmap#Milestone_17_-_Animation_Conceptualization_-_Inkscape_0.51