Кухня преображений: редизайн персонажа в Cooking Diary

В прошлом году наш кулинарный тайм-менеджмент Cooking Diary (“Кулинарный дневник”) отметил трехлетие. Он всё время стремительно развивался и пополнялся разнообразными улучшениями и фичами. Мы стараемся, чтобы игра оставалась актуальной и отвечала трендам рынка. В том числе постоянно обновляем нарратив, геймплей и графику.

В этой статье расскажем, как пошагово делался редизайн персонажа Cooking Diary на примере гостя ресторана, Забывчивого посетителя.

Добро пожаловать на нашу творческую кухню!

CD_render_April22_3.jpg

Смена имиджа: зачем редизайнить персонажей

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

CD_render_April22_4.jpg

Но и это не конечный редизайн ученого. У нас в планах его повторное улучшение.

Еще один пример редизайна — перерисовка старых персонажей под новый визуал игры. Посетитель-весельчак в начале релиза проекта выглядел совершенно иначе. Стиль и рендер героя смотрелись так, будто этот забавный мужчина не из Cooking Diary.

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

CD_render_April22_5.jpg

На изменения и обновления в игре влияют не только показатели и видение проекта, но и реклама, в том числе креативы. Поэтому мы добавили в Cooking Diary визуал, который раньше был рекламным: бодипозитивную девушку, спортивного Дейва, милого щенка акита-ину и разрушенный ресторан.

CD_render_April22_6.jpg

А теперь — про нашего героя, Забывчивого посетителя. Когда мы впервые внедрили его в Cooking Diary, он был специальным гостем ресторана.
Посмотрим на его описания в дизайн-документе:

CD_render_April22_7.png

Нарративное описание героя:

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

Оригинальный арт Забывчивого посетителя до редизайна:

CD_render_April22_8.jpg

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

CD_render_April22_9.gif

Проблемы в арте:

  1. Слишком размытые тени, плохо передающие объем;
  2. Бесформенные\комковатые элементы;
  3. Устаревший стиль одежды.

Задачи для художника:

  1. Улучшить рендер;
  2. Усовершенствовать фигуру и одежду;
  3. Перерисовать обувь;

Примечание:

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

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

Погружаемся в процесс: начинаем редизайн

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

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

CD_render_April22_10.jpg

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

Подходим к производству: создаём новые арты

CD_render_April22_11.jpg

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

Продолжаем рисовать: делаем контур и делим арты

CD_render_April22_12.jpg

Вслед за скетчем мы создаем контур и заливаем его белым. Заливка цветом идёт программно, по оттенкам, которые художник подобрал заранее. Метод покраски похож на режим наложения слоя Multiply в Фотошопе.

CD_render_April22_13.jpg

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

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

CD_render_April22_14.jpg

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

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

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

Поскольку персонаж прошел через редизайн одним из первых, это стало нашим шансом обновить вид рендера. Старый стиль уже не устраивал: размытые тени смотрелись грязно и плохо передавали объем. Решили поменять рендер на более четкий cell-shading и улучшить контур, который изначально был всюду одинаковой толщины. Чтобы контур выглядел более "живым" и смотрелся лучше, мы варьировали его плотность в зависимости от расположения. В углах, изгибах и пересечениях линий контур стал толще, а во внутренних элементах — тоньше, чем основной.

Возвращаемся к фидбэкам: исправляем контур и проходим рендер

CD_render_April22_15.jpg

CD_render_April22_16.jpg

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

Слева видна работа над вариациями кистей рук для разных ситуаций.

CD_render_April22_17.jpg

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

Чтобы сохранить пропорции, мы использовали арты для вида спереди, немного отредактировав их и поменяв порядок слоев.

CD_render_April22_18.jpg

Если сравнить силуэты вида спереди и вида сзади, то можно увидеть, что отличий достаточно мало.

CD_render_April22_19.jpg

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

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

Ещё изменили освещение для вида сзади. Ведь при повороте персонажа свет не должен смещаться.

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

CD_render_April22_20.jpg

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

CD_render_April22_21.jpg

Финальный подбор цветов для одежды. Теперь Забывчивый посетитель выглядит ярче и современнее, что идеально подходит для нашей красочной игры.

Рецепт удачного редизайна: что держать в голове

  • Нужно прочувствовать персонажа. Задайте себе вопросы: сколько герою лет, принадлежит ли он какой-нибудь субкультуре, какой у него характер и какие интересы. Ответив, вы сможете подобрать элементы и символы, которые мастерски покажут все эти тонкости.
  • Важно, чтобы визуал героя вписывался в тематику и настроение игры. Если атмосфера игры темная и таинственная, создайте подходящий к ней облик персонажа;
  • Стоит сделать несколько скетчей в естественной для героя позе, чтобы лучше понять и передать его характер. Можете нарисовать персонажа в определенной ситуации и показать его реакцию. Так вы легче подадите идею куратору. А заодно — поможете аниматору;
  • Редизайнить — значит улучшать внешний вид персонажа. Не бойтесь экспериментировать!
  • Не помешает учитывать современные тренды. Узнайте, что сейчас модно и что интересно вашей целевой аудитории. А потом преображайте героя.

Конечный результат:

CD_render_April22_22.jpg

Вид персонажа в одной из анимаций:

CD_render_April22_23.gif

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

584 0 850 14
0
RENDER.RU