Sable & Sun — Cinematic Storytelling Scroll Experience
A fully immersive, cinematic storytelling landing page where the visitor's scroll wheel directs the camera travelling deeper into a lush living…
A fully immersive, cinematic storytelling landing page where the visitor's scroll wheel directs the camera travelling deeper into a lush living landscape. Features multi-layer parallax depth, canvas-based mist and spore particles, gliding tropical birds, seamless scroll-driven narrative transitions, interactive luxury journey dossiers, an expedition planner modal, and procedural Web Audio nature soundscapes.
- Camera zoom and parallax translation mapped smoothly to scroll progress (1.0 to 1.38x scale)
- Procedural waterfall mist vapor simulation rendered in real-time via HTML5 Canvas
- Atmospheric environmental effects including gliding tropical macaws, volumetric sunbeams, and forest spores
- Three-stage narrative text choreography transitioning with blur, scale, and opacity curves
- Interactive luxury expedition cards with slide-in day-by-day itinerary dossier drawer
- Integrated procedural Web Audio nature soundscape engine with pink-noise waterfall and synthesized bird calls
Built with: HTML5 Canvas, CSS3 3D Transforms, JavaScript (ES6+), Web Audio API, Scroll Choreography, Parallax Animation, Glassmorphism