auditing-animations

Audits motion across a codebase and writes prioritized animation fix plans.

Updated Aug 3, 2026
One-click install
npx skills add https://github.com/m-de-graaff/skills --skill auditing-animations-m-de-graaff
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: auditing-animations
Source: https://github.com/m-de-graaff/skills/tree/main/skills/auditing-animations
Command: npx skills add https://github.com/m-de-graaff/skills --skill auditing-animations-m-de-graaff

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Evaluating the motion quality of an entire product is hard to do systematically: easing, durations, transform origins, interruptibility, and accessibility issues are scattered across components, and fixes are often vague. This Skill surveys all animation in a codebase, vets each finding against the actual code, and produces self-contained implementation plans another agent can execute without any prior context. ## Core Features & Use Cases - Four-phase audit workflow: recon the motion stack and conventions, audit against animation principles, vet and prioritize findings by leverage, then write one plan per finding into plans/. - Scalable depth: choose quick, standard, or deep coverage depending on whether you want high-traffic components only or the whole repo including marketing pages. - Read-only by design: it never modifies source code, installs packages, or commits; the only files it writes are plans stamped with the current commit hash for drift detection. - Use Case: Ask for a motion audit of your React app before a design polish sprint. You receive a severity-ranked findings table plus executable plans with exact target easings, verbatim current code, and feel-check verification steps. ## Quick Start Audit the animations across this repository and write prioritized fix plans into the plans directory.

Frequently Asked Questions about auditing-animations

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit animations across an entire codebase?▼

Run a motion audit that maps where animations live (tokens, keyframes, transition props, gesture handlers), evaluates them against animation principles, and ranks findings by severity and leverage. This Skill performs that four-phase process and writes one executable plan per finding into plans/.

What is the difference between auditing animations and reviewing an animation diff?▼

An audit surveys motion across the whole product and produces a prioritized roadmap of fixes, while a diff review judges one specific change. Use auditing-animations for whole-app scope and reviewing-animations for a single pull request or diff.

Does the animation audit modify my source code?▼

No. The audit is strictly read-only on source code: no edits, installs, builds with side effects, or commits. The only files it writes are self-contained implementation plans under the plans/ directory.

Can the animation audit run on a large repository?▼

Yes. Depth scales from quick (high-traffic components, about five HIGH findings) to standard (all interactive UI) to deep (the whole repo including marketing pages). On large repos it can fan out across parallel agents, but only if the user explicitly asks for dispatch.

What makes an animation fix plan executable by another agent?▼

Each plan includes exact file paths with the current code verbatim, exact target values copied from animation principles, the repo's own conventions with an exemplar file, ordered single-edit steps, hard boundaries, and both mechanical and feel-check verification. Plans are stamped with the current commit hash so drift is detectable.