Хакатон проводится совместно с
Хакатон-2019
Playgendary
13 826

Персонаж за 4 часа: создать 2D-героя, не забыв про анимацию

Как совместить большие планы и сжатые сроки.

В закладки

Елена Барабанщикова, Art Producer в Playgendary

Поговорим о персонажах — именно с их конкретными образами мы связываем многие проекты, будь то Tomb Raider, The Witcher или Pac-Man.

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

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

Тут главное — узнаваемый считываемый образ и чёткое следование канону.

Автор в Instagram

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

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

Силуэт позволяет считать образ и характер персонажа

Почему наши персонажи именно такие

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

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

Самые доступные инструменты, которые помогут понять востребованность образов, — это Google Trends и Yandex Wordstat. С ними можно не только определить, какой из героев больше на слуху, но и оценить динамику тренда — вовремя заметить, что один из вариантов уже пошёл вниз и начинает забываться.

​Google Trends

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

Обычно пайплайн разработки 2D-контента для мобильных раннеров, платформеров или экшенов не сильно отличается от студии к студии. Коротко расскажу о нашем:

Шаг 1

Геймдизайнер создает документ с подробным визуальным описанием персонажа, а также необходимыми анимациями, суперспособностями, и даже репликами — это очень важно, чтобы получить релевантный образ. Туда же прикладываются референсы, и задача отправляется художнику.

Шаг 2

Создаются первые черновые скетчи — 3-6 максимально разных идей в рамках одной концепции. Скетчи обычно делаются в ч/б линиях или «от пятна», чтобы определиться с примерным силуэтом, образом и ключевыми деталями.

Шаг 3

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

Шаг 4

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

Шаг 5

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

Шаг 6

Все слои именуются в соответствии с содержанием и на английском языке — это облегчает экспорт и поиск какого-либо определённого элемента персонажа.

Шаг 7

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

Шаг 8

Готовый арт храним в .psd и нарезанных спрайтах в формате .png + .json, художники делают экспорт такой послойной нарезки из .psd при помощи скрипта Photoshop To Spine.

Важный момент: для персонажей очень важна «читаемость» — они не должны сливаться с фоном, потому герои всегда проверяются не в вакууме или на дефолтной подложке, а на реальных игровых бэкграундах. И так как мы разрабатываем мобильные игры, то тестируем сразу на устройствах, а не на мониторах, чтобы понимать, как это видит игрок.

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

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

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

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

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

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

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

Такой подход облегчит поиск и доступ к необходимым файлам как самими 2D-художниками, так и аниматорам и программистам.

От арта к анимации

​Пример нарезки персонажа для анимации

Когда арт готов, можно переходить к созданию анимации. Для персонажей Bowmasters мы используем костную анимацию в Spine.

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

А вот уникальные, сочные анимации припасены для фаталити — мы проводили опросы игроков и ничто их так не радует, как сокрушительная победа над соперником. Таким образом игрок не пресыщен перманентным визуальным безумием.

Не канон

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

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

Мы немного «нарушили» правило только по части визуального стиля, а на трудозатратах со стороны аниматоров и кодеров это никак не отразилось. Отбросив условности, можно сказать, что внутри акула — тоже человек!

Планирование

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

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

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

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

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

  • Отрисовка и утверждение скетча для простого персонажа на основе прототипа — 2 часа.
  • Создание и сохранение финальной графики — 4 часа.
  • Работа аниматора (при условии, что у персонажа будет стандартный набор действий, и нужно сделать только дополнительную анимацию для танца) — 2 часа.
  • +20% от полученного времени на разного рода издержки — ожидание фидбека, проблемы с поиском композиции, борьбу с внешними факторами.

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

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

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

Разрабатываем и издаем мобильные игры, в которые играют миллионы людей по всему миру.
{ "author_name": "Playgendary", "author_type": "editor", "tags": ["\u043e\u043f\u044b\u0442","\u0430\u0440\u0442"], "comments": 30, "likes": 53, "favorites": 273, "is_advertisement": false, "subsite_label": "hackathon", "id": 80120, "is_wide": true, "is_ugc": false, "date": "Fri, 08 Nov 2019 13:26:05 +0300", "is_special": false }
Хакатон для игровых
разработчиков
0
30 комментариев
Популярные
По порядку
Написать комментарий...
63
Ответить
21

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

Ответить
13

Мобильный геймдев, это парад копирования и самокопирования

Ответить
3

Да, но у них прямо нагло спизжено очень много. Мне аж плохо стало в один момент

Ответить
2

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

Ответить
1

тут вы правы.

Ответить
2

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

Ответить
1

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

Ответить
0

Что? И много ты игр скачал и играешь только из-за рекламы, даже если не нравится? 

Ответить
0

Спасибо за реф!

Ответить
7

Главное, что соблюдены все каноны. Это не баян, это классика!

Ответить
0

Ору 😂😂

Ответить
12

Ожидал такое 2D)) Я разочарован.

Ответить
0

Удачи это анимироваить
Но да, эта студия халтурщики унылые.

Ответить
5

Я вот не понял одного момента. Вы пишите, что правый персонаж плохой, потому что сливается с фоном. При этом, он все равно есть в игре

Ответить
1

Именно поэтому мы и взяли этого персонажа для примера, он оказался проблемным и своего рода напоминаем для нас)

Ответить
4

Кому-то следует проверить, нет ли здесь какого-нибудь расизма

Ответить
2

Егор, круто

Ответить
2

Круто, за реальные примеры отдельное спасибо, надеюсь только на хакатоне заданий с анимацией не будет >_<

Ответить
1

а почему в фотошопе? 

Ответить
1

Частый вопрос от художников) Причин было несколько, главная — что вектор всегда можно сымитировать, причем без ограничений этого формата. Появились бы риски интеграции в используемый движок + вектор со сглаживаем — это высокая нагрузка на процессор. А еще в новых играх франшизы Masters мы стали делать более интересный арт — тут Photoshop очень пригодился)

Ответить

Комментарий удален

0

У меня тогда еще один вопрос, чисто для понимания)
Почему не делать все в векторном редакторе, после чего готовую работу растерезировать и передавать в тот же фотошоп (или растерезировать прямо в фотошопе), если надо какую то растровую красоту навести?
А если не надо то сразу в спайн.

Ответить
1

Спасибо за материал!

Я ещё никогда не отигрывал роль "чёрного властелина", это мой шанс попробовать!

Ответить
0

4 часа на персонажа
Предположим, что мы хотим игру с героем, тремя типами врагов и боссов, 5*4 = 20, итого половину хакатона мы потратили на создание персонажей)

Ответить
2

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

Ответить
0

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

Ответить
0

пля, стиль персонажей просто отвратителен. ненавижу геометрию в дизайне...

Ответить
{ "jsPath": "/static/build/dtf.ru/specials/DeliveryCheats/js/all.min.js?v=05.02.2020", "cssPath": "/static/build/dtf.ru/specials/DeliveryCheats/styles/all.min.css?v=05.02.2020", "fontsPath": "https://fonts.googleapis.com/css?family=Roboto+Mono:400,700,700i&subset=cyrillic" }
null