Gamedev Artyom Kaleev
10 309

Тайминг: как в играх работает один из ключевых принципов анимации

От скорости зависит всё.

В закладки
Аудио

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

Профессиональный аниматор Дэниел Флойд, автор канала на YouTube New Frame Plus, в своём ролике рассказал про расчёт времени, или тайминг — один из ключевых принципов анимации в видеоиграх. Мы выбрали из видео главное.

Почти все аниматоры — будь то разработчики игр или мультипликаторы — следуют ключевым принципам анимации. Всего их двенадцать, и выдвинули их ещё в прошлом веке художники Disney Олли Джонстон и Фрэнк Томас Хоть и принципы были рассчитаны в основном на мультфильмы, они сохранили актуальность и для компьютерной анимации.

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

Тайминг — это скорость или время, с которым происходит действие.

Дэниел Флойд
New Frame Plus

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

Благодаря правильному использованию расчёта времени можно придать контекст множеству вещей. В пример Флойд привёл самое обычное действие — подъём на ноги (со стула или пола).

Пускай само по себе движение будет занимать около двух секунд. Но что, если аниматор хочет изобразить не обычного человека, а какого-нибудь гиганта? Значит, в таком случае объекту нужно придать вес: тогда подъём будет длиться больше — условно пять или десять секунд.

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

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

Дэниел Флойд
New Frame Plus

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

В анимации нельзя проводить параллель между кадрами (фреймами) и кадровой частотой (фреймрейтом) — это невзаимосвязанные понятия. Фреймрейт — это количество кадров, которые игра может срендерить в секунду, и оно всегда разнится. Фреймы же — просто единица измерения, которой аниматоры пользуются при создании анимаций.

К примеру, анимация этого удара Клауда в Super Smash Bros. при 60 кадрах в секунду длится 48 фреймов.

А анимация случайного жеста руки Геральта во время диалога в «Дикой охоте» — почти 140 фреймов.

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

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

В качестве примера Флойд также приводит анимации в Shadow of the Colossus. Колоссы — большие существа, и соответственно все анимации у них крайне долгие, что подчёркивает размеры существ.

Но, если разбирать Shadow of the Colossus дальше, становится видно, что во всей игре вообще нет никаких резких движений — будь то главный герой, вынимающий меч, или покрывало, которое медленно опускается на пол под дуновениями ветра.

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

Дэниел Флойд
New Frame Plus

То же самое можно сказать и про Red Dead Redemption 2, где долгие движения придают игре реалистичность — что само по себе свойственно эстетике жанра вестерн.

При создании анимаций важно также учитывать и то, как тайминг будет влиять на геймплей. К примеру, в большинстве файтингов все движения происходят крайне быстро — игрок даже не замечает большинство ударов. В Street Fighter один из ударов Рю длится всего 3 фрейма — 1/20 секунды.

Такой быстрый тайминг нужен для того, чтобы все персонажи чувствовались крайне отзывчивыми — чтобы игрок не следил за движениями врага (при такой скорости он просто не сможет), а пытался предсказывать удары.

Напротив, есть такие игры, как Dark Souls — где анимации медленные, а время восстановления после них крайне долгое. Базовый удар мечом занимает 30 фреймов — что в десять раз дольше, чем атака Рю.

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

Есть даже такие игры, как Superhot, где время идёт лишь тогда, когда движется сам игрок. Тайминг — центральная механика геймплея.

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

#разбор #опыт #анимация

