saas-motion-kit skill
A kit for software product promo videos on HyperFrames: 101 themes, a transition atlas and a repetition check for storyboards
- 254 ★ on the repository
- Last commit
Extended access
Why this level
- Scripts launch HyperFrames, Chrome and ffmpeg renders and write video files into the project directory
- The people layer calls paid models on fal under your key
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add skills/saas-motion-kitDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewExtended accessThe tool runs code or makes network calls and only reads external data.
- Scripts launch HyperFrames, Chrome and ffmpeg renders and write video files into the project directory
- The people layer calls paid models on fal under your key
This is third-party code. Review the repository files before installing.
What it does
saas-motion-kit teaches an agent to make promo videos for software products so that no two films look alike. The `saas-motion-video` skill runs seven stages: brief, components, theme, storyboard, build, sound and delivery. At every stage the agent stops and waits for a human decision. HyperFrames does the build, and the kit adds the process and creative rules. The repository holds 101 visual themes with frames and motion notes, an atlas of 24 narrative transitions and a tone matrix linking the tone of the message to speed, easing, colour and sound. The `variety_audit.py` script reads `STORYBOARD.md` and finds repeated effects, transitions and components, and a GitHub Action runs it on every commit. `pick_themes.py` shortlists themes for a tone and an audience and skips ones used recently. The rules ask you to use the product's real interface when it is clean and to invent a component when it is not. Other people's videos may serve as references only with the author's name and a link, and you may borrow techniques, not frames or music. The `breakdown.py` script splits a reference into shots. For people in frame there is a layer with generated characters who are never presented as customers.
Who it is for. Product founders and designers who make promo and release videos with Claude Code and want each one to differ from the last.
Good fit when
- You need a 45-second LinkedIn promo for a product URL, in a chosen theme, music-driven and with no voiceover
- A storyboard exists but the same transitions seem to repeat, and you want to check it with a script
- You want themes for a calm, precise tone aimed at developers, skipping ones used recently
- You liked someone else's video and want to break it into shots and borrow techniques with credit
Not a fit when
- You want a quick video without approvals at each stage: the process has seven stages with stops
- You want to use other people's footage, music or characters: the kit allows borrowing only techniques
- Node.js 22, ffmpeg and the HyperFrames skills are not installed: the build does not work without them
- You need a video in an environment without Claude Code: the `saas-motion-video` skill is written for it
Example request
/saas-motion-video Make a 45-second LinkedIn promo for my product URL, theme 055 Bento Grid, music-driven, no voiceoverLimitations
- It needs Node.js 22 or newer, ffmpeg and Claude Code. The HyperFrames skills are not included and are installed separately with `npx skills add heygen-com/hyperframes`.
- The people layer uses paid models on fal; footage stays out of Git and stand-in frames give you a preview.
- The themes and atlas are prompts and do not replace the video author's decisions: a human is needed at each stage.
- Finished videos sit in release attachments, not in the repository.
- The last commit is dated October 2026 and the current kit version is 1.4.
How to disable. Delete the `.claude/skills/saas-motion-video` folder from the project or from `~/.claude/skills` if you copied it there. The HyperFrames skills are removed separately from the agent's skills directory. Your video files stay in your project directory.
FAQ
How do I start saas-motion-kit?
Clone the repository, run `npx skills add heygen-com/hyperframes` and open Claude Code in the root. Then call `/saas-motion-video` with a description of the film. It needs Node.js 22 and ffmpeg.
What are the seven stages?
Brief, components, theme, storyboard with a creative pass, build, sound and delivery. After each stage the agent waits for a human decision.
What does variety_audit check?
The script reads the storyboard, finds repeated effects, transitions and components and checks reference links. The result can also be appended to the `~/.motion-ledger.json` ledger.
Can I use other people's videos?
Only as references, with the author's name and a link, and techniques like rhythm and transition types may be borrowed. Footage, music, characters and copy may not.
Are paid models required?
Not for the basic process. The people layer uses paid models on fal, and without them the film is assembled from stand-in frames.
Discussion
No questions or reviews yet.
Related
SkillsA skill that turns an article, README or website into a vertical HyperFrames promo video: brief and approval first, then assets, build and review
A skill for promo films and kinetic type: idea and storyboard before the build, MP4 rendered through Chrome and ffmpeg, checked by six gates
A skill for Claude Code and Codex that turns one sentence into a product launch film, scores the music and edits a frame on click
A skill that makes your agent film a short product video: concept, edit, sound and render on Remotion or HyperFrames
Fifteen Claude Code skills for launch films, animated charts and reels made entirely from code, with no After Effects
Motion Video Kit
motion-video-kit
A skill for business promo videos: a builder-not-judge loop, 16 motion techniques, Three.js patterns. Examples are other people's, frames are not distributed
Comparison with similar tools
Cards that share the main search query, and how they differ.
| Tool | Official | Repository stars | Main difference |
|---|---|---|---|
| saas-motion-kit (this card) | no | 254 | |
| HyperFrames | no | 79,556 | the render engine and base skills without the gated process or repetition check |
| HyperFrames Motion Director | no | 479 | directs motion inside HyperFrames, while this kit guides the whole path from brief to delivery |
README in short
The README states the main rule: no two films should look alike, and describes a kit of a process, 101 themes, a transition atlas and a repetition check. It then lists the news of versions 1.1 to 1.4, a quick start, examples of finished films and links to the theme gallery.
README badge
Original SKILL.md
---
name: saas-motion-video
description: Make a promo / motion video for a software product with HyperFrames, using the saas-motion-kit 7-stage process (brief → components → theme → storyboard → build → sound → deliver), the clean-or-imaginary component rule, the creative muscle (tone matrix, variety rules, component forge, transition atlas, variety audit) and the 101-theme gallery in docs/. Use when someone asks for a launch video, product promo, booth loop, feature reveal or social motion piece for an app, SaaS or developer tool.
---
# saas-motion-video
You are the producer. The user is the creative director. Run the stages in order and **stop at every gate** for a human decision. Keep the user's taste in the loop; that is what makes the film feel human-made.
**The one rule of this kit: no two films should feel like the same film.** Don't repeat effects, transitions or components (within the film, or from the user's recent films). Invent at least one new component per film. Decide the message and the tone before choosing any effect. Read `creative/README.md` before stage 4.
## Before starting
- The HyperFrames skills must be installed (`npx skills add heygen-com/hyperframes`). If `/hyperframes` is not available, ask the user to install them and restart the session.
- Read `playbook/README.md`. Read each stage file when you reach that stage.
## Stages
1. **Brief** (`playbook/01-brief.md`). Ask at most four questions: the one message, the channel/format, the sound (music, SFX, voice or silent) and the truth source (a URL or docs). Also ask whether they have reference videos they love. For each one, run `python tools/breakdown.py <video> --id NN --creator … --url …` and credit it in `REFERENCES.md` (`templates/REFERENCES.md`, `creative/references.md`): borrow grammar, never assets. Write `BRIEF.md` from `templates/BRIEF.md`. **Gate:** the user confirms the brief.
2. **Components** (`playbook/02-components.md`, `components/README.md`). If there is a URL, run `npx hyperframes capture`. Score the real UI and propose, per component, *real* or *imaginary*. Never invent capabilities, customers or statistics. **Gate:** the user approves the inventory.
3. **Theme** (`playbook/03-theme.md`). Suggest 2–3 themes from `docs/themes/data/*.json` that fit the audience (read their `summary`, `fit` and `best_for`). Start from `python tools/pick_themes.py --tone <the brief's tone> --audience "<audience words>" --history ~/.motion-ledger.json`, which skips the themes of the user's last five films. Redraw each candidate's proof-moment frame in the user's brand as a quick HTML still. **Gate:** the user picks one.
4. **Storyboard + creative pass** (`playbook/04-storyboard.md`, `creative/`). Write `STORYBOARD.md` from `templates/STORYBOARD.md`: first the **Message & tone** sentence ("I want to say ___ in a ___ tone, so the viewer feels ___"), then the **ledger** (one row per shot: entrance, transition, ease, direction, palette, camera, components, new component, sfx, notes), then the frames. Choose craft from `creative/tone-matrix.md`, transitions from `creative/transition-atlas.md` (plus HyperFrames' stock set), and forge at least one new component with `creative/component-forge.md`. Run `python tools/variety_audit.py STORYBOARD.md --history ~/.motion-ledger.json` and fix every warning, or mark a deliberate repeat as `motif:`. Then draw a one-page sketch sheet. Keep on-screen words to a minimum. **Gate:** the audit is clean (or every remaining warning is explained), and the stills read as a story with the sound off.
5. **Build** (`playbook/05-build.md`). Hand off to the HyperFrames workflow (`/product-launch-video` for a URL-driven promo, `/general-video` for loops and custom pieces). Keep every frame seek-safe and deterministic. Run `lint`, `snapshot` and `check`. **Gate:** the user approves the preview.
6. **Sound** (`playbook/06-sound.md`). Music-driven: build a beat grid first and cut on bars. SFX: use warm tuned timbres (`tools/warm_sfx.py`). Silent is a valid choice. **Gate:** the user approves the mix.
7. **Deliver** (`playbook/07-deliver.md`). Render at 4K, then run `tools/deliver.sh` to downscale. For loops, run `tools/loop_check.py`. Report the actual duration, size and path. Record the film so the next one avoids it: `python tools/variety_audit.py STORYBOARD.md --history ~/.motion-ledger.json --append "<film>" --theme <NNN>`. Every few films, offer `python tools/history_report.py ~/.motion-ledger.json -o motion-history.html` so the user can see what they keep reaching for. **Gate:** the user checks it on the target screen.
## Hard rules
- Official logos only. Never redraw a brand mark.
- For non-Latin characters, bundle `latin-ext` font subsets locally. Write uppercase text yourself instead of relying on CSS `text-transform` (which breaks Turkish i/İ).
- No progress bars, no gradient text, no pure #000/#fff, no bounce or elastic easing on UI.
- Fewer words. If the story needs reading, redesign the frame.
- Credit every reference video by name and link (`REFERENCES.md` and `ref:<id>` in the ledger; the audit enforces it). Never put someone else's footage, frames or music in a film or the repo.
- Every transition must answer "why this one, here?". No transition twice in a row, at least three transition families, one surprise every ~15 s.