Как мы делаем «собачий» нуар Paper Bum. Часть 2

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

Первый прототип или «раки на хромой собаке»

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

Видео с горе-прототипом у нас почему-то есть только в виде съёмки экрана телефоном. Но, в принципе, качество ролика соответствует его содержанию:)

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

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

Принцип был такой — небо и деревья оставляем статичными, траву «оживляем». Потом деревья с небом отрезаем, делаем отдельным слоем на движке и чуть-чуть заводим за траву — чтобы не было белых пробелов (великолепный план, Уолтер, надёжный, как швейцарские часы).

Работать собирались вот с этим.

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

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

Наследие этого подхода — никому не нужные рисунки с торчащими кусками деревьев и перепадами травы.

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

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

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

Сработало! Жаль потерянных часов работы, но зато мы получили бесценный урок: если можно сделать проще — не усложняй (мудрость уровня мема «чтобы убить — стреляйте, чтобы не убить — не стреляйте»).

Животворящий параллакс

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

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

Повесили скрипт на каждый слой и установили везде разные скорости. Движение получилось и на небе — там медленно перемещается луна и плывут облака.

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

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

Тут версия без облаков, но принцип ясен.

Пока проблем хватает — получилось кривовато, местами скорость объектов далека от реализма, но это подкрутим, главное, что найден общий принцип, который (наконец-то!) работает.

Магия лунного света

Где объём — там и свет, решили мы, и начали экспериментировать. Изначально, видимо, предполагалось, что свет будем рисовать чуть ли не вручную, как-то поменьше нажимая на карандаш (что?..). Но после того, как окончательно определились с движком (долго выбирали между Godot и Unity), поняли — свет надо делать, возможности Unity позволяют.

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

Покажем изменения на примере сцены, где пёс ест из помойки. Вот версия без света.

Накидываем глобальное освещение с пониженной интенсивностью.

Добавляем зоны с освещением из окон, меняем там цвет на жёлтый.

Прикручиваем свечение от окон и тень от собаки.

Похоже на правду:) Играться с освещением продолжим, потенциал нравится.

Саундтрек своими руками

Вообще мы и сами своего рода музыканты (и на машинке вышивать можем, ага). Дома копится богатая коллекция инструментов, в числе прочего в неё входят контрабас и аккордеон. Нам очень нравится дарк-кабаре (например, The Tiger Lillies) — как раз у них мы подсмотрели сочетание контрабаса и аккордеона. На их основе и решили пилить саундтрек — что-то блюзовое, протяжное, с завываниями.

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

Поэтому с дарк-кабаре и блюзом пока решили притормозить и обошлись полумерой — собрали первый трек для трейлера в GarageBand.

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

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

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

Собирать саундтрек, кстати, поначалу было боязно — мы привыкли играть каверы, а не сочинять своё. Но быстро втянулись, и процесс в целом понравился.

А на сегодня всё! Следующую часть посвятим очень поучительному рассказу о том, как ни в коем случае не надо питчить игру, и немножко поноем о синдроме самозванца.

Напоминаем, что мы есть в соцсетях! «ВКонтакте», Facebook,* Twitter и YouTube. Там планируем размещать короткие новости, анонсы и шутейки.

Заранее спасибо за поддержку zen games! Ведь чем дальше — тем мрачнее.

* Деятельность родительской организации «Meta» признана экстремистской и запрещена на территории Российской Федерации