LottieFiles Motion Design skill: what it does and how to install it
Applies motion design principles to UI animations and transitions, with timing, easing, choreography and Disney principles, for CSS, Framer Motion, GSAP or Lottie.
Install
$ npx skills add LottieFiles/motion-design-skillRun it in a terminal. If your agent is already running, start a new session so it picks the skill up.
About this skill
What it does. Guides an agent through motion design decisions before it writes an animation: the emotional target, a motion personality (playful, premium, corporate or energetic), which property to animate, duration, easing, the hero element and supporting layers. It includes duration tables, easing rules, choreography and stagger patterns, and Disney animation principles adapted for UI.
When to use it. When you build UI animations, micro-interactions, loading and success states, page transitions or scroll-triggered effects with CSS, Framer Motion, GSAP, Lottie, springs or another animation system.
History
Repo stars
1.9k
Installs
No install data
Similar skills
- Design Motion PrinciplesBuilds or audits UI motion using the approaches of Emil Kowalski, Jakub Krehel and Jhey Tompkins, weighted to the kind of product you are making.
- GPT TasteA GPT-tuned variant of the taste skill, with enforced layout variance, editorial typography and GSAP scroll motion.
- High-End Visual DesignDefines the fonts, spacing, shadows, card structures and animations of agency-grade design, and blocks common AI defaults.