emilkowalski-motion
Motion-design follow-up skill inspired by Emil Kowalski's animation guidance. Use after an interface exists to add tasteful micro-interactions, state transitions, and page motion with product-grade restraint.
Profile →npx skills add nexu-io/open-design --skill emilkowalski-motion --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# Emil Kowalski Motion Follow-Up Use this skill after a design artifact already exists. The goal is to make the interface feel alive without turning it into a motion demo. ## Workflow 1. Inspect the current HTML, component, or selected page element before adding animation. 2. Pick the smallest set of motion moments that clarify state or hierarchy: - entry reveal for the primary content - hover / active feedback for important controls - transition between UI states - scroll reveal only when it helps the story 3. Prefer `transform` and `opacity`. Avoid animating layout properties such as `top`, `left`, `width`, or `height`. 4. Use one motion language across the artifact. Do not mix unrelated easings, durations, or physics. 5. Add `prefers-reduced-motion` fallbacks for any automatic or scroll-linked motion. 6. Keep copy, data, and layout intent intact unless the user explicitly asks for a redesign. ## Motion Rules - Default UI transitions should feel quick and useful: 140-220ms for most controls. - Larger page reveals can be slower, but must not block reading. - Avoid endless decorative loops unless they communicate status or progress. - Do not add custom cursors, noisy particle effec
- Workflow
- Motion Rules
- Implementation Notes
What does the emilkowalski-motion skill do?
Motion-design follow-up skill inspired by Emil Kowalski's animation guidance. Use after an interface exists to add tasteful micro-interactions, state transitions, and page motion with product-grade restraint.
How do I install it?
Run `npx skills add nexu-io/open-design --skill emilkowalski-motion --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From nexu-io/open-design, a repository with 83,577 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.