Exercices d'animation pour débutants

2 424

AriaVon

Présentation

Bonjour à tous ! Bonne année ʕ•́ᴥ•̀ʔっ. Le début de l'année est un bon moment pour commencer de nouvelles aventures, comme par exemple, se lancer dans le monde de l'animation. Cette fois-ci, je partage avec vous quelques exercices pour nous plonger dans ce monde merveilleux. J'espère que vous apprécierez, sans plus attendre...

Commençons !!

1. Animation en Mode simple

Commençons par découvrir le nouvel espace de travail d'animation ajouté au mode simple dans la mise à jour 4.2. C'est une interface minimaliste parfaite pour les petits écrans. Voyons comment l'utiliser.

Pour les utilisateurs de Clip Studio Paint DEBUT\/ PRO, un maximum de 24 images peut être utilisé.

✦ Où se trouve-t-il ?

La première chose à faire est d'aller en mode simple. Si nous avons déjà une toile ouverte en mode bureau, alors, pour passer en mode simple, nous devons aller à l'icône flottante ou, à défaut, depuis le chemin : Icône Clip Studio (coin supérieur gauche) > Passer en mode simple.

Une fois dans l'interface, il faut changer la toile d'illustration pour une toile d'Animation. Pour ce faire, nous devrons aller à : Menu (icône des trois points) > Créer une animation.

Si nous ouvrons le projet directement depuis l'écran Clip Studio Start, il suffit de choisir l'option : Dessiner > Nouvelle toile > Animation. Dans cette fenêtre, nous trouverons des toiles avec des dimensions recommandées, mais nous pouvons aussi les choisir manuellement.

✦ Comment ça marche ?

La première chose que nous trouverons en activant l'interface d'animation est la ligne de temps en bas de la toile.

- LIGNE DE TEMPS -

Dans la barre de temps, nous trouverons trois sections importantes.

1. Bouton de lecture.

2. Barre d'images : Par défaut, la barre contient une image vide qui ne peut pas être supprimée ; en outre, les images créées seront ajoutées à cette barre. En cliquant sur n'importe quelle image, un menu se déroulera avec deux options : Dupliquer et Supprimer.

Lors de la duplication d'une image, celle-ci inclura toutes les couches qui lui sont liées.

3. Avec le symbole (+), nous pouvons ajouter des images vides à la ligne de temps. D'autre part, avec le symbole (…), nous pouvons activer le papier calque et voir la fréquence d'images.

Chaque nouvelle image est une feuille blanche où le contenu des calques des images précédentes ne peut pas être copié, nous avons donc deux options :

➀ Dessiner tout à nouveau.

➁ Au lieu de créer une nouvelle image, nous pouvons la dupliquer. Ensuite, il faut éditer les calques pour obtenir le résultat souhaité. C'est une bonne option, cela nous évite de dessiner certains éléments à nouveau. Par exemple, pour réaliser l'animation de ce petit lapin, j'ai eu besoin de deux calques, un qui contenait les lignes directrices et un autre par-dessus le précédent pour le lapin. Une fois la pose correcte dessinée, j'ai dupliqué l'image pour conserver les informations du calque guide ; il ne restait plus qu'à effacer le lapin dupliqué et à dessiner le nouveau dans la pose suivante.

- IMPORTER DES IMAGES -

Si nous voulons importer une image pour le fond ou tout autre élément, nous devons aller aux trois points situés dans la palette «Calque» et choisir l'option «Galerie». Cette option nous mènera à la galerie de notre appareil pour sélectionner l'image souhaitée.

In the «Layer» palette, we find all the functionalities that will allow us to create illustrations as we would conventionally.

- IMPORTER DES IMAGES -

- ONION SKIN -

Onion skinning allows us to see the elements of the frame before and after the one currently being worked on. Elements from the previous frame will be displayed in purple, and those from the subsequent frame in green. Onion skinning allows us to visualize the sequence of frames and, most importantly, create a guide to draw the next pose.

- CHANGE FRAME POSITION -

Changing the position of frames is as easy as pressing and holding a frame and moving it to the new position.

- FRAMES PER SECOND -

The frame rate is set to 12 by default and cannot be edited directly from Simple Mode, but there is a way to change it.

Dans la fenêtre, vous pouvez choisir parmi plusieurs options ou l'écrire directement dans la barre. Nous choisissons celle dont nous avons besoin.

Within the window, you can choose from several options or type it directly into the bar. Choose the one you need.

