Bonjour à tous, bienvenue dans mon tutoriel !!

 

Dans ce tutoriel, je vais vous montrer les étapes faciles pour créer un character art pour un avatar animé ou un rigging model !!!

Ce tutoriel est divisé en 2 parties :

 

La première partie vous montrera comment créer des illustrations de personnages pour l'avatar animé, et

La deuxième partie vous montrera comment animer l'avatar dans Clip Studio Paint (Pro/Ex)

Vous pouvez également exporter l'illustration vers un autre logiciel d'animation pour créer un modèle de rigging 2D pour un avatar interactif, tel qu'un sprite de jeu ou un modèle Vtuber.

 

Ce tutoriel comprend également le processus de nettoyage des fichiers pour cela.

Commençons !!

Tutoriel vidéo

Version vidéo de ce tutoriel

Partie 1 : Créer le modèle d'avatar

La base pour créer un avatar animé est simple.

Divisez le personnage en parties et déplacez-les pour créer une animation.

La manière traditionnelle de procéder consiste à dessiner un personnage, puis à découper et à éditer les parties.

Si vous dessinez les pièces séparément, prévoir la séparation des pièces vous aidera à travailler plus facilement.

Voici le processus que je vais vous montrer dans ce tutoriel.

Étape 1 : Créer un design clair

Esquissez l'œuvre en vue de face et pose debout de base.

L'œuvre doit être claire et détaillée pour le processus de traçage

Facultatif : j'ai également coloré l'esquisse pour l'utiliser comme référence de couleur dans le processus de dessin

Vous pouvez utiliser le modèle de tête pour vous aider à dessiner.

Le modèle de tête se trouve dans le [Panneau Matériau > 3D > Tête]

(Vous pouvez accéder à ce panneau via le menu [Fenêtre>Matériau:3D])

Facultatif : vous pouvez personnaliser les caractéristiques du visage pour les adapter à votre conception en ajustant la valeur dans l'onglet [Caractéristiques du visage] dans le panneau [Détails de l'outil secondaire]

Créez un nouveau calque et dessinez le modèle de tête

Le modèle de tête a des détails clairs, vous pouvez l'utiliser comme référence pour la forme du visage, les oreilles et la position des yeux.

Étape 2 : Planification pour le fractionnement des pièces

une fois la conception terminée, divisez l'œuvre en plusieurs parties.

 

La clé pour diviser les parties :

« Diviser là où l'animation sera effectuée » et « Commencer par la ligne centrale, du plus grand au plus petit »

Remarque : dans ce tutoriel, je vais terminer les parties du corps en premier, puis travailler sur les traits du visage plus tard pour éviter toute confusion.

Commencez par la tête (visage + arrière de la tête) et le corps

Facultatif :

J'ai divisé la tête en 2 parties : le visage et l'arrière de la tête

Cela donnera un aspect plus naturel à l'animation de rotation de la tête.

Divisez les détails suivants autour de la ligne centrale, énumérez-les dans l'ordre d'apparition

vous pouvez voir que certaines parties sont symétriques et d'autres sont asymétriques

Il existe également des parties qui ont une version miroir sur le côté opposé, comme la frange latérale ou les queues jumelles.

Vous pouvez dessiner ces parties une fois, puis les copier et les retourner pour créer un autre côté.

Une fois la liste des pièces terminée, Créez un nouveau dossier pour chaque pièce

Dans ce tutoriel, j'ai défini l'étiquette de couleur par type pour montrer le processus de travail,

vous pouvez la définir de la manière qui vous convient le mieux

Remarque : j'utilise le « - » dans le nom du dossier pour identifier le groupe de pièces. (ex : « hair-twintail-L »)

Étape 3 : Dessin des pièces # Corps

Configurer l'espace de travail

Je copie le croquis avec la couleur pour l'utiliser comme référence de couleur.

Vous pouvez également utiliser le panneau [Vue secondaire] pour cela

Modifiez la couleur du calque d'esquisse dans le panneau [Propriétés du calque]

Il est maintenant temps de passer à la règle symétrique !!

 

Sélectionnez le calque de papier,

Allez dans [Règle] et choisissez la [Règle symétrique]

Définissez les options :

[Nombre de lignes] : 2,

[Symétrie des lignes] : coché,

[Angle d'accrochage] : 90,

 

Dessinez la règle sur le canevas, la règle s'accrochera à 90 degrés

Afficher dans tous les calques :

Clic droit sur l'icône de la règle et [Afficher dans tous les calques]

Sélectionnez la règle avec l'outil [Objet] et alignez-la au centre de la toile

 

vous pouvez définir l'option [Centre X] dans le panneau [Propriétés de l'outil] sur la moitié de la largeur de la toile

