Créez une animation en boucle en déplaçant une partie de l'illustration terminée.

 

Apprenez les bases des fonctions d'animation de CLIP STUDIO PAINT pendant le processus de production.

Ce cours est recommandé à ceux qui souhaitent s'initier facilement à l'animation.

 

 

Dans ce cours, nous expliquerons à l’aide de l’exemple ci-dessous.

Décidez des parties que vous souhaitez déplacer pour améliorer l'impression de l'illustration avant de la travailler.

Un autre moyen efficace d'ajouter une touche de réalisme consiste à dessiner des effets pour les lumières et les symboles.

 

L'exemple montre une fille se détendant dans une pièce sombre tout en écoutant de la musique.

Faites bouger les yeux, la lumière qui passe par la fenêtre, les notes de musique, la pluie et les cordes des rideaux pour transmettre le passage du temps.

 

Les données de l'exemple d'illustration et les données de l'animation complétée peuvent être téléchargées à partir des liens suivants.

Veuillez utiliser ces informations pour vérifier les fonctions décrites.

Données de l'illustration

Données d'animation

 

Animez l’illustration avec le déroulement suivant.

Le clignement est mis en scène par une animation de cellule utilisant plusieurs images, tandis que la lumière entrant par les fenêtres et les stores est représentée par une animation d'image clé spécifiant des nombres.

 

La version tablette de CLIP STUDIO PAINT est utilisée dans le cours, mais l'animation peut être créée avec presque les mêmes opérations sur un ordinateur ou un smartphone.

Pour plus de détails sur l’utilisation de CLIP STUDIO PAINT sur chacun des appareils, veuillez consulter la page ci-dessous.

 

Opérations de base pour les versions Windows et macOS

[Version tablette] Apprenez les opérations de base de CLIP STUDIO PAINT

[Version smartphone] Apprendre les opérations de base de CLIP STUDIO PAINT

[1] Disposition des calques

Organisez les calques de l'illustration pour faciliter le travail sur l'animation.

 

Séparez la palette [Calque] pour les parties mobiles et non mobiles.

Pour les illustrations dont les lignes et la peinture sont claires, il est plus facile de travailler en les séparant.

Si vous n'êtes pas sûr de la séparation des calques, séparez grossièrement le personnage et l’arrière-plan.

 

Dans l'exemple, j'ai utilisé la structure de calques suivante.

Pour faciliter le travail de dessin des différences dans l'animation cellulo, le calque du personnage et de l’arrière-plan sont respectivement divisées en calques « Dessin au trait » et « Colorisation ».

 

Pour le calque « Lumière de la fenêtre », définissez l'opacité sur 50 % et le mode de calque sur [Densité éclat]. Définissez des images clés pour l'opacité afin de représenter les changements de lumière.

[2] Clignement des yeux

Créez une animation de clignement qui fait cligner les yeux de votre personnage.

Découpage des parties

Tout d'abord, découpez les yeux sur le visage de l'illustration et séparez-les des parties immobiles.

 

Dans la palette des calques, sélectionnez le calque « Personnage - Dessin au trait » et le calque « Personnage - Colorisation ».

Pour sélectionner plusieurs calques, cochez la case à gauche de la vignette.

Sélectionnez l’outil secondaire [Stylo de sélection] dans l'outil [Zone de Sélection].

En utilisant le [Stylo de sélection], vous pouvez spécifier la zone de sélection tout en modifiant la taille du pinceau comme si vous dessiniez avec un stylo.

 

Faites une sélection pour couvrir la forme des deux yeux.

Utilisez l'outil secondaire [Effacer la sélection] pour couper l'excédent du [Stylo de sélection].

Assurez-vous que le dessin au trait et la colorisation se trouvent dans la sélection.

Après avoir effectué une sélection en fonction de la forme des deux yeux, appuyez sur [Couper + Coller] dans le [Lanceur de sélection].

Un calque est créé sur la palette [Calque] en découpant la forme de l'œil dans les calques "Personnage - Dessin au trait" et "Personnage - Colorisation".

Désélectionnez le calque une fois qu'il est créé.

 

Organisez le dessin au trait et la peinture dans un dossier de calques

Pour utiliser plusieurs calques comme une seule image (cellulo) pour l'animation cellulo, il est nécessaire de les rassembler dans un seul dossier de calques.

 

