What problem does it solve? Web interfaces often feel stiff and disconnected because animations are pre-scripted, non-interruptible, and ignore gesture velocity. This Skill translates Apple's WWDC design guidance (fluid interfaces, springs, materials, typography) into concrete web techniques using CSS, Pointer Events, and spring libraries like Motion and Framer Motion. ## Core Features & Use Cases - Gesture-Driven Motion: Implement 1:1 drag tracking with Pointer Events, velocity handoff to springs, momentum projection, and rubber-banding at boundaries. - Spring Animation Guidance: Apply Apple's damping ratio and response parameters instead of fixed-duration animations, with concrete values for drawers, sheets, and repositioning. - Materials, Typography & Accessibility: Build translucent layers with backdrop-filter, size-specific type tracking and leading, and reduced-motion/reduced-transparency fallbacks. - Use Case: When building a bottom sheet that users can drag, flick, and re-grab mid-animation, use this Skill to wire pointer tracking, project the flick's landing point, and hand off release velocity to a spring so the motion feels continuous. ## Quick Start Review my drag-to-dismiss sheet component and rewrite its animations to use interruptible springs with velocity handoff following Apple design principles.