Ou l'aligner avec le panneau Aligner/Distribuer (Clipstudio 2.0+)

Ajustez une partie pour l'aligner sur la ligne de la règle avec la transformation du maillage :

[Edition > Transformation > Transformation du maillage]

la toile est prête, il est temps de commencer à dessiner !!

Dessin des pièces #1 : Pièces symétriques

Commençons par la partie visage.

Créez un nouveau calque vectoriel pour le dessin au trait

Ceci est facultatif, vous pouvez également utiliser le calque raster pour le dessin au trait, mais le calque vectoriel sera plus facile à éditer/changer dans le processus ultérieur

Assurez-vous que l'option [Aligner sur la règle spéciale] est activée.

Lorsque vous dessinez sur la toile, elle se trouve des deux côtés de la ligne de la règle

Remarque : si le pinceau/la gomme ne fonctionne pas avec la règle, cochez la case [Activer l'accrochage]

dans le panneau [Détails de l'outil secondaire], onglet [Correction]

Pour remplir la couleur :

Créez un nouveau calque vectoriel et dessinez des lignes pour fermer la zone

Pour la partie du visage, je dessine une ligne de cheveux

Créer une nouvelle couche raster

Remplir la couleur avec [Remplir] > [Référence à d'autres calques]

Dans le panneau [Propriétés de l'outil], définissez l'option [Référence multiple] sur [dossier]

Et activez l'option [Remplir jusqu'au chemin vectoriel]

Supprimez le calque vectoriel pour la ligne des cheveux

puis verrouillez le pixel transparent et l'ombrage sur la pièce

la première partie est terminée !

Facultatif : je change le mode de calque du dossier sur [Lumière douce] afin de pouvoir voir le calque d'esquisse pour travailler sur une autre partie.

Dessin des pièces#2 : Pièces asymétriques

Pour les parties asymétriques,

désactivez l'option [Aligner sur une règle spéciale] et dessinez la partie

Dessin des pièces#3 : Pièces miroir

La frange de cheveux gauche peut être retournée et former la frange de cheveux droite

Une fois que vous avez fini de dessiner une partie, sélectionnez le dossier de la partie.

Ensuite, créez une sélection rectangulaire, couvrez la partie et la largeur de la zone de dessin

Cliquez sur l'icône [Copier et coller] dans le menu flottant pour copier le dossier de pièces

Dans le menu flottant, cliquez sur [Échelle/Rotation]

et dans le panneau [Propriétés de l'outil], cliquez sur l'icône [Retourner horizontalement]

Renommer le dossier et ajouter des détails personnalisés

[Conseils sur la règle symétrique]

Vous aurez peut-être besoin d'une autre règle spéciale pour dessiner certaines parties,

et une fois terminé, la règle symétrique ne fonctionne plus

Cela s'est produit parce que une seule règle spéciale peut être accrochée en même temps

donc, lorsque vous créez une nouvelle règle spéciale, l'ancienne sera désactivée

 

Pour l'activer, sélectionnez la règle avec l'outil [Objet] et cliquez sur l'icône d'accrochage sur la règle

Lorsque toutes les parties sont terminées, sélectionnez toutes les parties et remettez le [Mode de calque] sur [Normal]

Vous pouvez remarquer le bord dur de certaines parties.

Pour résoudre ce problème, créez un masque avec l'icône [Masque] sur le panneau [Calque].

puis peignez la transparence avec l'[aérographe doux]

Étape 4 : Dessin des pièces # Face

Contrairement au corps qui doit être divisé en parties par la coiffure et le costume,

il existe une structure de base qui est toujours la même

vous pouvez également ajouter des éléments supplémentaires (comme une langue ou une couche pupillaire séparée),

mais assurez-vous qu'ils sont dans le bon ordre de calque

Déplacez le calque d'esquisse vers le haut et créez des dossiers pour les parties du visage

Créez une sélection [Rectangle] couvrant uniquement la moitié du visage, puis masquez-la sur le croquis.

Cela sera moins déroutant lors du dessin du visage avec la règle symétrique

Lorsque vous dessinez les pièces, vous pouvez également voir le résultat sur les pièces finies

Conseils :

Pour les utilisateurs de Clip Studio 3.0,

vous pouvez sélectionner plusieurs points sur la transformation du maillage pour les ajuster des deux côtés ensemble

 

Remarque : vous devez également sélectionner le point en position miroir

[Problème de découpage]

La plupart des logiciels d'animation pour l'animation d'avatars disposent de la fonction masque de découpage.

Cependant, son utilisation est parfois plus compliquée, selon le logiciel

 

Vous devrez peut-être rechercher la méthode la plus adaptée à votre logiciel d'animation

Pour dessiner la bouche, je dessine la ligne de la bouche et l'intérieur de la bouche

Je copie la ligne de la bouche et la mets dans le dossier pour les lèvres inférieures,

puis je peins la peau pour couvrir la zone intérieure de la bouche

Lorsque le visage est terminé, déplacez les dossiers de calque vers le bas jusqu'au dossier de calque du visage

Vous pouvez peindre sur le masque de calque avec la gomme transparente ou douce

pour rendre la frange avant translucide

Habituellement, les yeux gauche et droit sont animés séparément,

Pour séparer les parties de l'œil gauche et de l'œil droit :

Sélectionnez les dossiers de calques, faites une sélection sur un œil

puis cliquez sur le bouton [Couper et coller] dans le menu flottant

Renommez les dossiers et maintenant toutes les parties sont terminées !!

Étape 5 : Nettoyer le fichier

Lorsque votre avatar est prêt, vous pouvez l'exporter vers un autre logiciel d'animation ou l'animer dans Clip Studio Paint. Certains logiciels peuvent vous demander de fusionner les calques de chaque partie avant l'exportation, cela sera inconfortable si vous souhaitez modifier la partie ultérieurement

 

 

(Remarque : j'utilise Spine 2D pour le processus d'animation. Le résultat peut être différent dans d'autres logiciels)

 

La fonction [File Object] de Clip Studio peut vous aider à garder la partie modifiable (dans des fichiers séparés) et vous n'avez pas besoin de fusionner les calques à chaque fois lors du processus d'exportation !!

Préparons le fichier.

 

Tout d'abord, supprimez tout sauf les dossiers de pièces du fichier

(Ex : calque papier, calque d'esquisse, référence, etc.)

Convertir le dossier de calques en objet fichier :

Clic droit sur le dossier de calques > [Objet fichier > Convertir le calque en objet fichier]

Définissez la zone sur [Zone de dessin] et enregistrez le fichier

 

La pièce est maintenant enregistrée dans un fichier externe

Astuces : placer le menu d'exportation sur le panneau [accès rapide] vous fera gagner du temps lors de la conversion

Convertissez tous les dossiers en fichiers.

Le nom du fichier sera le nom du dossier par défaut

Remarque : si le logiciel d'animation nécessite le format .psd (document Photoshop), vous pouvez simplement enregistrer avec le menu [Enregistrer sous..]

(Si vous devez modifier quelque chose, vous ne pourrez pas le modifier à partir du fichier .psd avec Clip Studio. Modifiez-le simplement dans le fichier .csp, puis exportez-le à nouveau au format psd)

Pour éditer la pièce, sélectionnez-la avec l'outil [Objet]

Ensuite, dans le panneau [Propriétés de l'outil], cliquez sur [Ouvrir le fichier]

Lorsque vous enregistrez le fichier de la partie, il sera automatiquement mis à jour dans le fichier principal

 

Votre avatar est maintenant prêt à être animé

Il a une structure de fichier propre avec un nom clair !!

L'art de la division des pièces est généralement animé avec la méthode de rigging (squelette) pour le modèle interactif du jeu ou de l'avatar en streaming

Si vous n’avez pas besoin du modèle dynamique,

Vous pouvez simplement créer l’animation dans Clip Studio Paint et l’exporter également sous forme d’animation vidéo ou gif !!

Partie 2 : Animer l'avatar dans Clip studio paint

Vous pouvez utiliser l'image clé [Layer keyframe] pour créer votre animation d'avatar.

L'expression du visage est plus facile à animer avec l'animation image par image.

Placez les parties caractéristiques du visage dans un dossier de calques

Sélectionnez tous les calques à l'exception du dossier d'expression du visage et cliquez sur l'icône [Échelle/Rotation]

Dans le panneau [Propriétés de l'outil], définissez le mode sur [Inclinaison],

puis déplacez le point de contrôle situé en haut et revenez à sa position.

Ouvrez le panneau de la chronologie ([Fenêtre > chronologie])

 

Créez une nouvelle chronologie avec Fréquence d'images : 8 et Durée de lecture : 24

(Cette quantité d'images est compatible avec la version Clipstudio Paint Pro)

Sélectionnez tous les calques cette fois-ci et activez l'image clé du calque dans le panneau [Chronologie]

L'onglet rouge affiche l'image active actuelle.

Au niveau de la première image, cliquez sur le bouton [Ajouter une image clé]

Remarque : la couleur de l'icône d'image clé dépend du type d'interpolation

vous pouvez utiliser linéaire pour une vitesse de mouvement constante, lisse pour une vitesse exponentielle

et maintenez enfoncé pour fixer la position de l'objet sur l'image

Lorsque vous sélectionnez la pièce avec l'outil [Objet]

 

dans le panneau de propriétés de l'outil], vous verrez que l'option [Transformer] apparaît sur la position des coins. Cela vient de l'inclinaison de toutes les pièces de l'étape précédente

Avec le coin réglable, la pièce peut être plus librement réglable

Concevez l'animation avant le réglage.

Dans ce tutoriel, je vais réaliser une pose de clin d'œil, en animation en boucle

Lors de la mise en correspondance de l'animation avec la période,

la publication doit être définie uniquement pour le début et pour la position du clin d'œil

Ajustez la pose de départ à l'image 1

Remarque : je commence par le corps, puis je déplace les autres parties plus tard

Ajoutez les images clés de fin pour tous les objets

Sélectionnez tous les calques, cliquez sur la dernière image et ajoutez l'image clé pour créer la boucle

Arrêtez l'animation

Créez une image clé pour tous les calques à l'image 7, puis définissez la pose pour l'image d'arrêt

Une fois la pose terminée, copiez les images clés pour arrêter l'animation suivante

cliquez et faites glisser pour sélectionner plusieurs fois toutes les images clés,

puis faites un clic droit sur l'image clé et copiez

Sélectionnez tous les calques, allez à l'image 13 et collez

Presque fini

Décalez les dernières images clés sur l'image 19,

et maintenant le mouvement du personnage est le même que celui de la conception

Animation physique

Rendons le mouvement plus vivant en ajoutant un peu de physique d'animation !

Pour l'instant, le tissu et les cheveux bougent tous ensemble avec le mouvement du personnage…

 

mais en réalité, il y a un effet d'inertie qui fera que les objets attachés s'arrêteront de bouger plus lentement. Ajouter cet effet à l'animation lui donnera un aspect plus naturel.

Ajoutez plus d'effet de mouvement à l'image qui marque la fin du mouvement

Il y a du mouvement sur les images 1 à 7, ajoutez plus d'effet de mouvement sur l'image 7

Il y a un autre mouvement sur les images 13 à 19

ajoutez également l'effet de mouvement supplémentaire sur l'image 19

Les images clés de l'image 19 étaient auparavant les mêmes que celles de l'image 1, et l'animation est en boucle.

Puisqu'il y a un ajustement à l'image 19, l'animation ne sera plus en boucle.

 

Pour résoudre ce problème, copiez toutes les images clés de l'image 1 et collez-les sur la dernière image clé

 

 

Ce réglage fait que les cheveux continuent de bouger sur l'image où le personnage ne bouge pas

[Espace de boucle]

L'animation comporte un petit espace de pause entre la boucle car la dernière image clé se trouve à la fin de l'image 23

Pour la supprimer, vous devez décaler l'image clé à la fin de l'image 24.

 

Voici comment la décaler facilement

[bouncing]

L'ajout d'un effet de rebond à l'animation donne un aspect plus naturel.

 

Insérez une image clé avec l'objet se déplaçant/pivotant dans la direction opposée,

entre les images clés de l'effet d'inertie.

Conseils : si vous avez trop ajusté la position du mouvement et que l'animation semble scintiller,

vous pouvez élargir l'écart entre les images clés au lieu de réajuster les objets

Expressions du visage

Il est plus facile d'ajouter l'expression du visage avec le dossier [Animation]

 

Sélectionnez tous les calques et désactivez la [Image clé du calque], les parties seront à leur position initiale

Dans le dossier d'expression du visage, fusionnez toutes les parties de l'œil gauche et droit (sauf l'iris/la pupille),

et pixellisez les calques de la bouche

Placez les parties du visage modifiées dans un dossier

Copiez le dossier et dessinez ou ajustez à nouveau les pièces avec [Transformation de maillage]

J'ai créé 3 émotions de visage

Créez un nouveau [dossier d'animation] dans le dossier d'expression du visage

puis déplacez tous les dossiers d'émotions du visage à l'intérieur

Sélectionnez tous les calques et réactivez l'image clé du calque, les images clés reviendront

Développez le dossier de calque expression du visage, il affichera le dossier d'animation

Développez l'option pour le dossier avec l'icône [+], vous verrez la chronologie de [cel]

Faites un clic droit et sélectionnez le visage à attribuer à l’image clé.

Et c’est fait !!

J'espère que mon processus de travail et mes techniques d'animation vous seront utiles pour votre projet !!

Amusez-vous bien à animer et à bientôt pour le prochain tutoriel !!