Comment créer un gif animé avec photoshop

Les GIF animés sont peut-être parmi les fichiers les plus amusants et les plus utilisés du Web. Ils peuvent être utilisés indifféremment pour s'amuser ou pour ramener un point à la maison de manière rapide et didactique sans prendre beaucoup de place sur un site Web.

Cependant, bien qu’apparemment complexes, les GIF ne sont en réalité pas si difficiles à créer. En fait, si vous avez Photoshop, vous avez déjà tout ce dont vous avez besoin pour en créer un, et c'est exactement ce que nous allons vous montrer dans ce tutoriel.

Prêt? Commençons.

Étape 1: Commencez par préparer les fichiers image qui constitueront votre fichier GIF, car chaque fichier GIF est composé de différents cadres. Cela signifie que vous devriez déjà avoir les différents "cadres" qui composeront votre GIF. Pour cet exemple, je vais créer un fichier GIF composé de trois fichiers image simples (illustrés ci-dessous).

Étape 2: Ouvrez les fichiers dans Photoshop (sauf si vous les avez d'abord créés dans Photoshop) et assurez-vous que chacun d'entre eux appartient à un calque séparé. Pour vous en assurer, une fois le premier fichier ouvert, cliquez sur le bouton Créer un nouveau calque.. en bas à droite du panneau Calques (illustré ci-dessous) et collez le fichier image suivant sur le nouveau calque.

Une fois que toutes vos images ont été ajoutées à leurs propres calques, elles doivent ressembler à ceci dans le panneau Calques de Photoshop:

Étape 3: Maintenant, sur Photoshop, allez dans le menu Fenêtre et cliquez sur l'option Animation. Cela fera apparaître la palette Animation de Photoshop. Une fois que c'est fait, cliquez sur le bouton en bas à droite (illustré ci-dessous) pour passer de la vue Chronologie à la vue Cadres, ce qui facilitera un peu notre travail.

Étape 4: Par défaut, la palette Animation ne montrera qu’une de vos images (ou «images»). Il indique également au bas de chaque cadre le temps qu’il sera affiché dans le fichier GIF final. Si vous voulez changer cela, cliquez dessus et sélectionnez l’heure de votre choix. Le temps que vous avez choisi s'appliquera également au reste des images.

Étape 5: Maintenant, ajoutez quelques cadres où iront vos autres images. Pour ce faire, dans la palette Animation, cliquez sur le bouton Dupliquer une image.

Cela ajoutera la deuxième image qui constituera votre GIF. Maintenant, voici l'astuce: pour chaque image ajoutée, assurez-vous que seul le calque contenant l'image désirée pour cette image est sélectionné dans la palette Calques. Vérifiez les images ci-dessous par exemple:

Etant donné que je souhaite que les couches 1 et 2 soient respectivement les deuxième et troisième composants de mon fichier GIF, je ne sélectionne que l'un ou l'autre pour les deuxième et troisième images. En fin de compte, la palette Animation doit afficher toutes les images de votre fichier GIF dans l'ordre dans lequel elles seront affichées et avec la durée d'affichage de chacune d'elles également définies.

Étape 6: Une fois que les images de votre prochain GIF seront prêtes, il sera temps de les sauvegarder. Pour ce faire, dans le menu Fichier, cliquez sur Enregistrer pour le Web et les périphériques… Dans la fenêtre qui s’ouvre, assurez-vous de sélectionner le format GIF sous Prédéfini.

De plus, en cliquant sur les onglets au-dessus de votre image dans cette fenêtre, vous serez en mesure de sélectionner les différentes qualités de sortie (avec différentes tailles) pour votre fichier GIF.

Une fois que vous avez choisi la taille et la qualité de votre GIF, cliquez sur Enregistrer et vous avez terminé.

Profitez de votre fichier GIF!