video-shotcraft: product films from real pages

About this Skill

Describe your product and the film you want. video-shotcraft helps the agent capture real pages, select shot recipes, plan the sequence, animate with Remotion, add music and sound effects, inspect the rendered frames, and deliver an MP4 with editable source. It supports the Ink Press template, independent creative production, guided collaboration, and individual shot adaptations.

Why we picked it

Useful for product launches and feature demonstrations built from your own website or app. The project combines reusable shot implementations with a complete production workflow and editing tools. Both animations on this page are the author’s official previews, compressed for display.

What it helps with

• Make a product launch or feature demonstration from an existing website or frontend project.
• Reuse a tuned camera move, typography sequence, transition, UI entrance, or data animation.
• Keep the Remotion source and use the Motion Workbench to revise text, timing, colours, shots, and audio.
• Export an optional JianYing draft for later editing of shot segments, captions, and audio tracks.

Install and choose a production mode

Run the official Skills CLI command, then ask your agent to use video-shotcraft for a product film. You can name Ink Press to reuse the template, authorize independent production, collaborate on the creative decisions, or request a specific shot from the gallery.

Official repository and installation guideOfficial Skill instructions

Shot recipes and reference implementations

The reviewed README describes 124 recipe cards and 150 shots across ten categories: opening and brand, camera, transitions, typography, UI entrance, interaction, data, light and emphasis, rhythm, and outro. The gallery lets you browse motion previews and copy shot names. Recipes link to the tuned Remotion implementations that the agent adapts to your product.

Official repository and installation guideOfficial Skill instructionsOfficial motion gallery

From product pages to the film

The workflow starts from the product’s actual appearance and useful features. The agent captures page textures and elements, plans the story, builds animation in code, adds beat-aware timing and sound design, and reviews rendered frames. The author’s workflow animation above shows this sequence.

Use screenshots and copy you can publish. Replace the template’s demonstration product with your own materials, and prepare anonymized or fictional data when a page includes customer or internal information.

Official repository and installation guideOfficial Skill instructionsProduction pipeline

Outputs and continued editing

The author’s standard output is a 1920 × 1080, 30 fps H.264 MP4, together with the Remotion project. Motion Workbench opens the authored shots, transitions, captions, and SFX as tracks, with visual controls for supported properties and a Remotion export path.

For a film with background music, the current skill instructions request both a BGM version and a version without BGM that retains sound effects, generated from the same timeline.

Official repository and installation guideOfficial Skill instructionsMotion Workbench guide

Optional JianYing export

JianYing export keeps the film as per-shot video segments, with native caption tracks and separate audio tracks. Camera movement and animation inside each shot are rendered into the video layer; captions, timing, segment order, and audio remain editable according to the export guide. The author reports testing on JianYing Pro 11.2 for macOS.

Official repository and installation guideJianYing export guide

Dependencies and asset terms

The skill’s code and documentation are Apache-2.0 licensed and can be installed from the original repository. Review Remotion’s own license and the per-file audio attribution before using those dependencies and assets for your project. Your agent or model provider may charge for usage.

Apache-2.0 licenseAudio sources and licensesRemotion license

Before you use it

• The author builds and tunes this skill for Claude Code and Codex. Provide access to your frontend project, public product pages, or suitable screenshots and brand assets.
• Node.js and npm are required for Remotion, the template, and Motion Workbench. FFmpeg and ffprobe support frame inspection and final checks.
• BGM beat analysis uses uv and a Python script. Page capture uses Puppeteer. Remotion downloads a headless browser on first render; the official guide includes headless Linux setup notes.
• The code and documentation use Apache-2.0. Remotion and bundled audio have separate terms; the audio attribution file identifies some older sounds whose sources need confirmation before commercial use.

Supported agents