Micro Application

Si vous vous êtes toujours demandé comment ces fabuleuses bannières de publicité qui parsèment le web étaient animées, cette astuce est faite pour vous.
Vous devez disposer de Photoshop et de son logiciel annexe, Image Ready.

1. Préparation des calques

Réfléchissez au mouvement que vous souhaitez créer. Décomposez ce mouvement en plusieurs étapes.
Au besoin, faites sur papier un croquis de chacune des étapes.

	Créez un document .psd, aux dimensions de votre gif animé, en mode couleurs RVB.
	Créez un calque pour chaque étape du mouvement.
	Classez les calques par ordre chronologique, et nommez-les bien. Ici, on souhaite créer un mouvement de rotation dans le sens des aiguilles d'une montre, pour un rectangle blanc. On a nommé les claque "1", "2", "3"... et "fond".

2. Lancement d'Image Ready

Si, à l'installation de Photoshop, vous avez demandé une installation complète, alors, vous devez disposer d'un logiciel annexe, Image Ready, qui vous permettra de créer des gif animés.
Si ce n'est pas le cas, reprenez votre CD d'installation et suivez les étapes proposées.

Lancez le logiciel, via Photoshop, en cliquant sur le bouton le plus en bas de la barre d'outils ou avec le raccourci "ctrl + shift + M".

3. Animation

Ouvrez la palette flottante "Animation", si elle n'est pas déjà ouverte, par le menu Fenêtre > Animation.

	Créez autant de vignettes que vous avez prévu d'étapes (ici, on en a 8), en cliquant sur le bouton "Reproduit l'image sélectionnée" autant de fois que nécessaire.
	Dans l'image 1, faites apparaitre seulement le calque "1" et le fond. Dans l'image 2, remplacez-les par le calque "2" et le fond, et ainsi de suite pour les autres images...
	Modifiez la durée de lecture des images, en maintenant le clic sur la durée qui est inscrite au-dessous, et glissez jusqu'à la durée désirée. Pour une animation de type dessin animé et un mouvement fluide, on choisira 0.1 secondes. Faites-le pour chaque image.
	Cliquez sur le bouton de lecture pour vérifier que l'animation se déroule bien comme vous l'aviez prévu.

4. Optimisez et exportez

	Ouvrez l'onglet "2 vignettes". Vous avez l'original à gauche, et la version optimisée à droite.
	Choisissez les paramètres de compression du gif dans la palette "optimiser". Moins votre gif comporte de couleurs, plus léger il sera. Ici, on choisit 4 couleurs, en palette Sélective.
	Utilisez le raccourci clavier "ctrl + shift + alt + S" pour enregistrer une copie optimisée de votre gif. Nommez-le, et il est prêt à être intégré dans votre page HTML.

Vous pouvez ainsi créer des smileys animés personalisés, des bannières animées à échanger, etc...