Je crée un nouveau dossier de calques et stocke le dessin au trait des yeux découpés et deux calques à remplir.

Remplacez le nom du dossier des calques par « a » et les noms des calques par «Copie de Personnage - Dessin au trait » > « Yeux - Dessin au trait », « Copie de Personnage - Colorisation » > « Blanc des yeux ».

Placez le dossier « a » devant le calque « Personnage - Dessin au trait ».

 

Ajout à la partie découpée

Si vous masquez le dossier « a », vous verrez que la partie du calque « Personnage - Colorisation » où les yeux ont été dessinés est maintenant vide.

Ajoutez de la peau et des cheveux au calque « Personnage - Colorisation » afin que les zones non peintes ne soient pas vides lorsque les yeux cligneront.

 

Avec le calque « Personnage - Colorisation » sélectionné, utilisez l’outil secondaire [Extraire une couleur du calque] de l'outil [Pipette] pour obtenir la couleur du dessin et ajoutez la peau et les cheveux avec le pinceau.

Une fois les parties mobiles et non mobiles séparées, nous sommes prêts à créer l'animation de clignement.

 

Comment créer une animation sur cellulo

Pour créer une animation de cellulos, vous devez préparer plusieurs images (cellulo) qui serviront de différences.

 

Deux autres images seront ensuite dessinées et trois images seront utilisées pour créer une animation de clignement.

Dessinez des yeux ouverts en « a », des yeux entrouverts en « b » et fermés en « c » et attribuez-les aux cellulos.

Les opérations sur les cellulos sont effectuées sur la palette [Chronologie].

 

Chronologie

Tout d'abord, sélectionnez [Chronologie] dans le menu [Fenêtre] pour afficher la palette [Chronologie].

Appuyez sur [Nouvelle chronologie] pour créer une chronologie.

