App Store preview videos drawn frame by frame in code

What you end up with

The tradeoff the author points out: the renderer redraws the app's views by hand, so if a screen changes in the app the video will not update and nothing warns you.

What you get

• A plain-language summary of the workflow
• A fill-in prompt template
• What to watch out for
• A link to the original source

Who it is for

Builders who already use AI agents and want a proven workflow they can copy into their own project.

Works with

Solid chips: the agent is named in this listing's own tools list. Dashed chip: Plain Markdown, so it also pastes into other agents such as Grok Bot, Hermes, OpenClaw or Muse. We list those as compatible by format only, not as tested.

Tools needed

Cost to run: Free with the agent plan you already use.
Time to result: One working session

How it works

1. Read what they did

   Skim the source post linked below, then the summary on this page.

   Expected: You know the setup and the one rule that made it work.

2. Fill in the template

   Copy the prompt and replace every [bracketed] value with your own project details.

   Expected: A prompt that fits your project.

3. Run it once and check

   Run it on a small task first and confirm the result yourself before you trust it on real work.

   Expected: One verified run.

Sample prompt from the pack

Ask the agent to build a renderer that draws your key screens to image frames on a timeline
Drive captions and cuts from a list of timestamps
Generate or add a music track and encode with ffmpeg
Reuse the same sample data as your screenshots

Free preview of the file

# App Store preview videos drawn frame by frame in code

PaperChase agent use case (free feed entry), version 1.0. Source: [Roland Leth (@rolandleth)](https://roland.leth.ro/blog/tech/app-store-preview-videos-with-claude-code), 2026-10-24.

## What they did

For the app Reckon, every frame is generated in code at an exact time, so captions, camera moves and cuts land on the beat. A copy change is an edit and a re-render rather than a new recording. The video draws its screens from the same sample data as the screenshots, so the numbers match everywhere.

## Worth knowing

The tradeoff the author points out: the renderer redraws the app's views by hand, so if a screen changes in the app the video will not update and nothing warns you. Check every screen before re-rendering, and keep Apple's rule that previews show the app itself in mind.

Worth knowing

• The tradeoff the author points out: the renderer redraws the app's views by hand, so if a screen changes in the app the video will not update and nothing warns you. Check every screen before re-rendering, and keep Apple's rule that previews show the app itself in mind.
• Figures are as reported by the original author and were not re-measured by us.

Details

Version 1.0 · Updated Oct 26, 2026 · Markdown version of this page
License: Personal and commercial use. Credit the original source when you share the workflow. Download terms

Related

Prompt pack$29

Video Production with AI Agents: lanes, prompts, skills and render checks

by PaperChaseWebb

A Markdown playbook for making finished videos with Claude Code or Codex: pick a lane (draw in code, edit footage, script 3D or generate), plan with a shot list, render test frames, and make the agent check every render before you see it.

Works withClaude CodeCodexPlain .md

Creative and video · Intermediate · 20 min setup

Prompt packFree

Check every render before you trust it (free sample)

by PaperChaseWebb

One rule, one skill and four ffmpeg commands that make Claude Code or Codex look at its own video output (frames, cuts, loudness, captions) before it tells you it is done.

Works withClaude CodeCodexPlain .md

Creative and video · Beginner · 5 min setup