La fréquence d'images est l'indicateur de la fréquence à laquelle des images consécutives (frames) sont affichées sur un écran, mesurée en images par seconde (fps), déterminant ainsi la fluidité de l'animation. Voici plusieurs exemples avec différentes FPS.

The frame rate is the indicator of the frequency with which consecutive images (frames) are displayed on a screen, measured in frames per second (fps), thus determining the fluidity of the animation. Here are several examples with different FPS.

2. Animation Exercises

Voyons maintenant quelques exercices d'animation qui nous aideront à comprendre le temps, l'espace, l'accélération ou la décélération, entre autres. Ces exercices, bien qu'ils puissent sembler simples, couvrent en réalité certains des fondamentaux de l'animation.

✦ Pendule

Le pendule est un exercice qui nous permet de comprendre certains éléments de l'animation qui se présentent, peu importe ce que l'on anime. Commençons par connaître quelques concepts importants :

● TEMPS (Timing) : Le timing est la durée de l'animation. Prenons comme exemple le pendule suivant, qui a une durée de 24 images, 12 pour aller du point A au point B et 12 autres pour revenir du B au A. Ce temps peut être indiqué dans les lignes directrices comme le montrent les marques le long de la courbe dans le pendule suivant.

Le timing n'est pas fixe, il varie en fonction de ce qui est animé. C'est l'animateur lui-même qui décide de la durée de chaque action.

● BREAKDOWN : C'est une pose qui rompt le mouvement, elle est utilisée pour définir la transition entre deux images. Elles indiquent la direction du mouvement. Par exemple, si nous avions deux points, qui dans ce cas seraient nos poses clés, nous pourrions déplacer un objet en ligne droite, mais si, d'autre part, nous voulons marquer un mouvement en courbe, alors nous placerions un breakdown entre les deux points pour marquer la courbe. Mais un breakdown n'a pas nécessairement besoin d'être placé au centre.

● INBETWEEN (In-betweening): These are frames added between key poses and breakdowns to smooth the movement and give fluidity to the animation. These frames are related to the concepts of acceleration and deceleration.

● ACCÉLÉRATION ET DÉCÉLÉRATION : Pour obtenir l'effet d'accélération et de décélération, le concept de Spacing est utilisé ; c'est en termes simples l'espace laissé entre une image de mouvement et la suivante lors du dessin. Ce concept est fondamental pour toute animation, quel que soit le nombre d'images utilisées, l'espace que nous laissons entre une image et la suivante est ce qui donnera l'illusion d'accélération et de décélération.

Découvrons maintenant les quatre types de mouvements qui permettent d'animer n'importe quoi :

➀ CONSTANT : Ici, l'objet se déplace à une vitesse constante. Nous remarquons alors que l'espace entre une image et la suivante maintient la même proportion tout au long du parcours.

➁ ACCÉLÉRER (Ease-In) : Le mouvement commence lentement et s'accélère avec le temps. Ici, nous pouvons voir comment les images du début sont proches les unes des autres et, à mesure que le mouvement progresse, elles s'éloignent de plus en plus.

➂ DÉCÉLÉRER (Ease-Out) : Dans ce cas, l'objet commence avec une certaine accélération et la perd au fur et à mesure qu'il avance. Ici, les images s'inversent, nous commençons avec une grande séparation entre elles et, à mesure que nous arrivons à la fin, elles commencent à se rapprocher.

➃ ACCÉLÉRATION ET DÉCÉLÉRATION (Ease-In et Ease-Out) : Ce dernier est un mélange des deux précédents. Nous avons une accélération au début et une décélération à la fin.

Voyons maintenant cela avec le pendule.

- DÉCÉLÉRATION -

Au début du mouvement, l'objet commence son accélération jusqu'à atteindre le point où son énergie diminue, entrant dans un état de décélération. Premièrement, pour décélérer, ou donner un effet de lenteur, l'espace laissé entre une image et la suivante doit être petit.

- ACCÉLÉRATION -

Deuxièmement, pour accélérer, ou donner un effet de rapidité, l'espace laissé entre une image et la suivante doit être grand.

- FAISONS-LE EN MODE SIMPLE -

Voyons maintenant comment animer ce pendule en mode simple, étape par étape, pour nous familiariser encore plus avec la nouvelle interface du mode simple.

➀ Premièrement, nous dessinerons les lignes directrices. Ces guides seront d'une grande aide visuelle pour comprendre la trajectoire du mouvement que nous voulons réaliser et le temps qu'il faudra pour passer d'une image à l'autre, comme expliqué précédemment.

