Skip to content

Commit 28e354b

Browse files
committed
docs(skills): add cloud render + variables to CLI skill, media-use generative use cases
The hyperframes-cli skill only documented self-managed AWS Lambda rendering; the zero-infra HeyGen-hosted `cloud render` path (a real, shipped command with its own docs page) was absent from every skill, so agents never surfaced it. - hyperframes-cli: add `cloud` to the frontmatter verb list + entry point; new Cloud and Variables sections; new references/cloud.md distilled from docs/deploy/cloud.mdx; routing + workflow rows. - media-use: add image-to-video recipe (heygen video create type:image) plus a table of other HeyGen generative use cases (photo avatar, digital twin, video translation, lipsync, voice design) in references/operations.md; surface them in the SKILL coverage/provider rows. - Sync README + docs/guides/skills.mdx catalog entries to mention cloud render.
1 parent 648e4e8 commit 28e354b

7 files changed

Lines changed: 236 additions & 39 deletions

File tree

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,7 @@ Atomic capabilities the creation workflows compose against — pull one when you
9090
| `/hyperframes-keyframes` | Seek-safe keyframe authoring across runtimes — GSAP timelines, CSS keyframes, Anime.js, WAAPI, FLIP, paths, masks, SVG morph/draw, 3D depth — plus `hyperframes keyframes` diagnostics for rendered motion. |
9191
| `/hyperframes-creative` | Non-animation creative direction — `frame.md` / `design.md`, palettes, typography, narration, beat planning, audio-reactive visuals, composition patterns. |
9292
| `/media-use` | The media OS — resolve any media need (BGM, SFX, image, icon, logo, voice, color grade, LUT) into a frozen local file or paste-ready block + ledger record, generate via TTS/music/image models when the catalog misses, transcribe, caption, remove backgrounds, and reuse assets across projects. One shared audio engine + manifest tracking. |
93-
| `/hyperframes-cli` | CLI dev loop — `init`, `lint`, `check`, `snapshot`, `preview`, `render`, `publish`, `doctor`, plus AWS Lambda cloud rendering (`lambda deploy / render / progress`). |
93+
| `/hyperframes-cli` | CLI dev loop — `init`, `lint`, `check`, `snapshot`, `preview`, `render`, `publish`, `doctor`, plus HeyGen-hosted cloud rendering (`cloud render`) and AWS Lambda rendering (`lambda deploy / render / progress`). |
9494
| `/hyperframes-registry` | Install and wire registry blocks and components into compositions via `hyperframes add`. Authoring a new block or component to contribute upstream. |
9595
| `/figma` | Import Figma assets, tokens, components, and storyboard sections → reconstructed motion (frames read as states, not slides) (REST/CLI) plus Motion animations (MCP) and shaders (MCP source / native export) into a composition. |
9696

docs/guides/skills.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,7 @@ Atomic capabilities the creation workflows compose against — pull one when you
9999
| `/hyperframes-keyframes` | Seek-safe keyframe authoring across runtimes — GSAP timelines, CSS keyframes, Anime.js, WAAPI, FLIP, paths, masks, SVG morph/draw, 3D depth — plus `hyperframes keyframes` diagnostics for rendered motion. |
100100
| `/hyperframes-creative` | Non-animation creative direction — `frame.md` / `design.md`, palettes, typography, narration, beat planning, audio-reactive visuals, composition patterns. |
101101
| `/media-use` | The media OS — resolve any media need (BGM, SFX, image, icon, logo, voice, color grade, LUT) into a frozen local file or paste-ready block + ledger record, generate via TTS/music/image models when the catalog misses, transcribe, caption, remove backgrounds, and reuse assets across projects. One shared audio engine + manifest tracking. |
102-
| `/hyperframes-cli` | CLI dev loop — `init`, `lint`, `check`, `snapshot`, `preview`, `render`, `publish`, `doctor`, plus AWS Lambda cloud rendering (`lambda deploy / render / progress / destroy / policies`). |
102+
| `/hyperframes-cli` | CLI dev loop — `init`, `lint`, `check`, `snapshot`, `preview`, `render`, `publish`, `doctor`, plus HeyGen-hosted cloud rendering (`cloud render / list / get / delete`) and AWS Lambda rendering (`lambda deploy / render / progress / destroy / policies`). |
103103
| `/hyperframes-registry` | Install and wire registry blocks and components into compositions via `hyperframes add`. Authoring a new block or component to contribute upstream. |
104104
| `/figma` | Import Figma assets, tokens, components, and storyboard sections → reconstructed motion (frames read as states, not slides) (REST/CLI) plus Motion animations (MCP) and shaders (MCP source / native export) into a composition. |
105105

