Riot nous livre ses réflexions dans ce Dev. Blog consacré aux animations de personnages. Riot Lamz revient par ailleurs sur certains défis rencontrés, notamment sur les cas de Yasuo et Braum.
Lamz sur Dev Blog : Animer un champion (Source)
Salut à tous ! Je suis Rory « RiotLamz » Alderton et je vais vous expliquer comment nous animons les champions.
Lorsque nous parlons avec les fans sur les forums ou lors des événements, la création des champions est toujours un sujet brûlant, alors je pensais vous expliquer comment nous donnons vie aux champions.
Première chose, comment nous les animons. Il existe deux techniques dans l'industrie de l'animation : à la main et par motion capture. Vous avez sûrement déjà vu ces vidéos d'acteurs en combinaison couverte de boules réfléchissantes. C'est de la motion capture, utilisée dans de nombreux jeux et films pour que les personnages semblent réalistes et naturels. À la main, en revanche, les animateurs dessinent chaque image (ou frame) une par une. Ce procédé manuel est plus long, mais donne à l'animateur un meilleur contrôle sur le résultat. Il est utilisé dans les dessins animés et les films de super-héros pour repousser les mouvements d'un personnage au-delà des limites physiques.
Laquelle de ces techniques utilisons-nous ? L'option B : l'animation à la main. Ce choix a été fait il y a plusieurs années, avant mon arrivée, afin de préserver notre propre style et nous permettre d'offrir des animations fluides qui ne nuisent pas au gameplay. L'animation à la main permet aussi d'utiliser des techniques telles que la déformation des frames intermédiaires ou la compression et étirement des formes, tout en préservant la lisibilité des silhouettes personnages lors de la partie.
Bien. Voyons maintenant quelques exemples.
Défi : l'ultime de Yasuo
Les ultimes font partie des compétences les plus marquantes dans le jeu, en termes de visuels et de gameplay. Que Darius vous assassine grâce à sa Guillotine noxienne ou que Zac vous piétine jusqu'à la mort, les animations doivent être les plus expressives et les plus lisibles possibles. Fort de ce constat, nous avons dû longuement réfléchir à comment faire en sorte que le Dernier soupir de Yasuo donne une impression d'agilité et de puissance en seulement une seconde, sa durée de lancement, soit 30 frames. La fluidité du gameplay nous imposait que l'animation ne dépasse pas cette durée.
Avant que nous ne commencions à travailler sur l'animation, les idées doivent être approuvées afin qu'elles soient aussi claires, marquantes et uniques que possible. L'une de nos premières idées était que Yasuo tranche son ennemi avec un mouvement ascendant pendant la seconde entière, mais ce n'était pas très marquant lors des tests de jeu, car il était en réalité caché derrière les effets visuels de la compétence et ses poses étaient limitées à un espace trop réduit. En réalité, on ne le voyait presque pas.
Ensuite, nous avons essayé de faire en sorte qu'il bondisse et frappe trois fois. Nous avons donc proposé ce concept d'animation et il a été rapidement approuvé. Victoire ! Nous avons ensuite commencé à travailler sur l'animation réelle, avec pour base la conception de trois poses aériennes qui devaient s'enchaîner de manière fluide. Ces trois moments de l'animation seraient ceux qui resteraient visibles le plus longtemps, alors ils étaient cruciaux. Une fois qu'ils ont été achevés, nous avons commencé à animer les poses qui feraient le lien entre eux et représenteraient les extrémités de l'animation de Yasuo. Voici le résultat :
Nous avons ensuite affiné l'animation pour que les poses fixes deviennent un mouvement fluide. À cette étape, l'animation semble presque prête pour son intégration dans le jeu, quand bien même les cheveux et les cordes que porte Yasuo (des éléments connus pour être pénibles à animer) n'ont pas encore été animés. Traditionnellement, ces éléments sont animés manuellement en toute fin de processus, une fois que l'animateur est satisfait de l'animation du reste du corps. Mais cette fois-ci, nous avons inauguré une nouvelle technologie que nous appelons « Jiggle Tech ». Celle-ci nous permet de déclencher l'animation de certains éléments en temps réel selon les mouvements de Yasuo, grâce à une simulation instantanée de la physique dans notre logiciel. Nous pouvons donc vérifier directement le résultat et procéder à des retouches ou changements sans avoir besoin de refaire l'animation des cheveux ou des cordes à chaque fois.
Maintenant que les fondements de l'animation sont en place, il est temps de passer au peaufinage. C'est lors de cette phase que nous ajoutons des frames intermédiaires déformées, qui nous permettent d'étirer le personnage ou les accessoires dans des proportions exagérées le temps d'une seule frame. Cela crée un mouvement furtif flouté qui donne à l'animation un aspect plus saisissant, qui révèle d'ailleurs nos inspirations des dessins animés japonais.
La conception de Braum
Braum possède un énorme bouclier (une vieille porte, d'ailleurs) avec lequel il combat. C'est une super idée de base, mais nous avons dû nous demander comment Braum allait manier cet objet lorsqu'il attaque ou utilise ses compétences. Mais notre plus grand défi était l'implémentation de son E, Incassable. Cette compétence est assez complexe, car Braum peut l'utiliser tout en se déplaçant et en lançant d'autres compétences, ce qui signifie que nous devions mélanger plusieurs animations pour créer un mouvement et un style de combat à 360 degrés. Voici comment nous avons donné vie à la compétence la plus fameuse du personnage.
Nous avons d'abord dû trouver une pose défensive qui pourrait servir de base au déclenchement de tous les autres mouvements de Braum. Après plusieurs essais, notre choix s'est fixé sur une animation stationnaire au cours de laquelle il plante son bouclier au sol avec une seule main, permettant ainsi d'avoir l'un de ses poings à disposition pour animer son attaque depuis son bouclier.
Ensuite, nous devions trouver un moyen de représenter les déplacements de Braum lorsqu'il utilise Incassable, pour qu'il puisse protéger ses alliés et bloquer les attaques ennemies ! Comme nous ne voulions pas que Braum se déplace en tenant son bouclier d'une seule main (cela donnerait l'impression qu'il n'est pas lourd et résistant), nous avons changé la manière dont il l'agrippe ainsi que sa posture afin qu'il utilise ses deux mains lorsqu'il se déplace. Nous avons ensuite dû réfléchir à sa démarche, alors nous avons créé quatre animations séparées : vers l'avant, vers la gauche, vers la droite et vers l'arrière. Nous les avons combinées dans notre système paramétrique, qui les a mélangées pour créer des animations de mouvement à 360 degrés. Pour que le résultat fonctionne, il était vital que les quatre animations aient la même durée, que les membres de Braum se trouvent à la même position et que ses pieds touchent le sol lors des mêmes frames exactement. Voici notre résultat :
Après avoir conçu les animations d'Incassable lorsque Braum est immobile et en mouvement, nous nous sommes tournés vers ses animations d'attaque lorsqu'il utilise son E. Le concepteur du personnage tenait absolument à ce que cet aspect soit présent, car il s'agit d'un élément fondamental de ses compétences. Nous avons commencé par essayer une nouvelle fois d'utiliser notre système paramétrique, mais les animations créées par l'ordinateur étaient beaucoup trop mélangées les unes aux autres, et le résultat était trop mou et sans éclat. Nous avons fini par créer un système qui nécessitait neuf animations d'attaque séparées, couvrant de manière régulière un espace à 360 degrés, et avec un minimum de mélange des animations. Voici ce que cela donnait :
En guise de cerise sur le gâteau, nous avons également utilisé notre technologie de « Jiggle Tech » sur plusieurs des accessoires de Braum, par exemple son collier et la corde autour de son bras. Ces animations secondaires complétaient très bien la principale et donnaient à l'ensemble un aspect plus travaillé.
Enfin, l'une de mes compétences préférées de Braum est son ultime. Il illustre bien comment les différentes méthodes que j'ai expliquées peuvent se compléter pour créer un moment de jeu impressionnant.
C'est tout pour l'instant ! J'espère que cela vous aura bien montré comment nous travaillons sur l'animation des champions chez Riot. Nous faisons en sorte de mettre la barre toujours plus haut, car intégrer de nouvelles technologies et méthodes de travail nous conduit toujours à relever des défis plus intéressants et fascinants, quel que soit le domaine. Je suis absolument convaincu que la technologie encourage l'art et que l'art encourage la technologie.
Merci d'avoir lu !