➁ Sur un nouveau calque au-dessus, nous dessinerons le pendule. Nous pouvons le dessiner sur plusieurs calques puis les fusionner en un seul avec la fonction «Combiner avec le calque inférieur».

➂ L'étape suivante consisterait à créer une nouvelle image et à dessiner le pendule à partir de zéro ou, à défaut, si l'illustration le permet, nous pouvons gagner du temps en faisant ce qui suit :

Une fois que nous avons les deux calques, celui du pendule et celui des lignes directrices, nous nous dirigerons vers la fenêtre de la ligne de temps et sélectionnerons l'image qui correspond aux calques que nous avons dessinés, dans notre cas ce sera la seule image créée. Nous cliquerons sur la miniature, le menu se déroulera avec les options où nous choisirons «Dupliquer». Avec l'image dupliquée, nous nous dirigerons maintenant vers la fenêtre des calques, sélectionnerons le calque où se trouve le pendule et avec l'outil «Transformer», nous devrons déplacer le pendule vers sa position suivante.

➃ Une fois que nous avons terminé la séquence aller, pour revenir, nous n'avons pas besoin de modifier quoi que ce soit, il suffit de dupliquer les images que nous avons déjà, de la dernière à la première, et de les placer en suivant la séquence qui leur correspond sur la ligne de temps.

Voilà, nous avons terminé notre première animation. (๑˃ᴗ˂)ﻭ

Un autre exercice que nous pouvons faire dans la lignée des pendules est celui où la figure oscillante a une tridimensionnalité.

En procédant ainsi, nous devrons faire pivoter la figure en fonction du mouvement.

✦ Balle qui rebondit

Continuons à découvrir d'autres concepts importants de l'animation avec l'exercice de la balle qui rebondit.

● ÉCRASER ET ÉTIRER : (Squash et Stretch) : De nombreux objets et êtres organiques possèdent naturellement des qualités de déformation, d'élasticité. C'est pourquoi le squash et le stretch sont fondamentaux, ils nous rappellent d'appliquer des caractéristiques élastiques à ce que nous animons.

Rappelez-vous, même si un objet est écrasé ou étiré, sa masse ne change pas, elle ne disparaît pas, elle se déforme simplement.

● SQUASH : Si un objet est écrasé en heurtant une surface, ses côtés s'élargiront en devenant plus larges.

● STRETCH : Si l'objet s'étire, ses côtés se contracteront et par conséquent sa hauteur augmentera. Un objet tombant ou allant d'un côté à l'autre à grande vitesse présente cette caractéristique.

Voyons l'exemple : La balle rebondira sur le sol, donc, au contact de celui-ci, la balle s'écrasera un peu et s'étirera ensuite en remontant.

- ÉTAPE PAR ÉTAPE -

➀ Commençons par dessiner le sol et les lignes directrices, chacun sur un calque indépendant. Le début sera lent puis s'accélérera.

➁ Maintenant, sur un nouveau calque, dessinons la balle.

Avec tous les calques guides créés, commençons l'animation.

➂ Nous irons à la ligne de temps et dupliquerons l'image où se trouvent les calques. Ceci afin, surtout, de ne pas perdre les lignes directrices en avançant dans la création de nouvelles images.

➃ Avec l'outil «Transformation», nous déplacerons la balle vers sa position finale ou, à défaut, nous la dessinerons.

➄ Maintenant, nous devons écraser la balle, pour cela nous pouvons utiliser plusieurs outils, comme par exemple, les outils : Liquéfier, Transformation de maillage, ou Déformation de position libre.

➅ La suite consiste à se déplacer à la position précédente par rapport à la dernière et à dessiner la balle en lui appliquant un étirement, ce que nous pouvons faire avec les outils mentionnés précédemment.

Pour être exact, cet effet ne se produit pas tel quel dans la réalité, mais c'est la beauté de l'animation, elle permet d'ajouter une touche unique.

➆ Enfin, nous remplirons les positions manquantes avec la balle. Pour cela, nous pouvons dupliquer chacun des calques et les organiser selon la séquence pour simuler que la balle revient et ainsi compléter la boucle, sans dupliquer celle de la dernière position et de la première.

Voilà, nous avons terminé.

- AUTRES EXERCICES -

➀ POIDS : Un autre exercice que nous pouvons faire en suivant cette ligne est de jouer avec l'accélération et la décélération pour simuler différents poids sur les objets, et ainsi suggérer le matériau avec lequel ils sont fabriqués, car selon le matériau, l'objet se comporte différemment.

