atelier-scrolllisted

# Atelier — Scroll Choreography Scroll is the canvas for award-grade web. Done well it's cinematic; done badly it's scroll-jacking that fights the user. The discipline: **choreograph scroll, never hijack it.** Lenis keeps the *real* scroll position (so keyboard, anchors, sticky, and assistive tech keep working) while making it smooth. > **Inputs:** the Direction Doc's motion budget + signature moment. **Default stack:** GSAP + > ScrollTrigger + Lenis; native CSS scroll-driven animations where supported. **Gate:** every effect runs > through `atelier-perf-a11y` (reduced motion, off-main-thread, no scroll-jacking). Easing/duration > vocabulary → `atelier-motion/references/timing-easing.md` (keep reveals consistent with component > motion); React wiring (`ReactLenis` / `useGSAP`) → `atelier-components`; WebGL hover/scroll distortion → > `atelier-webgl`. Deep reference: `references/fundamentals-deepdive.md` (§4). --- ## The flow 1. **Check the budget** → 2. **Smooth scroll base (Lenis)** → 3. **Pick the technique** → 4. **Prefer native where it fits** → 5. **Page transitions** → 6. **Gate (reduced motion + perf).** ## 1. Budget check Scroll choreography is an **award/creative-world** investment. In the production world, keep it to subtle reveals + maybe one pinned/scrubbed signature moment. Don't scroll-jack content/utility sites — it costs conversions and accessibility. Confirm the Direction Doc actually called for this. ## 2. Smooth scroll base — Lenis Lenis is the cur