King, Witch and Dragon. Devlog #4

Главный герой замоделен, риг готов, пришло время анимировать. Это достаточно большая тема, даже в контексте одного персонажа, по этому я решил разбить её на 3 части. Первый пост посвящён стандартным анимациям персонажа, которые создаются в программе для работы с 3D-графикой и импортируются в игровой движок для дальнейшей настройки.

Вторая часть будет посвящена процедурным анимациям, которые частично или полностью создаются и контролируются с помощью кода непосредственно в игровом движке. В третьем блог-посте отдельно рассмотрим анимации различных атак, а также попробуем собрать всё вместе, чтобы проверить общий флоу.

Подготовка

Как и в случае с созданием рига, у меня не было предыдущего опыта анимации персонажей, по этому я решил потратить вначале немного времени на теоретическую подготовку.

Мой выбор пал на 2 книги, о которых я много слышал от коллег и читал много положительных отзывов в интернете:

King, Witch and Dragon. Devlog #4

Первая книга The Animator's Survival Kit расказывает о фундаментальных основах анимации и её часто ставят на один уровень в Диснеевской The Illusion of Life.

Вторая книга Game Anim от бывшего аниматора Naughty Dog рассказывает об анимациях в контексте современных технологий и игр в частности. Также автор расширяет 12 фундаментальных принципов анимации и добавляет 5 новых пунктов, которые появились, благодаря специфике игровой анимации.

Вооружившись базовыми знаниями, я принялся применять их на практике.

Ключевые анимации персонажа

В платформерах персонаж бóльшую часть времени бегает и прыгает. Иногда он останавливается, чтобы дождаться очередной команды от игрока. Таким образом у нас есть 3 ключевых анимации:

  • айдл (ожидание, стояние на месте)
  • бег
  • прыжок

Эти анимации игрок будет видеть чаще всего, по этому важно, чтобы они были выполнены на достаточном уровне. Они могут быть не супер-зрелищными, но они должны органично вписываться, не рябить в глазах и не раздражать игрока. В противном случае это крайне негативно скажется на игровом опыте.

Айдл

Как сказал Джонатан Купер в своей книге

There's nothing more of a wasted opportunity than lazy bouncing or breathing idle

Jonathan Cooper

что можно перевести примерно как "Нет ничего хуже лениво-подпрыгивающего или дышащего айдла".

Так как же сделать анимацию ожидания менее скучной, более живой и динамичной? Я попробовал разные варианты и наилучшим для меня оказался ветер. Он позволяет создать много второстепенных движений (колышущийся шарф и набедренная повязка, движение волос и перьев), а так как все элементы движутся с разной частотой, это помогает уменьшить эффект зацикленности.

Плюс к этому тяжёлое дыхание даёт контекст о том, что персонаж устал (конечно, нелегко постоянно бегать и прыгать) и вообще у него сейчас не лучший период в жизни.

Бег

Идея была сделать анимацию бега немного болтающейся и расхлябанной, эдакий зомби-бег, чтобы показать контраст между ним и нормальным Принцем, который весь такой сильный, подтянутый и жёсткий. Также, мне кажется, так она будет более выразительной и лучше читаться, когда персонаж будет маленького размера на экране.

Когда я выложил эту gif-ку в сообществе игры ВКонтакте, а также в теме Screeshot Saturday, то получил фидбэк, что рука с мечом неестественно вытягивается при движении вперёд. Изначально идея была таким образом показать вес меча, но видимо я немного перестарался, по этому я подкорректировал анимацию, это будет заметно на более поздних gif-ках.

Так что, если вы тоже хотите принимать участие и давать фидбэк, который будет принят во внимание, вступайте в нашу группу VK.

Прыжок

Для прыжка я сделал 3 зацикленных анимации:

  • движение вверх
  • зависание в врехней точке
  • движение вниз
King, Witch and Dragon. Devlog #4

В движке я создал Animation Blend-Tree и в нём сделал плавный переход между анимациями, в зависимости от вертикальной скорости персонажа:

King, Witch and Dragon. Devlog #4

Аддитивные анимации

Давайте посмотрим, как эти 3 ключевых анимации выглядят в действии...

Вроде бы неплохо, но чего-то не хватает...

Не хватает инерции, которая бы давала ощущение массы тела персонажа. В данном случае мы можем добавить инерцию в трёх местах: разгон, торможение и приземление.

Когда мы начинаем бежать с места, мы сначала подаёмся вперед, наклоняем туловище, чтобы наше тело начало "падать" вперёд и чтобы гравитация помогла нам начать ускорение.

Когда при быстром беге мы резко тормозим ногами, наше туловище продолжает двигаться вперёд и нужно какое-то время, чтобы его остановить и привести в нейтральное положение.

Когда мы прыгаем даже с небольшой высоты, мы амортизируем приземление и сгибаем колени.

Можно было было бы сделать полноценную анимацию под каждый из этих случаев (в некоторых ААА играх так и сделано), но что если у нас, например, несколько анимаций бега? Если делать анимации разгона и торможения для каждой версии бега, то это значительно увеличивает количество необходимых анимаций, а также усложняет наш Animator Controller.

В этом случае на помощь приходят "аддитивные" или добавочные анимации. Суть их в том, что нам не надо анимировать всего персонажа, а только те элементы, которые будут дополнительно двигаться при определённых условиях, например, наклон корпуса при разгоне. После этого мы в движке создаем новый анимационный слой, делаем его аддитивным и проигрываем на нём нашу анимацию.

King, Witch and Dragon. Devlog #4

