frankxai/awesome-motion-design-agent-skills106 installs
web-motion-auditor
Use when reviewing web animations, UI transitions, scroll effects, hover states, loading states, GIF/video captures, reduced-motion support, animation performance, or motion polish in HTML, React, Next.js, or Vercel apps.
How do I install this agent skill?
npx skills add https://github.com/frankxai/awesome-motion-design-agent-skills --skill web-motion-auditorIs this agent skill safe to install?
- Gen Agent Trust Hubpass
This skill is a set of instructional guidelines for auditing web animation quality and accessibility. It contains no executable code, script files, or network operations, and does not pose any security risks.
- Socketpass
No alerts
- Snykpass
Risk: LOW · No issues
What does this agent skill do?
Web Motion Auditor
Workflow
- Run or open the app.
- Inspect the animated states: load, hover, focus, click, route transition, scroll, empty/loading/success/error.
- Check accessibility:
prefers-reduced-motion- focus visibility
- no motion that blocks reading or interaction
- Check performance on desktop and mobile widths.
- Capture screenshots/video when possible.
- Score with the motion quality rubric.
- Return concrete fixes with file references.
Common Fixes
- Shorten transitions.
- Use transforms/opacity instead of layout-heavy properties.
- Reduce stagger count.
- Add reduced-motion branch.
- Replace decorative motion with state-explaining motion.
- Move complex narrative motion to Remotion or a controlled hero scene.
How can the creator link this skill?
Add the canonical catalog link to the repository README so users can inspect current installs and available audits. The publishing guide covers the complete discovery path.
<a href="https://skillzs.dev/skills/frankxai/awesome-motion-design-agent-skills/web-motion-auditor">View web-motion-auditor on skillZs</a>