What problem does it solve?
Designers and builders often have a screen recording of a landing page, animation, or interaction they want to recreate, but translating video into precise build instructions is slow and error-prone. This Skill turns any reference video into a paste-ready, section-by-section prompt that an AI coding agent can use to rebuild the design.
Core Features & Use Cases
- Video Inspection: Uses ffprobe and ffmpeg to extract duration, dimensions, frame rate, and representative frames from local files, URLs, or uploaded videos.
- Layered Analysis: Breaks the video down into story, layout, motion, visual design, technical rebuild approach, and accessibility/performance requirements.
- Superprompt Generation: Produces a single fenced prompt covering asset maps, brand content, global design system, section-by-section anatomy, motion and scroll systems, WebGL/Three.js behavior, responsive rules, and anti-patterns.
- Use Case: You record a 20-second scroll-through of an award-winning landing page. The Skill extracts frames, identifies pinned sections and scroll-scrubbed video moments, and outputs a complete prompt that an agent can use to one-shot the HTML recreation.
Quick Start
Use the video-to-superprompt skill to analyze this reference video and write a super detailed prompt covering the design, animations, scroll interactions, typography, colors, and section-by-section storytelling.
