New SKILL.md Workflow Helps AI Coding Agents Learn Motion and Interaction from Live Sites

A developer tool called web-reverse-engineer addresses a gap in AI-assisted coding workflows: the inability of static design files like DESIGN.md to capture runtime behaviors such as animation timing, cursor tracking, and scroll-triggered motion. While AI coding agents like Claude Code, Cursor, and Gemini CLI reliably follow design tokens for color, typography, and layout, the subtle interactive qualities that make websites compelling only exist in a running browser page. The web-reverse-engineer project ships as a portable SKILL.md workflow that instructs an agent to observe a public reference site's live behavior, extract the underlying design and motion principles, and use those observations to guide an entirely original implementation. The workflow explicitly avoids copying source code, stylesheets, or assets, focusing instead on deriving interaction patterns and animation logic from scratch under a different brand and visual identity. Three demo builds — including an ambient canvas animation, a cursor-tracking SVG eye, and a procedural sine-wave hero — were used to demonstrate the approach in practice.