Motion Design Skill — Official LottieFiles AI Agent Skill

Microinterações e transições suaves com lottie-web (best practices LottieFiles): renderer SVG, cleanup, performance (quality/subframe), eventos, presets por componente. API completa em references/lottie-web-cheatsheet.md, componentes React em references/lottie-react-patterns.tsx.

Quando usar (gatilhos concretos)

• Adicionar animações Lottie (JSON Bodymovin do After Effects) em React/Vue/vanilla
• Microinterações: fade-in de cards, hover/tap em botões, entrada de modais/toasts, loading, skeletons
• Animações SVG vetoriais leves (renderer SVG do lottie-web)
• Controlar playback (play, pause, seek, loop, speed, direction)
• Otimizar performance Lottie (quality, subframe, freeze/unfreeze, cleanup)
• Integrar Lottie em React com lottie-react (wrapper oficial)

Quando NÃO usar