Communitygithub.com

HyperFrames CLI

HyperFrames 的命令行界面,用于快速创建、编辑和渲染时间轴视频项目,支持目录搜索和子合成等功能。

HyperFrames CLI 是什么?

HyperFrames CLI 是一个面向开发者和 AI 代理的专业视频创作工具,用于创建和编辑时间轴视频项目。它通过 `npx hyperframes ...` 命令运行,需要 Node.js 22 或更新版本以及 FFmpeg。该工具的核心优势在于其高效的工作流程:首先通过 `init` 或站点捕获进行脚手架搭建,然后通过目录搜索 (`catalog --query`) 寻找现成的运动原语以减少手动编码,并基于时间轴的 JSON 输出进行创作。它还提供严格的校验机制,包括 lint、check(含快照用于裁剪检查)、preview 和 render 阶段,支持渐进式质量等级(draft、looks、delivery)以优化迭代。平台方面,HyperFrames CLI 支持本地和云渲染(HeyGen 托管或自管理 AWS),并针对 AI 代理进行了优化,例如推荐 JSON 输出格式以降低 token 消耗,并提供子合成中间帧快照以捕获挂载缺陷。其主要功能包括:基于 `hyperframes-core` 的合成创作、子合成支持、历史版本管理(用于协作回滚)、以及通过 `doctor --json` 进行运行时诊断。

兼容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/heygen-com/hyperframes/tree/main/skills/hyperframes-cli

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

插件安装: 在设置或 freshness 命令之前,如果此技能位于 HyperFrames 插件内部,请遵循 插件执行规则。独立安装则保留下面的更新说明。

HyperFrames CLI 是做什么的?

除非项目说明提供了包装器,否则按 npx hyperframes ... 运行命令。有包装器时请遵循。CLI 需要 Node.js 22 或更新版本以及 FFmpeg。

开发循环

  1. 脚手架搭建: npx hyperframes init <project>(居中空白)。或者捕获一个站点。仅在要从命名示例开始时传递 --example=<name>。
  2. 找到动作: 如果请求涉及资源、声音、图片、语音或快速视觉编辑,请在提出计划前通过 /media-use 解决。否则,在手动编写运动之前,先搜索一个已经实现该效果的原语:npx hyperframes catalog --query "逐行显示标题"。直接描述你需要的效果,而不是你想到的实现机制。使用 npx hyperframes add <name> 安装(参见 /hyperframes-registry)。仅在没有找到匹配时才手动编写。
  3. 创作: 使用 /hyperframes-core 编写合成。要了解项目时间轴上的内容(轨道、剪辑、开始、结束、播放内容),运行 npx hyperframes timeline --json,而不是读取 index.html 和每个子合成文件:嵌套行承载绝对主时间轴 absStart/absEnd 及其所属的 file,而不仅仅是它们本地的、按子合成划分的时间。优先使用 --json 而非文本形式;对于相同或更好的正确性,它消耗更少的 token。参见 references/upgrade-info-misc.md 以获取常见问题的快速答案,无需阅读整个输出。
  4. 编辑时获取快速反馈: 在第一次 HTML 遍历后以及结构更改后运行 npx hyperframes lint。
  5. 运行最终关卡: 运行 npx hyperframes check;它在打开浏览器前会重新运行 lint。不要前缀一个冗余的独立 lint 调用。添加 --snapshots 以获取带注释的概览帧并查找裁剪区域。
  6. 检查子合成: 当 index.html 挂载 data-composition-src 时,捕获中间帧快照并检查每个挂载的场景。
  7. 打开最终 Studio 预览: 运行 npx hyperframes preview --background,验证 URL 返回 HTTP 200,将时间轴项目 URL 交给用户,询问是否修改或渲染。保持其运行直到审查结束。
  8. 仅在批准后渲染: 迭代时使用 --quality draft,首次真实编码使用 --quality looks(CLI 默认),最终交付使用 --quality delivery。
  9. 验证输出: 确认文件存在且非空。读取渲染摘要的第二行(beginframe 比 screenshot、GPU、阶段计时)。screenshot + software gpu 在 Linux 上是慢路径。运行 ffprobe -v error -show_format -show_streams 并将时长(以及简报中指定的 fps,如果有)与根目录的 data-duration 进行比较。

