hyperframes 0.7.58 → 0.7.60
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cli.js +4334 -2360
- package/dist/commands/layout-audit.browser.js +54 -30
- package/dist/hyperframe-runtime.js +27 -27
- package/dist/hyperframe.manifest.json +1 -1
- package/dist/hyperframe.runtime.iife.js +27 -27
- package/dist/hyperframes-player.global.js +1 -1
- package/dist/skills/hyperframes/SKILL.md +103 -124
- package/dist/skills/hyperframes/references/capability-menu.md +47 -0
- package/dist/skills/hyperframes/references/pitch-round.md +40 -0
- package/dist/skills/hyperframes/references/route-briefs.md +85 -0
- package/dist/skills/hyperframes/references/skill-lifecycle.md +33 -0
- package/dist/skills/hyperframes/references/workflow-catalog.md +70 -0
- package/dist/skills/hyperframes-cli/SKILL.md +99 -109
- package/dist/skills/hyperframes-cli/references/beats.md +19 -0
- package/dist/skills/hyperframes-cli/references/cloud.md +8 -3
- package/dist/skills/hyperframes-cli/references/cloudrun.md +62 -0
- package/dist/skills/hyperframes-cli/references/compare-and-batch.md +105 -0
- package/dist/skills/hyperframes-cli/references/lambda.md +77 -24
- package/dist/skills/hyperframes-cli/references/lint-validate-inspect.md +3 -3
- package/dist/skills/hyperframes-cli/references/preview-render.md +15 -1
- package/dist/skills/hyperframes-cli/references/upgrade-info-misc.md +2 -0
- package/dist/studio/assets/{hyperframes-player-CtTDO63S.js → hyperframes-player-3XTTaVNf.js} +1 -1
- package/dist/studio/assets/{index-C47jAC3Q.js → index-D6etaey-.js} +1 -1
- package/dist/studio/assets/index-DXbu6IPT.css +1 -0
- package/dist/studio/assets/{index-DeQPzqwH.js → index-Dh_WhagG.js} +1 -1
- package/dist/studio/assets/index-cH6NfVV_.js +426 -0
- package/dist/studio/index.d.ts +12 -3
- package/dist/studio/index.html +2 -2
- package/dist/studio/index.js +13755 -8627
- package/dist/studio/index.js.map +1 -1
- package/dist/studio/styles/tailwind-preset.d.ts +5 -0
- package/dist/studio/styles/tailwind-preset.js +8 -1
- package/dist/studio/styles/tailwind-preset.js.map +1 -1
- package/dist/templates/_shared/AGENTS.md +5 -4
- package/dist/templates/_shared/CLAUDE.md +5 -4
- package/package.json +2 -2
- package/dist/studio/assets/index-B_UvTX3E.js +0 -423
- package/dist/studio/assets/index-uahwWkgw.css +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";var HyperframesPlayer=(()=>{var X=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var Ue=Object.getOwnPropertyNames;var Ve=Object.prototype.hasOwnProperty;var je=(r,e)=>{for(var t in e)X(r,t,{get:e[t],enumerable:!0})},ze=(r,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Ue(e))!Ve.call(r,n)&&n!==t&&X(r,n,{get:()=>e[n],enumerable:!(i=He(e,n))||i.enumerable});return r};var $e=r=>ze(X({},"__esModule",{value:!0}),r);var ut={};je(ut,{HyperframesPlayer:()=>Y,SPEED_PRESETS:()=>J,formatSpeed:()=>R,formatTime:()=>V});function be(r){return r.hasRuntime||r.runtimeInjected?!1:!!(r.hasNestedCompositions||r.hasTimelines&&r.attempts>=5)}function L(r){return typeof r=="object"&&r!==null}function ve(r){return L(r)&&typeof r.getDuration=="function"}function ge(r){return L(r)&&typeof r.duration=="function"&&typeof r.time=="function"&&typeof r.seek=="function"&&typeof r.play=="function"&&typeof r.pause=="function"}var We="https://cdn.jsdelivr.net/npm/@hyperframes/core@0.7.
|
|
1
|
+
"use strict";var HyperframesPlayer=(()=>{var X=Object.defineProperty;var He=Object.getOwnPropertyDescriptor;var Ue=Object.getOwnPropertyNames;var Ve=Object.prototype.hasOwnProperty;var je=(r,e)=>{for(var t in e)X(r,t,{get:e[t],enumerable:!0})},ze=(r,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Ue(e))!Ve.call(r,n)&&n!==t&&X(r,n,{get:()=>e[n],enumerable:!(i=He(e,n))||i.enumerable});return r};var $e=r=>ze(X({},"__esModule",{value:!0}),r);var ut={};je(ut,{HyperframesPlayer:()=>Y,SPEED_PRESETS:()=>J,formatSpeed:()=>R,formatTime:()=>V});function be(r){return r.hasRuntime||r.runtimeInjected?!1:!!(r.hasNestedCompositions||r.hasTimelines&&r.attempts>=5)}function L(r){return typeof r=="object"&&r!==null}function ve(r){return L(r)&&typeof r.getDuration=="function"}function ge(r){return L(r)&&typeof r.duration=="function"&&typeof r.time=="function"&&typeof r.seek=="function"&&typeof r.play=="function"&&typeof r.pause=="function"}var We="https://cdn.jsdelivr.net/npm/@hyperframes/core@0.7.60/dist/hyperframe.runtime.iife.js";function P(r){if(r===null)return null;let e=Number.parseInt(r,10);return Number.isFinite(e)&&e>0?e:null}function Be(r){let e=r?.querySelector("[data-composition-id][data-width][data-height]")??r?.querySelector("[data-width][data-height]");if(!e)return null;let t=P(e.getAttribute("data-width")),i=P(e.getAttribute("data-height"));return t!==null&&i!==null?{width:t,height:i}:null}var U=class{constructor(e,t){this._iframe=e;this._callbacks=t}_iframe;_callbacks;_interval=null;_runtimeInjected=!1;get runtimeInjected(){return this._runtimeInjected}start(){this.stop(),this._runtimeInjected=!1;let e=0;this._interval=setInterval(()=>{e++;try{let t=this._iframe.contentWindow;if(!t)return;let i=!!(t.__hf||t.__player),n=!!(t.__timelines&&Object.keys(t.__timelines).length>0),s=!!this._iframe.contentDocument?.querySelector("[data-composition-src]");if(be({hasRuntime:i,hasTimelines:n,hasNestedCompositions:s,runtimeInjected:this._runtimeInjected,attempts:e})){this._injectRuntime();return}if(this._runtimeInjected&&!i)return;let a=this._resolvePlaybackDurationAdapter(t);if(a&&a.getDuration()>0){this.stop();let d=Be(this._iframe.contentDocument);this._callbacks.onReady({duration:a.getDuration(),adapter:a,compositionSize:d});return}}catch{}e>=40&&(this.stop(),this._callbacks.onError("Composition timeline not found after 8s"))},200)}stop(){this._interval!==null&&(clearInterval(this._interval),this._interval=null)}resolveDirectTimelineAdapter(){try{let e=this._iframe.contentWindow;return e?this._resolveDirectTimelineAdapterFromWindow(e):null}catch{return null}}resolveDirectTimelineAdapterFromWindow(e){return this._resolveDirectTimelineAdapterFromWindow(e)}hasRuntimeBridge(e){return Reflect.get(e,"__hf")!==void 0||L(Reflect.get(e,"__player"))}_injectRuntime(){this._runtimeInjected=!0;try{let e=this._iframe.contentDocument;if(!e)return;let t=e.createElement("script");t.src=We,(e.head||e.documentElement).appendChild(t),this._callbacks.onRuntimeInjected?.()}catch{}}_resolveDirectTimelineAdapterFromWindow(e){if(this.hasRuntimeBridge(e))return null;let t=Reflect.get(e,"__timelines");if(!L(t))return null;let i=Object.keys(t);if(i.length===0)return null;let n=this._iframe.contentDocument?.querySelector("[data-composition-id]")?.getAttribute("data-composition-id"),s=n&&n in t?n:i[i.length-1],a=t[s];return ge(a)?a:null}_resolvePlaybackDurationAdapter(e){let t=Reflect.get(e,"__player");if(ve(t))return{kind:"runtime",getDuration:()=>t.getDuration()};let i=this._resolveDirectTimelineAdapterFromWindow(e);return i?{kind:"direct-timeline",timeline:i,getDuration:()=>i.duration()}:null}};var _e=`
|
|
2
2
|
:host {
|
|
3
3
|
display: block;
|
|
4
4
|
position: relative;
|
|
@@ -1,174 +1,153 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: hyperframes
|
|
3
3
|
description: >
|
|
4
|
-
|
|
5
|
-
video, animation, or motion graphic
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
or record a session, or names another framework. Most important when no
|
|
14
|
-
project CLAUDE.md or AGENTS.md describes the video workflow.
|
|
15
|
-
metadata: { "tags": "read-first, video, animation, router, hyperframes, intent-routing" }
|
|
4
|
+
Mandatory entry point: read this first for any request to make, create, edit, animate, or render a
|
|
5
|
+
video, animation, or motion graphic, including a promo, explainer, captioned clip, title card,
|
|
6
|
+
overlay, slideshow or interactive deck, Remotion port, or any HyperFrames HTML composition. Also
|
|
7
|
+
use it to inspect, diagnose, validate, preview, publish, or batch-render an existing HyperFrames
|
|
8
|
+
project. Inputs may be a website URL, GitHub PR, Figma design or URL, text or brief, existing
|
|
9
|
+
footage, or music. It resumes project state, captures intent when applicable, selects and installs
|
|
10
|
+
the owning workflow, and routes domain capabilities. HyperFrames is the default output framework
|
|
11
|
+
unless the user explicitly chooses another framework for the deliverable or asks only to record a
|
|
12
|
+
browser session.
|
|
16
13
|
---
|
|
17
14
|
|
|
18
|
-
# HyperFrames
|
|
15
|
+
# HyperFrames entry point
|
|
19
16
|
|
|
20
17
|
HyperFrames **renders video from HTML** — a composition is an HTML file whose DOM declares timing with `data-*` attributes, whose animation runtime is seekable, and whose media playback is owned by the framework. The full authoring contract lives in `/hyperframes-core`; read it before writing composition HTML.
|
|
21
18
|
|
|
22
|
-
|
|
19
|
+
## 1. Start from project state
|
|
23
20
|
|
|
24
|
-
|
|
21
|
+
Apply the first matching row; do not evaluate lower state rows:
|
|
25
22
|
|
|
26
|
-
|
|
23
|
+
| State | Action |
|
|
24
|
+
| ----------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
25
|
+
| Explicit port of existing Remotion source to HyperFrames | Read the `/remotion-to-hyperframes` section of `references/workflow-catalog.md`, then route directly to that workflow. Skip the intent layer. |
|
|
26
|
+
| Specific operation on an existing HyperFrames project: inspect, diagnose, validate, preview, render, publish, or batch-render | Perform only that operation. Skip intent and workflow routing; load `/hyperframes-cli` and any required domain skills. |
|
|
27
|
+
| Specific edit to an existing project | Make the edit. Do not run the intent layer. |
|
|
28
|
+
| `BRIEF.md` exists | Read `workflow` and `flow`. Execute that workflow; `flow: companion` always executes in `/general-video`. Ask no brief questions. |
|
|
29
|
+
| No brief, but `hyperframes.json` or `STORYBOARD.md` exists | Resume from project files and recorded preferences. Infer the owning workflow from existing artifacts. If it cannot be determined uniquely, ask one routing-only question; do not run the intent interview. |
|
|
30
|
+
| Fresh creation | Run the intent layer (§ 4), then route once using the rules below. |
|
|
27
31
|
|
|
28
|
-
|
|
29
|
-
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------ |
|
|
30
|
-
| **Author / edit an HTML composition** — the `data-*` contract, clips, tracks, sub-compositions, variables | `/hyperframes-core` |
|
|
31
|
-
| **Animate** — atomic motion, scene blueprints, transitions, runtime adapters (GSAP / Lottie / Three.js / Anime.js / CSS / WAAPI / TypeGPU) | `/hyperframes-animation` |
|
|
32
|
-
| **Author seek-safe keyframes** — GSAP timelines, CSS keyframes, Anime.js, WAAPI, FLIP, paths, masks, SVG morph/draw, 3D depth, plus `hyperframes keyframes` diagnostics | `/hyperframes-keyframes` |
|
|
33
|
-
| **Creative direction** — `frame.md` / `design.md`, palettes, typography, narration, beat planning, audio-reactive | `/hyperframes-creative` |
|
|
34
|
-
| **Media** — resolve/generate BGM, SFX, image, icon, brand logo, voice, color grade, LUT; TTS voiceover, transcription, background removal, captions; cross-project reuse | `/media-use` |
|
|
35
|
-
| **CLI dev loop** — init, lint, check, snapshot, preview, render, publish, doctor | `/hyperframes-cli` |
|
|
36
|
-
| **Install registry blocks / components** (`hyperframes add`) | `/hyperframes-registry` |
|
|
37
|
-
| **Import Figma content** — assets, tokens, components, storyboards→reconstructed motion (REST/CLI); Motion (MCP), shaders (MCP source / native export) | `/figma` |
|
|
32
|
+
Continue with source adapters in § 2. A direct or resumed workflow route skips §§ 3–4 and proceeds to workflow installation in § 5. A specific operation or edit skips §§ 3–5 and loads only the domain skills it needs from § 6.
|
|
38
33
|
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
# Intent routing — pick a workflow
|
|
42
|
-
|
|
43
|
-
This section knows only the top-level workflows; it does not load their internal references or the domain skills above.
|
|
44
|
-
|
|
45
|
-
## Before routing — confirm the input, not the spec
|
|
46
|
-
|
|
47
|
-
Routing needs to know **what the video is about** — its input and subject. If that's unspecified ("make a video about our thing" with no URL, product, topic, or asset), ask before entering any workflow — committing to a workflow IS the routing decision. At most two questions:
|
|
48
|
-
|
|
49
|
-
- **Input** — a product (URL / brief), a general website, a GitHub PR, a topic to explain, or an existing talking-head video?
|
|
50
|
-
- **Figma source** — if the input is a figma.com URL, `/figma` extracts assets/tokens/(components/storyboard) first, regardless of which workflow below is chosen for the video's shape; that workflow then builds from `/figma`'s output — never by driving Figma via raw MCP tools directly (skips SVG sanitization, provenance, and brand-token binding).
|
|
51
|
-
|
|
52
|
-
**Mode** — if the request carries an ongoing autonomous signal ("surprise me", "decide for me", "just build it"), note it and pass it into the workflow: the whole run goes autonomous and no later step re-asks. With no signal, the workflow asks the mode as its first brief question. Default is collaborative. (`/motion-graphics` is autonomous by design.) Semantics: `hyperframes-core` → `references/brief-contract.md`.
|
|
34
|
+
If a fresh request does not identify the subject or input, ask what the video is about before routing. Check preferences and recipes before asking anything (§ 4, step 1).
|
|
53
35
|
|
|
54
|
-
|
|
36
|
+
## 2. Adapt orthogonal inputs before routing
|
|
55
37
|
|
|
56
|
-
|
|
38
|
+
A Figma source changes **how assets and design enter the project**, not which workflow owns the deliverable.
|
|
57
39
|
|
|
58
|
-
|
|
59
|
-
| -------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
60
|
-
| `/product-launch-video` | **Selling a product** (SaaS, app, company / product site) — from a URL, brief, or script → a **promo**. The default for any commercial URL, even if the site is only named. |
|
|
61
|
-
| `/website-to-video` | **Showing a site itself** — a tour / showcase built from the site's own screenshots. For non-commercial sites (portfolio, blog, docs, personal, event), or when the user wants a tour, not a promo. |
|
|
62
|
-
| `/faceless-explainer` | **Explaining a topic / concept** from text — no product, no URL; every visual is LLM-invented |
|
|
63
|
-
| `/pr-to-video` | A **GitHub PR / code change** → changelog / feature-reveal / fix / refactor explainer |
|
|
64
|
-
| `/embedded-captions` | Adding **captions / subtitles** to an existing talking-head video (footage untouched) |
|
|
65
|
-
| `/talking-head-recut` | Packaging an existing talking-head video with **designed graphic overlays** — lower-thirds, data callouts, kinetic titles, pull-quotes |
|
|
66
|
-
| `/motion-graphics` | A short (~under 10s), **unnarrated** piece where the **motion _is_ the message** — kinetic type, a stat / chart hit, a logo sting, an animated map, an animated tweet / headline, a **standalone** lower-third / overlay (MP4 or transparent alpha) |
|
|
67
|
-
| `/music-to-video` | A **music track** → a **beat-synced** video — lyric video, slideshow, or kinetic promo; the music drives pacing (optional user images / videos cut onto the beat grid) |
|
|
68
|
-
| `/slideshow` | A **presentation / pitch deck / interactive deck** — discrete slides, fragments, branching, hotspots; output is a navigable **deck**, not a rendered video |
|
|
69
|
-
| `/general-video` | **Anything else** — longer or multi-scene pieces, a static loop / poster, a custom composition |
|
|
70
|
-
| `/remotion-to-hyperframes` | **Porting an existing Remotion (React) composition** to HyperFrames (migration, not creation) |
|
|
40
|
+
If any input is a `figma.com` URL:
|
|
71
41
|
|
|
72
|
-
|
|
42
|
+
1. For fresh creation, begin the intent layer (§ 4) and complete its memory and recipe reads.
|
|
43
|
+
2. During input triage, run `/figma` to extract assets, brand tokens, components, and storyboard frames when present. For an existing-project edit, run `/figma` without reopening intent.
|
|
44
|
+
3. Route the requested deliverable using the output from `/figma`, then continue only the selected route's unanswered intent questions.
|
|
45
|
+
4. Do not drive Figma through raw MCP tools. That bypasses SVG sanitization, `.media/manifest.jsonl` provenance, and brand-token `var()` binding.
|
|
73
46
|
|
|
74
|
-
|
|
75
|
-
- **A URL or script** — ask one thing: _is the site selling a product?_ **Yes** (SaaS / app / product / company site) → `/product-launch-video` — a promo, and the default for any commercial URL even if the site is only named. **No**, or the user just wants the site shown as-is (portfolio / blog / docs / personal / event) → `/website-to-video` — a tour. A GitHub PR link → `/pr-to-video`; a concept with no product or site → `/faceless-explainer`.
|
|
76
|
-
- **Existing footage** — plain spoken-word subtitles → `/embedded-captions`; designed overlay cards → `/talking-head-recut`. Neither edits the footage itself (re-timing / recolor / reframe / reorder / audio is NLE editing — out of scope).
|
|
77
|
-
- **A music track is the input** (an audio file, or a video to pull audio from) with **no narration** → `/music-to-video` — the music's beats/energy drive the pacing. (Narrated pieces stay with the input-matched workflow above; `/motion-graphics` is for short unnarrated motion that isn't music-driven.)
|
|
78
|
-
- **A presentation / pitch deck / interactive deck** (discrete slides, navigation, presenter mode) → `/slideshow` — output is a navigable deck, not a rendered video. An explicit "slideshow" request proceeds directly; an adjacent trigger ("deck / slides / presentation / convert this page") makes `/slideshow` confirm it's a slideshow before authoring, and switch to the appropriate non-slideshow workflow if not.
|
|
79
|
-
- **Length is a guide, not a gate** — intent picks the workflow; go to `/general-video` only when the piece is clearly longer than ~3 min, or is a static / loop / custom format.
|
|
47
|
+
A GitHub PR URL is not a website source. A named or adopted recipe already carries its workflow; confirm adoption through the intent layer, then route to that workflow.
|
|
80
48
|
|
|
81
|
-
##
|
|
49
|
+
## 3. Route fresh creation
|
|
82
50
|
|
|
83
|
-
|
|
51
|
+
Use the first matching row. Match the requested **deliverable**, not a word or file type mentioned in passing.
|
|
84
52
|
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
53
|
+
| Priority | Request | Workflow |
|
|
54
|
+
| -------- | ------------------------------------------------------------------------------------------------------------------ | -------------------------- |
|
|
55
|
+
| 1 | Explicitly port an existing Remotion source | `/remotion-to-hyperframes` |
|
|
56
|
+
| 2 | Author a presentation, pitch deck, or navigable interactive deck | `/slideshow` |
|
|
57
|
+
| 3 | Add plain captions or subtitles to existing talking-head footage without changing it | `/embedded-captions` |
|
|
58
|
+
| 4 | Add designed graphic overlays to existing talking-head, interview, or podcast footage without changing the footage | `/talking-head-recut` |
|
|
59
|
+
| 5 | Build a beat-synced video from a music track, with no narration or website capture | `/music-to-video` |
|
|
60
|
+
| 6 | Create an explicitly short, unnarrated, motion-first unit, typically under 10s | `/motion-graphics` |
|
|
61
|
+
| 7 | Explain a GitHub pull request or code change from a PR reference | `/pr-to-video` |
|
|
62
|
+
| 8 | Market or showcase a website, product site, app, or company from a URL or site-specific brief | `/product-launch-video` |
|
|
63
|
+
| 9 | Explain a topic, article, or notes with invented visuals and no product or site capture | `/faceless-explainer` |
|
|
64
|
+
| 10 | Any other custom video or composition | `/general-video` |
|
|
90
65
|
|
|
91
|
-
|
|
66
|
+
Before finalizing the route, read the matching section of `references/workflow-catalog.md`. It is the canonical input/output/trigger contract available before lazy-installed workflow skills are present. If the candidate does not satisfy that entry, continue routing instead of forcing the match.
|
|
92
67
|
|
|
93
|
-
|
|
68
|
+
### Resolve common ambiguities
|
|
94
69
|
|
|
95
|
-
|
|
70
|
+
- A short animated title, logo sting, stat hit, chart hit, map hit, or standalone lower-third is `/motion-graphics` when it is unnarrated and motion is the message. A static title card, narrated sequence, longer montage, or custom loop is `/general-video`.
|
|
71
|
+
- An explicitly short motion graphic may use a URL, tweet, article, or screenshot as source material. A generic “make a video from this site” request is `/product-launch-video`.
|
|
72
|
+
- Existing footage with captions routes to `/embedded-captions`; footage with designed information cards routes to `/talking-head-recut`. Retiming, reordering, recoloring, reframing, or remixing footage is a custom edit and falls through to `/general-video`.
|
|
73
|
+
- A music file selects `/music-to-video` only when its beat grid drives the piece. Music used as a bed does not override the subject-matched route.
|
|
74
|
+
- “I want a storyboard” changes the review process, not the workflow. With no other routing signal, use `/general-video`. A confirmed sketched board may itself be the requested deliverable; the review loop defines that stop point.
|
|
75
|
+
- Specialized narrative workflows support up to about 3 minutes and are strongest around 30–90s. Route a clearly longer piece to `/general-video`. Length never overrides an explicit port, deck, caption, overlay, or music-driven deliverable.
|
|
96
76
|
|
|
97
|
-
|
|
98
|
-
- **Workflow skills** — installed and refreshed at trigger time by the update step above (`skills update <workflow-name>`).
|
|
77
|
+
## 4. The intent layer — one conversation, before any workflow runs
|
|
99
78
|
|
|
100
|
-
|
|
79
|
+
Fresh creation only — § 1's state table already decides whether this section runs at all (edits, project operations, briefed and resumable projects, and explicit Remotion ports never enter it). One conversation at the front door turns "make me a video" into a confirmed brief — the route, the must-have answers, the run's shape, and everything else in the user's head — handed to whichever workflow executes and made durable as `BRIEF.md` (shape: `../hyperframes-core/references/brief-format.md`). Workflows own execution; this layer owns understanding. Every workflow's opening rule points back here, so the questions are asked once no matter which door the user came through.
|
|
101
80
|
|
|
102
|
-
|
|
103
|
-
- **Update:** `npx hyperframes skills update` — refreshes the core set plus everything installed to the latest, and removes skills no longer published. Without names it never installs workflows you haven't used; naming skills (`skills update <name…>`) additionally installs those.
|
|
104
|
-
- **Full set, explicitly:** `npx hyperframes skills` (or `npx skills add heygen-com/hyperframes --all`).
|
|
81
|
+
These reads are mandatory when their condition matches; do not replace them with recollection, and read only the matching section when a reference is organized by workflow:
|
|
105
82
|
|
|
106
|
-
|
|
83
|
+
| Condition | Read before acting |
|
|
84
|
+
| ----------------------------------------------------------- | ---------------------------------------------------------- |
|
|
85
|
+
| A route is a candidate, before confirming it | Its section in `references/workflow-catalog.md` |
|
|
86
|
+
| The route is known, before asking route-specific questions | Its section in `references/route-briefs.md` |
|
|
87
|
+
| Triage judged the request unformed, before any concept work | `references/pitch-round.md` |
|
|
88
|
+
| Offering optional capabilities or collecting supplied media | The route-filtered rows in `references/capability-menu.md` |
|
|
89
|
+
| Deriving `flow`, `storyboard`, mode, or canonical fields | `../hyperframes-core/references/brief-contract.md` |
|
|
107
90
|
|
|
108
|
-
|
|
91
|
+
**1 — Memory before questions.** Two reads, both mandatory, before anything is asked:
|
|
109
92
|
|
|
110
|
-
|
|
93
|
+
- **Remembered defaults.** Let `<MEDIA_DIR>` be the installed `/media-use` skill directory. For an existing project, `<MEMORY_ROOT>` is its root. Before scaffolding, use a deliberately nonexistent probe path with no `.media`, such as `/tmp/hyperframes-intent-memory-<run-id>`; never use the current workspace. Run `node <MEDIA_DIR>/scripts/prefs.mjs get --hyperframes <MEMORY_ROOT> --json`. Make each remembered value the recommended option and name its source. The pre-project probe sees only the personal tier; do not claim project provenance.
|
|
94
|
+
- **Recipes.** Run `node <MEDIA_DIR>/scripts/recipe.mjs list --hyperframes <MEMORY_ROOT> --json`. If the user names a recipe, says “like last time,” or a recipe matches the probable route, ask whether to adopt it before other brief questions — and make the offer earn the yes: say why it matches and what adopting saves (“this matches your launch-promo recipe — adopting fills destination, aspect, language, and the design spec; you'd confirm the message and the two run-shape questions”). When several match, list them and include “none.” An adopted recipe locks the fields it contains; ask only its missing fields and the run-shape questions. It does not remove review or render approval gates.
|
|
111
95
|
|
|
112
|
-
|
|
113
|
-
- **Output:** a product launch / SaaS **promo** as a HyperFrames composition → MP4 (sweet spot 30–90s) — the product's value is the subject, not a walkthrough of the site. For a plain tour of the site, use `/website-to-video`.
|
|
114
|
-
- **Triggers:** "launch video for X", "promo for our site", "explain my SaaS in a minute", "turn my script into a 60s promo", "text-only launch video, don't scrape".
|
|
96
|
+
**2 — Triage the input.** What is the video about — a website (sold or shown), a PR, a topic, a music track, existing footage? And is the request **formed** — the message, the material, and the occasion readable from what the user gave — or **unformed**, a subject with no take on it? Source material doesn't settle this by itself: a site, document, or PR carries its own thesis, but five tellings of that thesis are five different videos — a request whose only shape comes from its source ("make a video about this URL") is formed about the facts and unformed about the telling, and enters the round to pitch the telling. A formed request runs the layer exactly as it always has; nothing below is added for it. An unformed one goes through the pitch round after routing (step 4) and earns one question here, before anything is generated: what is the user already picturing? Their answer seeds the round (`references/pitch-round.md`). A user who says they don't know video at all gets that reference's decision map instead of a question sequence. For a genuinely exploratory request ("we need a video but I'm not sure what kind"), don't interrogate — establish the subject and what exists to show, one question at a time, then close by **recommending** a route plus how the run will review: a text storyboard first, on a live board, with optional wireframe sketches before the full build (`../hyperframes-core/references/review-loop.md`). The user hears the process before any workflow starts.
|
|
115
97
|
|
|
116
|
-
|
|
98
|
+
**3 — Pick the route** (the route table and ambiguity rules in § 3), then open that route's entry in `references/route-briefs.md`. It lists the must-have questions to ask now, the **deferred asks** to announce, whether the two run-shape questions apply, and which fields the pitch round may answer.
|
|
117
99
|
|
|
118
|
-
|
|
119
|
-
- **Output:** a site tour / showcase / social clip built from the site's own visuals → MP4.
|
|
120
|
-
- **Triggers:** "turn this website into a video", "site tour from ", "social clip from our homepage", "I just have a URL — make something".
|
|
100
|
+
**4 — The pitch round** — unformed requests only; formed requests and recipe adoptions go straight to the must-haves. Sample five concepts along five genuinely different paths, at least two from the distribution's tail, and present them all before recommending one — pick, mix, and redirect are all answers. Each pitch names the capability or two it rides, in the plain language of `references/capability-menu.md` — the toolbox experienced as concepts, not listed as a menu. On an autonomous run the same gate runs internally, and the heads-up names the direction chosen and the typical one left behind. The procedure — the sampling gate, the presentation discipline, and the decision map for users new to video — is `references/pitch-round.md`. The chosen concept answers the route's pitch-eligible fields and lands in `BRIEF.md` under `## Intent`; the capabilities it named are confirmed with it, under `## Customizations`.
|
|
121
101
|
|
|
122
|
-
|
|
102
|
+
**5 — The route's must-haves.** One question per field, recommended option first with its receipt (rules: `../hyperframes-core/references/brief-contract.md` § 3). Skip a question only when the request already answered it — inference is not an answer, but a chosen pitch is: fields the pitch round settled are locked with the pitch as their receipt. Then announce the route's deferred asks in one line ("after I probe the clip, I'll offer 2–3 caption identities") so the user hears the run's full shape before it starts.
|
|
123
103
|
|
|
124
|
-
|
|
125
|
-
- **Output:** faceless explainer → MP4, every visual LLM-invented per scene (typography / abstract / diagram / data-viz); ships the `pin-and-paper` preset. (sweet spot 30–90s).
|
|
126
|
-
- **Triggers:** "faceless explainer about X", "explain how DNS works as a video", "turn this article into an explainer", "explainer from my notes".
|
|
104
|
+
**6 — The two run-shape questions** — where the route's entry applies them, asked after the must-haves, each on its own:
|
|
127
105
|
|
|
128
|
-
|
|
106
|
+
- **(a) Storyboard?** Review the plan, wireframe sketches, and the finished piece pass by pass on a live board (`../hyperframes-core/references/review-loop.md`) — recommended for anything beyond a couple of scenes — or skip the board and get one finished video from the confirmed brief.
|
|
107
|
+
- **(b) Automation or companion?** **Automation** — the matched workflow's pipeline executes the brief end to end. **Companion** — build it together in `/general-video` with every HyperFrames capability on the table; the route's answers still describe the video, general-video executes them.
|
|
129
108
|
|
|
130
|
-
|
|
131
|
-
- **Output:** code-change explainer (changelog / feature-reveal / fix / refactor) → MP4 — diff highlights, before/after, file-tree + impact scenes. ≤ (sweet spot 30–90s).
|
|
132
|
-
- **Triggers:** "make a video about this PR", "turn PR #1187 into a changelog video", "release-notes video from github.com/org/repo/pull/123".
|
|
109
|
+
These two are **orthogonal — never merge them into one menu.** All four `flow` × `storyboard` combinations are valid user choices (a companion run reviews on the live board too when `storyboard: yes`); a flattened three-option list ("storyboard review / one shot / companion") silently makes companion-with-storyboard unselectable. When a diagram or source material summarizes the outcomes as three branches, that is the derived behavior (`brief-contract.md` § 1), not the question shape. In a form-style question UI, keep (a) and (b) as two separate selects.
|
|
133
110
|
|
|
134
|
-
|
|
111
|
+
Signals replace questions, never add them: an ongoing "just build it" / "surprise me" / "don't ask" locks `flow: automation, storyboard: no`, and every unanswered field becomes a decision with a receipt in the heads-up. A storyboard request, however phrased, locks `storyboard: yes`. Remembered `flow` / `storyboard` values reorder the recommendations — they never make either question disappear. The run's collaborative/autonomous execution mode derives from these two answers — the old first question is never asked; the canonical mapping is `../hyperframes-core/references/brief-contract.md` § 1.
|
|
135
112
|
|
|
136
|
-
-
|
|
137
|
-
- **Output:** the same footage **untouched**, with a caption layer — one visual identity picked from its catalog (36, from a quiet verbatim rail to full VFX constitutions); the subject occludes the embedded captions. Any length.
|
|
138
|
-
- **Triggers:** "add captions / subtitles to this video", "captions behind the subject", "cinematic captions for my clip".
|
|
113
|
+
**7 — Nice-to-have: recommend, then show.** Skip this step when the selected route brief says to skip the front-door capability offer. Otherwise, once the must-haves are locked, send one offer, not an interrogation — recommendations first, catalog on request. Capabilities the chosen pitch already named are settled with the concept — this step recommends from what the pitch didn't cover, and after a pitch round it is often just the two open asks and the design ask:
|
|
139
114
|
|
|
140
|
-
|
|
115
|
+
- **One or two rows** of `references/capability-menu.md` that this brief specifically calls for, each traced to something in the confirmed concept — a key number wants the count-up treatment, product shots want staging and a grade, a music bed means cuts on its grid. A suggestion that would fit any video fails that test; drop it. At most one may be a labeled **challenger**: higher ceiling, named cost (“the standard cut carries it; shader transitions would lift the close, at render-time cost”).
|
|
116
|
+
- **Material answered on arrival.** When the user hands over a logo, a clip, or data, answer with its concrete use (“the logo could close the video as a sting — want that?”) rather than silently filing it.
|
|
117
|
+
- **The two open asks stay:** anything here you want, and is there any material of your own (images, clips, logos, data) the video should carry?
|
|
118
|
+
- **The design spec keeps its own three-state ask** — use an existing spec, pick a shipped preset by eye, or leave the decision to the workflow (`capability-menu.md` § The design ask).
|
|
141
119
|
|
|
142
|
-
-
|
|
143
|
-
- **Output:** the same footage with timed **graphic-overlay cards** — kinetic titles, lower-thirds, data callouts, pull-quotes, side panels, picture-in-picture — synced to the transcript. Any length.
|
|
144
|
-
- **Triggers:** "package this video", "add graphic overlays / lower-thirds / data callouts to my talk", "turn this interview into a graphics-packaged edit".
|
|
120
|
+
The full route-filtered slice appears only when the user asks what else is possible. An accepted recommendation is a confirmed answer: when it lands on a preference-backed field (a preset, a voice, a caption identity), it records like any other confirmation, and `/media-use`'s promotion rules make it the next run's recommended default. Capture answers verbatim in `BRIEF.md` under `## Assets`, `## Customizations`, or `## Notes`. One round; silence or “no” moves on.
|
|
145
121
|
|
|
146
|
-
|
|
122
|
+
**8 — Hand off.** Three disciplines close the conversation (invariants: `../hyperframes-core/references/brief-contract.md` § 3):
|
|
147
123
|
|
|
148
|
-
- **
|
|
149
|
-
- **
|
|
150
|
-
- **
|
|
124
|
+
- **One integration check.** Read the combined answers for a consequence no single answer showed — vertical at 90 seconds with a chart-dense concept means charts a phone can't read — and surface it with a proposed adjustment now, not at the sketch pass.
|
|
125
|
+
- **Stated and inferred, apart.** Present the locked brief as one summary — deferred asks and the run's shape included — with what the user answered and what was inferred or defaulted as two visibly separate groups, receipts on both. The inferred group is where corrections live; an autonomous heads-up is mostly that group.
|
|
126
|
+
- **Revision is not confirmation.** When the user corrects the summary, fold the change in and present it again; never execute an edited-but-unconfirmed brief.
|
|
151
127
|
|
|
152
|
-
|
|
128
|
+
Then enter the workflow (`flow: companion` → `/general-video`; otherwise the matched route), installing it first per § 5. The workflow's Setup writes `BRIEF.md` from this summary as its **first action after `hyperframes init`** (never before — `init` refuses a non-empty directory), using canonical frontmatter values and preserving the user's important wording in the body — the chosen pitch, when there is one, under `## Intent`. It then records the preference-backed fields (`../hyperframes-core/references/brief-format.md` names the subset), and asks no brief question again.
|
|
153
129
|
|
|
154
|
-
|
|
155
|
-
- **Output:** a **beat-synced** HyperFrames composition → MP4 where the music drives pacing. Typography and templates are the floor (a complete video needs zero assets); any supplied media is cut onto the same beat grid (beat-cut / ken-burns). The genre — lyric video, slideshow, kinetic promo — emerges from the per-frame choices; the pipeline never branches on it.
|
|
156
|
-
- **Triggers:** "make a video for this song", "beat-synced video from this track", "lyric video", "turn this music into a video", "music visualizer / kinetic promo to this beat".
|
|
130
|
+
## 5. Install and enter the workflow
|
|
157
131
|
|
|
158
|
-
|
|
132
|
+
Before reading the selected workflow, install or refresh it and the core domain skills:
|
|
159
133
|
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
134
|
+
```bash
|
|
135
|
+
npx hyperframes skills update <workflow-name>
|
|
136
|
+
```
|
|
163
137
|
|
|
164
|
-
|
|
138
|
+
Use the bare name without `/`. If the command fails, surface the error; do not reconstruct the workflow from memory. Everything else about installation — the core-vs-lazy split, what `init` refreshes, diagnosis, CI opt-out, and the no-CLI fallback — lives in `references/skill-lifecycle.md`.
|
|
165
139
|
|
|
166
|
-
|
|
167
|
-
- **Output:** a HyperFrames composition (any length / format) via the original flow: design system → prompt expansion → plan → layout-before-animation → build (delegating to the `hyperframes-`\* skills) → validate.
|
|
168
|
-
- **Triggers:** "make a title card", "animate this", "a longer brand / sizzle reel", "a multi-scene composition", "a static loop / poster", any "make a video" that fits no row above.
|
|
140
|
+
## 6. Load domain skills on demand
|
|
169
141
|
|
|
170
|
-
|
|
142
|
+
| Need | Skill |
|
|
143
|
+
| ------------------------------------------------------------------------------------------------------------------- | ------------------------ |
|
|
144
|
+
| Composition structure, timing attributes, tracks, variables, determinism | `/hyperframes-core` |
|
|
145
|
+
| Motion rules, scene blueprints, transitions, runtime adapters | `/hyperframes-animation` |
|
|
146
|
+
| Seek-safe GSAP, CSS, Anime.js, WAAPI, FLIP, paths, masks, SVG, 3D keyframes, or `hyperframes keyframes` diagnostics | `/hyperframes-keyframes` |
|
|
147
|
+
| Design specs, concept, palette, typography, narration, beat planning | `/hyperframes-creative` |
|
|
148
|
+
| Images, icons, logos, audio, captions, grades, LUTs, reusable media | `/media-use` |
|
|
149
|
+
| Init, lint, check, snapshots, compare, batch render, Studio, render, publish, or diagnostics | `/hyperframes-cli` |
|
|
150
|
+
| Registry blocks and components | `/hyperframes-registry` |
|
|
151
|
+
| Figma assets, tokens, components, or storyboard frames as reconstructed motion | `/figma` |
|
|
171
152
|
|
|
172
|
-
|
|
173
|
-
- **Output:** a HyperFrames HTML composition translated from the Remotion source, graded against the Remotion render (SSIM eval harness + tiered test corpus).
|
|
174
|
-
- **Triggers:** "port my Remotion project to HyperFrames", "convert this Remotion comp", "migrate from Remotion".
|
|
153
|
+
Domain skills never take ownership of the end-to-end deliverable. Load only what the active workflow needs.
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
# Capability menu — what HyperFrames can bring to a video
|
|
2
|
+
|
|
3
|
+
One list, three readers. The **pitch round** (`pitch-round.md`) speaks it before anyone reads it as a menu: each pitch names the capability or two its concept rides, phrased from the middle column — the rows experienced inside concepts, which is how most users first learn what they're allowed to want. The **intent layer** (`/hyperframes` § 4, step 7) recommends from it — one or two rows the confirmed concept specifically calls for and the chosen pitch didn't already name, with the route-filtered slice shown when the user asks what else is possible. **`/general-video` in companion mode** uses the same list as its execution map — as its **trigger list**: each row's plain-language line is also the moment to offer it, when the conversation touches what the row does — and as each pass's **upgrade channel**: a plan, sketch, or build checkpoint may carry one or two traced offers pointed at material the user is looking at.
|
|
4
|
+
|
|
5
|
+
**Borrowing rule.** Capabilities marked with a home workflow live in that workflow's skill directory, and workflow skills install lazily. Before reaching across, run `npx hyperframes skills update <that-workflow>` with the bare name. Resolve the installed skill directory, invoke its script by absolute path, and pass the project root explicitly when the script accepts one. Keep the working directory at the project root. Never assume a sibling-relative path such as `../media-use` or `../music-to-video`; the project may live anywhere.
|
|
6
|
+
|
|
7
|
+
Each row's last column reads **home → entry → what you get**: the owning skill, the exact doc or command to start from, and the artifact that comes back.
|
|
8
|
+
|
|
9
|
+
| Capability | Say it to the user as… | Home → entry → what you get |
|
|
10
|
+
| ------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
11
|
+
| **Design spec (`frame.md`)** — one file that locks palette, type, and layout feel; every frame obeys it (the video-first sibling of a web `design.md`) | "a design system for the video — colors and typography stay consistent" | `/hyperframes-creative` → `references/design-spec.md` (what a spec is + resolution order); presets: `frame-presets/<name>/` (always installed — browsing needs no borrow); applying machinery `build-frame.mjs` (home: `/faceless-explainer`, `/product-launch-video`) → `frame.md` at the project root. How to ask: **§ The design ask** below |
|
|
12
|
+
| **Website capture** — headless-Chrome crawl of a real site: screenshots, brand tokens, assets | "I can capture your site and build from its real look" | CLI → `npx hyperframes capture <URL> -o ./capture` → `capture/` (screenshots, extracted tokens/text/assets); doctrine: `/product-launch-video` |
|
|
13
|
+
| **Beat analysis & audio-reactive motion** — a deterministic beat / energy map of a track; cuts land on the grid, elements pulse with the music | "if there's music, I can cut the video to its beat — and make elements move with it" | grid: `/music-to-video` → `scripts/analyze-beatgrid.py` → `audiomap.json` (beats, energy, sections); element reaction: `/hyperframes-creative` → `references/audio-reactive.md` + `scripts/extract-audio-data.py` |
|
|
14
|
+
| **Motion blueprints** — proven scene shapes (reveals, counters, charts, dioramas) picked per beat | "each scene gets a proven motion treatment, not improvised movement" | `/hyperframes-animation` → `blueprints-index.md` + `rules-index.md` → per-beat `blueprint:` ids the build reads |
|
|
15
|
+
| **Voice, music, SFX, images, logos, color grades** — generated or resolved from the catalog, frozen into the project | "narration in a voice you pick, background music, sound effects, brand logos — and a cinematic grade on images" | `/media-use` → `scripts/resolve.mjs` (one verb, incl. `--type grade`) + the audio engine `audio/scripts/audio.mjs` → frozen local files + `.media/manifest.jsonl` records / `audio_meta.json` |
|
|
16
|
+
| **Generative video** — an AI presenter delivers the script; a still photo becomes a talking clip; a finished video gets dubbed into another language | "an AI presenter can read your script on camera; I can animate a photo into a talking clip, or dub the video" | `/media-use` → `references/operations.md` § Generate: video (`heygen video create` / `video-translate`; OAuth free allowance where eligible) → an mp4 clip adopted into `assets/` + manifest record |
|
|
17
|
+
| **Transcription & captions** — word-timed transcripts; styled caption skins on the finished video | "accurate captions, styled to match" | `/media-use` → `scripts/transcribe.mjs` → word-timed transcript; caption machinery `captions.mjs` (home: `/faceless-explainer`) → the caption track |
|
|
18
|
+
| **Cut footage by its transcript** — trim a clip by choosing sentences, not timecodes | "I can trim your clip by picking the sentences to keep" | `/media-use` → `scripts/transcript-cut.mjs` → the trimmed clip + updated transcript |
|
|
19
|
+
| **Designed overlays on user footage** — kinetic titles, lower-thirds, data callouts synced to what's said | "your own clip can carry designed titles and info bars, timed to the speech" | the **whole ask** = the `/talking-head-recut` route — route there, don't rebuild it; **one scene inside a bigger piece** = `/hyperframes-animation` lower-third / callout blueprints + `/talking-head-recut`'s safe-zone thinking → overlay comps on the footage track |
|
|
20
|
+
| **Real map scenes** — a genuine basemap with located pins, routes, or a flight path | "for places and journeys — a real map, not a drawing of one" | `/motion-graphics` → `grounding/locate.mjs` (geocode) + `categories/maps/` (incl. `bake-basemap.mjs`) → a deterministic baked basemap + located pins |
|
|
21
|
+
| **Figma import** — assets, brand tokens, components, storyboard frames read as motion states | "if the design lives in Figma, I can build from it directly" | `/figma` → REST/CLI import (+ MCP for Motion/shaders) → sanitized SVGs, `var()`-bound brand tokens, frames-as-states |
|
|
22
|
+
| **Registry blocks** — 50+ installable scene compositions (data charts, device mockups, quote cards…) | "ready-made scenes we can drop in and restyle" | `/hyperframes-registry` → `npx hyperframes add <block>` → an installed sub-composition (wiring: `references/wiring-blocks.md`) |
|
|
23
|
+
| **Scene transitions** — cuts, crossfades, wipes, WebGL shader transitions between scenes | "how one scene hands off to the next — up to full shader wipes" | `/hyperframes-animation` → `transitions/overview.md` then `transitions/catalog.md`; assembly `transitions.mjs` (home: `/faceless-explainer`) → injected handoffs in the index |
|
|
24
|
+
| **User media on the timeline** — the user's own images / clips staged and woven into frames | "your own footage, screenshots, or photos placed into the video" | staging `stage-assets.mjs` (home: `/music-to-video`, `/product-launch-video`); adoption: `/media-use` `--adopt` → files in `assets/` + manifest records |
|
|
25
|
+
| **Publish to a stable link** — the finished piece on a public URL; re-publishing updates the same link | "when it's done I can publish it to a link you can share — updates keep the same URL" | `/hyperframes-cli` → `references/preview-render.md` (`npx hyperframes publish`) → a stable public URL |
|
|
26
|
+
|
|
27
|
+
Offer, don't unload: the intent layer recommends the one or two rows the confirmed concept itself calls for, states each as one plain-language line traced to the brief, and asks once — the route-filtered slice on request, the full table for the companion.
|
|
28
|
+
|
|
29
|
+
## The design ask — have it, pick it, or leave it
|
|
30
|
+
|
|
31
|
+
The design-spec row is a three-state question, not an explainer (what a spec **is** stays in `design-spec.md`):
|
|
32
|
+
|
|
33
|
+
- **They have one.** Brand guidelines, a `frame.md`, a `design.md` — note the path in `BRIEF.md` § Assets; the workflow reads it as brand truth (resolution order: `/hyperframes-creative` → `references/design-spec.md`).
|
|
34
|
+
- **They don't, but the look matters — show, don't name.** Pick 2–3 shipped presets whose look fits the content, tone, and audience (browse `/hyperframes-creative` → `frame-presets/`), and open each one's `frame-presets/<name>/frame-showcase.html` in the browser so the user picks **by eye**, never from a list of names. The choice lands in `BRIEF.md` as `style_preset` — a remembered preference key, so next run it's the recommended answer with a receipt. On a route that captures a real site, say the honest line as the showcases open: a showcase wears the preset's **own** palette, and the site's brand colors and fonts will be remixed onto whichever preset wins — **the pick is the layout bones, not the colors** — and offer the alternative of deferring the pick until after capture, when the look can be judged with the real brand in hand (a declared deferred ask; the sketch pass shows the remixed truth either way, before anything expensive is built).
|
|
35
|
+
- **They don't care — or nothing shipped fits.** Don't care: no further questions; the workflow's design step decides and says why. Nothing fits: announce the **design picker** as a deferred ask — the workflow's design step generates mood boards contextual to their content to choose from (`/hyperframes-creative` → `references/design-picker.md`); it needs a project and a generation pass, so it never runs inside the intent conversation.
|
|
36
|
+
|
|
37
|
+
## Genre lenses — the shipped workflows' taste, borrowable
|
|
38
|
+
|
|
39
|
+
The narrative workflows carry genre-tuned design references — `story-design.md` (narrative archetypes and beats), `visual-design.md` (the genre's look), `motion-language.md` + `cut-catalog.md` (motion and cut doctrine). When a companion or freeform piece resembles a genre, read that workflow's lens before planning or building in it (borrowing rule above):
|
|
40
|
+
|
|
41
|
+
| The piece resembles… | Borrow from |
|
|
42
|
+
| ---------------------------------------- | ----------------------------------------------------------------------- |
|
|
43
|
+
| a product promo / launch / site showcase | `/product-launch-video` → `references/` |
|
|
44
|
+
| a topic / mechanism / concept explainer | `/faceless-explainer` → `references/` |
|
|
45
|
+
| a code-change walkthrough | `/pr-to-video` → `references/` (+ `code-vocabulary.md` for code frames) |
|
|
46
|
+
|
|
47
|
+
`motion-language.md` and `cut-catalog.md` are near-identical across the three — take them from the genre you already resembled, or `/faceless-explainer`'s as the neutral default. **Borrow the shape and the taste, never the machinery**: their scripts and directory rules belong to their pipelines; the generic back half of any build lives in `hyperframes-core/references/production-loop.md`.
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
# Pitch round — the intent layer's divergent step
|
|
2
|
+
|
|
3
|
+
Everything else in the intent layer converges: recommended options, receipts, one question per field. This step diverges. An unformed request has nothing to converge on — "make us a video about the launch" answers no creative field, and asking `message` as a form question hands the user the very blank they came to have filled. So before the form, pitch: five concepts, sampled wide, offered once.
|
|
4
|
+
|
|
5
|
+
## When it runs
|
|
6
|
+
|
|
7
|
+
Triage (`/hyperframes` § 4, step 2) marks the request formed or unformed; only unformed requests enter the round, and only on routes whose `route-briefs.md` entry names pitch-eligible fields. A recipe adoption skips the round — the bundle already carries an approved concept. An autonomous signal never skips it; it moves the round inside (§ The gate, alone).
|
|
8
|
+
|
|
9
|
+
Before generating anything, ask what the user is already picturing. An existing idea seeds the round as a pitch of its own and is never displaced by generated ones; a fully formed picture ends the round before it starts — that picture is the concept, and the layer returns to its questions.
|
|
10
|
+
|
|
11
|
+
## The sampling gate — internal, always
|
|
12
|
+
|
|
13
|
+
Run this before writing any pitch, in every mode. None of it is shown to the user.
|
|
14
|
+
|
|
15
|
+
First, four questions about this brief, answered specifically, not generically:
|
|
16
|
+
|
|
17
|
+
1. **What does the subject look like?** Its own visual world — an island-travel piece has whitewashed walls and caldera cliffs; an outage postmortem has terminal green and a scarred timeline. The subject's vocabulary drives the layouts.
|
|
18
|
+
2. **What does the target emotion look like as a frame?** Longing is empty space the viewer wants to fill; urgency is compression; awe is one element too large for the canvas.
|
|
19
|
+
3. **What does the playback surface demand?** A lobby screen is ambient and glanced at; a feed fights for its first second; a story is vertical and fast.
|
|
20
|
+
4. **What does every other video on this subject look like?** That is the anti-pattern. The tail pitches must not be it.
|
|
21
|
+
|
|
22
|
+
Then five concepts, one from each path: the subject's world · the emotion · the audience (meet their expectation, or break it) · the anti-pattern, inverted · an unusual format (a letter, a countdown, a recipe, a front page, a map). Estimate for each the probability that a model handed this brief would produce it. The numbers are directional, not calibrated, and they exist to enforce one constraint: **at least two of the five must sit below 0.10.** If all five clear 0.10, every pitch is the median — start over. Then check silhouettes: sketch each concept's major elements as rough bounding boxes; two concepts with the same silhouette are one concept, so replace one.
|
|
23
|
+
|
|
24
|
+
Probabilities never reach the user. They are a sampling constraint, not a scorecard.
|
|
25
|
+
|
|
26
|
+
## Presenting the round
|
|
27
|
+
|
|
28
|
+
Each pitch is three lines: the concept in one sentence, its visual world, its opening hook. The visual-world line carries the machinery: name the one or two capabilities the concept rides, in the plain language of `capability-menu.md`'s middle column — "the launch number counts up on the track's beat grid," never a feature name. This is how the toolbox reaches the user: experienced inside a concept they can want, not listed in a menu they can't evaluate. Machinery earns its mention the way a recommendation earns its place — a capability that would fit all five pitches is decoration; name it only where this concept leans on it.
|
|
29
|
+
|
|
30
|
+
All five appear before any recommendation — a recommendation stated first anchors everything after it. Then recommend one, with a reason. Mixing is a first-class answer ("the framing of the second with the opening of the fourth"); silence or "you decide" accepts the recommendation. One round: the pitches are an offer, not a quiz, and there is no second batch unless the user asks for one.
|
|
31
|
+
|
|
32
|
+
The chosen concept **is** the brief's creative core: it answers the route's pitch-eligible fields (typically `message` and `angle`), those questions are skipped downstream with the pitch as their receipt, and the concept lands in `BRIEF.md` under `## Intent` in the wording the user accepted. The capabilities the pitch named are confirmed with it — they land under `## Customizations` and are not re-offered later as if they were new.
|
|
33
|
+
|
|
34
|
+
## The gate, alone — autonomous runs
|
|
35
|
+
|
|
36
|
+
"Just build it" changes the audience, not the discipline. Walk the same gate — four questions, five concepts, tail constraint, silhouette check — pick the winner, and keep building. The heads-up then treats the pick like every other receipt-backed decision: name the direction chosen and why, the machinery it rides, and the most typical direction deliberately left behind. An autonomous run is where the median is most dangerous — no one is present to say "this looks like every other video," so the gate has to say it.
|
|
37
|
+
|
|
38
|
+
## The decision map — "I don't know anything about video"
|
|
39
|
+
|
|
40
|
+
A user who says they can't judge any of this gets neither pitches nor a question sequence. Give them a map of the two or three decision surfaces where their input genuinely changes the outcome — where it will play, how long it should run, what it should feel like — each with two to four plain-language options and a marked default. They choose only where they can tell the difference; every untouched surface keeps its default with a receipt. Then run the gate autonomous-style and present the winning concept inside the brief summary, where accepting the summary accepts the concept.
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
# Route briefs — what the intent layer asks, per route
|
|
2
|
+
|
|
3
|
+
The adaptive half of the intent layer (`/hyperframes` § 4, steps 4–6): each route's entry names the **must-haves** to ask now, the **conditional** questions its input can add, the **deferred asks** to announce (questions that stay in the workflow because their recommendations need pipeline data — a probed clip, a captured site), and whether the two **run-shape questions** (storyboard? · automation or companion?) apply. An entry that names **pitch-eligible** fields sends an unformed request through the pitch round (`pitch-round.md`) after routing; the chosen concept answers those fields. An entry without that line never enters the round. These entries live here, in the router skill, because workflow skills install lazily — at routing time the matched workflow may not be on the machine yet.
|
|
4
|
+
|
|
5
|
+
Field semantics and question rules: `hyperframes-core/references/brief-contract.md` § 2–3. Every question: recommended option first, receipt attached; a remembered value becomes the recommendation with its source named. The intro text of the brief always states **message** and **language** (state, don't ask).
|
|
6
|
+
|
|
7
|
+
## `/faceless-explainer`
|
|
8
|
+
|
|
9
|
+
- **Must-haves:** **angle** — concept / how-to / listicle / narrative, recommend the one the text's own shape suggests · **length** — inside the 30–90s sweet spot, scaled to how much the text actually teaches · **destination** — YouTube / embed → 16:9 · X / LinkedIn / Instagram feed → 1:1 · Shorts / TikTok → 9:16.
|
|
10
|
+
- **Conditional:** a pasted script adds **`VO_MODE`** — use it verbatim, or restructure per scene?
|
|
11
|
+
- **Pitch round:** `message` + `angle` — five tellings of the same topic are five different videos.
|
|
12
|
+
- **Run-shape:** both.
|
|
13
|
+
|
|
14
|
+
## `/product-launch-video`
|
|
15
|
+
|
|
16
|
+
- **First, sell or show?** One question when the request doesn't say: market the product (a promo), or show the site as-is (a tour / showcase)? A show-it answer is **intent, not a different pipeline**: write it into `BRIEF.md` (`## Intent` / `## Customizations` — "feature the site's own captured screens as the video's assets") and the workflow's normal steps carry it — the captured screens become the featured `asset_candidates`.
|
|
17
|
+
- **Must-haves:** **angle** — story shapes from the site's / brief's own positioning, recommend one with its basis · **length** — 30–90s sweet spot, scaled to the material · **destination** — as above.
|
|
18
|
+
- **Conditional:** a show-it-as-is ask adds **what to show** — the whole site, or specific pages/sections (into `BRIEF.md`'s body); a pasted script/brief adds **`VO_MODE`** (verbatim or restructured?); a script that only names a site adds **capture?** — crawl it for brand + assets (default), or text-only / "don't scrape" (no-capture mode, a preset supplies the design system).
|
|
19
|
+
- **Pitch round:** `message` + `angle`, after sell-or-show is settled — the pitches inherit that intent.
|
|
20
|
+
- **Run-shape:** both.
|
|
21
|
+
|
|
22
|
+
## `/pr-to-video`
|
|
23
|
+
|
|
24
|
+
- **Must-haves:** the **PR reference** (URL, `owner/repo#N`, or "this PR") · **angle** — changelog / feature-reveal / fix-explainer / refactor-walkthrough, recommend the one the PR itself suggests · **audience** — developers (default) · mixed technical · non-technical stakeholders · **length** — from the size table below · **destination** — 16:9 is the default for a code explainer.
|
|
25
|
+
- **Length comes from the PR's change size**, not a fixed guess — peek once, read-only (the workflow's Step 1 still does the full deterministic fetch):
|
|
26
|
+
|
|
27
|
+
```bash
|
|
28
|
+
gh pr view <PR_REF> --json title,additions,deletions,changedFiles
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
Pick the tier from `additions + deletions` (nudged up by `changedFiles`) and lead with it (hard cap ~3 min):
|
|
32
|
+
|
|
33
|
+
| PR change size | Recommended length |
|
|
34
|
+
| --------------------------------- | ------------------ |
|
|
35
|
+
| trivial (≲ 50 lines changed) | ~20–40s |
|
|
36
|
+
| focused (~50–200 lines) | ~40–70s |
|
|
37
|
+
| substantial (~200–600 lines) | ~70–110s |
|
|
38
|
+
| large (≳ 600 lines, or 25+ files) | ~110–180s |
|
|
39
|
+
|
|
40
|
+
State the basis in one phrase ("~40s — small change, +44/−13 across 12 files"). The tier is a **ceiling** on how much story the diff can support, never a floor to fill: a one-headline story recommends inside 30–90s regardless of tier (the tier's range may still appear as a non-recommended fuller-walkthrough option).
|
|
41
|
+
|
|
42
|
+
- **Pitch round:** `angle` and the opening hook — the diff fixes the facts, not the telling.
|
|
43
|
+
- **Run-shape:** both.
|
|
44
|
+
|
|
45
|
+
## `/general-video`
|
|
46
|
+
|
|
47
|
+
- **Open-ended requests only:** first derive a one-sentence `message`. Ask `audience` only when it is unclear and would change the story or terminology. Ask `destination` only when it would change aspect or composition. Ask for a priority only when the brief contains a real trade-off. Default to one best version; ask about variations only when the user requests options or comparison.
|
|
48
|
+
- **Specific requests:** a complete ask such as “a static title card with our logo for a website hero” needs no discovery questions.
|
|
49
|
+
- **Pitch round:** `message` — the unformed open-ended request is this round's home case.
|
|
50
|
+
- **Run-shape:** both questions apply. `/general-video` is also the companion host, so `flow: companion` stays on this route with the full toolbox.
|
|
51
|
+
|
|
52
|
+
## `/music-to-video`
|
|
53
|
+
|
|
54
|
+
- **Must-haves:** the **music source** — a track file, a video to pull audio from, or generate one from a mood description · **destination → aspect**.
|
|
55
|
+
- **Deferred (announce):** brand (font + palette) and the genre feel are chosen at its Step 3 by design — they emerge from the track's analysis, not from a question up front.
|
|
56
|
+
- **Pitch round:** `message` — the visual concept riding the beat grid (lyric treatment, montage story, kinetic type); brand and genre feel still land at Step 3.
|
|
57
|
+
- **Run-shape:** both.
|
|
58
|
+
|
|
59
|
+
## `/motion-graphics`
|
|
60
|
+
|
|
61
|
+
- Autonomous by design: at most **one** clarifying question, owned by its director step, in the flow. No must-haves here beyond confirming the input; route directly.
|
|
62
|
+
- **Run-shape:** neither — the piece is seconds long; a board and a companion session have nothing to add.
|
|
63
|
+
- **Front-door capability offer:** skip it. The director's one-question limit is authoritative.
|
|
64
|
+
|
|
65
|
+
## `/slideshow`
|
|
66
|
+
|
|
67
|
+
- The one question is the routing confirmation itself — "do you want this as a HyperFrames slideshow?" — asked during triage (it survives every mode: wrong routing is a quality problem). The deck contract owns everything after.
|
|
68
|
+
- **Run-shape:** neither — the deliverable is a navigable deck, not a rendered video.
|
|
69
|
+
- **Front-door capability offer:** skip it. After route confirmation, the deck workflow owns all remaining choices.
|
|
70
|
+
|
|
71
|
+
## `/embedded-captions`
|
|
72
|
+
|
|
73
|
+
- **Must-haves:** which clip (the input file).
|
|
74
|
+
- **Deferred (announce):** the caption **identity** pick — its Step 0 probes the clip first, then shortlists 2–3 identities from the catalog and recommends one. Say that's coming.
|
|
75
|
+
- **Run-shape:** neither — the footage is untouched; there is no storyboard to review.
|
|
76
|
+
|
|
77
|
+
## `/talking-head-recut`
|
|
78
|
+
|
|
79
|
+
- **Must-haves:** which clip (the input file).
|
|
80
|
+
- **Deferred (announce):** its render-strategy questions — aspect ratio, layout, style group, card count — stay at its Step 7, where the recommendations come from the probed footage and transcript. Say they're coming.
|
|
81
|
+
- **Run-shape:** neither.
|
|
82
|
+
|
|
83
|
+
## `/remotion-to-hyperframes`
|
|
84
|
+
|
|
85
|
+
- Not served by the intent layer — a migration with no brief. Route directly.
|