{ "author_name": "Artyom Kaleev", "author_type": "editor", "tags": ["\u0440\u0430\u0437\u0431\u043e\u0440","\u043e\u043f\u044b\u0442","\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f"], "comments": 9, "likes": 200, "favorites": 398, "is_advertisement": false, "subsite_label": "gamedev", "id": 52571, "is_wide": false, "is_ugc": false, "date": "Fri, 31 May 2019 21:11:41 +0300" }
Объявление на DTF
DTF
Если вы пропустили: лонгриды за июль 2019, часть 2
Рассказ про эпический мод для «Сталкера», легенда о Мулань, подробная хроника экспедиции Аполлона-13 и другие тексты…
{ "id": 52571, "author_id": 17412, "diff_limit": 1000, "urls": {"diff":"\/comments\/52571\/get","add":"\/comments\/52571\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/52571"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 64954, "last_count_and_date": null }
9 комментариев

Популярные

По порядку

Написать комментарий...
24

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

Но за гифки из Shadow of the Colossus спасибо. Хочется на них вечно смотреть.

Ответить
8

Я бы ещё добавил, что крайне важен композиционный ритм в повествовании. Это относится к сторителлингу вообще любого рода, от кино и игр, до веб-сайтов, инфографиков и рекламных постеров, где есть вступление(Заголовок), кульминация (Call to action) и завершение(второстепенная информация).

По этому принципу устроены все элементы, хотя статья хорошо раскрывает эту суть через призму анимаций.

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

Пример очень хорошей композиции на памяти, я могу привести первым - TLoU. Я кстате всегда говорю, что IMHO на деле игра красива не сюжетом (который на самом деле достаточно предсказуемый и в стиле банальной "Дороги"), а именно постановкой. У игры нету логических и ритмических просадок. Все анимации, интеракции, вступления в бой (при том, что у тебя есть возможность выбора по-стелсу, обходом, диверсионно или рембо-стайл) - видно что отточено, чтобы любой сценарий хорошо укладывался в голове и восприятии. ОЧЕНЬ идеально сделаны тайминги душевных диалогов между делом. Ты не скучаешь даже в пассивных эпизодах. Как только уходит этап боя - плавно вставляется диалог или монолог, которого не много и не мало. К окончанию ты уже вступаешь в следующий этап исследования или решения условной "головоломки". Уровень общей композиции, выстроенной как раз через тайминги (не только анимационные) подобно правильной ритмичной музыкальной композиции гораздо лучше и понятней укладывается в голове.

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

P.S.- эхх, гифки видимо надо локально вставлять :)

Ответить
1

Если убрать из уравнения подсознание и смириться с отвалившимися следом юнгом, фрейдом, кэмпбеллом, архетипами и прочей уличной магией, все станет только внятней. Есть культурно обоснованные пропорции, привычные соразмерности. Ценить их и воспринимать, как "правильные" - вопрос научения, это не прошито в нас изначально. Со временем все эти "золотые сечения" меняются, но в целом следование актуальным канонам безопасно, а отступление от них требует осмысленности. Но это не вопрос прошивки, мы научаемся ценить тот или иной канон.

Ответить
0

Вы правы, если говорить о более высоких этажах.

Но Фрейд и Юнг тут не при чем. Это вещи скорее эволюционные. Осознание ритма и композиции - это исходит глубоко изнутри, из внутреннего понимания систематизации вещей. А это общее для развития каждой культуры. Упорядочивание - признак сознания :)

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

Так же меняется наш стиль жизни. И лет через 10 - мы увидим новые типы и акценты постановки, таймингов и т.д..

Ответить
0

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

Ответить
0

Правильно ли я понял:
1. Тайминг - это время какого-то движения. То же поднятие со стула.
2. Спейсинг - "плавность" (количество кадров в траектории движения, внутри тайминга). Условно: тут медленнее - там ускорился?

Ответить
0

Да. Так и есть.

Ответить
0

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

Ответить
1

То есть количество кадров вставания (кадр от полностью сидя до кадра полностью стоя) - это тайминг, а изменение расстояния рисунка между кадрами (на сколько следующий рисунок сильнее сдвигаем) - спейсинг? Типа "рваная скорость движения" или нет, плавная или импульсами?

Ответить
0

Прямой эфир

{ "remaining": "WzAsMSwyLDMsNCw1LDYsNyw4LDld" } [ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "clmf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fjog" } } }, { "id": 10, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "clmf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-250597-0", "render_to": "inpage_VI-250597-0-1134314964", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=clmf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudo", "p2": "ftjf" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fzvc" } } } ]
Хидео Кодзима оказался алгоритмом
машинного обучения
Подписаться на push-уведомления