Into The Ocean: История одного кранча на инди-джем DTF

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

4 июня таргетированная реклама ВК впервые пошла на пользу человечеству — именно так меня нашёл Дмитрий, и я, страдая от скуки после работы в предвкушении отпуска, вклинилась в разработку игры Into The Ocean на Инди-джем DTF.

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

Этап 1: Поиск стиля

До моего появления у ребят уже были кое-какие мысли насчет общей стилистики: простота, плоскость, практически векторность — явный шаг к успеху при сжатых сроках (у некоторых участников, которые сумели выдержать подобную стилистику на джеме, вышли практически полноценные игры), и все это неплохо вязалось с основной идеей. В визуализации мира, рождающегося в голове 14летней девочки, напрашивалась сказочность и наивность. В целом я была согласна, но вспомнила некоторую картинку с конкурса "Лукоморье" в группе SkillsUp School от Ильи Загайнова, которая запала мне в душу, и предложила ориентироваться на неё:

Into The Ocean: История одного кранча на инди-джем DTF

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

Этап 2: Распределение обязанностей, организация процесса и старт

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

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

Into The Ocean: История одного кранча на инди-джем DTF

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

Этап 3: От вальяжного порисовывания до 4хдневного кранча

Короче вопреки всем мыслимым законам логики начала я с портрета ГГ:

Девочке уже 7 лет как 14 лет и она слишком реалистично нарисована для задуманного стиля. Бороздит цветные океаны, болтает с чайкой, угорает по жизни.
Девочке уже 7 лет как 14 лет и она слишком реалистично нарисована для задуманного стиля. Бороздит цветные океаны, болтает с чайкой, угорает по жизни.

Хвала богам — я додумалась хотя бы остановиться и не тратить время и силы на рендер до упаду. Вместе с фидбеком у нас ушло, кажется, 3 вечера.

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

Первоначальный набросок и поиски цвета при помощи всяких комбинаций карт градиента
Первоначальный набросок и поиски цвета при помощи всяких комбинаций карт градиента
Финалочка
Финалочка

Карты градиента — чудная вещь, облегчающая жизнь.Но не в тот момент когда вы накладываете ее на чб нарезку под анимацию!!! ЭТО СУПЕР ТУПО НЕ ДЕЛАЙТЕ ТАК НИКОГДА потому что единственный аналог карт градиента в афтере — эффект Colorama, а он отличается в настройке, а значит сложную карту градиента придется долго подбирать вручную, причем не на привычной линейной тоновой растяжке, а на моднявом круге. В общем потратила я полчаса на поиски этого самого аналога, и потом еще полчаса на настройку, и все равно получилось не 100% сходство.

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

В общих чертах (сейчас будет абсолютно бесполезная информация для тех кто не открывал АЕ)— на практически одноцветном статичном слое воды лежит 3д слой с фрактал нойзом в разных режимах наложения, в разных вариациях цвета воды подходит то колор додж, то оверлей, то лайтен; над ним так же дисплейсится по этому слою отражённый и сплюснутый полупрозрачный прекомпоз с небом. Блики на воде — вырезанный по мягкой маске кусок слоя с фрактал нойзом, наложенный в более жестоком режиме — скрин или эдд. Снизу светящихся подводных гадов изображают размытые партиклы, опять же дисплейснутые тем же макаром.

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

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

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

Концепт от Димы Майера https://vk.com/dartdimon
Концепт от Димы Майера https://vk.com/dartdimon

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

На этом моменте я начала вспоминать что в играх существует интерфейс и его продумывание вообще-то художничья задача
На этом моменте я начала вспоминать что в играх существует интерфейс и его продумывание вообще-то художничья задача

Потом я бросила попытки придумать красивые волны на дневных фонах и просто анимировала воду по уже протоптанной дорожке:

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

По инерции при помощи CC Toner'а сразу сделала второй дневной фон, с другим океаном:

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

В тот же день я, будучи уже в отпуске в Ижевске, поехала на дачу с ноутом и работала буквально в траве на коленках. Так за 2 часа под бомбардировкой комарами родился портрет принцессы:

Into The Ocean: История одного кранча на инди-джем DTF

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

Ой кажется рисуя балкон я на мгновение вспомнила про стиль
Ой кажется рисуя балкон я на мгновение вспомнила про стиль

5 часов до дедлайна, мне скинули готовую чайку — верного спутника ГГ в океане:

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

Спустя 20 минут моего ковыряния объект потерял в обаянии но приобрёл в цветности:

Into The Ocean: История одного кранча на инди-джем DTF

И тут я вспоминаю что существует интерфейс, потому что за пару часов до дедлайна мне скидывают скрин из билда, куда вставлена вырезанная рамка из какой-то игры:

Никогда не откладывать интерфейс на последний момент. Осознавать свою ответственность за компоновку. Заканчивать отрисовку всей графики за адекватное количество дней до дедлайна чтоб оставалось время на тесты и допилы)))))) ААААААААА
Никогда не откладывать интерфейс на последний момент. Осознавать свою ответственность за компоновку. Заканчивать отрисовку всей графики за адекватное количество дней до дедлайна чтоб оставалось время на тесты и допилы)))))) ААААААААА

Рамка, состряпанная мною за 40 минут, впоследствии вставленная в билд:

Into The Ocean: История одного кранча на инди-джем DTF

Этап 4: Принятие

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

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

Но это был очень свежий опыт! Поэтому я ни о чем не жалею. Спасибо чувакам за возможность вписаться. Зетс олл.

Найти меня можно здесь:

3131
29 комментариев

Саша классная, кеш потраченный на таргет ВК оказался самым лучшим вложением за этот год! Найти хорошего художника, который бы согласился поработать за спасибо было очень не легко)

5
Ответить

А можно подробнее про такие лихие способы использования таргета?

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

3
Ответить

Извиняюсь, а что была за реклама...

Ответить

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

2
Ответить

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

1
Ответить

Больше всего понравился ваш ночной океан! Прям атмосферный.
Я даже посидел на выходных и сделал из него типа Главное меню.
Скачать можно тут: https://www.dropbox.com/s/w68rl0oz4gen3pz/Intro%20The%20Ocean%20HD%20Remaster%20Definitive%20Edition.zip?dl=0

2
Ответить

Арты прекрасные, анимация моря замечательная, но UX и то, как они соединены вместе, действительно, портит все впечатление.

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

1
Ответить