What problem does it solve? Web interfaces often feel stiff and disconnected because animations are pre-scripted, gestures lack momentum, and motion cannot be interrupted mid-flight. This Skill translates Apple's WWDC design guidance into concrete web techniques so interfaces respond instantly, track gestures 1:1, and move with physical realism. ## Core Features & Use Cases - Spring-Based Motion: Replace fixed-duration CSS transitions with interruptible springs using damping ratio and response parameters, including velocity handoff and momentum projection for flicks and throws. - Gesture Engineering: Implement pointer-capture dragging with grab offsets, rubber-banding at boundaries, parallel gesture recognition, and hysteresis thresholds for taps and swipes. - Materials, Depth & Typography: Build translucent layers with backdrop-filter, size-specific tracking and leading for type, and reduced-motion/reduced-transparency accessibility fallbacks. - Use Case: When building a bottom sheet or draggable card in React with Motion/Framer Motion, use this Skill to configure the correct spring parameters, project the flick landing point, and hand off release velocity so the gesture feels continuous. ## Quick Start Review my draggable bottom sheet component and rewrite its animations to use interruptible springs with velocity handoff following Apple fluid interface principles.
