video-shotcraft
Vincentwei1021/video-shotcraft · Apache-2.0 · 160 entries
A shot library for product promos in Remotion: 124 recipe cards holding 150 named moves. Each is a written recipe plus a tuned component. A film template and sound tools come with it.
- Get it
npx skills add Vincentwei1021/video-shotcraftTo use one recipe without the skill, copy its demo .tsx and the two or three files it imports from demos/_fixtures/.
- Needs
Remotion 4 and React 19, and FFmpeg for its checks. No Tailwind, no CSS files, no web fonts.
- Sends off your machine
Nothing by itself. A few of its tools go online when you run them: sound search on freesound.org, social upload, page capture.
- We watched it run
Four recipes rendered on a newer Remotion than the repo pins. The first two needed no code changes at all.
Lifting one recipe out took a three-line edit. In a tall frame it rendered, but the type stayed the same size, so a tall cut needs its sizes retuned by hand.
A recipe has no props. You change it by editing the file.
- Not tried here
The other 120 cards, the film template and the sound tools were read, not run.
- License
Apache-2.0
That covers code and docs. Not covered: the bundled sound files and music tracks. The author says 38 cards were worked out by studying other people's films and rebuilt from scratch.
Everything in it
Showing 10 of 160Show everything
Remotion pieces
- Motion.tsx (480x270 design stage)A DesignStage that scales a 480x270 design grid to the frame, plus an ease table and seg/lerp/rand helpers. 14 older demo files use it.
Shot recipes
- assemble-then-type-flyinTextless component shells fly in from every direction onto an empty dark grid, then every character arrives from 3D space with its own…
- card-stackEight cards spring up from below the frame one after another and pile into a single stack, then the whole pile fans out into a 3D arc as…
- carousel-3dEight cards sit on a circular ring laid out with sin and cos, spinning through exactly one full revolution while each card billboards…
- integration-hub-mapA page flips 180 degrees into an integration hub where five app icons pop in together and rainbow light tubes connect with pulses flowing…
- panel-grid-movesAn angled comic-panel split that cuts one moment into three framings before resolving to a poster.
- product-card-progressive-assembleA product card builds itself field by field as image, title and pills pop in, the old price gets struck through while an accent new price…
- quad-split-parallel-scenesThe frame hard-cuts into a 2×2 grid where four micro-scenes run in parallel — typing, a whip zoom, word pops, and a cursor interaction…
- scanline-assemble-flyinThe page starts as an empty dark grid; a scanline descends and each component flies in from off-screen to snap into place behind it, with…
- title-demote-to-labelA centered headline stands for a beat, then shrinks and slides to the top-left corner to become a section label as content grows beneath it.