Creative Motion and Scroll

Motion is not decoration added after layout. It is the reading rhythm of the page. This skill covers the stack that carries that rhythm: GSAP for choreography, ScrollTrigger for scroll-linked behavior, Lenis for the feel of the scroll itself, and a deliberate transition layer between pages.

Core principle: one scroll system, one animation ticker, one owner for every transform.

When to Use

• Smooth scrolling with Lenis (or a deliberate decision to keep native scroll).
• ScrollTrigger pinning, scrubbing, snapping, parallax, horizontal galleries, or progress-linked sequences.
• Masked text reveals, line-by-line entrances, or kinetic typography tied to scroll.
• Page transitions on a multi-page site with Barba.js or the View Transitions API.
• Scroll-velocity effects, skew, or inertia.
• Debugging jitter, stale triggers, double RAF loops, or broken anchors after adding smooth scroll.

When Not to Use