hyperframes

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

HyperFrames — start here

HyperFrames — 从这里开始

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.

Below: a capability map (the domain skills, loaded on demand) and the intent router (pick a workflow for any "make me a video" request).

HyperFrames 从 HTML 渲染视频 —— 合成内容是一个 HTML 文件，其 DOM 通过

data-*

属性声明时间轴，动画运行时支持跳转，媒体播放由框架管控。完整的创作规范位于

/hyperframes-core

；编写合成内容 HTML 前请先阅读该文档。

以下是能力图谱（按需加载的领域技能）和意图路由器（为任何“帮我制作视频”的请求选择工作流）。

Capability map — the domain skills

能力图谱 —— 领域技能

Atomic capabilities you load on demand — not full video workflows. For "make me a video", use the intent router below.

You want to…	Skill
Author / edit an HTML composition — the `data-*` contract, clips, tracks, sub-compositions, variables	`/hyperframes-core`
Animate — atomic motion, scene blueprints, transitions, runtime adapters (GSAP / Lottie / Three.js / Anime.js / CSS / WAAPI / TypeGPU)	`/hyperframes-animation`
Creative direction — `frame.md` / `design.md` , palettes, typography, narration, beat planning, audio-reactive	`/hyperframes-creative`
Media — TTS voiceover, background music, transcription, background removal, captions	`/hyperframes-media`
Media resolve — find + freeze BGM, SFX, images, icons from HeyGen catalog into `.media/` with manifest tracking	`/media-use`
CLI dev loop — init, lint, validate, inspect, preview, render, publish, doctor	`/hyperframes-cli`
Install registry blocks / components ( `hyperframes add` )	`/hyperframes-registry`

可按需加载的原子能力 —— 并非完整的视频工作流。若需“帮我制作视频”，请使用下方的意图路由器。

你想要……	技能
创作/编辑 HTML 合成内容 —— `data-*` 规范、片段、轨道、子合成内容、变量	`/hyperframes-core`
动画制作 —— 原子运动、场景蓝图、转场、运行时适配器（GSAP / Lottie / Three.js / Anime.js / CSS / WAAPI / TypeGPU）	`/hyperframes-animation`
创意指导 —— `frame.md` / `design.md` 、调色板、排版、旁白、节拍规划、音频响应	`/hyperframes-creative`
媒体处理 —— TTS 旁白、背景音乐、转录、背景移除、字幕	`/hyperframes-media`
媒体解析 —— 从 HeyGen 资源库查找并固化背景音乐、音效、图片、图标至 `.media/` ，并进行清单跟踪	`/media-use`
CLI 开发循环 —— 初始化、代码检查、验证、检视、预览、渲染、发布、诊断	`/hyperframes-cli`
安装注册块/组件（ `hyperframes add` ）	`/hyperframes-registry`

Intent routing — pick a workflow

意图路由 —— 选择工作流

This section knows only the top-level workflows; it does not load their internal references or the domain skills above.

本节仅介绍顶层工作流，不加载其内部引用或上述领域技能。

Before routing — confirm the input, not the spec

路由前 —— 确认输入内容，而非规格

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:

Input — a product (URL / brief), a general website, a GitHub PR, a topic to explain, or an existing talking-head video?

Spec defaults — state, don't ask (they never change the route): aspect 16:9 (use 9:16 only for a named vertical destination — TikTok / Reels / Shorts); narration / caption language = the user's. The chosen workflow re-confirms its own specifics at its first step.

路由需要知晓视频的主题——即输入内容和主题。若主题未明确（例如“帮我制作一个关于我们产品的视频”但未提供 URL、产品信息、主题或资产），请在进入任何工作流前询问——确定工作流即是路由决策。最多询问两个问题：

输入内容——是产品（URL / brief）、通用网站、GitHub PR、待解说的主题，还是已有的访谈类视频？

规格默认值——直接告知，无需询问（这些不会改变路由）：宽高比为 16:9（仅当指定垂直平台——TikTok / Reels / Shorts 时使用 9:16）；旁白/字幕语言与用户使用的语言一致。选定的工作流会在第一步确认自身的具体要求。

