Créez un dessin à la main. GIF dans Adobe Photoshop

1. Introduction: Vous voulez pimenter votre blog ou site web avec des GIF animés mignons ? Avez-vous déjà eu besoin du GIF de réaction parfait pour cet amour menial ? On y est tous allés. Prenez ce cours pour apprendre comment vous pouvez en faire un vous-même. Je vais vous emmener à travers tout le processus d' animation de personnages dessinés à la main et de lettrage dans Photoshop. De l'esquisse à l'exportation. C' est beaucoup plus facile que vous ne le pensez. Bientôt, vous afficherez vos GIF sur votre blog ou Instagram. Alors commençons et réalisons des GIF. 2. Préparer votre GIF lettré à la main: Le projet de cette classe est de créer un GIF dessiné à la main avec au moins un aspect animé. Il peut être aussi simple qu'un clin d'œil de personnage ou un lettrage à la main de style gribouillé. J' aime assez cet effet de texte rebondissant que j'ai utilisé dans ma vidéo d'introduction, et c'est vraiment facile à faire. Donc je vais aller de l'avant et le démontrer d'abord. abord, dessinez votre mot ou votre phrase, puis créez un nouveau calque et déposez l'opacité du premier calque afin qu'il soit plus facile à tracer. Ne vous inquiétez pas que la trace soit parfaite. Le point est que chaque traçage soit légèrement différent du dernier. Répétez cela deux ou trois fois de plus. Je pense que c'est une bonne idée de faire trois à cinq couches. Vous pouvez également effectuer cette étape traditionnellement avec un stylo et du papier calque, puis numériser si vous le souhaitez. Une fois que vous avez terminé avec vos cinq tracés, assurez-vous de repousser l'opacité de tous vos calques jusqu'à 100 %. La façon la plus simple de modifier la couleur de votre lettrage sur toutes les couches consiste à créer une carte dégradée. Accédez aux réglages, à la carte de dégradé et assurez-vous que la couche est en haut. Cliquez ensuite sur la barre de dégradé, et avec ces sélecteurs de couleur sur les côtés d'écriture et de gauche, vous pouvez double-cliquer dessus et choisir une couleur. Comme ce calque est en haut, il s'appliquera à tous les calques situés en dessous. Chaque calque représente une image de l'animation. Par souci d'organisation, assurez-vous de les garder numérotés dans l'ordre où vous voulez qu'ils jouent. Maintenant que j'ai fini mes calques, je suis prêt à animer. 3. Animer votre lettrage: Vous voudrez donc vous assurer que votre chronologie est visible. Accédez à Fenêtre > Montage. Dans certaines versions de Photoshop, il apparaît avec le menu déroulant ici au centre, qui a quelques options d'affichage de la chronologie différentes. Vous voudrez simplement vous assurer de choisir Créer une animation d'image. C' est là que vous allez organiser vos images clés et tester votre animation. La première image affiche tous les calques définis sur visible. Vous souhaitez désactiver la visibilité de toutes les couches que vous ne souhaitez pas afficher. Parce que nous voulons juste que le calque 1 apparaisse dans la première image, assurez-vous que les calques 2 à 5 sont invisibles. Avant de passer à la deuxième image, vous voudrez modifier la synchronisation en cliquant sur cette flèche déroulante. Vous pouvez toujours modifier la vitesse en changeant les temps de retard de vos images plus tard si vous le souhaitez, mais généralement je pense que 0,2 seconde par image fonctionne bien pour les GIF. Ainsi, lorsque vous créez une nouvelle image en cliquant sur ce symbole à droite entendre sur la timeline, cette nouvelle image répliquera les paramètres de la première image. C' est pourquoi je vous ai demandé de changer le temps de retard car alors il appliquera automatiquement ce temps de retard aux images suivantes que vous faites. De toute façon, vous devez juste vous assurer que le calque deux est le seul calque visible dans l'image deux et que le calque trois est le seul calque visible dans image trois et ainsi de suite et donc quatrième pour les deux autres images. Ici, il y a un menu déroulant qui a la possibilité de jouer Once, Three Times ou Forever, et vous aurez envie de choisir Forever car nous voulons qu'il bouclera. Poussez jouer et voilà. Je pense que ça a l'air bien. Plutôt content de ça. Je vous montrerai comment l'exporter plus tard. 4. Animer un personnage: C' est là qu'il devient un peu plus délicat en fonction la complexité de votre personnage et de l'animation elle-même. Le processus réel d'animation image par image est à peu près le même qu'avec le texte, mais vous voudrez tester votre animation brute avant de nettoyer vos dessins. Donc je vais faire une vague de fille. Je n'ai pas nécessairement besoin de le faire, mais pour des raisons de démonstration, je vais utiliser une technique appelée Onion Skinning, où vous dessinez votre première image et votre dernière image où vous voulez que l'animation se termine avant tout des trames entre les deux. Puisque j'ai déjà ma première image dessinée, je vais réduire l'opacité, créer un nouveau calque et dessiner ma dernière image. Maintenant que c'est fait, il est plus facile de voir ce qui doit se passer entre les deux. C' est une technique particulièrement utile pour les animations plus compliquées comme la course à pied ou la danse. Assurez-vous de rester assez lâche avec vos dessins à ce stade si vous faites quelque chose de plus compliqué comme ça. Ne vous attardez pas à les nettoyer, car vous voulez vous assurer que votre animation fonctionne bien avant de passer le temps de les rendre jolies. C' est une animation que j'ai faite il y a quelques années. C' est un test de moveset pour un jeu. Mais de toute façon, comme vous pouvez le voir, c'est beaucoup plus compliqué. J' ai dû utiliser la référence et j'ai vraiment passé du temps dessus. Donc, ce serait quelque chose comme ça avec lequel vous voudriez utiliser le dépouillement de l'oignon. Si vous faites simplement faire quelque chose de simple comme un clin d'œil ou une vague, vous n'avez pas nécessairement besoin de le faire. Tout ce qui fonctionne pour toi, vraiment. De toute façon, maintenant que j'ai mes calques, je les transfère dans ma chronologie pour pouvoir tester mon animation. Je ne vais pas vous embêter à nettoyer cela parce que j'aime à quoi il ressemble, mais si vous nettoyez vos esquisses rugueuses en faisant des dessins au trait propres sur des calques séparés, tous vos nouveaux calques gâcheront votre animation. Il est plus facile de simplement recréer votre timeline avec votre nouvelle illustration au trait. Sinon, vous devrez revenir en arrière et gâcher tous les paramètres de visibilité de chaque couche sur chaque image clé. 5. Exporter des GIFs et des vidéos: Voici mon GIF fini. Exporter un GIF est assez simple. Si vous avez une version de Photoshop à partir de, je crois que 2015 et retour, l'option Enregistrer pour le Web est à un endroit différent. Dans ma version, c'est juste ici sous Enregistrer sous. Mais pour les anciennes versions, vous devrez aller dans Fichier > Exporter > Enregistrer pour le Web. Quoi qu'il en soit, cliquez sur Enregistrer pour Web. Assurez-vous que tout a l'air bien. La taille du fichier doit être relativement petite et la répétition doit être définie sur Forever. J' ai changé le mien à 600 par 600 pixels, puis cliqué sur Entrée parce qu'il avait l'air un peu grand. Ça a l'air bien. Enregistrez-le sur votre bureau et voilà. Si vous voulez publier votre GIF sur Instagram, vous devrez l'exporter sous forme de vidéo car Instagram ne prend pas en charge les GIF. La vidéo doit durer au moins cinq secondes, alors vous devez allonger votre GIF. Étant donné que mes images sont réglées sur 0,2 seconde, cela signifie que j'aurai besoin d'au moins 25 images. Mais gardez à l'esprit que vous pourriez avoir besoin de plus ou moins si vous avez choisi une durée différente pour chaque image pour durer. Quoi qu'il en soit, il vous suffit de copier et de coller vos calques en les mettant en surbrillance tous, puis de maintenir la touche Option (ou Alt sur PC) enfoncée et de le faire glisser. Ensuite, mettez en surbrillance à nouveau, maintenez la touche Option enfoncée et faites glisser Voilà, tu y vas. J' ai maintenant 30 images, donc ça devrait être beaucoup de temps. Ensuite, tout ce que vous faites après cela est d'aller dans Fichier > Exporter > Rendu vidéo. Ça prendra quelques secondes pour charger. Modifiez le nom si nécessaire, et assurez-vous de l'enregistrer sur votre bureau. Appuyez ensuite sur Rendu. Maintenant, vous pouvez l'afficher en prévisualiser. Vous pouvez le mettre sur votre téléphone en le déposant dans votre Dropbox, ou si vous avez un iPhone, plaçant dans un dossier puis en le déposant sur votre téléphone via iTunes. C' est ça ! Si vous publiez votre GIF sur Instagram, n' hésitez pas à me marquer @melissaleedesign. J' aimerais les voir là-bas ou sur la page du projet de classe. Merci beaucoup d'avoir suivi mon cours. J' adorerais que vous me laissiez un commentaire, et n'hésitez pas à me poser toutes les questions que vous pourriez avoir dans Discussions. A la prochaine fois !