heygen-com · vanceingalls · Jun 3, 2026 · Jun 4, 2026 · Jun 4, 2026 · Jun 4, 2026
diff --git a/.claude-plugin/plugin.json b/.claude-plugin/plugin.json
@@ -1,7 +1,7 @@
 {
   "name": "hyperframes",
   "description": "HyperFrames by HeyGen. Write HTML, render video. Compositions, GSAP and runtime adapter animations, captions, voiceovers, audio-reactive visuals, and website-to-video capture for HyperFrames.",
-  "version": "0.6.70",
+  "version": "0.6.73",
   "author": {
     "name": "HeyGen",
     "email": "hyperframes@heygen.com",

diff --git a/.codex-plugin/plugin.json b/.codex-plugin/plugin.json
@@ -1,6 +1,6 @@
 {
   "name": "hyperframes",
-  "version": "0.6.70",
+  "version": "0.6.73",
   "description": "Write HTML, render video. Compositions, Tailwind v4 styles, GSAP and runtime adapter animations, captions, voiceovers, audio-reactive visuals, and website-to-video capture for HyperFrames.",
   "author": {
     "name": "HeyGen",

diff --git a/.cursor-plugin/plugin.json b/.cursor-plugin/plugin.json
@@ -2,7 +2,7 @@
   "$schema": "https://cursor.com/schemas/cursor-plugin/plugin.json",
   "name": "hyperframes",
   "displayName": "HyperFrames by HeyGen",
-  "version": "0.6.70",
+  "version": "0.6.73",
   "description": "Write HTML, render video. Compositions, Tailwind v4 styles, GSAP and runtime adapter animations, captions, voiceovers, audio-reactive visuals, and website-to-video capture for HyperFrames.",
   "author": {
     "name": "HeyGen",

diff --git a/.fallowrc.jsonc b/.fallowrc.jsonc
@@ -27,6 +27,9 @@
     "packages/producer/src/services/__fixtures__/crashOnMessageWorker.mjs",
     "scripts/*.{ts,mjs,js}",
     "scripts/*/run.mjs",
+    // Keyframe UI components — wired dynamically via EaseCurveSection/MotionPanel.
+    "packages/studio/src/components/editor/KeyframeDiamond.tsx",
+    "packages/studio/src/components/editor/SpringEaseEditor.tsx",
   ],
   "ignorePatterns": [
     "docs/**",
@@ -93,12 +96,30 @@
       "file": "packages/cli/src/commands/render.ts",
       "exports": ["resolveBrowserGpuForCli", "renderLocal"],
     },
+    // captureCost.ts: constants and helpers consumed by the runCaptureCalibration
+    // orchestration function and tests, but the entry-point graph doesn't
+    // reach them because the orchestrator's caller resolves them dynamically.
+    {
+      "file": "packages/producer/src/services/render/captureCost.ts",
+      "exports": [
+        "CAPTURE_CALIBRATION_TARGET_MS",
+        "MAX_MEASURED_CAPTURE_COST_MULTIPLIER",
+        "CAPTURE_CALIBRATION_PROTOCOL_TIMEOUT_MS",
+        "measureCaptureCostFromSession",
+        "logCaptureCalibrationResult",
+        "createFailedCaptureCalibrationEstimate",
+      ],
+    },
   ],
   "ignoreDependencies": [
     // Runtime/dynamic deps not visible to static analysis: tsup `external`,
     // dynamic require() resolution, peer/static-file consumption in tests,
     // and bun-hoisted workspace devDeps (e.g. happy-dom in root package.json
     // resolves for every workspace, so workspaces don't redeclare it).
+    // Required by @puppeteer/browsers and puppeteer-core at runtime; listed
+    // as a direct dep to guarantee installation even when transitive
+    // resolution fails (corrupted cache, dedup edge cases).
+    "debug",
     "puppeteer",
     "puppeteer-core",
     "esbuild",

diff --git a/.github/workflows/windows-render.yml b/.github/workflows/windows-render.yml
@@ -84,6 +84,7 @@ jobs:
     steps:
       - name: Disable Windows Defender real-time monitoring
         shell: pwsh
+        continue-on-error: true
         run: Set-MpPreference -DisableRealtimeMonitoring $true
 
       - name: Checkout
@@ -374,6 +375,7 @@ jobs:
     steps:
       - name: Disable Windows Defender real-time monitoring
         shell: pwsh
+        continue-on-error: true
         run: Set-MpPreference -DisableRealtimeMonitoring $true
 
       - name: Checkout

diff --git a/ADOPTERS.md b/ADOPTERS.md
@@ -16,9 +16,10 @@ If you'd rather not be listed publicly, that's fine — drop a note in [our Disc
 
 ## Production
 
-| Organization                             | Contact                                        | How HyperFrames is used                                                                                     |
-| ---------------------------------------- | ---------------------------------------------- | ----------------------------------------------------------------------------------------------------------- |
-| [HeyGen](https://www.heygen.com)         | [@jrusso1020](https://github.com/jrusso1020)   | Powers AI-generated video composition and rendering across HeyGen's video product surface.                  |
-| [tldraw](https://tldraw.com)             | [@steveruizok](https://github.com/steveruizok) | Generates automated pull-request walkthrough videos with GSAP-animated code diffs, narration, and captions. |
-| [TanStack](https://tanstack.com)         | [@AlemTuzlak](https://github.com/AlemTuzlak)   | Exploring HyperFrames for short-form code demo videos and documentation.                                    |
-| [OptinMonster](https://optinmonster.com) | Angie Meeker                                   | Exploring HyperFrames for marketing and product video content.                                              |
+| Organization                             | Contact                                        | How HyperFrames is used                                                                                       |
+| ---------------------------------------- | ---------------------------------------------- | ------------------------------------------------------------------------------------------------------------- |
+| [HeyGen](https://www.heygen.com)         | [@jrusso1020](https://github.com/jrusso1020)   | Powers AI-generated video composition and rendering across HeyGen's video product surface.                    |
+| [tldraw](https://tldraw.com)             | [@steveruizok](https://github.com/steveruizok) | Generates automated pull-request walkthrough videos with GSAP-animated code diffs, narration, and captions.   |
+| [TanStack](https://tanstack.com)         | [@AlemTuzlak](https://github.com/AlemTuzlak)   | Exploring HyperFrames for short-form code demo videos and documentation.                                      |
+| [OptinMonster](https://optinmonster.com) | Angie Meeker                                   | Exploring HyperFrames for marketing and product video content.                                                |
+| [reap](https://reap.video)               | [@usamaabid](https://github.com/usamaabid)     | Powers agent-first AI video clipping, editing, and rendering across reap.video's creator and agent workflows. |
diff --git a/CLAUDE.md b/CLAUDE.md
@@ -65,6 +65,42 @@ Never run `bun run --cwd packages/producer test:update` directly from the
 host to capture a baseline that will be committed — the resulting output.mp4
 will not match CI. Use it only for local-only experimentation.
 
+## Releasing
+
+All eight packages share one version. `.github/workflows/publish.yml` publishes
+them when a `v*` tag is pushed (it also accepts a manual `workflow_dispatch` with
+a version input). The CLI publishes as the unscoped `hyperframes` package; the
+other seven as `@hyperframes/*`.
+
+Cut a release from `main`:
+
+```bash
+bun run release:prepare <version>   # e.g. 0.6.72
+```
+
+Run it twice:
+
+1. **First run** writes `releases/v<version>.md` and prepends an entry to
+   `docs/changelog.mdx`, then stops with a non-zero exit. Edit both files: write
+   the 1–2 sentence summary and remove the `<!-- TODO -->` marker.
+2. **Second run** (after the TODO is gone) bumps every package and plugin
+   manifest, creates the `chore: release v<version>` commit, and tags
+   `v<version>` (lightweight).
+
+Then push to trigger the publish:
+
+```bash
+git push origin main --tags
+```
+
+Notes:
+
+- Pre-release versions (`0.6.72-alpha.1`) publish to the matching npm dist-tag
+  (`alpha`) instead of `latest`.
+- `--skip-changelog-check` skips the changelog gate for emergency releases.
+- The publish step skips any version already on npm, so re-running a failed
+  workflow run is safe.
+
 ## Skills
 
 Composition authoring (not repo development) is guided by skills installed via `npx skills add heygen-com/hyperframes`. See `skills/` for source. Invoke `/hyperframes`, `/hyperframes-cli`, `/hyperframes-registry`, `/tailwind`, or `/gsap` when authoring compositions. Use `/tailwind` for projects created with `hyperframes init --tailwind` so agents follow the pinned Tailwind v4 browser-runtime contract instead of Studio's Tailwind v3 setup. Use `/animejs`, `/css-animations`, `/lottie`, `/three`, or `/waapi` when a composition uses those first-party runtime adapters. Invoke `/hyperframes-media` for asset preprocessing (TTS narration, audio/video transcription, background removal for transparent overlays) — these commands have their own skill so the CLI skill stays focused on the dev loop. When a user provides a website URL and wants a video, invoke `/website-to-hyperframes` — it runs the full 7-step capture-to-video pipeline.
diff --git a/README.md b/README.md
@@ -71,6 +71,69 @@ Need ideas? Browse the [Showcase](https://hyperframes.heygen.com/showcase) for f
 - Docs-to-video, PDF-to-video, and website-to-video explainers
 - Reusable motion graphics for automated content pipelines
 
+## Frame.md
+
+**frame.md — your design system, ready for video.**
+
+Every brand has a `design.md`. None of them were written for a camera. `frame.md` is the missing translation layer: it takes your web-context design spec and inverts it for the frame — the same tokens, the same rules, but rewritten so an AI agent can compose a promo video without guessing at scale or reaching for web chrome.
+
+The output is a `DESIGN.md` superset your whole toolchain can read. Atoms stay sacred. Composition stays free. Numbers come from the script.
+
+<table>
+  <tr>
+    <td width="50%" align="center">
+      <a href="https://www.hyperframes.dev/design/biennale-yellow"><img src="https://static.heygen.ai/hyperframes-oss/docs/images/design-templates/biennale-yellow.png" alt="Biennale Yellow" width="100%"></a>
+      <br><b><a href="https://www.hyperframes.dev/design/biennale-yellow">Biennale Yellow</a></b>
+    </td>
+    <td width="50%" align="center">
+      <a href="https://www.hyperframes.dev/design/blockframe"><img src="https://static.heygen.ai/hyperframes-oss/docs/images/design-templates/blockframe.png" alt="BlockFrame" width="100%"></a>
+      <br><b><a href="https://www.hyperframes.dev/design/blockframe">BlockFrame</a></b>
+    </td>
+  </tr>
+  <tr>
+    <td width="50%" align="center">
+      <a href="https://www.hyperframes.dev/design/blue-professional"><img src="https://static.heygen.ai/hyperframes-oss/docs/images/design-templates/blue-professional.png" alt="Blue Professional" width="100%"></a>
+      <br><b><a href="https://www.hyperframes.dev/design/blue-professional">Blue Professional</a></b>
+    </td>
+    <td width="50%" align="center">
+      <a href="https://www.hyperframes.dev/design/bold-poster"><img src="https://static.heygen.ai/hyperframes-oss/docs/images/design-templates/bold-poster.png" alt="Bold Poster" width="100%"></a>
+      <br><b><a href="https://www.hyperframes.dev/design/bold-poster">Bold Poster</a></b>
+    </td>
+  </tr>
+  <tr>
+    <td width="50%" align="center">
+      <a href="https://www.hyperframes.dev/design/broadside"><img src="https://static.heygen.ai/hyperframes-oss/docs/images/design-templates/broadside.png" alt="Broadside" width="100%"></a>
+      <br><b><a href="https://www.hyperframes.dev/design/broadside">Broadside</a></b>
+    </td>
+    <td width="50%" align="center">
+      <a href="https://www.hyperframes.dev/design/capsule"><img src="https://static.heygen.ai/hyperframes-oss/docs/images/design-templates/capsule.png" alt="Capsule" width="100%"></a>
+      <br><b><a href="https://www.hyperframes.dev/design/capsule">Capsule</a></b>
+    </td>
+  </tr>
+  <tr>
+    <td width="50%" align="center">
+      <a href="https://www.hyperframes.dev/design/cartesian"><img src="https://static.heygen.ai/hyperframes-oss/docs/images/design-templates/cartesian.png" alt="Cartesian" width="100%"></a>
+      <br><b><a href="https://www.hyperframes.dev/design/cartesian">Cartesian</a></b>
+    </td>
+    <td width="50%" align="center">
+      <a href="https://www.hyperframes.dev/design/cobalt-grid"><img src="https://static.heygen.ai/hyperframes-oss/docs/images/design-templates/cobalt-grid.png" alt="Cobalt Grid" width="100%"></a>
+      <br><b><a href="https://www.hyperframes.dev/design/cobalt-grid">Cobalt Grid</a></b>
+    </td>
+  </tr>
+  <tr>
+    <td width="50%" align="center">
+      <a href="https://www.hyperframes.dev/design/coral"><img src="https://static.heygen.ai/hyperframes-oss/docs/images/design-templates/coral.png" alt="Coral" width="100%"></a>
+      <br><b><a href="https://www.hyperframes.dev/design/coral">Coral</a></b>
+    </td>
+    <td width="50%" align="center">
+      <a href="https://www.hyperframes.dev/design/creative-mode"><img src="https://static.heygen.ai/hyperframes-oss/docs/images/design-templates/creative-mode.png" alt="Creative Mode" width="100%"></a>
+      <br><b><a href="https://www.hyperframes.dev/design/creative-mode">Creative Mode</a></b>
+    </td>
+  </tr>
+</table>
+
+Browse and remix them all at [hyperframes.dev/design](https://www.hyperframes.dev/design).
+
 ## How It Works
 
 Define a video as HTML. Add data attributes for timing and tracks. Use GSAP, CSS, Lottie, Three.js, Anime.js, WAAPI, or your own frame adapter for seekable animation.
@@ -122,7 +185,7 @@ HyperFrames is the open-source rendering engine, plus a growing set of tools aro
 | Studio                                          | Available, evolving | Browser surface for previewing and editing compositions                                           |
 | AWS Lambda rendering                            | Available           | Deploy a distributed render stack and drive renders from your laptop or CI                        |
 | [hyperframes.dev](https://www.hyperframes.dev/) | Available           | Community playground for previewing, iterating, sharing, and rendering HTML-native video projects |
-| Design.HTML                                     | In development      | Visualize a brand identity and turn it into reusable, video-ready HyperFrames compositions        |
+| [frame.md](https://www.hyperframes.dev/design)  | Available           | Invert your design system for the camera — a DESIGN.md superset an agent can compose video from   |
 
 ## Catalog
 

diff --git a/bun.lock b/bun.lock