Blog Metlivi

Comment animer l’opacité d’une ombre masquée sur une partie déformable d’un personnage

Pour animer une ombre masquée sur une partie déformable d’un personnage, créez une illustration distincte pour l’ombre, faites-la suivre la déformation de la partie et animez son opacité séparément. Le masque définit où l’ombre peut apparaître ; son opacité détermine son intensité.

Ce tutoriel s’adresse aux créateurs de personnages 2D qui disposent déjà d’une partie déformable et souhaitent estomper son ombrage en douceur sans qu’il se déplace ni modifie l’illustration de base. Il utilise le workflow des paramètres de Live2D Cubism, puis explique les commandes équivalentes dans Spine.

29 octobre 2026Lecture : 7 minPar Metlivi Editorial Team
Section 1

1. Séparer l’ombre, le contour et les commandes de mouvement

Avant d’ajouter une animation, repérez trois éléments : l’illustration de base, un calque d’ombre distinct et la déformation qui déplace la partie. Pour cet exemple, appelons-les PartBase, PartShadow et PartWarp. Ces noms sont des suggestions d’organisation, pas des objets intégrés au logiciel.

Sélectionnez l’ArtMesh de l’ombre et examinez les champs Deformer, Clipping ID, Draw Order et Opacity. Cubism les présente comme des propriétés distinctes, ce qui vous permet de vérifier séparément l’attachement, le masquage, l’ordre des calques et la transparence. Placez l’ombre au-dessus de l’illustration de base dans l’ordre de dessin et donnez-lui temporairement une opacité suffisante pour l’inspecter clairement. Live2D : palette Inspecteur

Déterminez ce que doit représenter l’opacité avant de procéder au rigging. Si l’ombre doit toujours s’assombrir à un angle particulier, il peut être approprié de la lier à ce mouvement. Si vous devez l’estomper tout en conservant la même pose, utilisez un paramètre d’ombre indépendant. Les étapes suivantes utilisent cette commande indépendante.

Section 2

2. Faire suivre à l’ombre la déformation de la partie

Placez PartBase et PartShadow sous le déformeur de déformation qui fournit leur mouvement commun. Les déformeurs de déformation de Cubism peuvent déformer plusieurs objets enfants ensemble ; ils sont donc utiles pour maintenir un calque superposé attaché à l’illustration sous-jacente. Créez ou redimensionnez le déformeur afin qu’il couvre l’illustration pendant toute l’amplitude du mouvement prévu. Live2D : déformeur de déformation

Testez la déformation en maintenant l’opacité de l’ombre constante. Passez d’une pose extrême à l’autre et examinez les poses intermédiaires. Observez des éléments reconnaissables : le bord incurvé de l’ombre reste-t-il le long du même contour ? Son extrémité étroite reste-t-elle attachée à la même zone ?

Un parent commun gère la déformation appliquée par ce parent. Cela ne garantit pas que les modifications distinctes des sommets de l’ArtMesh de base ont aussi été reproduites sur l’ombre. Si le calque se déplace, vérifiez comment chaque objet est réellement déformé. Pour le rigging, transférez si possible le mouvement commun vers leur déformeur commun, ou ajustez les formes de l’ombre pour qu’elles suivent la base.

Section 3

3. Masquer l’ombre à l’intérieur de la silhouette de la partie

Sélectionnez PartBase et copiez son ID ArtMesh. Sélectionnez PartShadow et collez cet ID dans le champ Clipping ID de l’ombre. L’ArtMesh de base devient ainsi la source de découpage et l’ombre, l’illustration découpée. Laissez Reverse mask désactivé pour une ombre ordinaire contenue dans la partie. Live2D : masque d’écrêtage, Live2D : palette Inspecteur

Effectuez ce test pratique du contour : faites dépasser légèrement l’illustration de l’ombre de la silhouette de base, puis faites défiler la déformation. Le résultat découpé doit rester dans le contour prévu. Cela permet de distinguer un problème de masquage d’un calque superposé qui s’arrête simplement trop tôt.

Le découpage et la déformation résolvent des problèmes différents. Un contour correct peut masquer l’excédent d’illustration, tandis que la forme interne de l’ombre continue de dériver. Avant de poursuivre, vérifiez à la fois la silhouette extérieure et la position de l’ombre à l’intérieur de celle-ci.

Section 4

4. Créer un paramètre indépendant pour l’opacité de l’ombre

Créez un paramètre standard nommé ShadowOpacity, avec une valeur minimale de 0, une valeur par défaut de 0 et une valeur maximale de 1. Cette plage est un choix de conception donné à titre d’exemple. Les paramètres Cubism disposent de valeurs minimale, par défaut et maximale configurables, et leurs formes clés enregistrées sont interpolées entre les clés. Live2D : à propos des paramètres

Pour un ArtMesh d’ombre sans formes clés de pose existantes, procédez comme suit :

  1. Sélectionnez PartShadow.
  2. Sélectionnez ShadowOpacity dans la palette Parameter.
  3. Utilisez Add 2 Keyforms et confirmez les clés aux valeurs 0 et 1.
  4. À la valeur de paramètre 0, réglez l’opacité de l’ombre à 0 % dans l’Inspecteur.
  5. À la valeur de paramètre 1, réglez son opacité à une valeur maximale indicative de 40 %.
  6. Faites défiler les valeurs entre les clés et vérifiez que seul l’ombrage voulu change.

