Squelettes 2D

Introduction

Lorsque l'on travaille avec la 3D, les déformations du squelette sont courantes pour les personnages et les créatures et la plupart des applications de modélisation 3D les prennent en charge. Pour la 2D, comme cette fonction n'est pas utilisée aussi souvent, il est difficile de trouver des logiciels grand public qui s'y destinent.

Une option consiste à créer des animations dans des logiciels tiers tels que Spine ou Dragonbones. A partir de Godot 3.1, cependant, cette fonctionnalité est prise en charge de manière intégrée.

Pourquoi voudriez-vous faire des animations de squelettes directement dans Godot ? La réponse est qu'elle présente de nombreux avantages :

  • Meilleure intégration avec le moteur, donc moins de problèmes d'importation et d'édition depuis un outil externe.
  • Possibilité de contrôler les systèmes de particules, les shaders, les sons, les scripts d'appel, les couleurs, la transparence, etc. dans les animations.
  • Le système de squelette intégré dans Godot est très efficace et conçu pour la performance.

Le tutoriel suivant expliquera donc les déformations de squelette en 2D.

Configuration

Voir aussi

Avant de commencer, il est conseillé de passer par le tutoriel Animation d'éléments découpés pour avoir une compréhension générale de l'animation dans Godot.

Pour ce tutoriel, nous utiliserons une seule image pour construire notre personnage. Téléchargez-la à partir de gBot_pieces.png ou enregistrez l'image ci-dessous.

../../_images/gBot_pieces.png

Il est également conseillé de télécharger l'image finale du personnage : download:gBot_complete.png <img/gBot_complete.png> pour avoir une bonne référence pour assembler les différents morceaux.

../../_images/gBot_complete.png

Créer les polygones

Créez une nouvelle scène pour votre modèle (si c'est un personnage animé, vous pouvez utiliser un KinematicBody2D). Pour faciliter l'utilisation, un nœud 2D vide est créé comme racine pour les polygones.

Commencez par un nœud Polygon2D. Il n'est pas nécessaire de le placer quelque part dans la scène pour l'instant, alors créez-le simplement comme ceci :

../../_images/skel2d1.png

Sélectionnez-le et assignez la texture avec les morceaux de personnage que vous avez téléchargés auparavant :

../../_images/skel2d2.png

Il n'est pas conseillé de dessiner un polygone directement. Au lieu de cela, ouvrez la boîte de dialogue "UV" pour le polygone :

../../_images/skel2d3.png

Passez en mode Points, sélectionnez le crayon et dessinez un polygone autour de la pièce désirée :

../../_images/skel2d4.png

Dupliquez le nœud polygone et renommez-le correctement. Ensuite, entrez à nouveau dans la boîte de dialogue "UV" et remplacez l'ancien polygone par un autre dans la nouvelle pièce désirée.

Lorsque vous dupliquez des nœuds et que la pièce suivante a une forme similaire, vous pouvez modifier le polygone précédent au lieu d'en dessiner un nouveau.

Après avoir déplacé le polygone, n'oubliez pas de mettre à jour les UV en sélectionnant Édition -> "Polygone -> UV" dans l'éditeur d'UV du Polygon2D.

../../_images/skel2d5.png

Continuez à faire ça jusqu'à ce que toutes les pièces soient cartographiées.

../../_images/skel2d6.png

Vous remarquerez que les pièces pour les nœuds apparaissent dans la même disposition que dans la texture originale. C'est parce que par défaut, quand vous dessinez un polygone, les UV et les points sont les mêmes.

Réorganisez les pièces et construisez le personnage. Ça devrait être assez rapide. Il n'est pas nécessaire de changer les pivots, donc ne vous embêtez pas à vous assurer que les pivots de rotation de chaque pièce sont corrects ; vous pouvez les laisser tels quels pour le moment.

../../_images/skel2d7.png

Ah, l'ordre visuel des pièces n'est pas encore correct, car certaines couvrent de mauvaises pièces. Réorganisez l'ordre des nœuds pour régler ce problème :

../../_images/skel2d8.png

Et voilà ! Définitivement, c’était beaucoup plus facile que le tutoriel de cutout.

Créer le squelette

Créez un nœud Skeleton2D en tant qu'enfant du nœud racine. Ce sera la base de notre squelette :

../../_images/skel2d9.png

Créez un nœud Bone2D en tant qu'enfant du squelette. Mettez-le sur la hanche (habituellement les squelettes commencent ici). L'os pointera vers la droite, mais vous pouvez l'ignorer pour l'instant.

../../_images/skel2d10.png

Continuez à créer des os dans la hiérarchie et à les nommer en conséquence.

../../_images/skel2d11.png

A la fin de cette chaîne, il y aura un nœud jaw (mâchoire). Il est, encore une fois, très court et pointe vers la droite. C'est normal pour des os sans enfants. La longueur des os de pointe peut être modifiée avec une propriété dans l'inspecteur :

../../_images/skel2d12.png

Dans ce cas, nous n'avons pas besoin de faire tourner l'os (par coïncidence, la mâchoire pointe en plein dans le sprite), mais au cas où vous en auriez besoin, n'hésitez pas à le faire. Encore une fois, cela n'est vraiment nécessaire que pour les os d'extrémité car les nœuds chez les enfants n'ont généralement pas besoin d'une longueur ou d'une rotation spécifique.

Continuez et construisez le squelette entier :

../../_images/skel2d13.png

Vous remarquerez que tous les os soulèvent un avertissement ennuyeux au sujet d'une pose de repos manquante. Cela signifie qu'il est temps d'en mettre une. Allez au nœud squelette et créez une pose de repos. Cette pose est celle par défaut, vous pouvez y revenir quand vous voulez (ce qui est très pratique pour l'animation) :

