CONSTRUCTION D'UN .GIF ANIME
AVANT PROPOS:
Ce tuto explique comment créer une image .GIF animé avec le logiciel Adobe Image Ready. Ce n'est pas la seule méthode et de nombreux logiciels permettent de créer des images GIF depuis différentes images ou bien d'après vidéos. Je considère que vous savez utiliser votre logiciel d'image et sa fonction calque.
Indispensable pour ce tutoriel :
- Un éditeur d'images avec calques et enregistrant au format PSD
- Adobe Image Ready
PRESENTATION:
Ce format d'enregistrement autorise l'animation des images. Le codage ne calcule que les parties ayant changées, l'espace mémoire utilisé reste modéré. Si le format GIF est pris en charge par de nombreux logiciels, l'animation n'est pas toujours visible.
L'animation n'est qu'une succession d'images. Nous allons voir comment préparer les images avec Photoshop (des calques) et créer l'animation avec ImageReady.
CHAPITRES:
- Préparation
- Réalisation
- Enregistrement
- Complément
- Conclusion
|
|
PREPARATION:
Je ne reviens pas sur la confection des calques avec Photoshop. J'ai imaginé une image avec 1 fond et 3 calques comme ci-dessous
Les différents objets à animés sont placé sur les calques. L'image est maintenant terminée. Je vais utiliser Image Ready pour créer l'animation. Photoshop permet un échange rapide entre Photoshop et Image Ready par le menu ad hoc. Avant la version CS l'échange se faisait par le menu "Fichier/Passer à ..."
|
|
REALISATION:
L'image qui était dans Photoshop se retrouve dans Image Ready avec ses calques:
|
|
Je vérifie que les palettes calques et animations sont visibles, sinon je coche le menu correspondant
:
|
|
J'ai donc bien mes 3 fenêtres visibles à l'écran
A - Ma fenêtre d'animation
B - Mon image finalisée
C - Les calques
|
|
Dans la fenêtre animation je crée une nouvelle "image-animation":
|
|
Je constate qu'après cette action, les icones "magnetoscope" de la fênetre animation qui étaient jusque là inactive deviennent opérationnelles:
|
|
L'image-animation-2 est sélectionnée. Je clique sur le calque supérieur pour le rendre invisible uniquement sur cette étape de l'animation:
|
|
Atteind de cliquiste, je refais la même chose pour créer une troisième image-animation:
1 - Création d'une nouvelle image-animation
2- Je rends invisible le calque bleu
3 - Une particularité d' IR, le calque sélectionné reste cerné de bleu
|
|
Pris d'une frénésie cliquekesque, je continu de cliquer pour faire une 4ème image avec tous les calques invisibles, il ne reste que le fond sur mon image et déjà je devine l'animation en visualisant mes 4 images:
|
|
Je teste en cliquant sur le bouton "Lecture"...
|
|
.. et je vois que ça fonctionne:
|
|
ENREGISTREMENT:
Avant de sauvegarder l'image je vérifie que ma fenetre "optimisation" est bien visible, sinon je la coche:
|
|
Dans le menu déroulant "Paramètres prèdéfinis" de la fenêtre optimisation je choisi mon format d'enregistrement:
GIF: Parce que je veux conserver l'animation
32 - 64 - 128: Selon le nombre de couleurs sur l'image (et l'espace mémoire dispo)
Tramé - Non tramé: Les gris seront tramés (principe d'imprimerie) pour optimiser la compression
|
|
Je peux maintenant "enregistrer une copie optimisées sous..".:
|
|
COMPLEMENT:
Je vous laisse découvrir les possibilités qu'il y a en paramétrant la durée de chaque image:
|
|
L'interpolation entre deux images:
|
|
CONCLUSION:
Avec Photoshop et Image Ready rien de plus facile que d'obtenir un GIF simple ou évolué. La principale limitation reste la taille mémoire. Pour la photographie, il vaut mieux limité la taille que le nombres de couleurs ou d'utilisé le tramage. Le contraire pour les graphiques comportant des aplats de couleurs. Vous avez tous les éléments pour faire un site psychédélique...
 

|