Lorsque la boîte de dialogue [Nouvelle chronologie] apparaît, réglez [Cadence d'images] sur [8] et [Temps de lecture] sur « 24 » images.

Votre chronologie est prête.

Chaque calque de la palette [Calque] est traité comme une piste sur la palette [Chronologie].

[REMARQUE]

La cadence d’images est une unité qui exprime le nombre de cellulos d'une animation par seconde.

J'ai défini la cadence d'images sur 8 images par seconde et la durée sur 24 images, donc l'exemple sera une animation de 3 secondes.

Consultez cet article pour plus d’informations sur les fréquences d’images.

 

Dossier d’animations

Ensuite, créez un dossier d'animation et stockez les calques que vous souhaitez animer.

En le plaçant dans le dossier d'animation, le calque sera traité comme un cellulo sur la chronologie.

 

En appuyant sur le bouton [Nouveau dossier d'animation] sur la chronologie, vous créez un nouveau dossier d'animation sur les palettes [Chronologie] et [Calque].

Sur la palette [Calque], changez le nom du dossier d'animation en « Clignement » et placez-le en dessous du calque « Lumière de la fenêtre ».

Stockez le dossier « a » qui divise les parties de l'œil dans le dossier d'animation « Clignement ».

Le dossier « a » stocké dans le dossier d'animation est automatiquement spécifié comme le cellulo à l'image « 1 » sur la Chronologie.

Si les cellulos ne sont pas spécifiés sur la Chronologie, activez la boîte de dialogue [Préférences] > [Animation] > [Ajouter un cellulo à l’image lors de l'ajout d'un calque].

 

Spécification des cellulos avant la version 2.1

*Si vous utilisez la version 2.1 ou une version antérieure, après avoir stocké le dossier « a » dans le dossier d'animation, vous devez spécifier les cellulos selon la procédure suivante.

Déterminez une image et spécifiez quand afficher le cellulo.

 

Pour sélectionner une image sur la palette [Chronologie], appuyez sur le numéro de [Nombre d'images] en haut. L’image sélectionnée s'affiche en rouge.

Dans la palette [Chronologie], sélectionnez ❶ « Clignement » et ❷ Image [1] et appuyez sur ❸ Spécifier les cellulos.

Sélectionnez « a » dans la boîte de dialogue [Sélection de calque] et appuyez sur [OK].

Un cellulo est enregistré dans l’image et une vignette du cellulo est affichée sur la piste.

 

Création d'un nouveau cellulo

Créez ensuite les cellulos « b » et « c » qui suivent le cellulo « a ».

 

Avec la piste « Clignement » sélectionnée, sélectionnez l'image « 1 » et appuyez deux fois sur le bouton [Nouveau cellulo d'animation].

Les cellulos « b » et « c » sont créés aux images « 2 » et « 3 » après le cellulo « a ».

S'il existe un dossier de calques avec des cellulos spécifiés dans le dossier d'animation, un nouveau cellulo sera créé en fonction de la structure des calques.

 

Sur la palette [Calque], vous pouvez voir que les dossiers cellulos « b » et « c » ont la même structure que le « a ».

[REMARQUE]

L'utilisation du bouton [Zoom avant/Zoom arrière] de la palette [Chronologie] modifie la largeur de l’image. S'il est difficile de choisir une image, zoomez pour élargir la largeur.

 

Papier pelure

Ensuite, assurez-vous que [Activer le papier pelure] dans la palette [Chronologie] est activé.

Lorsqu’activé, les cellulos des images avant et après l'image actuellement sélectionnée sont affichés de manière translucide sur la toile.

 

Lorsque l'image « 2 » est sélectionnée, le cellulo « a » spécifié dans l'image précédente « 1 » est affiché de manière semi-transparente.

Modifiez les paramètres de papier pelure afin que les cellulos de 2 images avant et après soient affichés sur la toile.

Dans le menu [Animation], sélectionnez [Réglages de papier pelure] dans [Afficher les cellulos d'animation].

Remplacez le [Nombre de papiers pelure] par « 2 » pour [Image précédente] et [Image suivante].

Lors de la modification du cellulo « c » dans l'image « 3 », le cellulo « a » dans l’image « 1 » est maintenant affiché sur la toile avec le papier pelure.

 

Dessin des différences

Tout en vérifiant les yeux ouverts de « a » avec le papier pelure, dessinez les yeux fermés sur le calque « Yeux - Dessin au trait » du cellulo d'animation « c ».

 

La couleur du dessin au trait est le noir.

Ensuite, dessinez la division médiane des cellulos « a » et « c » dans le cellulo « b ».

 

Tracez une ligne des yeux en trois dimensions sur le calque « Yeux - Dessin au trait » de manière à ce que les demi-yeux suivent le globe oculaire, et peignez le blanc des yeux sur le calque « Blanc des yeux ».

 

Pour dessiner le blanc des yeux, utilisez l’outil secondaire [Extraire une couleur du calque] sur le calque « Blanc des yeux » du cellulo « a ».

Ceci complète les 3 cellulos requis pour l'animation.

 

Ajuster le timing du clignement

Ajustez le timing du clignement sur la palette [Chronologie].

Dans la piste « Clignement », exécutez [Spécifier les cellulos] pour obtenir l’ordre suivant :

 

Image « 1 » : Cellulo « a »

Image « 2 » : Cellulo « c »

Image « 3 » : Cellulo « b »

Image « 4 » : Cellulo « a »

 

L’ordre des cellulos peut également être modifié en faisant glisser les vignettes.

N'insérez pas la fente centrale lorsque l’œil se ferme, mais insérez-la lorsqu’il s’ouvre.

La vitesse est plus rapide que lorsque les yeux s’ouvrent, ce qui permet un clignement naturel des yeux.

 

Appuyez sur [Lire/arrêter] sur la palette [Chronologie] pour vérifier le mouvement.

Ceci termine l’animation de clignement.

 

[3] Lumière de la fenêtre

Transformez la lumière de la fenêtre en une animation d'image clé avec une opacité variable.

Activation des images clés

Avec la piste « Lumière de la fenêtre » sélectionnée dans la palette [Chronologie], activez [Activer les images-clé du calque].

 

Ajout d'images clés

Les images clés peuvent être manipulées avec l’outil secondaire [Objet].

Sélectionnez l'image « 1 » dans la palette [Chronologie] et cochez le côté droit de [Opacité du calque] dans la palette [Propriétés de l'outil] pour ajouter une image clé à l'image sélectionnée.

Pour vérifier les images clés d'opacité dans la palette [Chronologie], appuyez sur le bouton + à gauche du nom de la piste pour développer l'élément.

 

Une icône en forme de losange s'affiche sur la piste pour indiquer une image clé.

 

Paramètres des images clés

Animez les changements de lumière en modifiant la valeur d’opacité de chaque image clé.

 

Avec l’image « 1 » sélectionnée, réglez [Opacité du calque] sur « 35 », l’image « 5 » sur « 15 » et l’image « 8 » sur « 35 ».

 

Dupliquer une image-clé

Mettons en place un changement de lumière répétitif.

Faites glisser pour sélectionner toutes les images clés sur la piste « Lumière de la fenêtre » de la palette [Chronologie].

L'image clé sélectionnée est recouverte d'un cadre rouge.

Appuyez et maintenez votre doigt sur l'une des images clés sélectionnées et sélectionnez Copier.

Sur PC, cliquez avec le bouton droit pour afficher le menu contextuel ou sélectionnez le menu [Animation] > [Éditer la piste] > [Copier].

Appuyez et maintenez l'image « 9 » sur la piste « Lumière de la fenêtre » et sélectionnez Coller.

Comme auparavant, pour la version PC, sélectionnez le menu [Animation] > [Éditer la piste] > [Coller].

Ensuite, sélectionnez [Coller] de la même manière pour l'image « 17 ».

Le même mouvement est maintenant répété trois fois jusqu'à l'image « 24 ».

Appuyez sur [Lire/arrêter] sur la palette [Chronologie] pour vérifier le mouvement.

L'animation de la lumière de la fenêtre est terminée.

 

[4] Autres animations d'arrière-plan

D'autres parties sont mises en mouvement de la même manière avec l'animation de cellulo et l'animation par images clés.

Remarques

Ajoutez un effet de note de musique autour du personnage pour créer la sensation qu’il écoute de la musique.

 

Créez un nouveau dossier d'animation et déplacez-le en haut de la palette [Calque].

Nommez le dossier d'animation « Note ».

Sélectionnez l'image « 1 » sur la piste « Note » et appuyez sur [Nouveau cellulo d'animation].

Changez le nom du cellulo nouvellement créé en « a » dans la palette [Calque].

Un pinceau de décoration est utilisé pour dessiner des notes de musique.

Téléchargez le pinceau « Handdrawn note♪ » depuis CLIP STUDIO ASSETS.

 

Sélectionnez le cellulo « a », définissez la couleur du dessin sur magenta et dessinez des notes de musique autour du visage de la fille.

Sélectionnez ensuite l'image « 7 » et sélectionnez [Nouveau cellulo d'animation].