La procédure documentée de Cubism pour créer des formes clés consiste à sélectionner l’objet, à sélectionner son paramètre, puis à ajouter deux ou trois formes clés. Ici, la propriété modifiée est l’opacité de l’ArtMesh sélectionné. Ne sélectionnez pas l’illustration de base pendant ces modifications. Live2D : ajouter/supprimer des clés aux paramètres, Live2D : palette Inspecteur

Si l’ombre possède déjà plusieurs formes clés de pose, envisagez d’insérer un déformeur dédié au-dessus de l’ombre seulement et d’y affecter le paramètre d’opacité. Cette hiérarchie suggérée permet de dissocier la commande d’estompage des modifications de forme existantes de l’ombre. Les déformeurs de Cubism permettent de régler l’opacité en plus de la déformation. Live2D : déformeur de déformation

Section 5

5. Animer le paramètre au fil du temps

Enregistrez le modèle, chargez-le dans une scène Animation et développez le groupe Live2D Parameters de la piste du modèle. À chaque image souhaitée, saisissez une valeur pour ShadowOpacity. Cubism crée des clés sur la timeline lorsque vous modifiez les valeurs des paramètres, puis la lecture interpole entre ces clés. Live2D : 6. Créer des animations

Pour un test indicatif à 30 images/s, utilisez les valeurs suivantes. Elles décrivent un fondu d’entrée, un bref maintien, puis un fondu de sortie ; ce ne sont pas des durées imposées.

Image Valeur de ShadowOpacity Résultat attendu
0 0 Ombre invisible
12 1 L’ombre atteint son opacité maximale configurée
24 1 L’ombre reste à son maximum
36 0 L’ombre disparaît progressivement

Animez la déformation de la partie sur le même intervalle. Répétez ensuite le fondu en maintenant la partie dans sa pose la plus comprimée. En effectuant ces tests séparément, vous pourrez plus facilement déterminer si un changement indésirable vient de la forme ou du fondu.

Ouvrez l’éditeur de courbes pour examiner la transition du paramètre et en ajuster le timing. Vérifiez également que la piste du modèle et la zone de travail de lecture couvrent tout le test ; le tutoriel d’animation de Cubism explique qu’une piste trop courte peut faire disparaître le modèle entier avant la fin de la scène. Live2D : 6. Créer des animations

Section 6

6. Diagnostiquer les variations d’opacité et les artefacts sur les bords

Avant d’ajouter d’autres clés, suivez cet ordre de diagnostic. Il s’agit d’une séquence pratique fondée sur les commandes distinctes décrites plus haut.

Symptôme Première vérification Étape suivante
L’illustration de base s’estompe aussi Objet sélectionné et enfants du contrôleur d’opacité Limitez le contrôleur à l’ombre
L’ombre dérive pendant la flexion Déformation commune et modifications distinctes du maillage Corrigez le mouvement avant de modifier l’opacité
L’intensité de l’ombre varie entre les clés de pose Opacité enregistrée dans les formes clés existantes Inspectez ces formes pour repérer des valeurs involontaires
L’ombre déborde de la partie Clipping ID et disponibilité du masque Rétablissez la source de découpage prévue

Si les formes clés existantes contiennent des valeurs d’opacité incohérentes, la fonction Multiple Keys Editing de Cubism permet de modifier l’opacité par lots sur une plage sélectionnée. Sélectionnez uniquement les formes qui doivent partager la même valeur, activez Opacity et vérifiez les objets concernés avant d’appliquer la modification. Conservez les différences voulues au lieu d’écraser toutes les formes sans distinction. Live2D : fonction d’édition de plusieurs clés

Pour un liseré pâle, inspectez le bord translucide du masque. Live2D documente une solution de contournement qui consiste à utiliser un duplicata agrandi du masque, dont l’opacité affichée est de 0 %, et à le transformer en même temps que l’original. Vérifiez également la présence des formes clés aux extrémités et des sources de masque masquées si le découpage se désactive de façon inattendue. Vérifiez le rendu exporté dans le moteur prévu, car le comportement des masques peut varier selon l’implémentation. Live2D : masque d’écrêtage

Section 7

7. Reproduire la même séparation dans Spine

Dans Spine, animez l’alpha du slot de l’ombre avec sa propriété Color. La couleur du slot contrôle l’opacité de la pièce jointe et peut être mise en clé ; la couleur distincte de la pièce jointe ne peut pas l’être. Placez l’ombre dans son propre slot pour que le fondu affecte le calque voulu. Guide utilisateur de Spine : slots

Pour définir le contour, créez une pièce jointe de découpage autour de la partie. Placez l’ombre dans sa plage de découpage et définissez explicitement End slot : le découpage s’applique jusqu’à ce slot inclus. Le polygone de découpage peut suivre les os grâce aux poids, et les positions de ses sommets peuvent également être animées. Ce contour doit suivre la déformation indépendamment de l’animation alpha de l’ombre. Guide utilisateur de Spine : pièces jointes de découpage

Si l’ombre doit rester invisible après le fondu, Spine recommande de masquer sa pièce jointe avec une clé d’attachement de slot une fois la transparence atteinte. Un alpha nul peut tout de même entraîner du travail de rendu. Pour une ombre qui réapparaît progressivement, rétablissez la pièce jointe avant le début du fondu d’entrée visible. Guide utilisateur de Spine : slots

Terminez en testant l’ombre à une opacité nulle, partielle et maximale dans la pose neutre, aux deux extrêmes de la déformation et dans les poses intermédiaires. Une configuration fonctionnelle vous permet de modifier l’intensité de l’ombre tout en préservant son placement et son contour pendant le mouvement.

Section 8

Sources

À lire aussi

Continuer sur ce thème