Comment animer votre propre GIF personnalisé avec Photoshop

Créer des animations à partir de zéro dans Photoshop peut sembler décourageant, mais en réalité, elles sont très simples. Lancez Photoshop et récupérez certains de vos fichiers. Il est temps d'ennuyer le pantalon de vos amis avec plein de GIF animés!

Nous avons parlé de moyens simples de transformer des déchirures vidéo et Youtube en fichiers GIF animés, mais nous allons maintenant vous montrer comment créer une animation simple sans utiliser de fichier vidéo. Continuez à lire, celui-ci est très amusant.

Création d'animations avec les outils d'animation de Photoshop

Pour une animation simple, nous allons créer une partie de l'image sur un calque séparé que nous pouvons déplacer. Nous n'animerons que le mouvement des yeux, mais vous pouvez créer tout type d'animation de cette manière, y compris des cellules d'animation dessinées à la main ou des photographies en mouvement..

Indépendamment de ce que vous souhaitez animer, commencez par au moins deux calques. Dans notre exemple, nous utilisons le logo HTG et nous déplaçons ses yeux sur un deuxième calque que nous pouvons utiliser pour animer le mouvement..

Pour commencer, ouvrez le panneau Animation. Trouvez-le en allant dans Fenêtre> Animation.

Le panneau apparaît en bas de la fenêtre et est assez simple à utiliser. Chaque nouvelle "image" de l'animation est un peu comme un instantané du fichier. Clique le dans le panneau d'animation chaque fois que vous souhaitez créer un nouvel instantané en dehors de l'état actuel du fichier. Mais pas encore!

Ce panneau vous permet également de définir un «délai» pour chaque image, c'est-à-dire sa durée d'affichage (à l'écran, en fractions de seconde ou en fraction de seconde) avant de passer à l'image suivante. 25 images par seconde (0,04) est un taux standard pour l'animation, mais peut-être un peu rapide pour les GIF animés. Pour notre exemple, nous avons opté pour un délai de 0,05, que vous pouvez également utiliser. Si vous souhaitez utiliser un nombre différent d'images par seconde, divisez simplement 1 par le nombre d'images pour obtenir le délai approprié. (Par exemple, 1 seconde divisée par 25 images équivaut à 0,04 temps de retard.)

L'idée est de déplacer la couche des yeux dans petits incréments et prendre des instantanés en cours de route. Nous allons utiliser le outil de déplacement (touche de raccourci «V») et poussant notre couche en utilisant le Touches directionnelles. Dans notre exemple, nous avons pris un instantané après avoir décalé tous les deux pixels environ.

En cliquant sur le dans le panneau, vous pouvez voir les nouvelles images créées dans l'animation. Ils prennent le délai de l'image devant eux, vous pouvez donc choisir le bon délai en premier lieu, de sorte que vous n'ayez pas à changer de charge de cadres une fois que vous avez terminé la capture des images..

(Note de l'auteur: Si vous ressemblez à moi, vous modifierez le délai une centaine de fois, de toute façon. Les choses ne fonctionnent pas toujours exactement comme vous le souhaitez!)

Disposez vos cadres au fur et à mesure, en utilisant votre panneau de calques pour déplacer votre objet (dans notre exemple, les yeux) comme vous le souhaitez, et prenez beaucoup, d'instantanés. Souvenez-vous, environ 25 secondes équivaudront à une seconde, alors prenez vos clichés en conséquence.

Vous pouvez également modifier le retard de plusieurs images à la fois en utilisant la touche Maj, en sélectionnant plusieurs ou toutes vos images et en modifiant le retard. Notez que vous pouvez régler votre délai sur «Autre…» près du bas pour utiliser notre délai personnalisé de 0,05..

Naviguez jusqu'à Fichier> Enregistrer pour le Web et les périphériques pour ouvrir l'outil du même nom..

Cet outil vous permettra de créer un fichier GIF animé, convivial pour le navigateur, et de le tester à l'intérieur de l'outil (comme indiqué ci-dessus, à l'emplacement du curseur en forme de flèche). Assurez-vous de définir votre type de fichier sur GIF et d’utiliser l’un des paramètres Perceptuel, Sélectif ou Adaptatif. Ceux-ci peuvent changer votre image de différentes manières, mais pour beaucoup d'entre vous, vous obtiendrez des résultats presque identiques. Pour réduire la taille du fichier, vous pouvez modifier votre Taille de l'image (vers le bas) et votre nombre de Couleurs (en haut à droite). Vous pouvez également réduire la taille de votre fichier en n'incluant pas de transparence, bien que nous ne l'ayons pas dans notre exemple (oups!).

Et notre GIF animé est prêt à être mis en ligne pour ravir, choquer et susciter l’impression..

Et c'est à peu près tout pour l'animation. Pensées ou questions sur notre méthode? Vous avez une meilleure méthode ou des techniques plus simples? Vous voulez voir quelque chose de plus avancé? Parlez-nous d'eux dans les commentaires, ou envoyez-nous vos pensées à [email protected], et nous pourrons les inclure dans un prochain article sur les graphiques..