![Пиробайт [Pyrobyte] — разработка веб-сервисов и приложений](/_imgs/100x100/files/users/4915/avatar/avatar-400x400-4_1695810925.jpg){kind=avatar}
Праздники — время чудес, правда? :) Так подумали мы в Пиробайте и под Новый год выпустили свою 3D-игрушку-портфолио. Заходите поизучать, а мы расскажем о первом опыте разработки проекта на игровом движке Unreal Engine.
Поехали: https://pyrobyte-landings.tilda.ws/3d
Всем привет! На связи Антон, креативный директор Пиробайта. Еще летом мы с ребятам насмотрелись конкурсных сайтов, на одном из которых увидели мини-игру на Unreal Engine. Это игровой движок на С++ от Epic Games. На нем можно создавать игры для большинства операционных систем и платформ.
«Освоив работу с движком, можно легко делать геймификацию наших проектов», — подумали мы. Решили протестировать гипотезу и для начала сделать 3D-портфолио нашей студии.
Для первого проекта взяли такую концепцию: красная тачка (привет фанатам GTA) дрифтует по открытому пространству. По нему расставлены стенды с проектами студии. Когда машина подъезжает к какому-то из них, по нажатию на Enter открывается соответствующий кейс на сайте.
К самой разработке приступили в начале декабря, справились примерно за 2 недели.
Но, как в большинстве игр, без боссов на пути разработки игрового портфолио не обошлось :)
Гипотеза, с которой начали работу: небольшой проект на игровом движке можно сделать без разработчика
Игру-портфолио начинали вдвоем: я и дизайнер студии Илья. Пока не столкнулись с суровой программистской реальностью.
В Unreal Engine используется система визуального скриптинга Blueprints. Работает так: прототип игры собирается с помощью составления логических блоков — нодов. Их можно менять местами, настраивать связи и др. То есть игру — от простого кликера до полноценной RPG — можно реализовать без построчного кода.
Работать в Blueprints могут и непрограммисты. Но в процессе поняли, что у нас, дизайнеров, это займет больше времени, чем было запланировано изначально. Потому к задаче подключили нашего разработчика — бэкенда Алексея, который уже был знаком с UE.
Плоская земля, или Как мы геймдизайн поднимали
До проекта опыта работы с 3D у Ильи не было. Ранее другой дизайнер Пиробайта, Артем, работал с редактором для 3D-моделирования Spline. Илья же начал изучать программы для моделирования с нуля по видеоурокам. Параллельно мы по туториалам вникали в работу игрового движка.
Сначала Илья нарисовал скетч уровня в Figma: расположение объектов на полянке. В первом варианте проекты будто лежали на земле. Не удобно было ориентироваться между ними, а машине пришлось бы заезжать на них буквально.
Позже заметили и другой недочет: все объекты были расставлены слишком аккуратно. Без препятствий и направляющих не было понятно, по какому пути двигаться машине. А еще хотелось немного хаоса, чтобы было интересно изучать пространство, но пользовательский путь в нем все-таки прослеживался.
Мы с Ильей переделали компоновку. Направляющие для движения тачки и объема пространства задали елочками, добавили снеговиков и снежных волков — символов нашей студии, и большущего дракона — символ 2024 года.
Стенды с проектами, наградами, страницей Пиробайта на Dprofile расположили вкруговую.
Часть 3D-объектов Илья брал из программы для 3D-дизайна SketchUp. Объемные логотипы студии, рейтингов и премий — отрисовал сам в Blender.
Выйти из сумрака — еще один босс миссии
Когда мы уже задеплоили сборку и запустили сайт через тильду, обнаружили, что в игре сломалось все освещение и тени.
Такая поломка — распространенная проблема при переносе объемных объектов в веб. Алексей решил эту проблему запеканием.
Так называется перевод текстурных деталей и освещения в статические изображения — текстурные карты. После этого 3D-модели никуда не «уедут» и будут оптимизированы для использования в реальном времени или визуализации.
Это был супер-сложный для меня момент в разработке. Если делать еще такие проекты, стоит в будущем уделять внимание UV-развертке, без нее никак. Касается и материалов, и самой структуры проекта.
И вот мы на деплое! Но и это не финал…
В видеоуроке, по которому мы знакомились с Unreal Engine, проект разворачивали на Dropbox. Так же сделали мы и… получили битые ссылки >.<
Около недели проект открывается без проблем. Далее ссылка сбрасывается и перестает работать. Приходится создавать новую ссылку в Dropbox и снова переносить ее в Tilda.
Для будущих проектов вынесли урок: разворачивать сборки уже на своем сервере. Кстати, если заметите в игре баг или 404 страницы — напишите в комментариях, пожалуйста, будем благодарны и пойдем фиксить!
We are winning, son. Портфолио-игра работает!
За короткое время открыли для себя крутой инструмент геймификации проектов. Unreal Engine планируем изучать и дальше, прокачивать наши навыки в 3D и разработке игровых уровней уже на коммерческих проектах.
А еще с удовольствием сделали новогодний подарок для ребят из нашей студии — игру, в которой можно
• подрифтовать по снегу на красной тачке без правил и ограничений скорости;• поврезаться в волков;• разрушить башню Дженги;• рассмотреть фотомоменты жизни студии;• разогнаться и взлететь на лестницу (редкое достижение! напишите, у кого получится);• самое главное — познакомиться с нашими кейсами и наградами за них. А еще найти одну пасхалку грядущего релиза 🔥.
Жмем на газ: https://pyrobyte-landings.tilda.ws/3d
Фичи игрушки:
- Чтобы открыть кейс, припаркуйтесь у стенда и нажмите Enter;
- Если нажать на Tab, переключится вид из машины;
- Чтобы ездить привычными WASD, включите английскую раскладку.
Кстати, сможете посчитать, сколько в игре волков, ёлок и снеговиков? ☃
А пока считаете, поздравим вас с наступающими новогодними праздниками! Пусть новый 2024 год принесет все самое светлое, доброе, креативное и масштабное — и в личных делах, и на проектах 💜
Спасибо, что были с нами этот год! Встречаемся в январе в блогах Пиробайта и на страницах
