Прятки Онлайн — многопользовательская 3D-игра в браузере

В «Прятках Онлайн» ты сам делаешь себе маскировку: раскрашиваешь персонажа, выбираешь позу и место на карте. Остальные игроки видят результат. Мы построили вокруг этой механики сетевую 3D-игру, которая запускается в браузере.

Создали логотип, визуальный стиль и тон общения игры, спроектировали лендинг и игровые интерфейсы, разработали 3D-окружение, редактор маскировки и сетевую механику.

Айдентика

Разработали логотип с кистью и дробовиком: знак сразу отсылает к маскировке и поиску игроков. Для бренда выбрали тёмно-фиолетовую основу и яркие акценты — кислотный лайм, фуксию, голубой и жёлтый.

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

Дизайн сайта и игры

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

Спроектировали меню комнаты, редактор раскраски, выбор поз и интерфейс матча. Для телефона адаптировали управление и панели, чтобы игровое поле и основные действия оставались доступными на небольшом экране.

Раскраска и маскировка

Поиск игроков в музее

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

Карта музея даёт разные укрытия среди стен, экспонатов и скульптур. Во время раунда открыты центральная галерея и одно крыло; в следующем раунде доступное крыло может смениться.

Правила сетевой игры

Комната и настройки раунда

Участники собираются в комнате, выбирают режим и настройки раунда. Один игрок ищет остальных, а найденные переходят на его сторону. К концу раунда прятаться становится сложнее.

Движение, попадания и награды проверяет сервер. Мы также сделали подключение по коду и восстановление после короткого разрыва связи, чтобы участник мог вернуться в матч.

Игра в браузере

Устанавливать отдельное приложение не нужно: игра работает в браузере на компьютере и телефоне. Можно зайти гостем, а для сохранения очков в рейтинге используется постоянный аккаунт.

Для телефона адаптировали управление и доступ к раскраске. Сайт показывает, как устроена игра, и ведёт к запуску; меню и панели комнаты продолжают его визуальный стиль.

Оптимизация игры

Серьёзно оптимизировали сетевой код, цепочку отрисовки и 3D-модели. Сократили лишний обмен данными во время матча и нагрузку на устройство — с особым вниманием к FPS на слабых телефонах. Игра экономнее расходует трафик и остаётся доступной прямо в браузере.

Скорость сайта

Лендинг Пряток получил по 100 баллов во всех четырёх категориях PageSpeed. Основной контент появляется за полсекунды, а макет сохраняет своё положение во время загрузки.

Технологии проекта

Babylon.js · TypeScript — Трёхмерные карты, персонажи, камера, освещение и игровой интерфейс.

Bun · Elysia — Сервер матчей, подключение игроков и API аккаунтов.

Общая игровая симуляция — Единые типы и правила клиента и сервера для сетевого матча.

PostgreSQL · Drizzle — Постоянные аккаунты, сохранение очков и рейтинг.

Nuxt · Vite — Публичный сайт и сборка браузерного игрового клиента.

Срок разработки

1–2 месяца — ориентир до первой рабочей версии с согласованным набором функций. Точный срок зависит от задачи и интеграций.