Illustration en mouvement avec des images clés

1 193

Mana1057

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 !

Les utilisateurs qui ont aimé cette publication