skills-manifest.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,8 @@
2626
"files": 99
2727
},
2828
"hyperframes-cli": {
29-
"hash": "797fd624f0b83cb5",
30-
"files": 7
29+
"hash": "86362cdb0a7e5272",
30+
"files": 8
3131
},
3232
"hyperframes-core": {
3333
"hash": "690ebb3ba5420b90",
@@ -46,8 +46,8 @@
4646
"files": 10
4747
},
4848
"media-use": {
49-
"hash": "14d15dedf7acd4ed",
50-
"files": 124
49+
"hash": "2b0058b308cebffd",
50+
"files": 126
5151
},
5252
"motion-graphics": {
5353
"hash": "dafcdce07d221aa4",

skills/hyperframes-cli/SKILL.md

Lines changed: 39 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
name: hyperframes-cli
3-
description: HyperFrames CLI dev loop. Use when running npx hyperframes init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, render, publish, feedback, lambda, doctor, browser, info, upgrade, skills, compositions, docs, benchmark, telemetry, transcribe, tts, or remove-background (validate/inspect/layout are deprecated aliases covered by check), or when troubleshooting the HyperFrames build/render environment. Entry point for AWS Lambda cloud rendering (`hyperframes lambda deploy / render / progress / destroy / policies / sites`).
3+
description: HyperFrames CLI dev loop. Use when running npx hyperframes init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, render, publish, cloud, feedback, lambda, doctor, browser, info, upgrade, skills, compositions, docs, benchmark, telemetry, transcribe, tts, or remove-background (validate/inspect/layout are deprecated aliases covered by check), or when troubleshooting the HyperFrames build/render environment. Entry point for HeyGen-hosted cloud rendering (`hyperframes cloud render / list / get / delete`) and self-managed AWS Lambda rendering (`hyperframes lambda deploy / render / progress / destroy / policies / sites`).
44
---
55

66
# HyperFrames CLI
@@ -18,7 +18,8 @@ Everything runs through `npx hyperframes` unless project instructions specify a
1818
- Iterate: `npx hyperframes render --quality draft`
1919
- Deliver: `npx hyperframes render --quality high --output out.mp4`
2020
- CI / cross-host repro: `npx hyperframes render --docker --strict --output out.mp4`
21-
- Cloud (long / large): `npx hyperframes lambda render ./my-project --width 1920 --height 1080 --wait` (see Lambda below)
21+
- Cloud, zero-infra: `npx hyperframes cloud render` (HeyGen hosts the render; no local Chrome/FFmpeg/AWS, see Cloud below)
22+
- Cloud, bring-your-own-AWS: `npx hyperframes lambda render ./my-project --width 1920 --height 1080 --wait` (see Lambda below)
2223
7. **Report feedback** — after verifying the output, `npx hyperframes feedback --rating <1-5> --comment "..."` once per task (see Agent Conventions).
2324

2425
Run `check` before preview. It runs the linter first (and skips the browser entirely on lint errors), then does everything the old validate → inspect → snapshot sequence did in **one** browser session and one seek pass: runtime console errors and failed requests, layout defects (text spilling out of bubbles/containers or off canvas, held overlaps, occlusion), motion-sidecar verification (`*.motion.json` — entrances under seek, stagger order, in-frame, liveness), and WCAG contrast. Contrast failures are errors and carry the sampled fg/bg colors, measured vs required ratio, and a suggested compliant color, so most contrast fixes need no screenshot. Every finding carries a selector, `data-*` identity, composition source file, bbox, and sample time — jump straight to the HTML. Single-sample transients demote to info; findings held across samples gate the exit code (`--strict` gates warnings too). `validate`, `inspect`, and `layout` still work but are deprecated aliases of parts of `check`.
@@ -50,14 +51,16 @@ Cross-cutting rules that hold for every command:
5051

5152
## Routing
5253

53-
| Want to… | Read |
54-
| ---------------------------------------------------------------------------------------------------------- | ------------------------------------- |
55-
| Scaffold a project (`init`, `capture`, `skills`) | `references/init-and-scaffold.md` |
56-
| Check correctness (`lint`, `check`, `snapshot`, deprecated `validate`/`inspect`) | `references/lint-validate-inspect.md` |
57-
| Preview or render (`preview`, `play`, `render`, `publish`) | `references/preview-render.md` |
58-
| Diagnose the environment (`doctor`, `browser`) | `references/doctor-browser.md` |
59-
| Cloud render on AWS Lambda (`lambda deploy / sites / render / progress / destroy / policies`) | `references/lambda.md` |
60-
| Everything else (`info`, `upgrade`, `compositions`, `docs`, `benchmark`, `telemetry`, asset preprocessing) | `references/upgrade-info-misc.md` |
54+
| Want to… | Read |
55+
| ---------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- |
56+
| Scaffold a project (`init`, `capture`, `skills`) | `references/init-and-scaffold.md` |
57+
| Check correctness (`lint`, `check`, `snapshot`, deprecated `validate`/`inspect`) | `references/lint-validate-inspect.md` |
58+
| Preview or render (`preview`, `play`, `render`, `publish`) | `references/preview-render.md` |
59+
| Diagnose the environment (`doctor`, `browser`) | `references/doctor-browser.md` |
60+
| Cloud render, zero-infra HeyGen-hosted (`cloud render / list / get / delete`, `auth`) | `references/cloud.md` |
61+
| Cloud render on your own AWS Lambda (`lambda deploy / sites / render / progress / destroy / policies`) | `references/lambda.md` |
62+
| Parametrize / template renders (`--variables`, `--variables-file`, `--strict-variables`, `--batch`) | `references/cloud.md` + `hyperframes-core` (`variables-and-media.md`) |
63+
| Everything else (`info`, `upgrade`, `compositions`, `docs`, `benchmark`, `telemetry`, asset preprocessing) | `references/upgrade-info-misc.md` |
6164

6265
## Cross-Skill Hand-Offs
6366

@@ -66,6 +69,32 @@ Cross-cutting rules that hold for every command:
6669
- **Asset preprocessing** (`tts`, `transcribe`, `remove-background`) → use `media-use` for voice selection, Whisper model rules, captions, and TTS-to-captions chain.
6770
- **Parametrized renders** (`--variables`) → declared via `data-composition-variables` on `<html>`; see `hyperframes-core` for the full schema.
6871

72+
## Cloud (HeyGen-hosted rendering)
73+
74+
`hyperframes cloud render` is the **zero-infra** render path: the CLI zips your project, uploads it, renders on HeyGen's cloud, and downloads the mp4. No Chrome, no FFmpeg, no AWS, and you pay per credit. This is the default answer to "render this in the cloud"; reach for Lambda only when you already own AWS and need distributed/chunked rendering.
75+
76+
```bash
77+
npx hyperframes auth login # one-time sign-in (shared with the `heygen` CLI)
78+
npx hyperframes cloud render # zip, upload, render, download to renders/<id>.mp4
79+
```
80+
81+
Common flags: `--composition <html>`, `--output <path>`, `--quality draft|standard|high`, `--fps`, `--resolution 1080p|4k`, `--format mp4|webm|mov`, `--aspect-ratio` (auto-detected from `data-width`/`data-height`). Fire-and-forget with `--no-wait` + `--callback-url`; make retries safe with `--idempotency-key "$(uuidgen)"`. Manage jobs with `cloud list` / `cloud get <id>` / `cloud delete <id>`.
82+
83+
The idiomatic **template workflow is upload-once, re-render-many**: render a local project once to get its `asset_id`, then re-submit against that asset with different `--variables` (skips zip + upload). See `references/cloud.md` for the full flag set, the auth model, webhooks, and the template loop.
84+
85+
## Variables (parametrized / template renders)
86+
87+
Any render (local, cloud, or Lambda) can fill declared template slots at render time. Declarations live on the composition (`data-composition-variables`); the CLI surface is:
88+
89+
```bash
90+
npx hyperframes render --variables '{"title":"Q4 Recap","theme":"dark"}' --output q4.mp4
91+
npx hyperframes render --variables-file ./vars.json --output out.mp4
92+
npx hyperframes render --batch rows.json --output "renders/{name}.mp4" --strict-variables
93+
npx hyperframes cloud render --asset-id asst_abc123 --variables '{"name":"Ada"}'
94+
```
95+
96+
`--strict-variables` fails the render on any undeclared key or type mismatch (use it in CI). `--batch <rows.json>` renders one output per data row with `{key}`/`{index}` path placeholders and writes a `manifest.json`. For the **full schema** (declaring types, `data-var-src`/`data-var-text` declarative bindings, per-instance `data-variable-values` for sub-compositions, and precedence) use the `hyperframes-core` skill (`references/variables-and-media.md`). The cloud template loop lives in `references/cloud.md`.
97+
6998
## Lambda (Cloud Rendering)
7099

71100
`hyperframes lambda` deploys distributed rendering to AWS Lambda and drives renders from your laptop or CI. End-to-end is three commands:

0 commit comments

Comments
 (0)