mks-immersive-site

What problem does it solve?

Scroll-driven immersive 3D website architecture built with vanilla Three.js and Lenis enables cinematic storytelling without heavy frameworks, giving teams a scalable pattern for multi-world explorations.

Core Features & Use Cases

• Two rendering systems: a Canvas 2D entry page and a WebGL 3D world, enabling gate-controlled rendering and resource separation.
• Config-driven worlds: environment definitions in src/environments drive terrain, sky, weather, vegetation, particles, and lighting.
• Atmosphere-driven storytelling: keyframes interpolate 38+ parameters to shape mood, lighting, and effects as users scroll.
• Music-as-router pattern and MiniPlayer navigation enable seamless world switching and narrative pacing.
• Quick-start world-building with optional keyframes and subsystems for new scenes.

Quick Start

Create a new world by defining an environment config and optional keyframes, then boot the engine to render the scroll-driven world.