design-motion-principles

Audit UI motion design using expert principles from Emil Kowalski, Jakub Krehel, and Jhey Tompkins.

42|11|Updated Dec 26, 2025
One-click install
npx skills add https://github.com/petekp/claude-code-setup --skill design-motion-principles
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-motion-principles
Source: https://github.com/petekp/claude-code-setup/tree/main/skills/design-motion-principles
Command: npx skills add https://github.com/petekp/claude-code-setup --skill design-motion-principles

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides a structured audit of UI motion design, ensuring animations are purposeful, polished, and aligned with project goals by leveraging expert design philosophies.

Core Features & Use Cases

  • Expert Auditing: Analyzes UI animations through the lenses of Emil Kowalski (restraint, speed), Jakub Krehel (production polish), and Jhey Tompkins (experimentation, delight).
  • Contextual Analysis: Adapts recommendations based on project type and user intent.
  • Detailed Feedback: Offers specific, actionable insights for improving motion design, including enter/exit animations, easing, timing, and accessibility.
  • Use Case: Reviewing the animation suite for a new SaaS dashboard to ensure it feels responsive and professional without being distracting.

Quick Start

Audit the motion design in the provided UI code, focusing on Emil Kowalski's principles.

Frequently Asked Questions about design-motion-principles

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit UI motion design for a SaaS dashboard?

To audit UI motion design, this skill analyzes your animations and transitions through expert perspectives to ensure they are responsive, professional, and not distracting for productivity tools. It provides specific feedback on timing, easing, and enter/exit states tailored to your project context.

What are the best practices for UI animation timing and accessibility?

Best practices for UI animation timing and accessibility involve ensuring motion is purposeful and polished. This skill evaluates your duration, easing, and enter/exit states against established design principles, checking that animations remain contextually appropriate and accessible.

Can I review interaction design transitions for consumer apps?

Yes, you can review interaction design transitions for consumer apps. The skill adapts its motion design analysis based on your specific project type and user intent, ensuring animations provide the right level of polish and delight for consumer-facing interfaces.

How do I evaluate UI animation performance and easing curves?

Evaluating UI animation performance and easing curves requires checking if motion is purposeful and contextually appropriate. The skill applies expert design philosophies to your transitions, offering actionable insights to optimize performance and refine easing.

Does this motion design audit apply expert interaction design principles?

Yes, the motion design audit applies expert interaction design principles from Emil Kowalski, Jakub Krehel, and Jhey Tompkins. It analyzes your UI animations through lenses of restraint, production polish, and experimentation to ensure motion is polished and purposeful.

When should I not use complex animations in productivity tools?

Complex animations in productivity tools should be avoided when they distract from user tasks or degrade performance. This skill helps identify such limitations by auditing your motion design for restraint and speed, ensuring transitions remain professional and accessible.