При этом мы можем её проигрывать при переходе из любого айдла в любой бег. В моём случае получилось так:

Наклон для рывка в начале и небольшой наклон при остановке, плюс шарф отлетающий вперёд, т.к. он более лёгкий.

Аналогичный подход используется для создания аддитивной анимации приземления:

Ещё один плюс аддитивных анимаций в том, что с помощью ползунка в настройках анимационного слоя можно регулировать их интенсивность.

Движение по наклонным поверхностям

В зависимости от того, какую игру вы делаете, вам может понадобиться реализовать движение по наклонным поверхностям. Например, в Celeste все повержности строго горизонтальные или вертикальные, в Iconoclasts есть склоны под углом 45 градусов, а в Ori and the Will of the Wisps очень много органических и скругленных поверхностей. Я решил реализовать вариант с движением по произвольным поверхностям, которые могут быть наклонены под любым углом и могут менять наклон в реальном времени (близко к тому что сделано в Ori).

Для достижения такого результата используется несколько техник. Для начала я решил проверить как скелет персонажа "дружит" с инверсивной кинематикой (inverse kinematics или просто IK). Я использовал плагин FinalIK и компонент Grounder. Тестовый прогон на качающемся кубе оказался вполне удачным:

На небольших уклонах выглядит приемлимо, но когда угол приближается к 45 градусам (максимальный уклон, по которому может двигаться персонаж не соскальзывая) начинались проблемы:

  • нижняя нога неестественно вытягивалась, стараясь "дотянуться" до поверхности
  • стопы поворачивались под нездоровым углом
  • становилось заметно, что торс всегда в одном положении, нет переноса веса и контр-баланса
  • меч иногда зарывался в землю

Те же проблемы проявлялись и при беге:

Чтобы решить эти проблемы я сделал 2 дополнительные анимации бега: по склону вверх и по склону вниз. Затем, я добавил их в Animation Blend-Tree и начал смешивать их в зависимости от угла наклона поверхности. Вот что получилось:

То же самое я сделал для айдла:

King, Witch and Dragon. Devlog #4

Вот так выглядит двухуровневый Blend-Tree:

King, Witch and Dragon. Devlog #4

Верхний уровень контролирует переход от айдла к бегу в зависимости от горизонтальной скорости персонажа, нижний уровень выбирает одну из трёх анимаций, в зависимости от наклона поверхности.

И со всеми этими шестью анимациями отлично работают уже созданные аддитивные анимации разгона, торможения и приземления.

Бонус: Двойной прыжок

Способности персонажа подразумевают процедурные анимации, о которых я расскажу в следующем девлоге, но есть одна способность, которая не требует процедурной анимации и это двойной прыжок.

Напомню, что персонаж может осуществлять двойной прыжок с помощью крыльев летучей мыши:

King, Witch and Dragon. Devlog #4

Вот так выглядит анимация крыльев, замедленная в 2 раза:

А вот так она выглядит в игре, совмещённая с анимацией прыжка:

Что дальше?

В следущем девлоге я расскажу о процедурных анимациях способностей главного героя:

  • Движение по стенам и потолку с помощью паучьих лап, которые будут процедурно ставиться на поверхность с помощью инверсивной кинематики.
  • Использование щупалца в качестве крюка-кошки: процедурная генерация меша + анимация.
  • Анимация хвоста змеи, при движении в изогнутых тоннелях во время способности "рывок".

Интересно? Тогда подписывайтесь на меня в Instagram и Twitter, а также вступайте в группу VK, в которой я публикую апдейты и материалы по проекту, до того как они попадают сюда.

Спасибо за внимание!

294294
43 комментария

Несколько апдейтов вижу, что правая рука с мечом всё так же анимирована не оч, как будто парализовало руку. Двигается только в двух плоскостях, да ещё и почти равномерно как поршень у паровоза. 

18
Ответить

Спасибо за фидбэк! Я периодически по всем анимациям прохожусь, стараюсь смотреть свежим взглядом и дотюнивать потихоньку. Надеюсь, к следующим апдейтам станет получше.

6
Ответить

С таким мечом я бы отказался бегать. Побоялся бы "споткнуться" им об землю. Саблю лучше.

4
Ответить

Клинок похож на Ромфею, единственное, что их обычно держат двумя руками. У него как и техника боя другая, так и принцип действия. Она клинком захватывает цель (те же сабли скользят по цели, прорезая её), и если цель нестатична, ромфея может наносить ей довольно сильные повреждения.
Проблема как раз таки в том, что для того, чтобы ромфея нанесла более серьёзный урон, чем обычный прямой меч, надо наносить удары довольно специфичным образом, мягко говоря неудобным, поэтому это оружие забылось нахрен.

Ромфея являлась традиционным холодным оружием и важной составной частью экипировки фракийских тяжёлых пехотинцев, однако, возможно, она использовалась и всадниками.Если верить античным источникам, ромфею использовали вместе со щитом наподобие копья, хотя это было неудобно и малофункционально[5]. В нападении она применялась как двуручный меч[4].

9
Ответить

После прыжка лично я ожидаю, что персонаж присядет сильнее. А так получается, что он прыгнуо выше своей головы, но приземлился, будто всего лишь на 20 см подпрыгнул. А если ещё сделать переход между приземлением и бегом, то вообще будет шик.

Удачи и успеха вам) Буду ждать следующей статьи.

4
Ответить

Не могу с вами не согласиться :)

6
Ответить

и ещё заметил, что прыжок начинается с обычной стойки, хотя во время прыжка нужно присесть для начала

2
Ответить