../../_images/skel2d14.png

Les avertissements vont disparaître. Si vous modifiez le squelette (ajout/suppression d'os), vous devrez à nouveau définir la pose de repos.

Déformer les polygones

Sélectionnez les polygones précédemment créés et affectez le nœud du squelette à leur propriété Skeleton. Cela garantira qu'ils peuvent effectivement être déformés par lui.

../../_images/skel2d15.png

Cliquez sur la propriété mise en surbrillance ci-dessus et sélectionnez le nœud squelette :

../../_images/skel2d16.png

Encore une fois, ouvrez l'éditeur UV pour le polygone et allez à la section Bones.

../../_images/skel2d17.png

Vous ne pourrez pas encore peindre les poids. Pour cela, vous devez synchroniser la liste des os du squelette avec le polygone. Cette étape n'est effectuée qu'une seule fois et manuellement (sauf si vous modifiez le squelette en ajoutant / supprimant / renommant des os). Il garantit que vos informations de rigging sont conservées dans le polygone, même si un nœud de squelette est accidentellement perdu ou si le squelette est modifié. Cliquez sur le bouton "Sync Bones to Polygon" pour synchroniser la liste.

../../_images/skel2d18.png

La liste des os apparaîtra automatiquement. Par défaut, votre polygone n'a pas de poids attribué à l'un d'entre eux. Sélectionnez les os auxquels vous voulez attribuer un poids et peignez-les :

../../_images/skel2d19.png

Les points en blanc ont un poids complet attribué, tandis que les points en noir ne sont pas influencés par l'os. Si le même point est peint en blanc pour plusieurs os, l'influence sera répartie entre eux (il n'est donc généralement pas nécessaire d'utiliser des nuances entre les deux, à moins que vous ne vouliez polir l'effet de flexion).

../../_images/skel2d20.gif

Après avoir peint les poids, l'animation des os (PAS les polygones !) aura l'effet désiré de modifier et de courber les polygones en conséquence. Comme il suffit d'animer les os dans cette approche, le travail devient beaucoup plus facile !

Mais tout n'est pas rose. Essayer d'animer les os qui courbent le polygone donnera souvent des résultats inattendus :

../../_images/skel2d21.gif

Cela se produit parce que Godot génère des triangles internes qui relient les points lors du dessin du polygone. Ils ne se plient pas toujours comme on pourrait s'y attendre. Pour résoudre ce problème, vous devez définir des indices dans la géométrie afin de clarifier la façon dont vous vous attendez à ce qu'elle se déforme.

Sommets internes

Ouvrez à nouveau le menu UV pour chaque os et allez dans la section Points. Ajoutez quelques sommets internes dans les régions où vous pensez que la géométrie va se plier :

../../_images/skel2d22.png

Maintenant, allez dans la section Polygon et redessinez vos propres polygones avec plus de détails. Imaginez que, lorsque vos polygones se plient, vous devez vous assurer qu'ils se déforment le moins possible, alors expérimentez un peu pour trouver la bonne configuration.

../../_images/skel2d23.png

Une fois que vous aurez commencé à dessiner, le polygone original disparaîtra et vous serez libre de créer le vôtre :

../../_images/skel2d24.png

Cette quantité de détails est généralement correcte, bien que vous souhaitiez peut-être avoir un contrôle plus fin sur l'emplacement des triangles. Expérimentez par vous-même jusqu'à obtenir les résultats que vous aimez.

Note : N'oubliez pas que vos sommets internes nouvellement ajoutés ont également besoin d'une peinture de poids ! Allez à nouveau dans la section Bones pour les assigner aux bons os.

Une fois que vous êtes prêt, vous obtiendrez de bien meilleurs résultats :

../../_images/skel2d25.gif