Development · GitHub repo
emilkowalski/skills
AI agent skills for UI animation, design engineering, and interface polish
A curated collection of agent skills (such as for Claude Code) authored by design engineer Emil Kowalski. It encodes interface design, fluid motion rules, and mobile web fixes into reusable instructions that AI coding agents can execute to audit codebases or build high-quality UI.
What it's for
- Audit codebase animations to generate prioritized, fix-ready findings reports with /improve-animations
- Build smooth UI animations using appropriate easing curves and durations instead of generic AI defaults
- Stress-test newly built interfaces against edge-case content and extreme data using /break-ui
- Fix common mobile web UX quirks like sticky hover states, viewport height bugs, and input zooming
Features
- /improve-animations: Scans codebase animations and outputs prioritized findings with exact locations and fix advice
- /animate and /animate-expo: Guidelines for building fluid web and React Native animations off the JS thread
- /apple-design: Interface design and fluid motion principles adapted from Apple WWDC guidelines
- /mobile-native: Fixes for iOS and Android web quirks like 100vh bugs, tap delay, and safe-area insets
- /break-ui: Automated checks to test components against extreme character lengths, counts, and empty states
- /pick-ui-library: Evaluates and selects well-maintained component and motion libraries
- /ask-sonner: Targeted guidance and recipes for integrating the Sonner toast notification library
Pricing
Open source. Free (MIT license)
Details
- Type
- GitHub repo
- Category
- Development
- Topic
- AI Coding Prompts
- Open source
- Yes
- Platforms
- Command line
- For
- Front-end engineers and design engineers using AI coding agents like Claude Code
- Tags
- claude code, ui design, animation, design engineering, agent skills, front end
Why it was saved
- @emilkowalski: Adds an animation-audit slash command to Claude Code: it maps a codebase, audits all animations against a catalog of animation principles, and outputs severity-ranked findings with exact locations and fix summaries that can be handed to cheaper models to execute.
Related
Portable agent skills that enforce design quality in AI-generated frontends
A CLAUDE.md template fixing common LLM coding pitfalls using four principles.
Claude Code skill to ground the agent in the current branch diff
Gallery of community prompts for generating Remotion videos with coding agents
Cursor rules to keep Claude 3.7 Sonnet focused and non-destructive
Curated design-engineering skills and constraints for coding agents
Updated