Workflow cheat-sheet

工作流速查表

Workflow	Use it for
`/product-launch-video`	Marketing / launching / promoting a product — from its URL, a brief, or a script (even if the site is only named)
`/website-to-video`	Turning a general website into a video — site tour, portfolio / landing-page showcase, social clip from the site's visuals
`/faceless-explainer`	Explaining a topic / concept from text — no product, no URL; every visual is LLM-invented
`/pr-to-video`	A GitHub PR / code change → changelog / feature-reveal / fix / refactor explainer
`/embedded-captions`	Adding captions / subtitles to an existing talking-head video (footage untouched)
`/talking-head-recut`	Packaging an existing talking-head video with designed graphic overlays — lower-thirds, data callouts, kinetic titles, pull-quotes
`/motion-graphics`	A short, unnarrated, design-led motion graphic — kinetic type, a stat / chart hit, a logo sting, a lower-third overlay
`/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)
`/slideshow`	A presentation / pitch deck / interactive deck — discrete slides, fragments, branching, hotspots; output is a navigable deck, not a rendered video
`/general-video`	Anything else — longer or multi-scene pieces, a static loop / poster, a custom composition
`/remotion-to-hyperframes`	Porting an existing Remotion (React) composition to HyperFrames (migration, not creation)

Disambiguation (only where confusable):

Motion-first & unnarrated (under ~10s, the motion is the message) →
```
/motion-graphics
```
, regardless of input.
A URL or script — markets a specific product (even just naming the site) →
```
/product-launch-video
```
; a general non-product site →
```
/website-to-video
```
; a GitHub PR link →
```
/pr-to-video
```
; explains a concept with no product / site →
```
/faceless-explainer
```
. Genuinely unclear product-vs-topic, or launch-vs-general-site → ask one question.
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).
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.)
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.
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.

工作流名称	适用场景
`/product-launch-video`	营销/发布/推广产品——基于产品 URL、brief 或脚本（即使仅提及网站名称）
`/website-to-video`	将通用网站转换为视频——网站导览、作品集/落地页展示、基于网站视觉的社交片段
`/faceless-explainer`	基于文本解说主题/概念——无产品、无 URL；所有视觉内容由 LLM 生成
`/pr-to-video`	将GitHub PR / 代码变更转换为更新日志/功能展示/修复/重构解说视频
`/embedded-captions`	为已有的访谈类视频添加字幕/副标题（原视频内容保持不变）
`/talking-head-recut`	为已有的访谈类视频添加设计好的图形叠加层——底部标题栏、数据标注、动态标题、引言引用
`/motion-graphics`	简短的、无旁白、设计导向的动态图形——动态排版、统计/图表展示、logo 动画、底部标题栏叠加层
`/music-to-video`	将音乐曲目转换为节拍同步的视频——歌词视频、幻灯片、动态宣传片；音乐决定节奏（可选将用户提供的图片/视频按节拍剪辑）
`/slideshow`	演示文稿/ pitch deck / 交互式演示稿——独立幻灯片、片段、分支、热点；输出为可导航的演示稿，而非渲染后的视频
`/general-video`	其他所有场景——较长或多场景内容、静态循环/海报、自定义合成内容
`/remotion-to-hyperframes`	将已有的 Remotion (React) 合成内容迁移至 HyperFrames（仅迁移，不创建新内容）

歧义消除（仅适用于易混淆场景）：

以动效为主且无旁白（时长约10秒以内，动效即为核心信息）→ 使用
```
/motion-graphics
```
，无论输入内容是什么。
URL 或脚本——推广特定产品（即使仅提及网站名称）→
```
/product-launch-video
```
；通用非产品网站 →
```
/website-to-video
```
；GitHub PR 链接 →
```
/pr-to-video
```
；解说无产品/网站的概念 →
```
/faceless-explainer
```
。若确实无法区分产品与主题，或发布与通用网站，请询问一个问题。
已有视频素材——纯口语字幕 →
```
/embedded-captions
```
；设计好的叠加卡片 →
```
/talking-head-recut
```
。两者均不修改原视频内容（重定时/调色/重新构图/重新排序/音频编辑属于非线性编辑，不在本工具范围内）。
输入为音乐曲目（音频文件，或从中提取音频的视频）且无旁白→
```
/music-to-video
```
——音乐的节拍/能量决定节奏。（带旁白的内容仍使用与输入匹配的上述工作流；
```
/motion-graphics
```
适用于非音乐驱动的简短无旁白动效。）
演示文稿/ pitch deck / 交互式演示稿（独立幻灯片、导航、演示者模式）→
```
/slideshow
```
——输出为可导航的演示稿，而非渲染后的视频。明确的“幻灯片”请求直接进入该工作流；相关触发词（“演示稿/幻灯片/演示/将此页面转换为幻灯片”）会让
```
/slideshow
```
在创作前确认是否为幻灯片，若不是则切换至合适的非幻灯片工作流。
时长仅作参考，非硬性限制——意图决定工作流；仅当内容明显长于约3分钟，或为静态/循环/自定义格式时，才使用
```
/general-video
```
。

If the matched workflow isn't installed

若匹配的工作流未安装

Once you've picked a workflow, check it's actually available to you. If the matched workflow skill isn't installed, don't fall back to guessing — tell the user to install it first:

Just this workflow:

npx skills add heygen-com/hyperframes --skill <workflow-name>

(e.g.

--skill pr-to-video

— bare name, no leading

All workflows at once:
```
npx skills add heygen-com/hyperframes --all
```
(core + every workflow, skips the picker).

After they run it, re-read the workflow's skill and continue.

选定工作流后，请确认其是否可用。若匹配的工作流技能未安装，请勿猜测替代方案——告知用户先安装该工作流：

仅安装此工作流：

npx skills add heygen-com/hyperframes --skill <workflow-name>

（例如

--skill pr-to-video

——仅需名称，无需前置

）。

一次性安装所有工作流：
```
npx skills add heygen-com/hyperframes --all
```
（核心技能 + 所有工作流，跳过选择器）。

用户运行安装命令后，请重新阅读该工作流的技能文档并继续。

Keeping skills current

保持技能更新

HyperFrames skills are versioned.

npx hyperframes init

checks the installed skills against the latest on GitHub and installs/refreshes the full set whenever anything is out of date or missing — so a freshly init'd project always has the complete, latest set (and re-running init on an up-to-date project is a no-op). The check is a quick GitHub round-trip; offline (or rate-limited) it falls back to installing after a short timeout, so init never hard-fails on a network hiccup. The creation workflows scaffold with

init

, so starting a new project always runs this check and pulls our latest skills from GitHub when they're stale. The

--skip-skills

flag is currently neutered (a temporary measure while the skills.sh registry catches up): passing it no longer skips the check, so every

init

checks GitHub. CI/tests opt out via the

HYPERFRAMES_SKIP_SKILLS=1

env var.

If a task is behaving unexpectedly, or before a long build, confirm the installed skills are current:

Check:
```
npx hyperframes skills check
```
(add
```
--json
```
for a machine-readable verdict; exits non-zero when anything is outdated or missing).
Update:
```
npx hyperframes skills update
```
— pulls the full set to the latest, installing any not yet present (same as init's install step).

The CLI also surfaces a one-line reminder when a

render

lint

validate

run detects stale skills.

HyperFrames 技能采用版本化管理。

npx hyperframes init

会检查已安装技能与 GitHub 上最新版本的差异，若有过时或缺失的技能，会安装/更新完整技能集——因此新初始化的项目始终拥有完整的最新技能集（在项目已更新至最新版本时重新运行 init 不会产生任何操作）。检查过程是快速的 GitHub 往返请求；离线（或受速率限制）时会在短暂超时后继续安装，因此 init 不会因网络问题而完全失败。创建工作流会通过

init

搭建项目，因此启动新项目时总会运行此检查，并在技能过时后从 GitHub 获取最新技能。目前

--skip-skills

标志已失效（这是 skills.sh 注册表更新前的临时措施）：使用该标志不再跳过检查，因此每次

init

都会检查 GitHub。CI/测试可通过

HYPERFRAMES_SKIP_SKILLS=1

环境变量选择退出。

若任务运行异常，或在长时间构建前，请确认已安装的技能为最新版本：

检查：
```
npx hyperframes skills check
```
（添加
```
--json
```
参数可获取机器可读的结果；若有任何技能过时或缺失，会返回非零退出码）。
更新：
```
npx hyperframes skills update
```
——将完整技能集更新至最新版本，安装所有尚未安装的技能（与 init 的安装步骤相同）。

当

render

lint

validate

运行检测到过时技能时，CLI 也会显示一行提醒信息。

Workflow details

工作流详情

/product-launch-video

/product-launch-video

Input: A product being marketed — (a) a product URL (crawled with headless Chrome for assets + brand tokens), (b) a script / brief that names the product's site even without a link (PLV resolves + crawls it, unless the user opts out), or (c) a script with no derivable site / "don't scrape" (no-capture mode — pick a style preset that supplies palette + design system). A supplied script can be the verbatim voice-over or restructured per scene — PLV asks.
Output: product launch / SaaS promo as a HyperFrames composition → MP4. (sweet spot 30–90s).
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".

输入： 待营销的产品——(a) 产品 URL（通过无头 Chrome 爬取资产和品牌标识），(b) 提及产品网站的脚本/brief（即使无链接，PLV 会解析并爬取该网站，除非用户选择退出），或 (c) 无法推导网站的脚本/“请勿爬取”（无捕获模式——选择提供调色板和设计系统的风格预设）。提供的脚本可以是逐字旁白，也可以是按场景重构的内容——PLV 会询问用户需求。
输出： 产品发布/SaaS 宣传片的 HyperFrames 合成内容 → MP4。（最佳时长 30–90 秒）。
触发词： “为 X 制作发布视频”、“为我们的网站制作宣传片”、“用一分钟解说我的 SaaS 产品”、“将我的脚本转换为 60 秒宣传片”、“纯文本发布视频，请勿爬取”。

/website-to-video

/website-to-video

Input: A general website / URL to turn into a video — when the goal is a video of the site, not a product launch. Captured with headless Chrome for real screenshots + brand assets.
Output: a site tour / portfolio / landing-page showcase / social clip built from the site's own visuals → MP4.
Triggers: "turn this website into a video", "site tour from ", "social clip from our homepage", "I just have a URL — make something".

输入： 待转换为视频的通用网站/URL——目标是制作关于该网站的视频，而非产品发布视频。通过无头 Chrome 捕获真实截图和品牌资产。
输出： 基于网站自身视觉的网站导览/作品集/落地页展示/社交片段 → MP4。
触发词： “将这个网站转换为视频”、“来自[网站]的导览视频”、“来自我们首页的社交片段”、“我只有一个 URL——帮我制作内容”。

/faceless-explainer

/faceless-explainer

Input: Arbitrary text — a topic, article, or notes — being explained, with no product being marketed and no site to capture. (Forked from
```
/product-launch-video
```
; no headless Chrome.)
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).
Triggers: "faceless explainer about X", "explain how DNS works as a video", "turn this article into an explainer", "explainer from my notes".

输入： 任意文本——待解说的主题、文章或笔记——无营销产品，无待捕获网站。（从
```
/product-launch-video
```
分支而来；无需无头 Chrome。）
输出： 无解说者的解说视频 → MP4，所有视觉内容由 LLM 按场景生成（排版/抽象图形/图表/数据可视化）；附带
```
pin-and-paper
```
预设。（最佳时长 30–90 秒）。
触发词： “关于 X 的无解说者解说视频”、“制作一个视频解说 DNS 如何工作”、“将这篇文章转换为解说视频”、“根据我的笔记制作解说视频”。

/pr-to-video

/pr-to-video

Input: A GitHub pull request — a PR URL, an
```
owner/repo#N
```
ref, or "this PR" — read via the
```
gh
```
CLI (not a site to scrape).
Output: code-change explainer (changelog / feature-reveal / fix / refactor) → MP4 — diff highlights, before/after, file-tree + impact scenes. ≤ (sweet spot 30–90s).
Triggers: "make a video about this PR", "turn PR #1187 into a changelog video", "release-notes video from github.com/org/repo/pull/123".

输入： GitHub 拉取请求——PR URL、
```
owner/repo#N
```
引用，或“此 PR”——通过
```
gh
```
CLI 读取（无需爬取网站）。
输出： 代码变更解说视频（更新日志/功能展示/修复/重构）→ MP4——差异高亮、前后对比、文件树及影响场景。（最佳时长 30–90 秒）。
触发词： “制作一个关于此 PR 的视频”、“将 PR #1187 转换为更新日志视频”、“从 github.com/org/repo/pull/123 制作发布说明视频”。

/embedded-captions

/embedded-captions

Input: An existing talking-head video (MP4) to caption — actual footage, not a URL or brief. Transcribed locally (Whisper, no API key) and matted (RVM) so the subject can occlude captions.
Output: the same footage untouched, with a caption layer — Standard (verbatim lower-third rail + an embedded climax behind the subject) or Cinematic (every caption composited behind the subject). Any length.
Triggers: "add captions / subtitles to this video", "captions behind the subject", "cinematic captions for my clip".

输入： 待添加字幕的已有访谈类视频（MP4）——真实视频素材，而非 URL 或 brief。本地转录（使用 Whisper，无需 API 密钥）并进行遮罩（RVM），以便主体人物可以遮挡字幕。
输出： 原视频内容保持不变，添加字幕层——标准模式（逐字底部标题栏 + 主体人物后方的嵌入式高潮字幕）或电影模式（每个字幕都合成在主体人物后方）。支持任意时长。
触发词： “为这个视频添加字幕/副标题”、“字幕置于主体人物后方”、“为我的片段添加电影风格字幕”。

/talking-head-recut

/talking-head-recut

Input: An existing talking-head / interview / podcast video (MP4) to package with on-screen graphics — actual footage. Transcribed locally (Whisper). The clip plays in full underneath, untouched.
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.
Triggers: "package this video", "add graphic overlays / lower-thirds / data callouts to my talk", "turn this interview into a graphics-packaged edit".

输入： 待添加屏幕图形的已有访谈/采访/播客视频（MP4）——真实视频素材。本地转录（使用 Whisper）。原视频完整播放，内容保持不变。
输出： 原视频添加定时图形叠加卡片——动态标题、底部标题栏、数据标注、引言引用、侧边面板、画中画——与转录内容同步。支持任意时长。
触发词： “包装这个视频”、“为我的演讲添加图形叠加层/底部标题栏/数据标注”、“将这个采访转换为带图形包装的版本”。

/motion-graphics

/motion-graphics

Input: A short, design-led motion graphic where the motion is the message — typically under ~10s, no narration. Genres: kinetic typography, a stat / number count-up, a chart hit, a logo sting, a lower-third / overlay, or a search-driven page / tweet / headline shot.
Output: a short motion graphic → MP4 or a transparent overlay (alpha WebM / MOV) for a lower-third / callout.
Triggers: "an 8s logo sting", "animate this stat", "a kinetic-type intro", "turn this tweet into a motion graphic", "a transparent lower-third overlay".

输入： 简短的、设计导向的动态图形，其中动效即为核心信息——通常时长约10秒以内，无旁白。类型：动态排版、统计/数字计数动画、图表展示、logo 动画、底部标题栏/叠加层，或基于搜索的页面/推文/标题动效。
输出： 简短的动态图形 → MP4 或透明叠加层（带 alpha 通道的 WebM / MOV），用于底部标题栏/标注。
触发词： “8秒的 logo 动画”、“为这个统计数据制作动画”、“动态排版开场”、“将这条推文转换为动态图形”、“透明底部标题栏叠加层”。

/music-to-video

/music-to-video

Input: A music track — an audio file, or a video to pull the audio from — with no narration and no website capture. Optionally, user-supplied images / videos to weave in. The track is analyzed once into a deterministic beat / energy map (
```
audiomap.json
```
) the whole video is built on.
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.
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".

输入： 音乐曲目——音频文件，或从中提取音频的视频——无旁白且无需捕获网站。可选提供用户图片/视频以融入其中。曲目会被分析一次，生成确定性的节拍/能量图谱（
```
audiomap.json
```
），整个视频基于该图谱构建。
输出： 节拍同步的 HyperFrames 合成内容 → MP4，由音乐决定节奏。排版和模板为基础（无需任何资产即可生成完整视频）；提供的任何媒体都会按同一节拍网格剪辑（节拍剪辑/肯·伯恩斯效果）。类型——歌词视频、幻灯片、动态宣传片——由逐帧选择决定；流程不会按类型分支。
触发词： “为这首歌制作视频”、“基于这首曲目的节拍同步视频”、“歌词视频”、“将这首音乐转换为视频”、“基于这首节拍的音乐可视化/动态宣传片”。

/slideshow

/slideshow

Input: A presentation / pitch deck / interactive deck to author — a brief, an outline, or an existing page to convert to slides. Not a request for a rendered video; if the intent is ambiguous, the skill confirms "do you want this as a HyperFrames slideshow?" before authoring.
Output: a runnable HyperFrames composition + a JSON island the player's
```
SlideshowController
```
reads to turn the GSAP timeline into a navigable deck — discrete slides, fragment reveals, branching sequences, hotspot navigation, presenter mode, and speaker notes. The deliverable is a deck, not an MP4.
Triggers: "make a pitch deck / presentation / slide deck", "an interactive deck", "convert this page into slides", "a slideshow with presenter mode".

输入： 待创作的演示文稿/ pitch deck / 交互式演示稿——brief、大纲，或待转换为幻灯片的已有页面。并非请求渲染后的视频；若意图不明确，该技能会在创作前确认“你是否想要将其制作成 HyperFrames 幻灯片？”。
输出： 可运行的 HyperFrames 合成内容 + JSON 岛，播放器的
```
SlideshowController
```
会读取该 JSON 岛，将 GSAP 时间轴转换为可导航的演示稿——独立幻灯片、片段展示、分支序列、热点导航、演示者模式和演讲者备注。交付物为演示稿，而非 MP4。
触发词： “制作 pitch deck / 演示文稿/幻灯片”、“交互式演示稿”、“将此页面转换为幻灯片”、“带演示者模式的幻灯片”。

/general-video

/general-video

Input: Anything not above — a creative brief, a single element to animate, an edit to a composition you're building. Input- and length-agnostic.
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.
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.

输入： 上述未覆盖的所有场景——创意 brief、待动画的单个元素、正在构建的合成内容的编辑请求。输入和长度不限。
输出： 通过原始流程生成的 HyperFrames 合成内容（任意时长/格式）：设计系统 → 提示词扩展 → 规划 → 动画前布局 → 构建（委托给
```
hyperframes-
```
* 技能）→ 验证。
触发词： “制作标题卡”、“为这个内容制作动画”、“较长的品牌/精彩片段”、“多场景合成内容”、“静态循环/海报”，任何不符合上述场景的“帮我制作视频”请求。

/remotion-to-hyperframes

/remotion-to-hyperframes

Input: An existing Remotion (React) composition's source — the user explicitly asks to port / convert / migrate it. One-way (Remotion → HyperFrames); not creation-from-input. A passing mention of Remotion is not a trigger.
Output: a HyperFrames HTML composition translated from the Remotion source, graded against the Remotion render (SSIM eval harness + tiered test corpus).
Triggers: "port my Remotion project to HyperFrames", "convert this Remotion comp", "migrate from Remotion".

输入： 已有的Remotion (React) 合成内容的源代码——用户明确要求迁移/转换/移植。单向迁移（Remotion → HyperFrames）；并非基于输入创建新内容。仅提及 Remotion 不会触发该工作流。
输出： 从 Remotion 源代码转换而来的 HyperFrames HTML 合成内容，与 Remotion 渲染结果进行对比评估（SSIM 评估工具 + 分层测试 corpus）。
触发词： “将我的 Remotion 项目移植到 HyperFrames”、“转换这个 Remotion 合成内容”、“从 Remotion 迁移”。