Video Shotcraftby Vincentwei1021

Video Shotcraft Skill.

Turn a real product interface into a composed, inspectable video timeline.

Product Video
Remotion
Motion Design

Source Review · Video ShotcraftSKILL.md

Task Product Video Produces • A Remotion video project and rendered product film • A product-derived design specification, shot mapping, and storyboard • A reviewable timeline with capture assets and optional editable-project exports Before You Start Requires a Remotion/Node environment, browser capture, and ffmpeg. Some components need Three.js-related packages; optional music analysis and Jianying export add separate dependencies. Review Remotion's applicable license independently.

Editorial summary · source reviewed 2026-10-07 · not a generated example

01 What It Does

Video Shotcraft

A real-capture product-video pipeline that combines shot recipes, product visual tokens, deterministic Remotion implementation, sound, and final frame-based review.

Source-based workflowNot an execution benchmark

The Working Approach

Video Shotcraft is a production library and workflow for product videos. Its main subject is an actual web or desktop interface: page screenshots, element cutouts, and coordinates become the material for camera moves and feature demonstrations. The skill provides shot recipe cards, reference implementations, reusable components, audio assets, and an Ink Press template rather than asking the agent to invent every motion from a short description.

There are three separate full-video modes: adapting the existing template, autonomous creation, and guided co-creation. Choosing a mode changes the approval process, not the obligation to understand the product. Visual tokens should come from the product itself, while shot cards contribute motion structure. A final render, frame review, and sound treatment are part of the intended production path; none are established merely by generating a storyboard.

Expected Deliverables

A Remotion video project and rendered product film
A product-derived design specification, shot mapping, and storyboard
A reviewable timeline with capture assets and optional editable-project exports

See the Example Brief

From Brief to Review

01
Inspect And Choose A Mode
Read the product without changing its business code. Decide whether the existing template fits, whether creative decisions are delegated, or whether major decisions need guided approvals.
02
Establish Product And Sound Direction
Extract typography, spacing and materials from the product, identify safe demonstration states, and analyze user-selected music before storyboarding a beat-synced film. Plan real captures for existing UI rather than recreating it from memory.
03
Map Features To Shots
Select shot recipes and read their exact reference implementations. Plan timing, rests, captions and sound. In guided mode, obtain complete storyboard approval before final page and element capture; remove or replace sensitive data before capture in every mode.
04
Render And Inspect
Review still frames and complete renders, check timing and data safety, and obtain the documented independent final review. Where music is used, retain an alternate render without background music.

02 When to Use It

When to Use It

Requires a Remotion/Node environment, browser capture, and ffmpeg. Some components need Three.js-related packages; optional music analysis and Jianying export add separate dependencies. Review Remotion's applicable license independently.

A Good Fit

Software Product FilmsFits a feature story whose credibility depends on showing recognizable screens instead of an invented interface dressed in a cinematic style.
A Specific Motion TreatmentA single shot card can support an isolated motion task when a full promotional film is unnecessary.

Limits to Check

Runtime And Asset RightsRemotion and any supplied music, footage, or fonts carry their own terms. The skill's availability does not settle every dependency's commercial-use requirements.
Captures Can Expose DataCustomer, internal, personal, and credential information must be removed before capture. A visually successful frame is not acceptable if it reveals sensitive content.

Bring These Inputs

Product And Feature OrderProvide a local project, accessible page, or approved captures, plus the real features the film should explain.
Mode And ConstraintsChoose template adaptation, autonomous creation, or guided co-creation. State duration, aspect ratio, must-have shots, and nonnegotiable brand constraints.
Sound And Safe DataSupply cleared music if desired and identify which demonstration data can appear. Confirm replacements before screen collection begins.

03 Decisions That Matter

Decisions That Matter

Motion Recipes With Code
A recipe's actual implementation preserves details such as easing and masking that are easily lost when an agent improvises from the shot name alone.
Product Identity Survives
Separating motion structure from typography and materials allows an established effect to be adapted without imposing an unrelated promotional style on the product.

04 Try a Focused Brief

Try a Focused Brief

The example brief below has not been tested. Check the skill’s setup before using it.

Review the Setup

Use the complete repository with shot cards, demos, components, and template files. The source's rendering commands are not a general installation command.

Upstream Source File

https://github.com/Vincentwei1021/video-shotcraft/blob/5ddbf521038b0a7accfb6dc1e0a9eb29c67277ab/SKILL.md

Start With One Deliverable

Adapt the scope, source material and constraints in this brief before running the skill.

Example Brief

Use Video Shotcraft in guided co-creation mode for the supplied project. Make a short film explaining search, saved collections, and export using real UI captures with demonstration data only. Keep the product's existing type and colors. Propose the feature-to-shot mapping and complete storyboard before production, then render and review the result. Do not publish the film or upload source captures.

Inspect the Result

Check the actual output against these observable criteria.

Rendered UI frames match approved product states and contain no sensitive data.
Each selected shot maps to a concrete feature or narrative purpose.
The delivered render has been inspected as a complete sequence, not only as isolated still frames.

OpenDesign provides a local design workspace for coding agents. This listing does not mean the skill is bundled or that its external tools, credentials and software dependencies are included.

Download OpenDesign Read the Quickstart

05 Source and License

Source and License

This page describes the pinned source revision linked below. Upstream behavior and requirements can change.

Source Owner: Vincentwei1021
Repository: Vincentwei1021/video-shotcraft
Skill File: SKILL.md
License: Apache-2.0
Reviewed Snapshot: 2026-10-07 · 5ddbf521038b

Editorial Source Summary

A real-capture product-video pipeline that combines shot recipes, product visual tokens, deterministic Remotion implementation, sound, and final frame-based review.

Original summary by OpenDesign, based on the linked source. Repository stars are a dated popularity signal, not skill usage or a quality score.

06 Questions Before You Start

Questions Before You Start

Must I use the Ink Press look?

No. The template is one mode. Autonomous and guided creation can build a new direction, and even template adaptation should use the target product's visual identity.

Can I request only one animation?

Yes. The source supports using a single shot card and its reference implementation for a focused motion task.

Is an editable video-project export automatic?

The source describes an optional Jianying export route. It needs its own dependencies and platform checks, so it should be requested and verified separately from the main render.

OpenDesign

Make Room for the Next Design Iteration.

Keep your brief, source material and design work together in a local workspace. Check the skill’s own setup before adding it to your workflow.

Download OpenDesign Browse Design Skills