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 15 of 160Show everything
Remotion pieces
- _legacy (66 retired demos)66 demos removed from the library in October 2026, kept frozen only so old workbench projects still open. The repo says not to pick from…
- Brand.tsx (the repo's own logo and slogans)Link onlyThe video-shotcraft mark, wordmark, brand colors and pitch lines that the demos show on screen. It is the file to replace with your own…
- CaptionA small monospace caption line that fades in and out at the bottom of the frame for a given duration.
- ClipCardWraps a video file in a rounded card with an optional caption, and cross-fades a loop when the clip is shorter than the shot, so…
- ClipCardLooping (demo)The test scene for ClipCard: three cases of a looping clip inside a card. Needs a real mp4 in public/clips/, so the repo's smoke test skips…
- DigitRollOdometer-style rolling digits for monospace numerals.
- Fixtures.tsx (fake dashboard parts)Stand-in UI for demos: FakeDashboard, Card, TitleBlock and a gray palette. 647 lines; 23 demo files use it.
- FlashCutA warm-white bloom that flashes over a hard cut (10 frames by default). The flash-cut style of the shot-transitions card.
- helpers (rand, shake, camera, motion)Small pure functions with unit tests: seeded random (mulberry32), velocityAt, lagged follow, dampedSettle, handheld shake, and a three.js…
- Look.tsx (palettes and stage)Eight complete color looks (dark: midnight, aurora, ember, graphite, lime; light: paper, porcelain, sand), a type scale, and a lit Stage…
- 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.
- PageCamA 2.5D camera over a full-page screenshot: you give keyframes (frame, center x/y, zoom, tilt) and it flies the page. The base of every…
- PageCam2D.tsxA self-contained copy of the template's page camera for demos that fly over real screenshots (spotlight-hero-card, type-and-filter…
- Polish.tsx (eases and finish kit)The shared finish kit almost every demo imports: a CSS-equivalent bezier() ease maker, eight named eases (snappy, out, smooth, swift, exit…
- VerticalTickerLink onlyAn endless 3D wall of columns scrolling at different speeds (used by page-waterfall-wall). Its header says it was taken in from another…