ClaudeSuperPower

emilkowalski-motion

Skill

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.

Install

git clone https://github.com/nexu-io/open-design.git ~/.claude/skills/emilkowalski-motion

What is 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.

What this can do

Capabilities declared in this component's own frontmatter — not inferred.

Inherit all session tools

Declares no tool restrictions — inherits every session tool

~52 tokens of context used while enabled, before you invoke anything

Documentation

README · ~1 min read

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.

Reviews

Log in to leave a review.

No reviews yet — be the first.

Explore related

Other things in this space — across every part of the ecosystem, not just skills.