video-shotcraft is an AI agent skill that turns Claude Code or Codex into a
motion-design studio: point it at your product and it storyboards, animates, and
sound-designs a cinematic promo, marketing, launch, or demo video with
Remotion — real page captures, 2.5D camera moves,
beat-synced cuts, and film-grade SFX included.
🔥 2026-08 · New in the series: video-talkcraft, for narration videos
video-talkcraft is the
narration-video installment of this series. Hand it a script plus a finished
voiceover and every motion beat locks to the voice: word-level timestamps
aligned locally (median 20–40 ms per character), 78 motion recipe cards, a
7-layer anti-slideshow shot system (continuous camera curves, parallax planes,
idle/yield lifecycle, breathing environment), plain-cut subtitles, and
triple-gate QA. Same recipe-card + Remotion workflow as here, retuned for
talking content.
🛠️ 2026-09 · New: the Motion Workbench — keep editing the delivered film in your browser
After delivery the skill opens a CapCut-style workbench
(node workbench/scripts/open.mjs <project>). The film is decomposed into
shot / transition / caption / SFX tracks exactly as authored; select any shot
and edit its copy, font sizes and colours in a schema-driven inspector, move,
trim or speed-ramp clips, drag any of the 216 demo motions in from the
library, then export with Remotion. Preview and render are frame-identical
(pixel-parity verified).
🌟 2026-08 · 48 new shot recipe cards — the library grows from 104 to
152 cards / 209 previews. Distilled from 209 candidate motions through
eight rounds of frame-by-frame review against reference footage, then folded
into the regular Gallery categories with full recipe cards, native Remotion
components (demos/<category>/<name>/<Component>.tsx, deterministic and
driven by the normalized progress t — see demos/README.md for the wiring
snippet), and motion previews. All de-branded: neutral placeholder copy and a
single swappable ACCENT color variable.
🎞️ 2026-08 · JianYing (CapCut CN) project export — after final delivery
the film can be exported as an editable JianYing draft: the plate is cut per
shot (retime/reorder/grade), captions are rebuilt as native text tracks
(content/size/color editable), SFX/BGM land on separate audio tracks.
Verified on JianYing Pro 11.2 for macOS; see
references/jianying-export.md.
🎬 Showcase
The 38-second Gallery intro below was itself produced with this skill —
storyboard, shot implementation, and sound design were all done by an agent
following the toolkit's methodology:
Browse every shot card and motion preview online: Gallery
— search, filter, switch between variants, and copy selected shot-card names.
🚀 Quick start
The most direct way: hand the repo link to your agent.
In Claude Code / Codex or a similar agent, just say:
Install this skill for me: https://github.com/Vincentwei1021/video-shotcraft
The agent will clone the repo and link it into your skills directory. Or install
with the skills CLI / manually:
npx skills add Vincentwei1021/video-shotcraft
git clone https://github.com/Vincentwei1021/video-shotcraft.git
cd video-shotcraft
ln -s "$(pwd)" ~/.claude/skills/video-shotcraft # Claude Code
# or
ln -s "$(pwd)" ~/.codex/skills/video-shotcraft # Codex
Then make requests like:
Use video-shotcraft to create a promo for my desktop product.
Use the deck-deal-flyin and row-embed shot cards to present this feature.
Design a product close-up inspired by spotlight-hero-card.
If no shot card is specified, the skill introduces the built-in video template
first and asks whether to use it; you can also pick shots in the
Gallery before starting.
📼 Video template: Ink Press
The skill ships with Ink Press — a validated, complete promo template:
36.2 seconds, 1920×1080, 30fps, 10 shots in a paper-ink-amber style, with 2.5D
real-page camera moves, title cards, transitions, and a fully pinned cinematic
SFX pass:
Use video-shotcraft to make a promo for my product with the Ink Press template.
The agent swaps in your product's screenshots, copy, and branding to reproduce
the same quality — the fastest, most reliable path to a finished film.
More templates are on the way.
Headless / CI notes
Rendering on a headless Linux box (tested: 2 cores, Node 22) hits three walls
worth knowing:
Concurrency cap — remotion still/render fails with "Maximum for
--concurrency is 2" on low-core machines. Fix: pass --concurrency=1.
Old Headless removal — recent Chrome/Chromium dropped old headless mode;
pointing Remotion at system chromium fails to launch. Fix: use a
chrome-headless-shell binary instead of full Chrome.
Blocked CDN — if remotion.media is unreachable, the automatic
headless-shell download is rejected. Fix:
--browser-executable=<path-to-local chrome-headless-shell>.
With these three flags, frame renders from the bundled template work.
📦 What's included
Content
Description
157 shot recipe cards
Purpose, energy, suggested duration, parameters, implementation notes, and known pitfalls
214 motion previews
Covering 214 styles; searchable and filterable in the online Gallery
Remotion implementations
Tuned TSX demos containing the actual easing and timing parameters for each card
Complete video template
A validated 36.2-second, 1920×1080, 30fps product promo with 10 shots
Capture, visual direction, storyboarding, sound design, beat sync, and final QA
JianYing project export
Load the film into JianYing (CapCut CN) for further editing — per-shot speed, captions, and audio all editable (verified on macOS 11.2)
Motion workbench
Browser timeline editor opened after delivery: split the film into tracks, edit exposed shot properties, retime, drag in any of the 216 demo motions, export via Remotion
The toolkit primarily targets web and desktop product promos, while individual
shot cards can also be used in feature demos, brand films, launch videos, and
other motion projects.
Audio files under assets/audio/ may be used according to their respective license terms.
See ATTRIBUTION.md for sources and license details.
SFX are organized into 16 scene/material categories (transitionimpactrisercamerauitextpaperfilmlightdatascifimechglassfluidcrowdcounter) — pick the category first, then the timbre. See
sound-design.md for the category index and per-file usage.
Product screenshots bundled with the template are demonstration assets. Replace them with
screenshots from the target product before publishing, and verify whether any product,
customer, or personal data needs to be anonymized.
🙏 Acknowledgements
Many shot recipes in this library were distilled by studying the motion language
of outstanding official product films — including promos from ClickUp,
Perplexity, Slack, Notion, Figma, Framer, Bear, Raycast, Pitch, Miro, Superhuman,
and Loom. The cards document motion techniques (timing, easing, choreography)
re-implemented from scratch; no footage, artwork, or brand assets from these
films are included in this repository. All trademarks belong to their respective
owners, and none of these companies are affiliated with or endorse this project.
Per-batch sourcing notes for the 48 cards added in 2026-08 live in
references/shots/ATTRIBUTION.md.
Special thanks to:
Remotion — the React-based video framework
that powers every demo and template here. Note that Remotion has its own
license
(free for individuals and small teams; companies may need a paid license).
Mixkit — source of the SFX and music assets bundled
under their free commercial license.
The game-feel and animation communities whose published principles (e.g.
Vlambeer's screenshake talks, classic animation timing) inform several cards.
Claude Code — this library itself was built, iterated, and QA'd with an
AI coding agent, using the same workflow the skill teaches.
Follow me
⭐ Star history
video-shotcraft (Vincentwei1021/video-shotcraft)
Choose a tag and it will appear here. With no tags selected, all catalog projects are shown.
Searching Database…
Choose a tag and it will appear here. With no tags selected, all catalog projects are shown.
What is video-shotcraft?An AI agent skill turning Claude Code or Codex into a motion-design studio: it storyboards, animates and sound-designs cinematic product/marketing/demo videos with Remotion - real page captures, 2.5D camera moves, beat-synced cuts and film-grade SFX.
What kind of tool is video-shotcraft?A TypeScript agent skill with 157 shot recipe cards, 214 styles, 214 motion previews and a production-ready Remotion template; the README describes 152 recipe cards and 209 previews in its header, plus a live gallery.
How do I use video-shotcraft?Install the skill into Claude Code or Codex, point it at your product, and it generates the storyboarded, animated, sound-designed video; browse 214 motion previews in the live gallery first.
What does video-shotcraft require?Claude Code or Codex as the host agent plus Remotion for rendering; after delivery, the Motion Workbench (node workbench/scripts/open.mjs) opens a CapCut-style browser editor for further editing.
What should I know about the video-shotcraft series?A newer series installment, video-talkcraft, targets narration videos: word-level timestamps aligned locally (median 20-40 ms per character), 78 motion recipe cards, a 7-layer anti-slideshow shot system, plain-cut subtitles and triple-gate QA - same recipe-card + Remotion workflow.
Who is video-shotcraft for?Developers and marketers producing cinematic promo, marketing, launch or demo videos via AI agents.
Where does video-shotcraft run?Locally with your agent (Claude Code/Codex) rendering via Remotion in Node.
Do I need a graphics card for video-shotcraft?Remotion renders via headless Chrome - a decent CPU matters more than a GPU.
What is the Motion Workbench?A post-delivery editor (opened via node workbench/scripts/open.mjs) that decomposes the film into shot/transition/caption/SFX tracks exactly as authored, letting you edit copy, font sizes and colors in a schema-driven inspector, and move, trim or speed-ramp shots in the browser.
Which license does the repository list?GitHub metadata lists Apache-2.0; the README excerpt does not restate it.
An AI agent skill turning Claude Code or Codex into a motion-design studio: it storyboards, animates and sound-designs cinematic product/marketing/demo videos with Remotion - real page captures, 2.5D camera moves, beat-synced cuts and film-grade SFX.