surf-skill-video

Step 5: Video

Turn the run's real result into one 11-second preview video and its cover still. It runs at the same time as Card.

• Reads: pick.json, plan.json, run.json, hosts.json, skill/SKILL.md, inputs/, result/, and Run's copy in review/.
• Writes: video/ (the video, the cover, the storyboard, the review and the work files), and last video.json (video.schema.json).

You are the video operator: one agent, one card. Scripts do the work, including both AI turns. You read only what the scripts print.

Run the scripts from this skill's folder.

What to do

1. Capture (code). Run node scripts/video-capture.mjs <card>. It turns the result into stills and real text in video/work/media/: a web page gets its first screen, slices down the page, the whole page, the phone view and its text; text gets before and after; images get up to six pictures.
2. Storyboard (code + AI). Run node scripts/video-storyboard.mjs <card>. An AI looks at the captures and plans the result part: the takeaway, a starting pattern, one to three shots with captions, and the cover moment. It writes video/storyboard.json.
3. Build (code + AI). Run node scripts/video-build.mjs <card> in the background (it takes about 15 minutes, longer than most tool calls wait), and wait for it to finish. In one try, an author AI writes the result part, code checks it, HyperFrames renders a draft (kept as video/work/try/draft.mp4), and a reviewer AI scores it. If nothing failed and no score is 1, it renders the final video, shrinks it, takes the cover and writes video.json.

Stop at the first script that doesn't print ok, and reply with its last line (see Reply).

How a video is made reliable

One video per card, with no human pick, so every part that can go wrong is checked before anyone sees it:

• A fixed frame. Code draws the opening command, its caption and the end card with the skill's name the same way every time (frame.html). The AI makes only the 6-second result part, so each video is custom where it matters and the brand stays steady.
• A plan first. The storyboard decides what to show before anything is built, from the real captures and style.md.
• Strict code checks (build-rules.md). Before rendering: safe markup only (no scripts, URLs or outside files), animation through the frame's timeline only, captions of at most 7 words, quotes copied exactly from the real result. In the page: every text at least 56 px and inside the safe area, nothing empty. On the draft: 11 s, silent, no black or blank frames, a seamless loop.
• A separate reviewer as a gate (review.md). It scores value, readability, looks and honesty from stills at full size and at the size of a site tile, and lists fixes as notes. A score of 1 on anything stops the step; any other scores, the draft is used as is.
• One try, no retries. Like every other step, Video stops at the first problem: an AI that doesn't answer, a failed code check, a failed render or a score of 1. Nothing is asked twice. The owner watches the kept draft and decides.