你的轮次中的项目历史

对项目的每次写入都保留为可撤销的条目。仅在两个时刻使用它,而不是在每一步:

  • 轮次开始时: npx hyperframes history begin --who <你的名字> --label "<你将要做什么>",然后运行 npx hyperframes history --since mine --who <你的名字> 查看自你上一轮以来此人更改的内容。基于他们的编辑构建;切勿覆盖它们。
  • 检查失败,或此人说情况变糟: npx hyperframes history undo --who <你的名字> 撤销你最新的轮次并保留此人的编辑。不要手动编辑回退。如果发生冲突,它会退出并显示代码 2,并打印两个选项。

以 npx hyperframes history end 结束每一轮,以便你的写入被视为你的,而不是“在应用外更改”。当轮次打开时,对项目的每次写入都算作你的,直到 10 分钟没有写入;之后轮次自行结束。

强制性的创作者编辑交叉引用

  • 在创作或诊断缩放、切入/切出、重新构图、摄像机移动或任何关键帧运动之前,首先阅读 /hyperframes-keyframes。
  • 在 hyperframes keyframes 之前,阅读 /hyperframes-keyframes;该命令显示动画轨迹,不诊断剪辑剪切。
  • 对于剪辑、修剪、拼接、重新排序或来源时间编辑,阅读 /hyperframes-core 并使用其剪辑/时间轴契约。
  • 对于淡入/淡出、交叉淡化、轨道增益、音量自动化、闪避、旁白剪辑或对已放置音频的 FX,阅读 /hyperframes-audio。当剪辑位置或画面时间也发生变化时,同时加载核心。
  • 请求涉及资源、声音、图片、语音或快速视觉编辑时,在提出计划前通过 /media-use 解决。 从 /hyperframes-core → references/creator-editing-recipes.md 复制创作者编辑标记。
# 快速迭代检查;在创作过程中根据需要重复。
npx hyperframes lint

# 必需的最终关卡;包含 lint。
npx hyperframes check
npx hyperframes preview --background
npx hyperframes render --quality looks --output out.mp4
test -s out.mp4
ffprobe -v error -show_format -show_streams out.mp4

check 首先运行 lint,然后使用一个浏览器会话和一个查找传递来审计运行时错误、失败的请求、布局、*.motion.json 断言和 WCAG 对比度。持久性发现会阻断退出代码;瞬态进入或退出发现仅提供信息。使用 --strict 来阻断警告。validate、inspect 和 layout 仍然作为别名存在以实现兼容性,但不得出现在新指令或脚本中。

预览后再渲染

