Ce tutoriel vous montre comment préparer une animation gif image par image montrant un personnage faisant des mimiques et bougeant ses mains. L'outil proposé pour réaliser les dessins est l'éditeur vecta.io, disponible gratuitement en ligne. Pour créer le gif animé, vous utiliserez l'outil en ligne gifmaker.me.
.
Pré-requis
Pour réaliser ce tutoriel, il faut avoir personnalisé un personnage avec vecta.io, comme cela est indiqué dans le tuto intitulé Utiliser vecta pour personnaliser un dessin (cours précédent).
Important
La réalisation d'un gif animé image par image nécessite de créer plusieurs images légèrement différentes. L'utilisation d'un éditeur vectoriel comme vecta.io permet de modifier pas à pas chaque image. Il s'agit ensuite d'enregistrer chaque image créée, de manière à pouvoir les utiliser pour engendrer une illusion de mouvement. Chaque image s'affiche l'une après l'autre, plus ou moins rapidement.
Le réglage du temps d'affichage des images se fait au moment de créer le gif animé. L'animation ci-dessus est composé de 11 images dont plusieurs d'entre elles ont été dupliquées pour générer une action inversée. Le temps d'affichage de chaque image est de 300 millisecondes
.
Préparez l'animation des éléments mobiles
Pour donner plus d'expression à notre personnage, je vous propose de lui créer des mains simplifiées que vous pourrez animer sans difficulté. Comme pour le style du personnage (visage et buste), le dessin de formes élémentaires permet de modifier facilement le positionnement des éléments à animer.
Les mains (doigts et paumes), ainsi que les manches du vêtement cachant les bras du personnage sont dessinés avec des ellipses de différentes tailles.
Pour vous aider à choisir les bonnes proportions, je vous montre sur l'image ci-dessous quelles proportions vous devez donner à l'avant bras et à la main de votre personnage.
Pensez à grouper les éléments qui ne bougeront pas les uns par rapport aux autres lors de l'animation.
Anticipez les situations auxquelles vous serez confrontés lors de l'animation de votre personnage.
La bouche et les mains changeront de forme pour renforcer les différentes expressions que vous allez donner à votre personnage. faites comme les professionnels de l'animation : préparez à l'avance les dessins dont vous allez avoir besoin.
Les mains peuvent être très expressives et elles vont beaucoup apporter à la qualité des mimiques de votre personnage. Observez de quelle manière elles ont été dessinées en utilisant simplement des ellipses. Il s'agit en fait de silhouettes de mains. Aucun détail ni contour ne doit être utilisé !
La bouche est aussi un élément important dans l'expression d'un personnage. N'en dessinez pas de trop compliquées. N'essayez pas de faire des bouches dans le style manga !
Si vous n'arrivez pas à dessiner des mains, vous pouvez utiliser des mains toutes prêtes proposées par vecta.io dans la planche nommée “Corps des gens - Mains”. Elles ne sont pas articulées mais vous en trouverez deux ou trois formes qui pourront être utilisées.
.
Animez votre personnage
Le moment est venu d'animer votre personnage image par image. Choisissez comme point de départ une attitude qui vous semble expressive et développez-la en faisant bouger légèrement les yeux, les sourcils, la bouche, les mains et les bras de votre personnage.
Important
Exportez chaque image au format jpg. Attention, vecta.io exporte en jpg en utilisant une extension à quatre lettre (.jpeg). Gifmaker.me ne reconnait pas cette extension. Vous devez donc changer l'extension .jpeg en .jpg. Vous pouvez le faire au moment de l'enregistrement du fichier ou plus tard, avant l'importation des images dans gifmaker.me !
.
Créez le gif
Après avoir modifié l'extension .jpeg de vos images, vous pouvez les importer (les “uploader”...) dans gifmaker.me pour créer votre animation.
Quand votre animation est au point, vous devez d'abord cliquer sur le bouton 1 puis télécharger votre animation en cliquant ensuite sur le bouton 2.
Important
Faites plusieurs essais en essayant d'améliorer les choses d'une fois sur l'autre. Pensez à donner des numéros de version à chacune de vos animations. Vous les nommerez de façon explicite en mentionnant votre prénom, avant de les placer dans le dossier “Commun” pour que je puisse les évaluer.
Combien y a t-il d'images par seconde sur cette animation ?
