
What Is Motion Video Kit?
Motion Video Kit is a Claude Code skill for creating premium, launch-style commercials for real businesses. It combines AI-generated footage, motion built with HTML and GSAP, selective Three.js scenes, measurable quality checks, and an independent review process.
The kit can also be used as plain context with other large language models. Its guidance is based on an analysis of 28 professional SaaS launch films and a sample commercial refined through five rounds of independent critique. The repository contains original analysis and links to reference films, but it does not redistribute footage from those films.
Motion Video Kit works best with HyperFrames for rendering, although its principles, prompts, and quality checks are renderer-agnostic.
Key Features
- The Gauntlet review loop: Separates the builder from the judge, uses fresh critics to assess the actual render, verifies findings item by item, and records work in a ledger.
- Motion grammar: Provides six motion rules, a catalog of 16 reusable mechanisms, pacing guidance, and notes on 28 reference films.
- Quality controls: Covers measurable checks such as frozen time, loudness, contrast, and brand color, alongside visual and business approval criteria.
- Audio guidance: Explains how to choose music for the buyer's customer, use sparse sound effects, and work toward defined mix targets.
- Business playbook: Includes commercial verticals with buying evidence, price anchors, a pilot-offer template, and honesty rules.
- Three.js patterns: Documents deterministic and seekable scenes, exploded layers with projected callouts, photographs placed in 3D context, animated option patches, and a realism checklist.
- Scripts and templates: Includes utilities for frozen-time measurement, loudness analysis, contact sheets, sound-effect softening, candidate selection, gain solving, isolated component testing, and projected overlays.
Prerequisites
The included scripts require ffmpeg and ffprobe. Your FFmpeg installation must include the ebur128 filter for loudness analysis.
Node.js 22 or newer and HyperFrames are optional. They are useful when working with the included component-lab template, but they are not required to apply the project's workflow, prompts, or review standards.
Check the required tools
ffmpeg -version
ffprobe -version
ffmpeg -filtersReview the filter output and confirm that ebur128 is available before relying on the loudness-measurement tools.
Install Motion Video Kit for Claude Code
Step 1: Clone the repository
git clone https://github.com/echris6/motion-video-kit.gitStep 2: Install the skill globally or locally
To make the skill available across all Claude Code projects, copy it into your user-level skills directory:
cp -r motion-video-kit/business-motion-film ~/.claude/skills/To install it for only one project, copy it into that project's local skills directory:
cp -r motion-video-kit/business-motion-film <your-project>/.claude/skills/After installation, ask Claude Code to create a business commercial, sample reel, or explainer. You can also provide an existing film and request a review.
Use the Kit with Another LLM
The project is not limited to Claude Code. For another LLM, place the contents of business-motion-film/SKILL.md in the model's context, then add only the reference files relevant to the task.
For example, include motion-grammar.md when designing transitions and pacing, audio.md when planning the soundtrack, or critic-prompts.md when evaluating a rendered film. This selective approach keeps the context focused while preserving the project's core rules.
Understand the Repository Layout
business-motion-film/
SKILL.md
references/
gauntlet.md
critic-prompts.md
motion-grammar.md
launch-film-notes.md
quality-bar.md
audio.md
business-offers.md
three-js-patterns.md
case-study-alder.md
scripts/
templates/
component-lab.html
projected-overlays.jsSKILL.md defines the main workflow and non-negotiable requirements. The references directory contains the detailed production, business, motion, audio, Three.js, and review guidance. The scripts directory contains measurement and media-processing utilities, while templates provides an isolated component lab and a projected-overlay module.
Create Your First Commercial
Step 1: Define the business and deliverable
Start with a concrete brief. Identify the real business, the product or service being promoted, the intended audience, and whether the deliverable is a commercial, sample reel, or explainer.
A useful initial request is:
Create a launch-style commercial for this business. Develop the visual direction, motion plan, audio approach, production workflow, and quality-review plan using the Motion Video Kit.
Provide genuine brand assets, approved messaging, and product facts whenever possible. Do not ask the model to fabricate customer outcomes or portray generated people and locations as authentic evidence.
Step 2: Plan motion before building scenes
Use references/motion-grammar.md to select motion mechanisms and establish pacing. The kit offers six core rules and 16 reusable mechanisms, allowing you to make deliberate choices rather than adding arbitrary movement.
If you need stylistic references, consult references/launch-film-notes.md. It contains written observations and links to 28 original films. Use these notes for analysis and direction; the repository does not grant rights to reuse the referenced footage.
Step 3: Choose the production technique for each shot
Combine techniques according to the needs of the scene:
- Use AI-generated footage when original visual material is needed.
- Use HTML and GSAP for precise, code-built motion.
- Use Three.js selectively when the concept benefits from spatial layers, 3D context, projected callouts, or option patches.
- Use the isolated component lab to refine individual components before integrating them into the full film.
Avoid treating Three.js as a default for every shot. The repository presents it as a selective tool and supplies a realism checklist to help prevent technically impressive but visually unconvincing results.
Step 4: Design the soundtrack
Consult references/audio.md when choosing music, sound effects, and mix levels. Match the music to the buyer's customer rather than selecting a track only because it feels fashionable. Keep sound effects sparse and clean so they reinforce important movement without crowding the mix.
The included scripts can help soften sound effects, identify candidates, solve gains, and measure loudness. Because the README does not prescribe command-line options for each script, inspect the relevant script before running it and follow its documented interface.
Step 5: Render and measure
Review the actual output rather than judging only a storyboard or source code. Use the provided tools and quality-bar guidance to check:
- Frozen or visually inactive time.
- Audio loudness.
- Contrast and readability.
- Correct use of brand color.
- Visual polish and business suitability.
Contact sheets can make it easier to inspect pacing, composition, visual repetition, and weak frames across the complete film.
Run the Gauntlet Quality Loop
The Gauntlet is a central part of Motion Video Kit. Its key principle is builder does not equal judge. The person or model that assembled the film should not be the only one deciding whether it is finished.
- Render the current version: Give critics the actual film rather than relying on descriptions or intended behavior.
- Use fresh critics: Obtain reviews from evaluators that were not responsible for building the piece.
- Record findings: Maintain a ledger of issues, decisions, and changes.
- Revise the film: Address the issues that are supported by the render and the project's quality criteria.
- Verify each item: Confirm individually that every claimed fix is visible or measurable in the new render.
- Repeat as needed: Continue until the film meets the measured, visual, and business ship criteria.
Ready-to-use prompts for component reviews, full-film reviews, verification, and storyboard criticism are available in references/critic-prompts.md. The worked example in references/case-study-alder.md shows how the broader process was applied to a complete project.
Basic Usage Examples
Generate a commercial plan
Using Motion Video Kit, create a production plan for a premium commercial for this real business. Include the concept, scene structure, motion mechanisms, audio direction, rendering approach, measurable checks, and Gauntlet review stages.
Review an existing render
Review this rendered commercial using the Motion Video Kit quality bar and full-film critic process. Separate measured issues from visual or business concerns, then produce an itemized verification ledger.
Evaluate a Three.js scene
Assess this Three.js scene using the kit's deterministic rendering contract and realism checklist. Check whether it is seekable and whether its spatial layers, callouts, and photographic elements remain visually credible.
Advanced Tips
Make Three.js scenes deterministic and seekable
For production rendering, build scenes whose state can be reproduced at a specific point in time. Deterministic, seekable behavior makes frame generation, debugging, revision, and review more reliable than motion that depends on uncontrolled real-time state.
Develop difficult components in isolation
Use templates/component-lab.html to work on individual motion components outside the complete film. Isolating a component reduces iteration time and makes it easier to compare timing, readability, and composition before integration.
Use projected overlays carefully
The templates/projected-overlays.js module supports overlay work associated with spatial scenes. Pair it with the documented Three.js patterns when building projected callouts or annotations that must stay connected to scene elements.
Keep review evidence concrete
Ask critics to cite visible frames, timing regions, or measured results. Then verify each correction against a new render. This prevents a revision ledger from becoming a list of claimed changes that were never confirmed.
Separate objective and subjective checks
Frozen time, loudness, contrast, and brand-color use can be checked systematically. Style, realism, persuasion, and client suitability also require visual and business judgment. A strong review process uses both categories instead of substituting one for the other.
Follow the project's honesty rules
Never present AI-generated imagery as a real customer, completed job, or proven result. Label generated material appropriately and preserve a clear distinction between conceptual visuals and factual business evidence.
Recheck commercial pricing data
The market prices in the repository are a September 2026 snapshot of public listings. Re-verify current pricing before preparing a quote, proposal, or pilot offer. Reach figures quoted from studio portfolios are claims made by those studios and should be treated accordingly.
Conclusion
Motion Video Kit provides more than a visual style guide. It combines production guidance, reusable motion patterns, audio practices, business positioning, measurable checks, and an independent-critic workflow for building launch-style commercials. Install it as a Claude Code skill or provide its files to another LLM, then use the Gauntlet to judge each real render before shipping.
The repository's text, scripts, and templates are available under the MIT License. Rights to the linked reference films remain with their respective owners.
