Skill / Motion / Layout / External
figma-implement-motion
Translates Figma motion and animations into production-ready application code. Use when implementing animation/motion from a Figma design — user mentions "implement this motion", "add animation from Figma", "animate this component", provides a Figma URL whose node is animated, or when `get_design_context` returns motion data or instructs you to call `get_motion_context`.
by figma
Works with
Universal
Hosted in an external repository
This skill's full instructions live in its source repository, not on UI Skillbook. Open it on GitHub to read it, or copy a prompt that points your agent straight at it.
Related skills
60fps-animationExternal
Web animation performance guidance for avoiding layout thrashing and reaching smooth 60/120fps motion with compositor-friendly techniques.
accessible-animationExternal
Tiered reduced-motion patterns for CSS, GSAP, Framer Motion, Lenis, and other web animation systems.
pbakaus-animateExternal
Enhance UX with purposeful animation and micro-interactions that support usability and delight.
animate-expoExternal
Build animations in React Native and Expo, making the decisions in the order that determines whether they feel right — should it animate, which thread it runs on, which properties, spring or timing, how the gesture hands off, how it degrades. Writes the implementation with Reanimated, Gesture Handler, Expo Router and expo-haptics. Use when animating anything in an Expo app, adding gestures, sheets, screen transitions, press feedback or haptics, or fixing motion that stutters on device. For web animation use animate.