Les objets qui tombent différemment en raison de leur degré de flexibilité différent et, par conséquent, leur degré de déformation variera également.

Un autre aspect que nous pouvons ajouter ou prendre en compte est de superposer un mouvement d'étirement et un mouvement d'écrasement au moment de l'impact pour créer un point de contact.

➁ SPIRALE : Pour l'exercice suivant, il faut dessiner une spirale à laquelle nous appliquerons un espacement suivant les principes d'accélération et de décélération (moins d'images, plus rapide ; plus d'images, plus lent).

Quant à la balle, elle devra suivre les principes du Squash et du Stretch. Lorsqu'elle accélère, la balle s'étirera et en décélérant, elle retrouvera peu à peu sa forme originale.

C'est une animation simple, mais qui aide à mieux assimiler les concepts.

➂ GOUTTE D'EAU : Le troisième exercice consiste à laisser tomber une goutte d'eau et à ce qu'elle se décompose en petites gouttes en heurtant la surface. Une fois de plus, les lignes directrices nous aideront à visualiser la trajectoire.

La goutte commence son parcours avec une forme circulaire, mais à mesure qu'elle descend, elle s'étirera.

En impactant le sol, la goutte s'écrase contre celui-ci puis s'étend en libérant les gouttelettes. Pour mieux comprendre ce dernier mouvement, je conseille de chercher des références.

➃ LE MARTEAU : L'exercice du marteau vise à représenter le poids de l'objet en utilisant les concepts d'accélération et de décélération. Au début, nous aurons plusieurs images rapprochées pour indiquer le début de l'accélération, mais ensuite, les images suivantes augmenteront leur espacement pour la simulation de l'accélération.

Le niveau suivant de cet exercice consiste à le réaliser en perspective.

➄ PERSONNAGE QUI SAUTE : Dans l'exercice suivant, nous pouvons ajouter un peu plus de difficulté en concevant un personnage que nous ferons sauter en suivant une trajectoire en arc (nous verrons l'importance des arcs dans la section suivante).

✦ Arcs

En poursuivant avec les concepts, nous allons maintenant parler des arcs. Dans la vie, la trajectoire d'un grand nombre de mouvements se produit en arcs ; il en va de même en animation, un exemple en est le pendule que nous avons animé dans la première section. De plus, les mouvements en arcs sont naturellement plus esthétiques.

Les arcs se retrouvent souvent dans les poses de Breakdown, c'est pourquoi il est important d'en tenir compte lors de l'animation, car sinon nous pourrions commettre l'erreur de ne pas maintenir la proportion de l'objet.

Voyons l'exemple suivant : Si nous ne suivons pas la trajectoire courbe de la chute, alors nous courons le grand risque que la figure de transition se déforme d'une manière non désirée.

Voyons maintenant l'exemple d'une balle qui rebondit et s'arrête. Dans cet exercice, nous pouvons vérifier comment la balle perd de la vitesse avec le temps, comme cela se produirait dans la vie réelle. La balle ne perd pas d'énergie au même point, mais elle avance sur une trajectoire formée d'arcs qui, avec la perte d'énergie, deviennent plus petits.

- ÉTAPE PAR ÉTAPE -

➀ Le processus est essentiellement le même que dans les exercices précédents. Nous commencerons par dessiner la trajectoire descendante des arcs et les marques des images à dessiner. Pour placer les images, nous suivrons la même logique : la balle diminue sa vitesse en atteignant le sommet de l'arc et augmente en redescendant, elle rebondira au fond puis remontera.

➁ Maintenant, concernant la balle, nous devons nous rappeler d'ajouter le Squash. Lorsqu'elle accélère, la forme s'allonge.

Lorsqu'elle est suspendue en l'air, elle reprend sa forme originale.

Et enfin, en heurtant le sol, la balle s'écrase.

Voilà, nous avons terminé. Un autre exercice que nous pourrions réaliser serait celui-ci, mais en variant la position des images, par exemple, que la balle reste suspendue en l'air beaucoup plus longtemps. Nous pourrions également faire en sorte que la figure change en une autre à chaque saut.

- PERSPECTIVE -

Le suivant est le même exercice que le précédent, mais en y ajoutant de la perspective. La seule chose que nous devons prendre en compte cette fois-ci est que l'objet diminuera de taille à mesure qu'il s'éloigne du premier plan.

Avec ces exercices, nous pouvons voir à quel point les mouvements sont beaux lorsque nous y ajoutons des arcs.

- AUTRES EXERCICES -

