Тихая поляна

Прогулка по лесным полянам от третьего лица на Babylon.js: три героя (лиса, волк, олень), сгенерированные уровни с кристаллами и порталом, биомы со своей атмосферой (летний лес, осенняя роща, каменное плато, зимний лес со снегопадом, ночной лес со светлячками, озёрный край), три режима камеры, пресеты графики, трава, которая качается на ветру и приминается героем, синтезированные звуки шагов, ветра и птиц.

Разработка — Максим Безрукавников, при участии Claude (Anthropic).

Скриншоты

Все снимки сделаны на пресете «Ультра»: тени PCF с картой 4K, SSAO, MSAA 4×, густая трава до 70 м и дальность прорисовки 200 м.

Лесная поляна	Осенняя роща
Зимний лес	Ночной лес
Озёрный край	Пресет «Ультра» в настройках

Запуск

npm install
npm run dev        # дев-сервер Vite, http://localhost:5173
npm run build      # проверка типов + сборка в dist/
npm run preview    # посмотреть собранную версию

Структура

index.html              разметка UI (меню, выбор героя, HUD, панель настроек)
styles.css              все стили
src/
  main.ts               инициализация, состояния меню / выбор / игра, клавиатура, игровой цикл
  heroes.ts             описания героев, загрузка GLB, смешивание анимаций
  constellations.ts     созвездия игрока: фигуры, имена, места на небе
  starsky.ts            ночное небо уровня: фоновые звёзды и созвездия игрока
  achievements.ts       достижения поверх статистики и коллекций дневника
  journal.ts            дневник игрока: редкие кристаллы и другие находки
  share.ts              «поделиться» результатом Леса дня: текст в буфер обмена
  world.ts              постоянная сцена (свет, камера, тени) и смена уровней; запросы для физики и камеры
  levels/
    recipes.ts          рецепты уровней: кампания из 8 уровней, дальше бесконечный режим
    biomes.ts           биомы: палитра, небо, солнце, лес, камни, трава, звуки, частицы
    generator.ts        генератор раскладки по сиду + проверка достижимости
    terrain.ts          рельеф: шум из сида, выровненные площадки, запечённая карта высот
    level.ts            меши уровня: лес и камни через thin instances, платформы, кристаллы, портал
    decor.ts            детали на поляне у каменного круга — по дню за каждый день игры
    progress.ts         прогресс кампании в localStorage
  rng.ts                детерминированный ГПСЧ с независимыми потоками
  player.ts             ввод (клавиатура, сенсорный стик), движение, прыжок, коллизии
  camera.ts             три режима камеры, захват курсора, облёт за меню
  settings.ts           пресеты, localStorage, тени и пост-обработка для каждой сцены
  grass.ts              трава: thin instances по кускам, LOD по дальности, ветер и примятие в шейдере
  wind.ts               общая модель порывов ветра — для звука, травы и снега
  particles.ts          частицы вокруг камеры: снегопад и светлячки
  ripples.ts            круги на воде вокруг героя, идущего вброд
  breath.ts             пар изо рта на морозе
  audio.ts              звук на Web Audio API: ветер, птицы, шаги и приземления
  music.ts              фоновая музыка: эмбиент, сочиняемый на ходу, лад по биому
  utils.ts              мелкие помощники
  ui/
    menu.ts             главное меню
    sky-panel.ts        карта звёздного неба в меню
    journal-panel.ts    панель «Дневник» в меню
    select.ts           экран выбора героя (3D-подиумы и карточки)
    settings-panel.ts   панель настроек
    hud.ts              счёт, подсказки, FPS, кнопка камеры
    fullscreen.ts       полноэкранный режим: кнопка в HUD и клавиша F
    transition.ts       затемнение и экран итога между уровнями
public/models/          wolf.glb, fox.glb, stag.glb
docs/screenshots/       снимки для README — пресет «Ультра»
CREDITS.md              лицензии моделей и шрифтов

Модели лежат обычными файлами в public/models/ и грузятся по URL (import.meta.env.BASE_URL + 'models/…'). Сборка использует base: './', поэтому dist/ можно выложить в любую подпапку, например на GitHub Pages.

Уровни

Уровень строится из рецепта (levels/recipes.ts): биом, размер, число кристаллов, цепочек платформ и полян, доля спрятанных кристаллов. Первые восемь рецептов заданы вручную, дальше параметры растут до потолка, а биом выбирается по сиду. Один номер уровня — всегда одна и та же раскладка.

Генератор (levels/generator.ts) расставляет поляны, цепочки ступеней (подъём не больше 1.25 м и зазор не больше 2.4 м — под прыжок волка, самого слабого прыгуна), лес по Poisson-диску с рощами по шуму и сплошной стеной по краю, камни и кристаллы. Затем поиском в ширину по сетке 0.5 м проверяет, что до каждого кристалла и каждой цепочки можно дойти; если нет — пробует другой поток случайных чисел.

Рельеф (levels/terrain.ts) — фрактальный шум с параметрами биома (у каменного плато — острые гребни) и валом за границей уровня. Центральная поляна, боковые поляны и площадки под цепочками платформ выравниваются с плавным переходом. Высота запекается в сетку 1 м; по ней же строится сетка земли (шаг 1.5 м). Первые уровни почти плоские — множитель relief в рецепте. Склон круче 38° (MAX_WALK_SLOPE) не пускает героя вверх, а на таком склоне он съезжает; генератор считает такие клетки стенами при проверке достижимости.

Портал в каменном круге открывается после 80% кристаллов, все кристаллы дают звезду. В меню «Уровни» — открытые уровни с лучшим временем. Звёзды открывают героев: лиса доступна сразу, волк — за 6 звёзд, олень — за 15 (поле stars в HEROES); закрытый герой стоит на подиуме тёмным силуэтом. Каждая звезда зажигает звезду на небе (меню «Небо»): созвездия процедурные, но одинаковые у всех — фигура, имя и место зависят только от номера (constellations.ts). Первые созвездия маленькие, дальше до 8 звёзд; когда все 24 собраны, звёзды рассыпаются пылью. То же небо висит над ночным лесом (starSky у биома).

В dev-сборке в консоли браузера доступен __game (world, player, rig, beginLevel(n)).

Как добавить биом

Добавьте запись в BIOMES (levels/biomes.ts) и используйте её id в рецептах. У биома есть звуковая атмосфера (ambience: частота птиц, кукушка, сверчки, совы, сила ветра), поверхность для шагов (surface: трава или снег), частицы в воздухе (particles) и ночной свет от кристаллов (crystalLights: два ближайших к герою кристалла освещают округу — вместе с небом и луной это предел в 4 источника у материалов по умолчанию), звёздное небо с созвездиями игрока (starSky) и вода (water: низины рельефа и прокопанные озёра; уровень воды подбирается так, чтобы естественные низины занимали не больше 6% карты). Мелкая вода замедляет героя и ослабляет прыжок, глубже 0.9 м (MAX_WADE_DEPTH) не зайти — для генератора это стена. Тип деревьев — pine или birch; новый тип рисуется в Level.buildTrees.

Как добавить героя

1. Положите имя.glb в public/models/ и допишите лицензию в CREDITS.md.
2. Добавьте запись в HEROES в src/heroes.ts: имена анимаций, исходную высоту модели (srcH), скорости, прыжок и сколько звёзд нужно, чтобы герой открылся (stars).
3. В src/ui/select.ts добавьте позицию подиума в SLOT_X, а в styles.css поправьте число колонок у .cards.

Лицензия

Код — MIT. У 3D-моделей свои лицензии, они перечислены в CREDITS.md.