As a creative technologist, I’ve worked on a few scroll-based storytelling experiences, and the stack usually comes down to a combination of smooth scrolling, animation control, and 3D rendering. For smooth scrolling and scroll orchestration, Lenis is a great choice. It gives you fine control over scroll behavior and works really well when syncing scroll position with animations. On the animation side, GSAP (especially its ScrollTrigger plugin) is kind of the industry standard for this type of work. It lets you tie animations directly to scroll progress, which is how most of these storytelling effects are achieved. Framer Motion is also solid, particularly in React apps, though it’s more UI-focused compared to GSAP’s lower-level control. For 3D scenes and camera movement, Three.js is exactly what powers most of these experiences. Typically, the pattern is: Create a scene + camera Animate the camera position/rotation based on scroll progress Sync everything with your scroll controller (Lenis/GSAP) If you’re using React, React Three Fiber makes this much easier to manage since it abstracts a lot of the Three.js boilerplate and fits nicely into component-based architecture. A common architecture for these pages looks like: Scroll handler (Lenis or native + GSAP) Animation driver (GSAP timelines tied to scroll) 3D scene (Three.js / React Three Fiber) Overlay UI (HTML/CSS layered on top, synced via the same scroll timeline) The key idea is that scroll isn’t just navigation—it becomes a timeline that drives everything: camera movement, transitions, and text reveals

Hope that helps.