➀ CORDE : En continuant avec les arcs, un autre exercice que nous pouvons faire est celui de la corde. Cet exercice consiste à animer une corde oscillant sous l'effet du vent. Cet exercice est important car c'est le principe qui permet d'animer le mouvement de nombreux autres objets.

Pour animer l'oscillation de la corde, nous pouvons visualiser deux cercles, un de chaque côté, sans toucher la corde. Cela aidera la corde à se déplacer en suivant des courbes. Un point à noter est que la longueur de la ligne doit être approximativement la même dans chaque image.

Ci-dessous, nous pouvons voir quelques exemples d'éléments auxquels nous pouvons appliquer ce principe : la queue de certains animaux, les cheveux, les vêtements, etc.

➁ CIRCUIT : Un autre exercice que l'on peut faire pour pratiquer les concepts expliqués précédemment est d'en concevoir un où l'on fait rebondir une balle dans un circuit, une balle qui heurterait des obstacles. De cette manière, on peut étudier l'incorporation d'arcs dans différents scénarios.

Dans mon cas, j'ai conçu une sorte de circuit fermé où la balle rebondit indéfiniment.

✦ Anticipation

L'anticipation est une pose qui contient un mouvement préalable à l'action que l'on souhaite réaliser. Une action qui communique à l'observateur que quelque chose est sur le point de se produire. La pose peut contenir un mouvement doux ou exagéré, cela dépendra de ce que l'on souhaite transmettre. Ci-dessous, nous allons animer un petit lapin qui saute. Voyons étape par étape :

➀ Nous commencerons par les lignes directrices que nous avons utilisées depuis le début. Comme on peut le voir, une fois de plus, nous travaillerons avec un arc.

➁ Maintenant, nous allons placer les poses clés (extrêmes), le mouvement initial et final.

➂ L'étape suivante consiste à ajouter le breakdown entre la pose A et B. Dans ce cas, il marque le point le plus haut du saut.

➃ Le breakdown suivant sera l'anticipation, cette pose se trouvera un peu avant la pose A.

➄ Enfin, nous ajouterons les poses intermédiaires pour adoucir la transition entre les poses clés.

À ce stade, il faut se souvenir des concepts de Squash et de Stretch lors de la définition du mouvement.

Voilà, nous avons maintenant un joli petit lapin sauteur.

- MOUVEMENT DE LA TÊTE -

Le principe est exactement le même que précédemment. Nous allons d'abord déterminer les poses clés.

C'est maintenant au tour du breakdown entre les poses clés. Cette pose fonctionnera comme transition.

L'étape suivante consiste à ajouter la pose d'anticipation, celle-ci sera placée un peu à gauche de la pose A. De plus, dans mon cas, j'inclinerai la tête vers le bas afin qu'avec l'ensemble des autres têtes, la trajectoire forme un arc.

Il faut noter que l'anticipation ne doit pas nécessairement provenir uniquement de mouvements exagérés. Le mouvement des yeux vers le point du mouvement suivant peut également servir d'anticipation, de sorte que le spectateur se rende compte que le personnage est sur le point d'effectuer une action.

Ensuite, nous ajouterons les poses intermédiaires qui donneront de la fluidité au mouvement.

Enfin, rappelez-vous que pour qu'un mouvement soit doté de naturel, il est toujours bon de le faire suivre une trajectoire en arcs.

Une fois tout ce qui précède établi, nous pouvons maintenant jouer avec l'espacement et le temps.

Voilà, nous avons terminé.

3. Exporter l'animation

Pour enregistrer l'animation que nous avons réalisée, il faut aller aux trois points en haut à droite et choisir «Exporter l'animation». En choisissant cette option, un menu s'ouvrira avec deux options : Partager et Enregistrer sur l'appareil. L'option de partage permet de choisir le chemin de stockage.

En choisissant l'une des deux options d'enregistrement, la fenêtre d'aperçu s'ouvrira, ainsi que le bouton d'enregistrement.

Voilà, nous sommes arrivés à la fin.

Conclusion

L'animation demande de la patience et du dévouement, on peut se frustrer, mais la récompense de la réussite est ce qui la rend si amusante. Animer quelque chose et le voir en action est vraiment incroyable. À mon avis, l'animation est une façon de donner vie et cela en soi est merveilleux. Alors, j'espère que vous l'apprécierez aussi.

Merci d'être arrivé jusqu'ici ! Ce serait d'une grande aide si vous me laissiez un j'aime. À une prochaine fois ! (≧∇≦)\/\

Au revoir.

En savoir plus sur moi ici :

Les utilisateurs qui ont aimé cette publication