Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →

lottiefiles/motion-design-skill

1 skill · 6.7k installs · 877 stars · GitHub

Install

npx skills add https://github.com/lottiefiles/motion-design-skill

Skills in this repo

1Motion DesignThe motion-design skill Applies motion design principles to create emotionally-driven, technically sound animations and transitions.Provides timing, easing, choreography, and Disney animation principles adapted for UI.Use when creating animations, transitions, micro-interactions, loading states, page transitions,scroll-triggered effects, or any motion work. Works with CSS, Framer Motion, GSAP, Lottie, Spring,or any animation system.. Motion Design Skill When to Apply Use this skill when: - Creating UI animations (buttons, cards, modals, page transitions) - Designing micro-interactions and feedback animations - Building loading, success, or error states - Animating illustrations or decorative elements - Planning scroll-triggered or progress-based animations - Establishing brand motion identity - Choreographing multi-element sequences **Decision tree:** 1. Does it serve a functional purpose (feedback, guidance)? → Timing rules for responsiveness 2. Does it express brand personality? → Motion Personality archetypes 3. Does it tell a story or guide attention? → Disney6.7kinstalls

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.

lottiefiles/motion-design-skill · 1 skills · Skillselion