Illustration en mouvement avec des images clés
Bonjour !
Avez-vous déjà eu envie de faire bouger vos dessins, mais l’idée de dessiner cellule par cellule vous décourage presque ?
Je vous ai eu ! J’espère !
Je vais vous montrer comment j’ai fait cela, avec une image :
Une version vidéo est disponible ici si vous le souhaitez :
J'ai réalisé une animation de dessin simple très simple qui n'implique aucune découpe de dessin et se concentre principalement sur l'animation de l'environnement, ici :
J'ai oublié comment créer une série, mais c'est comme la deuxième partie du premier
Pareil pour le premier, j'utilise Clip Studio Paint Pro, mais avec 24 images.
Tout le monde peut donc le faire.
Ces nouveaux conseils se concentrent davantage sur la superposition et l'organisation des dossiers afin que nous puissions utiliser davantage les images clés.
Commençons !
PRÉPARATION – ébauche et dessin
Première étape, préparez votre image.
Faites un brouillon de ce que vous voulez voir
Je voulais qu'il ait l'air endormi et qu'il commence peut-être à s'incliner sur le côté
⭐ Ce qui impliquera également des cheveux et une animation de clignotement
Peut-être ajouter également des effets de lumière en bas ?
⭐ Ce qui peut probablement impliquer une animation d'ombre
Je veux que l'arrière-plan pleuve
⭐ J'aime la pluie :D
Nous avons donc notre plan
Ouvrez votre Clip Studio Paint, chargez votre image.
Il faut découper les parties que l'on souhaite animer, je ne vais pas le montrer ici.
J'ai découpé le personnage en onze morceaux
Vous pouvez couper autant que vous le souhaitez
Assurez-vous d'étiqueter correctement vos calques pour rester organisé
CHRONOLOGIE
Pour obtenir notre chronologie, allez dans [Windows] > [Chronologie]
Cliquez sur [Nouvelle chronologie]
Je vais utiliser Fréquence d'images 8 et Temps de lecture 24
RAPPEL : Clip Studio Paint a un temps de lecture maximum de 24 ; si vous souhaitez animer plus longtemps, vous devez passer à la version EX.
Commençons l'animation
ANIMATION DE PLUIE - animation cellulaire
Le titre dit images clés — sauf pour cette partie !
Nous créons la pluie avec des cellulos - pour nous faciliter la vie.
le reste sera des images clés après cela !
Créons une animation de pluie simple et rapide à l'aide de cellulos
J'utiliserai un PINCEAU DE PLUIE
J'ai utilisé ce pinceau ici :
Commençons par l'ANIMATION DE PLUIE
Créez un [Nouveau dossier d'animation] > renommez-le en RAIN
Rappel : veuillez renommer vos dossiers et calques afin d'être organisé
Sur FRAME 1 – cliquez sur [New Animation Cel], un numéro ou une image 1 apparaîtra à l’intérieur du dossier.
Prenez votre PINCEAU DE PLUIE et utilisez votre pinceau, dessinez simplement de la pluie
Passez à l'image suivante, IMAGE 2 – cliquez sur [Nouvelle animation cellulo] > créer une autre pluie
Faites cela pour l'IMAGE 3 ET L'IMAGE 4
Maintenant, mettons ces quatre animations pour toute la lecture.
Assurez-vous que vous êtes sur l'image vide suivante,
exemple l'IMAGE 5, allez dans [Animation] > [Modifier la piste] > [Attribuer plusieurs cellules]
J'ai choisi [Affecter par nom de cellule]
Commencer par Cellule 1 à Cellule 4
Répéter 5 fois
Donc, 4 multiplié par 5 est 20, nous avons déjà 4 donc cela complète nos 24 images
Cliquez sur OK lorsque vous avez terminé.
Vous voyez que notre dossier RAIN Animation est maintenant rempli de chiffres (cels)
Et lorsque vous cliquez sur PLAY
Voici à quoi ressemble notre animation
Si c'est trop lumineux, vous pouvez modifier l'opacité du DOSSIER D'ANIMATION
ANIMATION DE LA TÊTE - inclinaison de la tête
Ensuite, animons la tête. Commencez par créer un nouveau DOSSIER – un simple dossier.
Nommez-le TETE
Faites glisser tous les éléments de la tête sur ce dossier
⭐ Yeux, Sourcils, Visage, Cheveux, Cheveux du haut et calque de la tête lui-même
Ensuite, pendant que le DOSSIER Tête est toujours sélectionné, cliquez sur [Activer les images clés sur ce calque]
Allez dans l'outil [Opération] > modifiez le point d'ancrage du Dossier Tête, cliquez dessus et faites-le glisser - placez-le sous le menton.
Des images clés seront ajoutées au dossier car vous avez déplacé le point d'ancrage, vous pouvez les supprimer pour garder votre timeline propre.
Nous allons animer la ROTATION ici.
Vous n'avez pas besoin de POSITIONS et de CENTRE DE ROTATION, vous pouvez supprimer ces images clés
Nous allons créer un petit BOUNCE
Cliquez sur ROTATE
C'est subtil, mais vous pouvez voir un changement lorsque vous cliquez sur les transformations
Interpolation d'images clés ; gardez-la FLUIDE
L'animation que je veux, c'est qu'il s'endort (tête penchée) puis se réveille (tête penchée en arrière)
Définissons notre première image clé, je vais choisir l'image 6.
Ajoutez une image clé à ROTATE – aucun mouvement, maintenons simplement cette position
Touche suivante, Image 12 – inclinez ou faites pivoter légèrement la tête vers la gauche, la tête commence maintenant à bouger.
Clé suivante, Image 14 – ajoutez une image clé, ne faites aucun mouvement.
En gros, nous avons simplement copié la clé de l'image 12.
Passons maintenant à l'Image 13 – nous inclinons la tête un peu plus que celle de l'Image 12
J'ai fait la même animation quelques images plus loin mais cette fois la ROTATION est dans le sens inverse des aiguilles d'une montre
Clip PLAY pour vérifier l'animation
Si le rendu commence à ralentir, effectuez un zoom arrière pour effectuer le rendu en temps réel
Voici le BOUNCE dont je parle :
1. Copiez votre dernier mouvement
2. Collez-le deux images plus loin
3. Au milieu de ces images clés
4. Augmentez la ROTATION de votre dernier mouvement (comme l'exagérer, ajouter plus de valeur)
ANIMATION DES YEUX - image clé
Les animations des yeux se font généralement avec des cellulos, mais comme nous utilisons déjà des images clés, nous pouvons tout aussi bien faire la même chose avec les animations des yeux.
Faire des animations des yeux avec des images clés revient essentiellement à jouer avec l'opacité, c'est direct.
C'est facile mais peut être compliqué.
Il est préférable d'utiliser HOLD Interpolations pour qu'il CONSERVE les valeurs clés jusqu'à ce que vous en placiez une autre.
Comme notre dossier HEAD est déjà activé pour les images clés et que les YEUX sont déjà dans ce dossier, les yeux sont également déjà activés pour les images clés
AFFICHEZ TOUS VOS CALQUES D'ŒIL
Sélectionnez l'image où vous souhaitez démarrer l'animation.
Vous pouvez utiliser les images clés HEAD comme référence.
Modifiez votre interpolation d'images clés sur HOLD
Disons que dans l'image 8, les yeux seront ouverts donc :
Les yeux ouverts correspondent à une opacité de 100 %.
Les demi-yeux correspondent à une opacité de 0 %.
Les yeux fermés correspondent à une opacité de 0 %.
En gros, si vous avez besoin d'OUVRIR LES YEUX, réglez l'opacité à 100 % et réglez les autres COUCHES DES YEUX à 0 % d'opacité
Et ainsi de suite
Gardez ce dont vous avez besoin à 100 % d'opacité
Rendez ce dont vous n'avez pas besoin à 0 % d'opacité
ANIMATION DES SOURCILS
Je vais être honnête, cette partie est un peu inutile car vous pouvez le faire sur les sourcils individuellement. Je veux montrer que vous pouvez animer le dossier et les calques à l’intérieur du dossier et que tout ira bien.
Ensuite, travaillons sur les sourcils.
Je vais animer le dossier EYEBROW, le dossier lui-même - à l'intérieur du dossier se trouvent L_Eyebrow et R_Eyebrow
Je vais animer sur POSITION pour le dossier EYEBROW
L'animation que je veux pour cela est que je veux qu'il fronce un peu les sourcils (les sourcils descendent) avant que sa tête ne s'incline vers l'arrière
Avant de commencer, assurez-vous que votre Interpolation d'images clés est LISSE
Placez une image clé, ne déplacez rien - placez simplement une image clé sur POSITION à FRAME 14
La position actuelle du personnage est telle que sa tête est déjà inclinée ici, ses yeux sont proches — ses sourcils sont dans une position cool.
Nous plaçons simplement une image clé de départ, la position d'origine.
Nous pouvons donc préparer notre prochaine clé avant que la tête ne s'incline vers l'arrière
Ensuite, à l’Image 19, assurez-vous que vous êtes sur [Outil d’opération], faites glisser les sourcils vers le bas – comme s’il fronçait les sourcils.
Ensuite, il ouvre les yeux, alors levons ses sourcils.
Copions la clé sur l'image 14**, car c'est notre position d'origine.
Cliquez sur l'image clé > ouvrez votre clavier Edge > cliquez sur ALT, puis faites glisser votre clé sur l'image 22
N'oubliez pas de cliquer à nouveau sur la touche ALT pour désactiver ce bouton clé.
Créons un rebond lorsque ses sourcils se lèvent
Ajoutez la même image clé à Image 24
Maintenant, l'image du milieu ; Image 23 est vide, assurez-vous que vous êtes sur [Outil d'opération], faites-la glisser un peu plus vers le haut.
Quand tu y joues…
Ça a l'air bizarre, oui. Il manque quelque chose.
Les sourcils montent et descendent, mais ils ne tournent pas et ne froncent pas les sourcils.
Travaillons là-dessus.
Sourcils individuels
Je veux qu'il fronce un peu les sourcils quand ses sourcils descendent – quand il est sur le point de relever la tête.
J'utiliserai ici ROTATE le plus souvent, pour donner l'impression que les sourcils froncent les sourcils
Travaillons d'abord avec L_Eyebrow, assurez-vous que vous êtes sur [Operation Tool] > obtenez le point d'ancrage et faites-le glisser au milieu de votre sourcil
La modification du point d’ancrage ajoute automatiquement des images clés, veuillez les supprimer, elles sont trop nombreuses, nous n’en avons pas besoin
Commençons l'animation
En utilisant le dossier Sourcils comme référence, commencez par Image 14, ajoutez une image clé sur ROTATE.
-- Ce serait notre image clé de départ, l'image clé avant l'action
— Vous n'avez pas besoin de déplacer quoi que ce soit, placez simplement une image clé
En référence au dossier des sourcils – Image 19, faites pivoter légèrement le sourcil – faites comme s’il fronçait les sourcils.
Revenons maintenant à la rotation d'origine
Copiez votre image clé sur l'image 14
Sélectionnez Image clé > Clavier Edge > Alt > Faites-la glisser vers Image 22
Cela copie l'image clé
Encore une fois, nous faisons un rebond, donc placez la même image clé sur l'image 24
Maintenant, le milieu de l'image est vide, Image 23, ajoutons le rebond.
Faisons tourner légèrement le sourcil dans le sens inverse des aiguilles d'une montre, pour donner l'impression qu'il monte, juste un petit peu.
L'action ici est que la tête du personnage est maintenant inclinée vers le haut, ses yeux viennent d'être ouverts.
Quand tu joues ça, ça rebondit un peu
Faites la même chose avec le sourcil droit, une fois terminé, cela ressemble à ceci ;
J'ai fini par mettre des images clés sur POSITION également car je ne pouvais pas trouver le centre du sourcil droit.
La POSITION m'a aidé à empêcher les sourcils de bouger à des endroits aléatoires pendant que je tourne.
ANIMATION DES CHEVEUX
Techniquement, il s'agit d'une animation de cheveux minuscules. Ce sont ces petits cheveux sur le dessus de sa tête. Mais vous pouvez également l'utiliser si vous prévoyez de couper les cheveux de votre personnage en sections.
Allons à ces petits cheveux, assurez-vous que vous êtes sur [Operation Tool] > obtenez le point d'ancrage de TOP HAIR > déplacez-le à l'extrémité inférieure des cheveux ou là où le cuir chevelu devrait être.
N'oubliez pas de supprimer les images clés de la modification du point d'ancrage, nous n'en avons pas besoin.
L'animation que nous allons faire ici consiste à ce que les cheveux se balancent simplement d'avant en arrière pendant que la tête se balance.
Faites défiler votre timeline et vérifiez où la tête s'incline, lorsque vous la trouvez, déplacez-vous quelques images en arrière. Nous allons mettre une image clé de départ.
— une image clé avant l'action.
— c'est aussi notre rotation / valeur d'origine
Disons Image 9, ajoutez une image clé ici sur ROTATE
Avancez de quelques images, disons l'image 14 - faites pivoter les cheveux dans le sens des aiguilles d'une montre
L'action est que le personnage va se pencher sur le côté, donc ses cheveux vont tomber.
CETTE SECTION NE SERA PAS TRÈS DÉTAILLÉE
Parce que l'animation que j'ai faite est essentiellement,
⭐Si le personnage est penché vers la droite - les cheveux tournent dans le sens des aiguilles d'une montre
⭐Si le personnage est penché vers la gauche - les cheveux tournent dans le sens inverse des aiguilles d'une montre
mais, il y a aussi quelques petits « rebonds » ou vous pouvez appeler ça des balancements.
⭐Avant de faire l'image clé de fin, j'ai fait plusieurs images clés des cheveux allant de gauche à droite jusqu'à ce que la valeur diminue et qu'ils atteignent mon image clé de fin
Si vous souhaitez créer une animation en boucle
Assurez-vous que votre image clé de fin est la même que votre première image clé !
ANIMATION DU TORSE
Animons le torse ou le haut du corps
Tout d'abord, créez un dossier (normal) > renommez-le en TORSO > placez-y le dossier Head et le calque supérieur**
placez tout ce qui concerne la moitié supérieure du corps
Assurez-vous que votre TORSE > Cliquez sur [Images clés activées sur ce calque]
Utilisez l'outil [Operation Tool] > Déplacez le point d'ancrage et déplacez-le vers la hanche du personnage
Des images clés seront placées en raison du changement de rotation, veuillez supprimer ces images clés, vous n'en avez pas besoin
Utilisez le dossier HEAD comme référence si vous le souhaitez
Mettez une image clé de départ sur ROTATE à l'image 7
- placez simplement une image clé ici, ne faites rien.
- c'est notre image clé de départ pour maintenir la rotation.
En utilisant le dossier HEAD comme référence, nous passons à FRAME 12 > rotation dans le sens des aiguilles d'une montre, juste un peu
je le déplace seulement d'une valeur
CADRE 20 - tournez à nouveau dans le sens des aiguilles d'une montre, augmentez légèrement la valeur
L'action que nous avons effectuée consiste à ce qu'il se penche plus lentement
Le reste de l'animation du TORSE est le même que celui des CHEVEUX.
⭐ Assurez-vous que l'image clé de fin est la même que l'image clé de départ.
⭐ Il y avait des images vides avant la fin de la timeline, alors je l'ai fait se balancer un peu en arrière et en avant.
Si votre lecture est lente, un zoom avant et arrière et/ou la désactivation de l'autre animation peuvent aider
Ma lecture était lente et j'ai oublié de désactiver la pluie, voici une exportation rapide de l'animation actuelle :
Rien de trop extrême, une inclinaison lente puis un petit balancement à la fin — c'étaient les images clés de fin se balançant d'avant en arrière (dans le sens des aiguilles d'une montre-dans le sens inverse des aiguilles d'une montre) jusqu'à ce que nous atteignions l'image clé de fin.
ANIMATION DE FEUILLES
Assurez-vous que le calque LEAVES est sélectionné > Cliquez sur [Images clés activées sur ce calque]
Déplacez le point d'ancrage des feuilles à l'extrémité droite du milieu de la toile** — sortez de la toile si nécessaire
Considérez le point d'ancrage comme une articulation, comment l'objet va-t-il pivoter si je place l'« articulation » ici ?
Vous obtiendrez des images clés car vous avez déplacé le point d'ancrage, veuillez les supprimer.
Vous n'en avez pas besoin.
L'animation que nous faisons ici consiste à faire osciller les feuilles.
Nous allons utiliser ROTATE, sélectionnez-la
FRAME 1 - placez une image clé sur ROTATE
- ne faites rien, placez-la simplement là, c'est notre image clé de départ
Placez la même image clé à la fin de la timeline sur ROTATE, FRAME 24
- aucun changement, aucune transformation - placez simplement une image clé à cet endroit.
Faites également glisser l'image clé de fin jusqu'à la toute fin de la timeline.
Sélectionnez-la et faites-la glisser.
Cela rendra l'animation des feuilles transparente.
Pour le milieu de l'animation, IMAGE 13 > FAITES TOURNER les feuilles dans le sens inverse des aiguilles d'une montre, pas trop extrême.
Jouer pour vérifier
AUTRES EFFETS
J'ai ensuite simplement ajouté quelques ombres et un éclairage en utilisant des calques normaux, pas besoin de les animer.
Pour le BOKEH, je les ai animés.
Seulement 3 images clés maximum par transformation
Pour l'Opacité, j'ai commencé avec 0% puis le milieu est à 100% et j'ai fini à nouveau avec 0%
- il y a eu un fondu entrant et un fondu sortant.
J'ai aussi fait deux BOKEH, donc je peux animer les deux à des intervalles différents.
- mettre deux bokeh dans une seule animation peut sembler brouillon
Pour la POSITION, je l'ai juste fait monter
- des timings différents
Une fois terminé, cela ressemble à ceci :
ANIMATION D'OMBRE
Je voulais avoir une ombre à l'arrière du personnage, essayons ça !
Dupliquez votre dossier de personnage > Renommez-le en Shadow Char
*optionnel*
FLOUEZ TOUT CE QUI SE TROUVE DANS LE DOSSIER SHADOW CHAR
— si vous voulez une ombre de bord plus douce, vous pouvez flouter les calques à l'intérieur de ce dossier
— vous pouvez supprimer les calques faciaux, vous n'en avez pas besoin ici
— j'ai utilisé un flou gaussien à 10 %
Désactivez l'image clé en cliquant sur [Activer l'image clé sur ce calque] > pour pouvoir éditer.
— vos images clés ne disparaîtront pas tant que vous ne les fusionnerez pas avec d'autres calques.
Assurez-vous de déplacer le dossier Shadow Char sous le dossier Character.
Ensuite, faisons de ceci une ombre
Allez dans Calque > Nouveaux calques de correction > Teinte/Saturation/Luminosité
Réduisez la saturation et la luminosité à -100
Assurez-vous que votre superposition ressemble à ceci :
⭐Caractère
⭐Calque de correction
⭐Caractère d'ombre
Ensuite, fixez le calque de correction au calque situé en dessous
Après cela, cliquez simplement sur [Images clés activées sur ce calque]
Augmentez légèrement l'ÉCHELLE et déplacez simplement la POSITION pour créer une distance
Les images clés seront placées car vous déplacez l'ÉCHELLE et la POSITION - vous pouvez les supprimer, vous n'avez pas besoin d'animer ce dossier
Et maintenant, cela ressemble à ceci :
*optionnel - APPAREIL PHOTO
Vous pouvez ajouter une caméra si vous le souhaitez !
Allez dans [Animation] > [Nouveau calque d'animation] > [dossier de caméra 2D]
Un dossier nommé Camera 1 apparaîtra dans votre onglet Calque, mettez tous vos calques à l'intérieur
Une boîte bleue apparaît sur la toile, c'est votre appareil photo
En général, je réduis d'abord l'échelle pour zoomer, afin d'avoir plus d'espace pour travailler lorsque je fais un panoramique avec l'appareil photo
Vous pouvez supprimer ces images clés, nous n'en avons pas besoin.
J'utilise ensuite POSITION pour déplacer la caméra à l'aide de 3 images clés.
Les images clés de début et de fin sont les mêmes, celle du milieu a juste bougé un peu — juste un tout petit peu, juste pour secouer
L'appareil photo est facultatif !
Aucun appareil photo ne ressemble à ceci :
Après cela, exportez simplement votre travail
Si vous l'exportez au format GIF animé, il est préférable d'activer le tramage.
⭐ SANS DITHERING :
⭐ AVEC DITHERING :
La superposition et l'organisation des dossiers (et des calques) facilitent cette animation.
En outre, restez organisé !
J'espère que cela vous aidera d'une manière ou d'une autre !
Commentaire