Как сделать игру вдвоем и выпустить в Steam
17 декабря 2019 в Steam вышла игра Potata, которую написали наши соотечественники — супружеская пара Анна Лепешкина и Алексей Заврин. Potata — это приключенческий платформер, рассказывающий историю юной ведьмы Потаты, которой предстоит преодолеть многочисленные трудности и спасти родной лес.
Мы попросили авторов рассказать о том, как проходила работа над проектом и почему Potata получилась такой, какой получилась.
Расскажите о себе
Мы — пара энтузиастов из Санкт-Петербурга. Меня зовут Аня, я концепт-художник и преподаватель, а в команде “Потаты” я выступаю гейм-дизайнером, художником, сценаристом и аниматором. Мой муж Алексей — программист и аниматор. Еще мы — авторы трех курсов для художников: об анимации в Spine, о том, как создать собственный игровой проект, и чем 3D может помочь 2D художнику.
Как родилась идея игры?
Я с детства увлекаюсь играми, мой дом буквально переполнен дисками и игровыми журналами. Моим первым любимым жанром был именно платформер, а среди самых запомнившихся проектов того времени — Sonic the Hedgehog и Tiny Toon. Поэтому жанр “Потаты” определился сам собой — мы даже не задумывались об этом.
Мы с мужем с самого начала хотели рассказать сказку, и это повлияло и на сюжет, и на визуальный ряд. Все-таки добрые, приключенческие игры интересны как детям, так и взрослым.
История родилась не сразу, она росла и менялась в течение многих дней, обрастала деталями и сюжетными поворотами. Я чувствую родство с главной героиней, мои детские переживания нашли отражение в сюжете. Тема противостояния маленькой девочки и сурового мира мне очень близка, и даже внешность героини во многом похожа на мою. Правда, по характеру Потата куда легкомысленнее.
Вы работали над «Потатой» только вдвоём?
Да, только я и муж. Музыку мы приобрели по лицензии, все остальное — дело только наших рук. Мы были уверены, что никто не будет работать над нашей идеей с тем же энтузиазмом, как мы сами, а нанимать людей за большие зарплаты мы были не в состоянии. Поэтому все делали сами. Нам обоим пришлось выучить много нового и стать мастерами на все руки.
По вашим оценкам, сколько времени, сил и денег ушло на создание “Потаты”?
Поскольку мы все старались сделать сами, денежные затраты получились не такими большими. На покупку музыки ушло чуть больше двадцати тысяч рублей. Где-то столько же — на маркетинг и поездки по конференциям с шоукейсами. В первую очередь, проект развивался благодаря нашему энтузиазму, желанию сделать что-то своё и воплотить мечту детства.
Разработка началась два года назад, когда я нарисовала первые концепты. Однако нельзя сказать, что на игру ушло два года: мы работали с перерывами и не полный рабочий день, и только в последние шесть месяцев занялись “Потатой” фуллтайм.
Какие навыки пришлось получить специально для создания «Потаты»?
С нуля ничего изучать не пришлось. В то время мы уже немного увлекались анимацией, были знакомы с Unity. Но этого было, конечно, недостаточно. Мы постоянно чему-то учились: вспоминали давно забытые навыки, гуглили возникающие проблемы, в общем, добирали все необходимое.
Например, я была вынуждена перестраиваться с рисования цельных работ на сборку локаций из элементов. Это не так просто, как кажется. Целиком можно нарисовать что угодно, а вот при разбиении картинки на части есть определенные ограничения.
Были ли предложения от издателей?
Да, но договориться не получилось. Главная наша ошибка — это долгая работа практически в стол. Издателя нужно было искать где-то в середине разработки, а не под конец. Перед релизом никто за проект не берётся.
В игре множество загадок. Как вы их придумывали?
Я много играла в квесты, поэтому было откуда черпать идеи и вдохновение. Сложнее оказалось не сделать головоломки слишком трудными. У нас все-таки не чистый квест по жанру, поэтому задачки не должны были тормозить игрока на долгие часы.
Вы много рассказывали о том, как проходит разработка игры. Помогали ли вам критика и отзывы подписчиков или помешали?
Когда как. На мой взгляд, соотношение полезной критики к бесполезной где-то 20 на 80. Фидбек приходилось фильтровать сквозь очень мелкое сито.Самым первым комментарием под первым же нашим роликом был: «какая-то ерунда (цензура)». Явно не самая полезная и конструктивная критика. Часто нас сравнивали с более крупными проектами, с тем же Ori: «А вот сделайте как там». Мы бы и рады, но всегда присутствовало ограничение по ресурсам, нас работало всего двое. Поэтому многие предложения мы просто не смогли реализовать.
Конечно, были и полезные идеи, мы всегда старались прислушиваться к аудитории. В итоге мы сделали довольно много изменений, предложенных на шоукейсах или в комментариях. Если подытожить, то критика очень помогает, но ее нужно фильтровать и понимать, что не все можно воплотить в жизнь. Комментаторам кажется, что это просто, но мы знаем проект и понимаем, что реально сделать, а что нет. И конечно, желательно не потерять авторское видение проекта.
Вообще, если говорить о комментариях, то лично для меня очень важна поддержка. Когда я вижу заинтересованность людей, то стараюсь сделать как можно лучше и никого не разочаровать.
Что было самым сложным в работе над игрой?
Сложно было отметать определенные идеи, которые или не вписывались в проект, или просто требовали слишком много ресурсов для реализации. Изначально планы были наполеоновские, но реалии разработки вернули нас с небес на землю.
Мы долго не могли определиться с уровнем сложности игры. С одной стороны, графика обещает легкое, приятное приключение. С другой, без вызова игроки могли бы и заскучать.
Дизайн главного персонажа менялся много раз. То героиня не подходила для требуемой анимации, то превращалась в настоящего пупса. В остальном разработка проходила в штатном режиме.
Перед релизом самое сложное — это отыскать все неуловимые баги, которые срабатывают через раз и непонятно, из-за чего появляются. Маркетинг и продвижение — тоже сложная штука, но мы старались сделать все, что могли. Даже на то, чтобы писать посты в паблике игры, уходило время, которого перед релизом просто не было.Но несмотря на все сложности, стоило мне увидеть готовый фрагмент игры, на душе становилось так хорошо! Это очень крутое чувство — пройти сквозь кучу проблем и преград и все-таки добиться нужного результата.
Что вы советуете начинающим инди-разработчикам?
Делать, делать, и делать. Главное — не выгореть в процессе и грамотно распределить силы, чтобы не выдохнуться еще на середине пути.
По поводу фидбека — главное, не позволяйте критикам обидеть вас, лишить веры в себя и понизить продуктивность. В случае с инди-разработкой именно внутренний огонь авторов — главный двигатель прогресса. Ему нельзя гаснуть ни в коем случае!
Вы — автор и преподаватель нескольких курсов для художников. Они родились в процессе работы над «Потатой»?
Напрямую курсы не связаны с проектом, но писались они во время разработки игры. Опыт, который мы с мужем получили в процессе создания “Потаты”, отражается в лекциях, просто несколько в другом виде.
Сегодня и только сегодня! Ответы на многие вопросы!
Вообще есть несколько способов игры, если быть точнее два:
1. Локальная сеть ака LAN
2. Глобальная сеть ака WAN ака всякие ваши там Интернеты.
Как поиграть по локальной сети?
Всё очень легко. Тебе нужно выполнить одно условие — чтобы все играющие находились в одной сети (к одному роутеру подключены, проводом связаны и т.д.). После по стандарту — хост заходит на нужную карту и `Меню —> Открыть сервер`, а игроки подключаются в Главное меню —> Играть —> Сетевая игра.
Плюсы:
— Простота. Я серьёзно — с этим даже ребёнок справится.
— Пинг. Он будет минимален
— Интернет не нужен.
Минусы:
— Нужно подходить впритык (вдали не поиграешь)
— Нельзя поставить плагины
Рассмотрим способы, как можно это сделать;
I. Хостим у себя на ПК.
1. Качаем серверную часть (server.jar на itch.io/githiub).
2. Нужно открыть на маршрутизаторе порт 6567 (без этого никак.)
О портах поподробнее. Чтобы открыть порт, нам понадобится:
— Маршрутизатор (по-человечески роутер)
Белый IP — это когда внешний IP совпадает со внутренним. Как проверить? Заходишь в настройки роутера (для этого введи в браузере 192.168.1.1 или 192.168.0.1 (всё зависит от модели роутера)), вводим логин и пароль (написан снизу роутера), смотрим какой IP во вкладке WAN. Посмотрел? Запиши его где-нибудь. Теперь зайди на сайт 2ip.ru, и посмотри какой IP там. Запиши его тоже. Теперь посмотри на IPшники, которые ты записал. Если они совпадают, тогда поздравляю комрад, у тебя белый IP и у тебя всё выйдет! Не совпадают — соболезную — ты не можешь открыть порты, а значит и хостить.
Заходим в настройки маршрутизатора, вкладка «Переадресация/Виртуальный сервер» (или иначе, у всех по разному), и добавляем новое правило:
IP: вводишь `ipconfig` —> адрес IPv4)>
Протокол: и то, и то
Пример: 
Вернёмся к server.jar. С 102 билда добавили батник, который запускает сервер автоматом — юзайте его. Откроется консоль. Вводим туда host |название_карты| |режим|
Список карт — maps. Добавить свои — папка с сервер.бат/config/maps. Если в названии есть пробелы/двоеточия и т.д. заменяем нижним подчёркиванием. Карты на русском нехостабельны.
survival — Выживание
pvp — ПвП
attack — Атака
sandbox — Песочница
Пример: 
Пы. Сы. Если провайдер запретил открытие порта 6567, но вы можете открыть другой (например 7777), тогда его можно изменить в настройках сервера командой config port
Пы. Сы. Сы. Если у вас серый IP, тогда можно будет попробовать попросить провайдера сделать белый, обычно такая услуга просто накидывает пару десятков рубликов к оплате, но зато вы станете всемогущим! Или можно получить бесплатно, как я. Но я ждал этого год.
Чтобы присоединится вводим WAN-IP. Если порт иной, не 6567, вводим его через двоеточие Пример: ХХХ.ХХ.ХХХ.ХХ:7777
Плюсы:
Hamachi
Плюсы:
Минусы:
— Есть ограничение до 5 человек
— Только для ПК.
Пы. Сы. Для умников, которые говорят что «А хумачи есть в плый марките!!11!» могут сворачиватся — тот LogMein НЕ эмулятор локальных сетей.
III. Покупной хост.
Просто платите шекели в месяц, ставите JRE, screen и наслаждаетесь жизнью. Например, petruchio.org.ru использует сервис vdsina.ru (Самые дешёвые тарифы ниже)
Плюсы:
— Особо парится не надо.
— Нет нагрузки на вашу шайтан-машину
Минусы:
— Для богатых буржуев, деньги не у всех есть
— Если выбран говно-хост тогда он возможно будет регулярно падать.
IV. Играть на других серверах
Плюсы:
— Хороший игровой опыт, когда каждый что-то делает
— Можно научится играть, завести новых знакомых
Минусы:
— Админом ты будешь вряд ли
— Сам карту/плагин/мод не поставишь
— Есть риск встретить токсика/грифера и т.д.
V. OpenVPN
Там как-то можно играть, но я хз как, на вики петручио всё описано, идите туды, вот ссылочка.
VI. Steam
Покупаешь игру в стиме, зовешь друга и играешь.
Плюсы:
— Можно почувствовать себя аристократами
Минусы:
— Нужно покупать игру, как-никак
А теперь, частозадаваемые вопросы:
1. Могут ли ПК-бояре играть с игроками с телефонов?
— Игра кроссплатформенная. Т.е. могут играть вместе Ведроиды, Линуксы, Шиндоусы, Яблочники (и те, и те), да хоть с чайника играй, все вместе будете. Кратко говоря — можно.
2. Не могу подключится к серверу, что делать?
— Узнай, работает сервер или нет.
— Если хост ты, проверь подключение к Интернету, если открыл порты (Если ты их конечно открыл вообще) — проверь правильность открытия
— Попробуй обновить игру, если она не последней версии.
— На сервере включён вайтлист, т.е. только вписанные игроки могут войти
— Ты просто заъанен к чертям.
3. Как ставить моды?
— Модификации —> Импортировать мод с GitHub — Разработчик/Название мода на гите (Пример: Slava0135/Refactorium)
— Модификации —> Импортировать модификацию — ищи зипку на устройстве.
4. Как создавать моды?
— Это уже другая история. Есть инглишевский гайд от разраба (Тык), есть петручевский(Тык!). Могу свой запилить, но зачем?
5. Нафиг нужна стартовая площадка?
— Она тратит энергию, копит ресурсы а потом раз в n-секунд отправляет накопленное сразу в древо технологий.
6. Как установить карту?
— Скачиваешь карту (например в дискорде из канала #maps), заходишь в игру, Редактор —> Импортировать карту —> Выбираешь место где лежит карта. Готово — ты можешь теперь запустить её в Пользовательской игре.
7. Как строить свои карты?
— Вкладка Редактор —> Создать новую карту. Вводишь название и начинаешь творить!
8. Как установить плагин на свой сервер?
— Нужно просто закинуть в Директорию с сервером/config/mods. Туда же нужно кидать моды.
9. Как пользоватся электромагнитной катапультой?
— Ставим катапульту в точку А. Пихаем в неё ресурсы. Подводим энергию. Ставим в зоне видимости катапульты А катапульту в точке Б. Отвожим от неё конвейер, запитываем энергией. Подключаем катапульту А к катапульте Б как силовой узел. Пруфит!
Создать JS-игру с мультиплеером за 24 часа и выжить
За 24 часа можно успеть очень много. Сегодня я решил рассказать, как всего за сутки мы с моими коллегами (шестью фронтендерами и одним бэкендером) создали настоящую мультиплеерную игру на JavaScript. Поехали!
Собрались похакатонить…
Совсем недавно в компании IRLIX, где я работаю frontend-разработчиком, прошло знакомое для многих мероприятие — хакатон. На мой взгляд, это очень крутой формат, который независимо от масштаба позволяет изучить новые грани разработки. В том числе для frontend направления. Главное — объективно оценивать, на что вы способны и найти баланс между полётом фантазии и реальностью при выполнении задач.
Целью данного хакатона было создать ровно за 24 часа игру с нуля, используя только JavaScript, Node.js, Soket.io. и два ящика энергетиков.
Я очень легко соглашаюсь на разную движуху. И мне совершенно не обязательно знать, что из этого выйдет. Уже в процессе меня одергивает разум: «Чувак, зачем ты в это вписался?». Но раз пути назад нет — погнали. Этот раз тоже не стал исключением. Не успел я оглянуться — и вот уже полностью погружен в процесс разработки игры.
Почему JavaScript?
Сегодня игрушку можно сделать практически на любом языке программирования, но мы решили остановиться на JS. Выбор стека был обусловлен в основном нашими знаниями по определенным технологиям. Мы решили использовать библиотеку Soket.io, так как она поддерживает постоянную связь клиента с сервером и имеет возможность создавать кастомные эвенты между ними, что необходимо при построении мультиплеерной игры. На мой взгляд, это было идеальным решением в рамках времени, которым мы располагали.
Процесс разработки или сутки, которые я не забуду никогда
Мне казалось нереально сложным иметь только общее представление о том, что должно получиться в итоге, и ни малейшего представления о том, как это сделать. Спустя сутки я понял, что в данном случае главная фича для крутого результата — это именно свобода действий. Ведь тебя практически ничего не ограничивает (ну, кроме времени, само собой) — фантазируй, придумывай, воплощай.
Начали мы с того, что командой накидали простейший код связи клиента с сервером, визуализировали себя на экранах в виде красных шаров и безумно радовались этому. На первичную логику ушел примерно час. Но далее мы столкнулись с интересной задачей игрового цикла, мы разделили отрисовку данных на клиенте и игровой цикл на сервере.
Серверный движок
Клиентский движок
Движение игроков было реализовано через изменение стейта игрока на сервере. Мы слушали состояние нажатых кнопок на клиенте, изменяли объект и отправляли его на сервер, а он, в свою очередь, менял позицию игрока.
Клиентский код
Серверный код
Это весь цикл перемещения игрока. Кроме того, для удобства в дальнейших кейсах мы решили задавать игроку состояние. Ниже пример метода перемещения игрока.
Когда мы поняли, что движущиеся точки — это конечно круто, но недостаточно, решили пуститься «во все тяжкие» и делать мультиплеерный шутер. Первое, что мы сделали — проработали концепцию, отбросив все лишнее. После — упростили графику ( от того, что нарисовало богатое воображение в наших головах до реализуемого варианта). Затем перешли к тому, что создали персонажей и их способности к стрельбе.
Было много спорных моментов, обсуждений, далеко не всегда получалось прийти к компромиссу. И, конечно, были эпизоды, в которых спорить было не о чем, потому что мы просто не знали, как это воплотить.
Например, как грамотно доставить информацию на оба экрана, чтобы на каждом кадре отрисовки летевшая пуля находилась у обоих клиентов. Но выбранная архитектура решила проблему на корню: клиент просто рисовал данные приходящие с сервера и отправлял события об изменении данных, почти все расчеты происходили на серверном движке.
Еще пример: мы не знали, что делать с ФПС ( наша бравая лошадка-сервер вывозила не больше 4 человек, а после грустно ложилась помирать). Происходило это по нескольким причинам: чем больше клиентов, тем больше данных нужно отправлять, а данные отправлялись 60 раз в секунду, на 8 игроках игровой цикл замедлялся до 15 циклов в секунду. Однако для оптимизации процессов было еще слишком рано, готовой игровой модели еще не было, и мы продолжили разработку.
Мы круто упростили модель передачи данных для выстрелов с помощью линейной интерполяции и сделали, в целом, много всего интересного (в первую очередь, для улучшения игрового процесса). Вот первый этап оптимизации для нашего серверного движка.
Отрисовка снарядов на клиенте
Также мы решили использовать пулинг для снарядов на сервере, хранили готовые инстансы снарядов в массиве и добавляли их при каждом выстреле, а после возвращали в пул для хранения. Это положительным образом влияло на нагрузку сервера.
Следующим этапом стала обработка столкновений. Первая наша попытка была просто ужасной: была куча блоков if/else, но все работало, однако глядя на такой код, хотелось плакать. Поэтому мы решили сделать все области столкновений в игре круговыми и обратиться к геометрии.
Реализация с помощью кода
Сделав лишь одну функцию для расчета столкновений между двумя объектами, мы решили все трудности с коллизией, но вычислений все равно было очень много: помимо снарядов у нас еще были стены на карте, и их тоже необходимо было обрабатывать.
Вот тут мы и столкнулись с задачей на оптимизацию. Мы решили считать столкновения игрока со стенами на клиенте. И это сильно облегчило работу серверному движку.
Самым эмоциональным для меня стал момент записи звуков для игры. За неимением других источников нам пришлось имитировать их самим. Мы бегали вокруг стола, стучали кружками и делали что-то еще. К тому моменту прошло уже много часов хакатона, мозг немного был затуманен, что в некоторых моментах даже сыграло нам на руку. Особенно смешным и немного нелепым получился звук попадания снаряда — представьте, как рыба пытается сказать букву «П».
А что в результате?
В нашем случае результатом стал мультиплеерный 2D шутер с видом сверху. Игроки сражались каждый сам за себя, количество патронов было ограничено, но на на карте постоянно появлялись случайные объекты в виде (дополнительных патронов, усиления урона, аптечки), эти объекты создавали точки интереса на карте и вынуждали игроков постоянно двигаться, чтобы выиграть бой, от этого игра становилась более динамичной и веселой. При поражении игрок выбывал с карты на некоторое время, а после опять мог вступить в бой. На следующий день после хакатона, мы рубились в эту игрой с ребятами из офиса, и, как оказалось, шутер получился веселым и залипательным, что нас очень сильно порадовало.
Простые игры на Canvas в браузере могут сделать ваше приложение более интерактивным. Например, простой игрой вы можете заменить скучные и долгие экраны загрузок. А написание полноценных браузерных игр на JS может стать отличной альтернативой разработке однотипных, скучных приложений. Вердикт: геймдеву на JS быть!
Как создать игру с другом на Unity 3D? Как создать игру с другом на Unity 3D?
Тебе и другу следует изучить Unity 3D и создать на нем игру, полагаю.
Игры — это не только программирование. Программирование в играх — это лишь малая часть всей работы по созданию игры. Это и сюжет, и графика, и музыка, и диалоги и еще много чего. Ты с другом думаешь, что потянешь? Хотя если друг сам будет активно участвовать и пинать тебя, чтобы ты читал документацию, а не задавал глупые вопросы на «ответах», то может что-то простенькое и получится.
Начните с уроков по Unity на оффсайте, распределите обязанности (кто занимается программированием, кто занимается содержанием), если не будет получатся, то лучше бросьте эту затею.
Есть примеры, когда неплохие инди игры делали 1-3 человека, но это исключение из правил. Успешные коммерческие проекты делаются конторами, где над одним проектом работают несколько десятков человек.