реклама
разместить

Как делать энергичную анимацию. Советы и техники от аниматора Skullgirls

Как создать приятную и энергичную анимацию? Как геймплей влияет на движения персонажей? Изучаем опыт ведущего аниматора Skullgirls - Мариэль Картрай.

Skullgirls – 2D файтинг, в котором каждый кадр анимации нарисован вручную.
Skullgirls – 2D файтинг, в котором каждый кадр анимации нарисован вручную.

Основные принципы и техники

Настольная книга аниматоров прошлого и современности – «Иллюзия жизни: анимация Диснея», выпущенная в 1981 году. Мультипликаторы студии Дисней Томас Фрэнк и Олли Джонстон изложили в ней 12 базовых принципов анимации, которые актуальны до сих пор. Мариэль делает акцент на некоторых из них.

Силуэт - всему голова

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

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

Хотя персонажи Skullgirls дерутся немного непривычными способами, по силуэту легко определить, что они делают.
Хотя персонажи Skullgirls дерутся немного непривычными способами, по силуэту легко определить, что они делают.

Упреждение

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

Упреждение привлекает внимание зрителя к следующему движению персонажа. Этот прием создает контраст между статичной и атакующей позой, позволяет почувствовать вес и силу и удара.

Змей перед укусом раскрывает пасть. Всего один кадр упреждения улучшает читаемость движения. 

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

Акцент на ключевых кадрах

Ключевые кадры или ключи показывают положение персонажа в начале и в конце действия. Они служат важным ориентиром в работе.

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

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

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

Сквозное движение

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

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

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

Сквозное движение в некоторых ситуациях позволяет использовать меньше кадров для анимации действия. Аниматор может пропустить упреждение и сразу перейти к ключевому кадру. Сквозное движение дает понять зрителю о направлении движения.

Мазок и размытие

Эти приемы используются, чтобы показать быстроту и скорость. Они позаимствованы на заре анимации из комиксов и используются в 2D анимации до сих пор.

Рисунок с размытием занимает мало кадров, но в то же время содержит много информации для зрителя. Удачный мазок на рисунке позволяет определить характер выполняемого действия и позу персонажа в начале и в конце удара.

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

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

На стоп-кадре этот момент выглядит забавно, а в движении — очень динамично.
На стоп-кадре этот момент выглядит забавно, а в движении — очень динамично.

Проскок

Эту технику аниматоры используют, чтобы показать резкое и энергичное действие с короткой амплитудой движения. Движущаяся часть тела «проскакивает» ключевую позу, а затем возвращается в нее, слегка напоминая маятник. Проскок можно сочетать с размытием и сквозным движением.

На примере проскок комбинирован с размытием.

А вот проскок в анимации удара бойца из Street Fighter 3.

Тут проскок дополнен сквозным движением рукава.

Аниматоры файтингов охотно используют этот прием, потому что он позволяет придать атаке визуальную силу. Анимация проскока при попадании слегка «залезает» на персонажа противника. Это усиливает ощущение воздействия, а у игрока не остается сомнений, что оппонент получил по заслугам.

Искажение анатомии

Задача аниматора – передать эффект движения. Нет нужды делать каждый кадр отдельным произведением искусства. Не нужно бояться преувеличивать или утрировать, искажать привычную анатомию, если это может улучшить читаемость движения

Мариэль Картрайт

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

Неестественно вывернутые суставы допустимы в промежуточных кадрах, если они работают на читаемость движения.

И еще пример.

Эти позы физически невозможны, но они отлично передают динамику движения.
Эти позы физически невозможны, но они отлично передают динамику движения.

Тайминг и спейсинг - что за звери и почему они важны

Даже идеально отрисованные кадры не сделают анимацию живой и привлекательной без правильной настройки длительности тайминга и спейсинга.

В среде аниматоров под таймингом понимают расчет движения объекта во времени и пространстве. Иными словами – сколько времени будет длиться то или иное движение персонажа, например удар или прыжок.

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

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

