Sunday Drive: игра-таймкиллер для VK

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

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

Тогда игру я написал на Unity, но сейчас решил перенести на TypeScript и WebGL.

Игра не использует библиотек для графики (таких как, например, Three.js), потому что я решил не полагаться на готовые решения и отстроить пайплайн с нуля. В случае с моделями используется формат RC3, который конвертируется из GLTF и сохраняет только данные о геометрии (а в случае машин – информацию о “костях” и привязанных к ним моделях). Если посмотреть на машины, можно заметить, что они состоят из нескольких частей:

Передняя и задняя части разделены, чтобы показывать повреждения в зависимости от стороны удара. Колеса тоже отделил, чтобы крутить ими при повороте. Когда машина еще не столкнулась и просто едет по дороге (не считая машину игрока), она объединяется в одну модель и рисуется полностью за один проход.

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

Здесь видно, что спрайты в рамках одной секции собираются в instanced-меш и рисуются за один проход. Плюс, сразу видно тени, которые рисуются стандартным shadowmap без фильтрации перед основным проходом. Изгиб дороги (и всех остальных моделей) считается в вершинном шейдере, поэтому технически дорога не гнётся, это просто визуальный эффект

Если остались вопросы, или интересно узнать о чем-то подробнее, то пишите в комментарии.

Подписывайтесь на RDCL.DEV