Three.js Scroll Cinema

Build scroll-driven 3D experiences that feel like one continuous cinematic shot. Three.js for the scene, GSAP + ScrollTrigger for the timeline.

When to use

• WebGL hero with camera dolly/zoom on scroll
• Product page where the model rotates/reveals as user scrolls
• Layered-image parallax that mimics depth without a full 3D model
• Multi-section storytelling stitched as a single camera path

When NOT to use

• Static 3D viewer with no scroll → just OrbitControls, no ScrollTrigger
• Pure 2D parallax → use framer-motion skill instead
• Video playback synced to scroll → use plain <video> + ScrollTrigger
• Heavy game-like physics → out of scope

Stack contract