Скорость и реалистичность перехода от одной ключевой позы к другой зависит от настройки спейсинга

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

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

Больше времени для ключей!

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

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

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

Хитстоп для весомости ударов

Вы не сделаете чертовски хорошую игру без хитстопа

Майк Займонт

Наблюдательный игрок в файтинги мог заметить, что персонаж игрока и его противник, получив повреждение, застывают на месте на доли секунды. Этот прием называется хитстоп и используется в большинстве 2D файтингов, чтобы сделать удары ощутимыми.

Длительность хитстопа зависит от силы атаки – чем она мощнее, тем дольше персонажи остаются застывшими.

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

Реакция на команды

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

Персонаж не замирает, как статуя, даже когда игрок не трогает клавиши.

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

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

Проблему с отзывчивостью персонажа пришлось решать разработчикам The Witcher 3. Анимация слева выглядит реалистичнее, но в одном из патчей ее изменили (новая версия справа). Игроки жаловались, что Геральт медленно меняет направление.

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

Чему научились аниматоры, работая над Skullgirls?

Работа над файтингом продолжалась 4 года. За это время разработчики набивали шишки и учились на своих ошибках. Какие советы они дают начинающим и опытным аниматорам?

Тестируйте анимацию с самого начала

Уже на этапе эскиза персонажи Skullgirls получали анимацию ударов и спецприемов и были полностью играбельны. После тестовых боев аниматору передавали заметки и предложения по улучшению анимации. Художники продолжали работу параллельно с настройкой всех параметров. К концу правок персонаж был полностью отрисован и готов к финальным тестам.

Пайплайн разработчиков Skullgirls: грубый набросок, его анимация и тестирование, чистовой лайн, финальная анимация с учетом правок.
Пайплайн разработчиков Skullgirls: грубый набросок, его анимация и тестирование, чистовой лайн, финальная анимация с учетом правок.

Разбивай движение на составные части

Аниматоры Skullgirls выработали собственный подход к анимации движений, позволяющий сохранить энергичность и плавность анимации, обойтись наименьшим числом кадров. Они разделяют каждое движение на 4 части:

· упреждение;

· размытие;

· атакующий ключ;

· возврат.

Атаку персонажа удалось уместить всего в 4 кадра.

Больше – не значит лучше

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

Анимация падения занимает 21 кадр, что очень много для Skullgirls. Движение слишком размеренное и содержит много ненужных деталей.

Фикс от аниматоров (немного на скорую руку).

Финальная версия стала короче на 6 кадров. Персонаж дольше задерживается в ключевых позах, уменьшено число промежуточных кадров. Благодаря этому движение выглядит эффектнее.

И еще пример.

Движение содержит 45 кадров и занимает 12 мегабайт памяти. Оно “тяжелое”, ему не хватает энергичности и скорости.
Когда анимация удара стала короче на 16 кадров, ее вес уменьшился в три раза без ущерба для читаемости движений.

И еще.

Разница всего в один кадр делает удар более резким.

Аниматор, помни!

1. Даже самая крутая анимация не в силах надолго удержать интерес игрока, если у игры скучный геймплей.

2. Анимация должна соответствовать требованиям и ограничениям, накладываемым игрой. Работайте совместно с гейм-дизайнером.

3. Ключевые позы и силуэт – основа читаемых движений. Создавайте анимацию, отталкиваясь от ключей.

4. Каждое движение следует раскладывать на составные части.

Не знаете, что за игра Skullgirls? Мы <a href="https://dtf.ru/games/142149-skullgirls-naskolko-vazhno-nayti-svoyu-auditoriyu" rel="nofollow noreferrer noopener" target="_blank">писали</a> о том, как разрабатывались игра и персонажи, какие принципы исповедовали создатели и что пошло не так на этапе релиза. 
Не знаете, что за игра Skullgirls? Мы писали о том, как разрабатывались игра и персонажи, какие принципы исповедовали создатели и что пошло не так на этапе релиза. 

