Design Engineer Auditor Package
Description
Expert motion and interaction design auditor based on **Emil Kowalski**, **Jakub Krehel**, and **Jhey Tompkins**' techniques. Get context-aware, per-designer feedback on your animations.
Installation
claude install-skill https://github.com/kylezantos/design-motion-principles README
Design Motion Principles
Expert motion and interaction design auditor based on **Emil Kowalski**, **Jakub Krehel**, and **Jhey Tompkins**' techniques. Get context-aware, per-designer feedback on your animations.
Installation
npx add-skill kylezantos/design-motion-principles
Works with Claude Code, Cursor, Windsurf, and other AI coding assistants.
What It Does
This skill audits your codebase's motion design through three distinct design philosophies:
| Designer | Philosophy | Best For |
|---|---|---|
| Emil Kowalski | Restraint & Speed | Productivity tools, high-frequency interactions |
| Jakub Krehel | Production Polish | Shipped consumer apps, professional refinement |
| Jhey Tompkins | Creative Experimentation | Kids apps, portfolios, playful contexts |
Key Features
- undefined
Usage
Once installed, just ask:
Audit the motion design in this codebase
The skill will:
- undefined
Example Output
## Reconnaissance Complete
**Project type**: Kids educational app, mobile-first PWA
**Existing animation style**: Spring animations (500-600ms), framer-motion
**Motion gaps found**: 4 conditional renders without AnimatePresence
**Proposed perspective weighting**:
- **Primary**: Jakub Krehel — Production polish for a shipped consumer app
- **Secondary**: Jhey Tompkins — Playful experimentation for kids
...
Related Skills
Algorithmic Art
When users request creating art using code, generative art, algorithmic art, flow fields, or particle systemsCreate generative art using p5.js with seeded randomness, flow fields, and particle systems
Design official Brand Guidelines
When brand colors, style guidelines, visual formatting, or company design standards applyApply Anthropic's official brand colors and typography to artifacts
Design official Canvas Design
When user asks to create a poster, piece of art, design, or other static pieceCreate beautiful visual art in PNG and PDF documents using design philosophy
Design official Frontend Design
When user asks to build web components, pages, applications, dashboards, or style/beautify web UICreate distinctive, production-grade frontend interfaces with high design quality
Design official Slack Gif Creator
When users request animated GIFs for SlackCreate animated GIFs optimized for Slack's size constraints
Design official Theme Factory
When user wants to apply a theme or styling to an artifactStyle artifacts with professional themes including 10 pre-set color/font combinations
Design official Related Agents
Html Css
| Web standards for semantic markup, maintainable styling, and accessibility. | - | [wshobson/agents](https://github.com/wshobson/agents) |
ui-visual-validator
| You are an experienced UI visual validation expert specializing in comprehensive visual testing and... | sonnet | [wshobson/agents](https://github.com/wshobson/agents) |
Refactor Clean
| You are a code refactoring expert specializing in clean code principles, SOLID design patterns, and... | - | [wshobson/agents](https://github.com/wshobson/agents) |