Как мы делаем “собачий” нуар Paper Bum. Часть 2: параллакс, магия света и струнное трио на коленке

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

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

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

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

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

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

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

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

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

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

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

Как мы делаем “собачий” нуар Paper Bum. Часть 2: параллакс, магия света и струнное трио на коленке
Как мы делаем “собачий” нуар Paper Bum. Часть 2: параллакс, магия света и струнное трио на коленке

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

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

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

Как мы делаем “собачий” нуар Paper Bum. Часть 2: параллакс, магия света и струнное трио на коленке

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Как мы делаем “собачий” нуар Paper Bum. Часть 2: параллакс, магия света и струнное трио на коленке

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

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

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

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

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

Будем дико благодарны за подписку на нас, а особенно - за добавление игры в желаемое в Steam!

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

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

42
13 комментариев