avatar

От препродакшена к производству арта в молодой игровой студии

опубликовал в Арт
От препродакшена к производству арта в молодой игровой студии
На примере игры "Привидения"

Кто автор этой статьи
Моё портфолио и краткая биография здесь:
www.TarXor.ru

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

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

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

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

Распределение обязанностей в команде
(кто и как влияет на графику)

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

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

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

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

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

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

Арт-директор
Решает организационные вопросы в арт-отделе. Занимается поиском новых художников, проводит собеседования. Общается со всеми участниками разработки, обсуждает с ними предстоящие задачи арт-отдела. Формирует конкретные задания, распределяет их между художниками, следит за их выполнением, за сроками, за общей стилистикой и качеством исполнения.

Художник-иллюстратор
Воплощает поставленные задачи в виде графики. Ремесленник, исполнитель. Для небольшой студии в нём ценится умение рисовать в разных стилях и техниках, владение 2D и 3D редакторами, спокойное отношение к правкам и переделкам. Не надо думать, что игровой художник только и делает, что рисует эффектные концепты, клёвые иллюстрации и крутых персонажей. Часто это рутинная работа, конвеерное рисование сотен однотипных объектов одного за другим.

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

Аниматор
Оживляет некоторые игровые объекты. Сложно представить современную игру без анимации.

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

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

Концепция будущей игры

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

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

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

Художнику, арт-директору, геймдизайнерам, продюсеру и сценаристу нужно сначала сформировать общее для всех видение, чтобы художник не рисовал впустую. Для этого требуются конкретные примеры уже существующих игр. Как ориентир взяли графику Dofus. Но с поправкой на нашу тематику. Значит, стиль более строгий, формы ровнее, реалистичней. Да и вообще, пытаться копировать в своей игре стиль из чужой, это не только трудно, но вторично и бессмысленно. Зачем это делать, если арт-отдел может разработать собственный оригинальный стиль. Продюсер, конечно, может думать иначе, но художник врядли.

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

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

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

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

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

Приступаем к рисованию

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

Вот что у меня получилось.

Stadiya Zapusteniya 01
Stadiya Zapusteniya 02
Stadiya Zapusteniya 03

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

Komnata po chastiam

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

Размеры тайла пола.

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

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

Как ни крути, а комната без мебели даёт маловато информации о том, как будут выглядеть интерьеры в игре. Да и отрабатывать стиль хорошо бы на более конкретных объектах.

Вариант шкафчиков а-ля Икея.

Eskiz budushei komnaty

Pervaya popytka
Получилось довольно уныло и суховато. Не хватало мультяшности. Тогда я взял за основу самую простую стойку с полками из Dofus, но нарисовал её на свой манер и с другим наполнением. Без подобных подглядываний не обойтись, если есть затруднения с представлением о результате.

Polka 01
Я рисую каждый объект в растре, обычно в два раза больше размером, чем он будет в игре, так гораздо легче работать с деталями, и при уменьшении исчезают мелкие недочёты. Хотя иногда проще или быстрее рисовать в размере один к одному, а иногда в три раза больше. Всё зависит не только от задач, но даже от графического редактора, в котором происходит работа над данным объектом, ну и от самого художника. Большие размеры имеют ещё одно преимущество — шире возможности использования изображений в рекламных или сюжетных иллюстрациях, баннерах. При уменьшении (и любом другом изменении размера) объектов в программе Photoshop можно обратить внимание на группу настроек в основных настройках программы. Они отвечают за качество картинки при масштабировании. Edit (Редактирование) > Preferences (Настройки) > General (Главные) > Image Interpolation (Интерполяция).

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

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

Levels
Также необходимо учитывать насколько важен или не важен для игрока конкретный объект или их группа. Выделять их можно как цветом, так и необычными (относительно других объектов) формами, другой подачей.

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

Polka 02

Немного про полы

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

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

Trees
Raznoobrazie

Проблема стен

Логично, что стены были нормальной толщины.

Tolschina sten
Но когда появилась основа графического движка игры, выяснилось, что основания стен должны быть размером в тайл пола. Если сделать стены потоньше и расположить, например, посередине тайла пола, то нельзя будет ставить мебель вплотную к стенам, потому что каждый объект должен ставится в свою ячейку тайловой сетки (иначе объекты пересекаются и отображаются неправильно — срезают и перекрывают друг друга там, где не должны). Стены внутри домов обозначались низким межстенком, чтобы не загораживть соседние комнаты.

На этой картинке варианты тайлов стен и межстенка.

Walls Wariants old
Walls and Betwalls
(нажав на картинку, можно увидеть её в натуральную величину)

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

Walls Set
(нажав на картинку, можно увидеть её в натуральную величину)

При взгляде на эту картинку, можно подумать, что для переделки одного только цвета, например, плинтуса (не говоря обо всём остальном), нужно потратить уйму времени. Но возможности программы Photoshop позволяют переделать один вариант оформления в другой за считанные секунды. Дело в том, что абсолютно все слои, из которых состоят тайлы стен и межстенков, являются смартобъектами (smartobjects). В результате, если поменять плинтус в любом тайле, то он автоматически поменяется и во всех остальных. То же касается и обоев на стенах, и других кусочков сборки. Помимо этого у смартобъектов есть ещё одно полезное свойство. Поскольку фотошоп хранит смартобъект в отдельном файле с неизменными размерами, то при многократном масштабировании этого смартобъекта качество картинки не теряется.

Сборки в виде комнат из нарисованных объектов делались постоянно. Чтобы понимать, насколько новый объект соответствует всем остальным, поначалу просто необходимо ставить его внутрь стандартной комнаты, где помимо подобных ему элементов, обязательно есть фигурка человека (в нашем случае это была главная героиня). Человечек помогает адекватней воспринимать масштабы.

Немного о продакшене

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

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

Иногда я создаю 3D модели для ускорения построений.

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

Несколько фэйковых скриншотов, собранных мной для своего портфолио
(при нажатии все картинки доступны для просмотра в масштабе 100%)

Komnata 01
Komnata 02_02
Komnata 04

Самые ранние концепты для "Привидений". Персонаж и элемент интерьера.

Test

Послесловие

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

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

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

1 чёткое разделение обязанностей в команде
2 определение общего настроения художественного стиля
3 поиск скриншотов из уже существующих игр с похожим по настроению стилем
4 определение особенностей движка
5 рисование концептов, набросков
6 рисование примеров 100% готовых объектов
7 создание псевдо-скриншотов будущей игры
8 оптимизация техники рисования, сбор статистики времени.

7 комментариев

avatar
Было интересно прочитать
avatar
Спасибо за статью
avatar
Очень толковая статья и хороший проект. Успехов :)
avatar
Замечательная статья. Обязательна будет полезна. 10 из 5
avatar
А можем рассчитывать на видео-процесс рисования сего чуда?)
avatar
Да там как то особо и нечего показывать, основной принцип здесь есть (показан на абажуре лампы). Остальное руками рисуется и геометрическими формами. И да, в программе IllustStudio в основном, фотошоп не люблю. :)
Если видео появится, сообщу.
Чтобы оставить комментарий необходимо .