# App Store preview videos drawn frame by frame in code

> Instead of recording the simulator, an iOS developer had Claude Code build a renderer that draws each frame of the App Store preview from the app's own screens, adds synthesized music and encodes it with ffmpeg.

- URL: https://paperchasewebb.ai/bots/marketplace/items/app-store-preview-videos-drawn-frame-by-frame-in-code/
- Type: Agent use case pack
- Category: Creative and video
- By: PaperChaseWebb
- Works with: Claude Code (named in the listing); Plain .md
- Price: Free USD
- Difficulty: Intermediate
- Setup time: 30 min
- Time to result: One working session
- Format: Markdown (.md) file, app-store-preview-videos-drawn-frame-by-frame-in-code.md
- Version: 1.0, updated 2026-10-26
- License: Personal and commercial use. Credit the original source when you share the workflow.

## 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.

## Tools needed

- Claude Code: built and runs the renderer
- ffmpeg: encodes the frames into video
- Synthesized audio: music track
- You need: An AI coding agent or chat model
- You need: A small real task to try it on

Cost to run: Free with the agent plan you already use.

## 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: Workflow template (Claude Code, ffmpeg)

```
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
```

Adapted by PaperChaseWebb. Not the original author's prompt.

## Free preview of app-store-preview-videos-drawn-frame-by-frame-in-code.md

````markdown
# 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.

## Questions

**Where does this come from?** A public post credited to Roland Leth (@rolandleth). Source: https://roland.leth.ro/blog/tech/app-store-preview-videos-with-claude-code

**Is it free?** Yes. Feed entries are free to read and download.

## How to get it

Free sample. Download it directly at https://paperchasewebb.ai/bots/marketplace/items/app-store-preview-videos-drawn-frame-by-frame-in-code/, no signup.

Seller: PaperChaseWebb Inc., mgmt@paperchasewebb.com