Le cellulo « a » est suivi du cellulo « b ».

Nous dessinerons également des notes dans le cellulo « b ».

Copiez le cellulo pour qu’il se répète deux fois en 3 secondes.

 

Sélectionnez les cellulos « a » et « b » des images « 1 » et « 7 » en faisant glisser, [Copier] et [Coller] jusqu’à l’image « 13 ».

Appuyez sur le bouton de lecture pour voir comment les notes bougent.

csptutovideo04_060.gif

Pluie

Ajoutez un dessin à l'extérieur de la fenêtre pour qu'il devienne une animation cellulo comme celle des notes de musique.

Deux cellulos sont placés toutes les 4 images et le même mouvement est répété 3 fois.

 

Cordon du rideau

Ajoutez le cordon des rideaux et faites-en une animation d'image clé qui oscille à gauche et à droite.

Ajoutez une animation d'image clé à faire pivoter.

 

Lorsque l’outil secondaire [Objet] est sélectionné, le centre de rotation de l'animation par image clé s'affiche sous la forme d'une croix.

Faites glisser la croix pour modifier la position du centre de rotation.

Placez le centre de rotation sur le point d'appui du store et définissez une image clé pour l'[Angle de rotation] dans la palette [Propriétés de l'outil].

Toutes les animations sont maintenant terminées.

 

[5] Exporter

Exportez l'animation terminée dans un fichier vidéo.

 

Étant donné que le format GIF ne peut utiliser que 256 couleurs maximum, exportez vers un fichier vidéo pour exprimer clairement les dégradés tels que la lumière et l'obscurité.

 

Sélectionnez le menu [Fichier] > [Exporter l'animation] > [Film].

Pour l'extension de fichier, sélectionnez [mp4], qui est facile à télécharger sur n’importe quel réseau.

 

Dans la boîte de dialogue [Paramètres d'exportation de film], réglez la cadence d'images sur « 8 ».

[REMARQUE]

En faisant correspondre avec la cadence d’images de la chronologie, la prévisualisation pendant la production peut être adaptée au mouvement de la vidéo.

 

Et voici une animation en boucle fluide à partager sur les réseaux sociaux !