Автор: Богдан Дудниченко специально для Smirnov School, онлайн-школы, где готовят концепт-художников, левел-артистов и 3D-моделеров для игр и анимации. Для читателей DTF у нас есть специальные скидки.

106106
реклама
разместить
4 комментария

Да, визуальный стиль в Skullgirls был великолепный, конечно. До сих пор обидно, что в игре был ростер, состоящий почти исключительно из анимешных тянок - куда интереснее было бы посмотреть на разные дизайны персонажей в такой стилистике. Где мой сиквел?

1

За канселили вместе с Майком, кек

Мариан занималась анимацией в Indivisible тоже, так что сиквел с точки зрения анимации доступен разве что в таком виде) 

Представлена Silent Hill f — первый трейлер, скриншоты и детали

В игре будут субтитры на русском языке, согласно странице в Steam.

229229
2929
2626
1111
33
22
22
11
😐
реклама
разместить
Для Kingdom Come: Deliverance II вышел крупный патч 1.2 — с улучшенной боёвкой и цирюльником

Также теперь можно бегать пьяным.

Автор скриншота: <a href="https://api.dtf.ru/v2.8/redirect?to=https%3A%2F%2Fsteamcommunity.com%2Fsharedfiles%2Ffiledetails%2F%3Fid%3D3440797390&postId=3635704" rel="nofollow noreferrer noopener" target="_blank">Vais Vargoroth</a>
325325
1515
99
77
55
33
11
Обожаю игры 2020-х, когда полноценными они становятся спустя 2 года после релиза и десяток патчей.
В Steam началась большая весенняя распродажа

Время вновь потратить все деньги на игры.

В Steam началась большая весенняя распродажа
184184
2727
99
77
33
33
22
11
11
11
БЕГОМ ПОКУПАТЬ ИГРЫ КОТОРЫЕ НЕ БУДУТ ЗАПУЩЕНЫ
Ubisoft представила Rainbow Six Siege X — масштабно обновлённую версию своего тактического шутера

Режим «6 на 6», улучшенная графика и звук, а также бесплатный доступ для новых игроков.

Ubisoft представила Rainbow Six Siege X — масштабно обновлённую версию своего тактического шутера
111111
2222
77
11
11
11
А помните радугу образца 2016 года ? эх вот время было 🥲😢
Для RPG-шутера Witchfire от авторов Painkiller вышел масштабный патч — с лабиринтом и испытаниями

Разработчики не собираются добавлять кооператив в игру, несмотря на просьбы, — они сфокусированы на одиночном контенте.

8282
2525
11
Лютейшая годнота становится еще более лютой
Демоверсия ремастера Half-Life 2 на RTX Remix выйдет 18 марта — 30 минут геймплея

Она будет бесплатной для всех владельцев оригинальной игры.

433433
8484
1717
1313
44
33
22
22
11
В игру банально скучно играть в 2025 - эти ртксы, как мёртвому припарка
ZA/UM анонсировала Disco Elysium для Android-смартфонов

На iPhone не выйдет, по крайней мере, сразу.

242242
3939
1010
88
66
44
22
22
11
11
андроид - сила
Брэд Питт мчится на болиде в трейлере фильма «Формула-1» от режиссёра «Топ Ган: Мэверик»

Зарубежный прокат стартует 25 июня.

7070
1919
77
55
11
11
ЕСЛИ ЕСТЬ ФОРМУЛА-1, ДОЛЖНА БЫТЬ И ФОРИШАКА-1
реклама
разместить
«Добро пожаловать обратно»: трейлер и кадры седьмого cезона «Чёрного зеркала»

Продолжение шоу выйдет 10 апреля.

8383
1515
1111
22
11
Не знаю, по-моему сериал скатился, когда производство из Англии перенесли в Америку.
Появился геймплей Ardenfall — RPG в духе Morrowind от разработчиков, «которые устали ждать новую The Elder Scrolls»

Иммерсивная ролевая игра выйдет в Steam в 2025 году — сперва в раннем доступе.

189189
5252
3434
1818
1616
11
Как называется эта стилизация, она отвратительная