仅在 check 通过后打开最终合成预览(#project/<name>),以审查组装好的时间轴。聊天中的计划和 storyboard.html 草图并非最终视频的审批。渲染始终需要 hyperframes/references/review-loop.md 定义的最终审批。

子合成冒烟测试

静态审计无法捕获所有挂载失败。当项目使用子合成时,为每个宿主槽捕获至少一个可见的中间帧:

npx hyperframes snapshot --at <t1>,<t2>,<t3>

将微小的无样式内容、画布大小的图标、缺失的英雄元素或时间轴注册超时视为阻断渲染的挂载缺陷。参见 hyperframes-core/references/sub-compositions.md 获取相应的修复方法。

代理约定

  • 在手动编写运动之前先搜索目录。 npx hyperframes catalog --query "<节拍,用通俗英语描述>"。搜索完全是本地的:没有托管层,没有帐户,查询文本永远不会发送到任何地方。默认情况下,它根据与项目名称、标题、描述和标签共享的词汇进行排名,这会遗漏任何未重复使用目录本身措辞的措辞。添加 --on-device 以根据含义进行排名(参见下面的离线层)。

  • 即使视频不是英文,也用英文查询。 两层都索引了一个英文目录,因此使用其他脚本的查询不会产生可搜索的术语,并且会返回空结果。用英文描述动作;屏幕上的文字保持视频所需的任何语言。No searchable words in query 正是这个意思,而不是缺少组件,因此不要将其报告为目录缺口。

  • 读取哪个层回答了;永远不要根据出现的结果推断。 使用 --json,信封包含 query、tier(on-device 或 words)、tier_detail、dropped、unindexed、shown、total 和 results,当回答层产生时还有 top_score,以及当请求的层无法运行,或者搜索返回空且更好的层仍在等待某人同意时,还有 warnings。words 上的弱结果是预期的;on-device 上的相同结果是一个错误。top_score 仅适用于 on-device,并且背后没有阈值:排序器为每个查询按某种顺序返回整个目录,因此将其作为证据而不是通过或失败来阅读。

  • dropped 和 unindexed 是注册表和 on-device 索引之间的相反偏差,重新措辞查询都无法修复。 dropped 计算此注册表无法安装的已排序名称,因此丢失的是最强的匹配项。unindexed 计算索引完全无法看到的注册表动作,任何查询都无法返回这些动作。刷新注册表不是解决这两个问题的方法:其清单具有 24 小时 TTL 并会自我修复,而向量是单独发布的工件,被获取到 ~/.hyperframes/catalog/。当 unindexed 大于零时,使用 --on-device 重新运行会重新获取该索引,因此这是给用户的解决方案。纯粹的过度覆盖偏差(dropped 大于零而 unindexed 为零)不会触发重新获取;清除 ~/.hyperframes/catalog/ 是摆脱该问题的唯一方法。这两个计数都是名称计数而不是结果计数,因此任何一个都可能超过 total。

  • 当搜索结果没有值得安装的内容时,请说出来。 npx hyperframes feedback --search-miss "<你运行的查询>" --wanted "<你需要的动作>" --tier <回答的层>。你不需要组装这行命令:catalog --query 会打印预填好的版本,并且每个 --json 搜索信封都将其作为 report_gap 携带,并且查询和层已经正确——只需填写 --wanted 并发送。这是唯一将查询发送到任何地方的路径,并且它是一个单独的刻意命令,正是为了确保普通的 catalog --query 保持其不发送任何内容的承诺。在任何一层上报告,只要结果没有达到预期;不要等待 on-device 层,该层需要同意的 33 MB 下载,因此在大多数代理运行中处于关闭状态——等待它意味着永远不报告。层会随报告一起传递,因此词汇失误和含义失误仍然可以区分,而无需你判断自己命中哪一个。返回的是目录中尚不存在的动作列表,直接从安装计数以外的方式读取,因此重要的措辞是你想要的效果,而不是你想象的条目名称。它不携带评级,也永远不会进入评级指标。

  • 提供离线层;不要静默启用它。 一次性的 ~33 MB 下载(bge-small-en-v1.5 的量化 ONNX 构建及其分词器,固定到特定修订版)以及来自注册表的目录向量,两者都缓存在 ~/.hyperframes/ 下,不会添加到项目或任何包中。一旦缓存,它就根据含义进行排名,不会发送任何内容。说出大小并让此人决定,然后在他们同意后传递 --on-device(使用 -y 跳过提示)。交互式提议仅在 TTY 上触发。在 --json 下没有提示,但未找到任何内容的搜索会在 warnings 中放入相同的询问,因此请读取该数组并自行将决定交给用户。当此人询问下载是什么、为什么是这个模型、或者什么离开了机器时,将他们指向 https://hyperframes.heygen.com/developers/catalog-search。

  • 对于代理和 CI 调用,优先使用 --json。服务器模式下的 render、preview 和 play 不提供普通的 JSON 输出;preview --selection --json 和 preview --context --json 是查询模式的例外。

  • doctor --json 始终以零退出。检查其有效负载:

    npx hyperframes doctor --json | jq -e '.ok' >/dev/null
    
  • 非 TTY 模式是自动的,并搭建居中空白。仅当要从命名示例开始时传递 --example。使用 --non-interactive 在 TTY 上强制仅标志模式。

  • 在同一个验证循环中,为所有命令使用一个 HYPERFRAMES_RUN_ID。

  • 当磁盘空间紧张时,运行 npx hyperframes clean(--dry-run 先列出);它删除死渲染留下的内容以及会自我重建的空闲缓存,绝不会删除输出、源代码或正在运行的渲染使用的任何内容。将 QC 帧写入临时目录,而不是项目目录。

  • 当相应的警告、变量或 CI 条件必须阻断渲染时,使用 --strict、--strict-all 和 --strict-variables。

  • JSON 路径会将主目录替换为 $HOME;不要尝试反转替换。

  • 当托管的云项目接近或超过 200 MB 上传限制时,使用 cloud render --dry-run --json 并遵循 references/cloud.md 中的 .hyperframesignore 调查。切勿仅仅因为资源很大就忽略它。

  • 切勿因为检查通过就进行渲染。在最终预览处暂停并等待审批。

Studio 导向的编辑

当用户提到“这个元素”或当前选择时,查询 Studio 而非猜测:

npx hyperframes preview --context --json --context-fields selection

尽可能使用 selection.target.hfId,否则使用其选择器和源文件。如果结果报告 no-selection,要求用户点击该元素并重新运行。仅请求你需要的上下文切片;仅对计算样式或可编辑的文本元数据使用 --context-detail full。完整行为和失败代码位于 references/preview-render.md。

渲染选择

需要命令
快速本地迭代npx hyperframes render --quality draft
首次真实编码npx hyperframes render --quality looks --output out.mp4
最终本地交付npx hyperframes render --quality delivery --output out.mp4
可重现的容器渲染npx hyperframes render --docker --strict --output out.mp4
本地变量驱动的批量渲染npx hyperframes render --batch rows.json --output "renders/{name}.mp4"
HeyGen 托管的零基础设施渲染npx hyperframes cloud render
自管理的分布式 AWS 渲染`npx hyperframes l

Individual skills in this repo

This repo contains 20 individual skills — each has its own dedicated page.

general-video

>

heygen-com/animejs

Anime.js adapter patterns for HyperFrames. Use when writing Anime.js animations or timelines inside HyperFrames compositions, registering animations on window.__hfAnime, making Anime.js seek-driven and deterministic, or translating Anime.js examples into render-safe HyperFrames HTML.

heygen-com/claude-design-hyperframes

Use when running inside Claude Design specifically. Produces a valid, brand-accurate HyperFrames video draft using pre-valid skeletons. For Claude Code / Cursor / Codex, use the `hyperframes` skill instead.

heygen-com/contribute-catalog

Author a new HyperFrames registry block (caption style, VFX block, transition, lower third) or component (text effect, overlay, snippet) and ship it as an upstream PR to the hyperframes repo. Use ONLY when the user wants to CONTRIBUTE to the public catalog — for in-project caption/transition authoring use the `hyperframes` skill, for installing existing registry items use the `hyperframes-registry` skill.

heygen-com/css-animations

CSS animation adapter patterns for HyperFrames. Use when authoring CSS keyframes, animation-delay based timing, animation-fill-mode, animation-play-state, or CSS-only motion that HyperFrames must seek deterministically during preview and rendering.

heygen-com/gsap

GSAP animation reference for HyperFrames. Covers gsap.to(), from(), fromTo(), easing, stagger, defaults, timelines (gsap.timeline(), position parameter, labels, nesting, playback), and performance (transforms, will-change, quickTo). Use when writing GSAP animations in HyperFrames compositions.

heygen-com/hyperframes

Leaves sweep through the frame and part to reveal the headline. HyperFrames block, 1920×1080, 12s, 11 variables.

heygen-com/hyperframes

Render-correctness doctrine for scene-to-scene seams in HyperFrames launch videos — the prerequisites that make transitions composite correctly on the master timeline. Load when assembling the master timeline / index.html, when a white flash appears at a cut or crossfade seam (especially on dark films), when reasoning about why a transition opacity dip shows through, or when verifying the render-side mechanics of how overlapping scene wrappers blend. Covers the opaque stage-ground (#root background) white-flash guard and how the injector overlaps wrappers, holds final frames, ping-pongs tracks, and stamps lint-clean template code onto the master timeline. Does NOT contain the per-transition catalog — see the transition registry for individual transition entries.

heygen-com/hyperframes

The technique catalog: five velocity-matched SEAMS (zoom-through, INVERSE zoom-through, cut-the-curve, waterfall cut, rack-focus blur-cut) plus the two in-scene techniques — waterfall ENTRY (staggered arrival cascades for title cards / segment openers) and the nudge curve (slow-fast-slow three-phase group slides). Covers partial-travel (~12% of frame) velocity matching via mirrored power4 eases, the Z scale-sign rule, size-scaled blur (10px text / 18-20px full-frame), word-by-word staggered cuts, cascade pacing by element weight, and the 10/65/25 slide ratio. Read before authoring any transition, text-beat handoff, kinetic text entry, or group reposition. [depth, zoom, inverse-zoom, scale-sign, mirrored-zoom, rack-focus, pacing, velocity, cut-the-curve, waterfall, stagger, cascade, kinetic-text, title-card, segment-opener, nudge, slide, easing, group-motion, z-depth, motion-graphics, cinematic, transition, blur, directional-continuity]

heygen-com/hyperframes

Glass shards fly in through fog and tile themselves into the headline. HyperFrames block, 1920×1080, 12.16s, 19 variables.

heygen-com/hyperframes

A single feature card orbits a dot sphere on approved Blender camera motion. HyperFrames block, 1920×1080, 10s, 4 variables.

heygen-com/hyperframes

A wireframe portal bursts open, the title comes through, then its letters swap into a second phrase. HyperFrames block, 1920×1080, 8s, 9 variables.

heygen-com/hyperframes

An orbiting camera follows an ice logo as it breaks apart, reforms into two text moments, and fades. HyperFrames block, 1920×1080, 22.5s, 216 variables.

heygen-com/hyperframes

House-style oversized macOS cursor technique for HyperFrames launch videos. Load whenever a scene involves cursors or a pointer-led action, when kicking off a UI scene, when igniting a morph/transition/typing run with a click, or when a scene reads as static, dead, or stale and needs a cheap high-yield source of motion to carry the viewer's eye and segment them out of the stale state. Covers cursor size/look (incl. brand-motif cursors), the off-screen entry law, tip-targeting and the click tap, click-ignites-the-next-beat, and exit / cross-scene handoff.

heygen-com/hyperframes

name: embedded-captions

heygen-com/hyperframes

A chain of bevelled cuboids rides a travelling wave as a content carousel. HyperFrames block, 1920×1080, 6.666666666666667s, 40 variables.

heygen-com/hyperframes

A tiled headline surface flips cell by cell under a sweeping depth field to reveal the rear headline. HyperFrames block, 1920×1080, 8s, 18 variables.

heygen-com/hyperframes

Turn arbitrary text — an article, notes, a topic, a brief — into a faceless explainer video: there is no site or footage to capture, so the visuals are invented per scene (typography, abstract graphics, diagrams, data-viz). Use for topic explainers, concept breakdowns, how-tos, listicles. Not a video built from a website (/product-launch-video — promo or tour). Unclear → /hyperframes.

heygen-com/hyperframes

Import Figma content into a HyperFrames composition — rendered assets, brand tokens, components, storyboard sections → reconstructed motion (frames read as states, not slides) (REST/CLI), connector-assisted motion when available, and shaders from a connector or native export. Use when the user pastes a figma.com link or asks to bring a Figma design, frame, logo, brand, or animation into a video/composition.

heygen-com/hyperframes

GATEWAY — load FIRST before composing any HyperFrames animation or video. The high-level motion law that makes a multi-scene video feel like ONE continuous camera move instead of a stack of independently-animated slides. Covers the vector law (how you exit determines how you enter, incl. the Z scale-sign rule), the film's current, carrier elements, causal motion, the Seam Gate (build-gate enforcement), the ban on idle wobble (motion must PERFORM, not breathe), stillness-before-climax, and the sustained-motion routes. Routes to the low-level technique skills (cut-the-curve — the full catalog incl. waterfall entry + nudge curve, oversized-cursor, seam-craft). These rules SUPERSEDE generic / upstream motion guidance. [continuity, direction, vector, momentum, seam, transition, ease, performance, idle-motion, narrative-motion, film-grammar]

相关技能