kylezantos/design-motion-principles

Registry

Summary

A Claude Skill for motion design audits, trained on the design principles of Emil Kowalski, Jakub Krehel, and Jhey Tompkins. It provides context-aware, personalized feedback on animations tailored to each designer's specific style.

Key features

• Trained on principles of three renowned motion designers
• Provides context-aware feedback on animations
• Delivers personalized critiques per designer's style
• Built as a Claude Code skill for design audits

Use cases

• Motion design quality audits
• Learning animation principles from experts
• Getting style-specific feedback on UI animations
• Improving animation implementation in projects

README excerpt

# Design Motion Principles A motion and interaction design skill with **two modes** — **build** interactive components with purposeful motion, or **audit** existing animations. Both modes give context-aware, per-designer guidance drawn from three distinct motion-design lenses. Distilled from the publicly published work of **Emil Kowalski**, **Jakub Krehel**, and **Jhey Tompkins** (see [Credits](#credits)). ## Installation ```bash npx skills add kylezantos/design-motion-principles ``` Works with Claude Code, Cursor, Windsurf, and other AI coding assistants. ## What It Does The skill applies three distinct motion-design philosophies, weighted by your project's context: | Lens | Philosophy | Key question | Best for | |------|-----------|--------------|----------| | **Emil Kowalski** | Restraint & speed | "Should this animate at all?" | Productivity tools, high-frequency interactions | | **Jakub Krehel** | Production polish | "Is this subtle enough?" | Shipped consumer apps, professional refinement | | **Jhey Tompkins** | Creative experimentation | "What could this become?" | Kids apps, portfolios, playful contexts | The point isn't a single set of rules — it's the productive tension between three lenses that genuinely disagree. Emil would cut an animation Jhey would add. The skill weights them to your context instead of applying one philosophy everywhere. ### Two Modes **Create** — Build interactive components with motion baked in. The skill runs a light discovery (project context + which lenses to weight), then generates components — React, Framer Motion, CSS, or HTML — applying the right recipes, accessibility, and performance defaults. **Audit** — Review existing motion design. The skill does reconnaissance on your project, runs a motion-gap analysis (finds

Topics

No topics yet.