mcpField
H
hyperframes

hyperframes

github.com/ryu1845创意与媒体016 次安装1 周前更新
代码仓库

关于 hyperframes

hyperframes 是用于创建和编辑 HyperFrames 视频的入口技能,视频由 HTML 渲染而成。它帮助创作者根据项目状态选择工作流、继续现有项目,并按需加载专业技能。

主要功能

  1. 01将新视频需求分流至相应工作流
  2. 02依据项目状态恢复工作
  3. 03检查用量和 CLI 版本
  4. 04安装或更新工作流技能
  5. 05按需加载领域技能

适用场景

  1. 01根据简报启动新视频制作
  2. 02继续现有 HyperFrames 项目
  3. 03为视频交付物选择工作流
  4. 04加载渲染或动画相关指导

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/ryu1845/hyperframes --skill hyperframes

安装后在 Claude Code 中输入/hyperframes确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

references/
brief-contract.md
brief-format.md
capability-menu.md
frame-worker-core.md
intent-interview.md
pitch-round.md
plugin-installation.md
production-loop.md
review-loop.md
route-briefs.md
script-format.md
skill-lifecycle.md
storyboard-format.md
subagent-dispatch.md
workflow-catalog.md
references/routes/
embedded-captions.md
faceless-explainer.md
general-video.md
motion-graphics.md
music-to-video.md
pr-to-video.md
product-launch-video.md
remotion-to-hyperframes.md
slideshow.md
talking-head-recut.md
scripts/
plugin-cli.mjs
plugin-cli.test.mjs
scripts/lib/
frame-packets-core.mjs
main-module.mjs
main-module.test.mjs

详细介绍

插件安装: 在此技能位于 HyperFrames 插件中时,执行设置或使用量查询命令之前,请遵循插件执行规则。独立安装请按下方的更新说明操作。

HyperFrames 入口

目录

检查剩余用量

开始创建时,运行 npx hyperframes usage --json。在工作流的关键节点(例如起草后、渲染前)再次检查,因为用量会在运行过程中变化。查看可用额度窗口及其重置时间;之前的查询不会预留额度。如果命令失败、不可用或返回 status: unknown,请说明用量未知,不要猜测。范围和工作流选择应由用户决定。

HyperFrames 从 HTML 渲染视频——合成内容是一个 HTML 文件,其 DOM 通过 data-* 属性声明时间,动画运行时可进行定位,媒体播放由框架负责。完整的创作规范位于 /hyperframes-core;编写合成 HTML 之前请先阅读。简报、故事板、评审、制作、调度和帧处理器规范位于此技能的 references/ 中。

1. 从项目状态开始

应用第一个匹配的行;不要评估后续状态行:

状态操作
将现有 Remotion 源码显式移植到 HyperFrames阅读 references/routes/remotion-to-hyperframes.md,然后直接转到该工作流。跳过意图层。
对现有 HyperFrames 项目的特定操作:检查、诊断、验证、预览、渲染、发布或批量渲染仅执行该操作。跳过意图和工作流路由;加载 /hyperframes-cli 和所有必需的领域技能。
关于现有项目中某部已制作影片的问题、暂停请求、没有具体修改的想法,或感想按照 /hyperframes-studio § 0 执行。
在现有项目中提出制作一部新影片按照 /hyperframes-studio § 5 执行。
对现有项目进行具体编辑执行编辑。不要运行意图层。若要了解项目时间线上的内容(轨道、片段、起止时间、播放内容),请运行 npx hyperframes timeline [--json],而不要读取 index.html 和每个子合成文件。
存在 BRIEF.md读取 workflow 和 flow。执行该工作流;flow: companion 始终在 /general-video 中执行。不要询问任何简报相关问题。
没有简报,但存在 hyperframes.json 或 STORYBOARD.md根据项目文件和已记录的偏好继续。根据现有产物推断所属工作流。如果无法唯一确定,则只询问一个关于路由的问题;不要进行意图访谈。
全新创作运行意图层——references/intent-interview.md——然后根据 § 2 的表格进行一次路由。

编辑现有项目时,请使用项目历史记录包围你的编辑(/hyperframes-cli,在本轮中记录项目历史)。 如果新的请求没有说明主题或输入,请先询问视频的内容,再进行路由。提问前先检查偏好设置和配方(references/intent-interview.md,步骤 1)。figma.com 输入或指定的配方会改变信息收集方式,而非路由——访谈中的“适配正交输入”一节会处理这两种情况。

保持项目 CLI 为最新版本

脚手架生成的项目会在其 package.json 脚本中固定 hyperframes@<version>,以确保渲染结果可复现;固定版本不会自动更新,而且运行固定旧版 CLI 时不会显示相关警告。恢复一个脚本中带有固定版本的项目时,请在第一个会影响渲染的命令之前探测一次:

npx hyperframes@latest upgrade --project . --check

此探测为只读操作,会报告固定版本与最新发行版的对比;请保留显式的 .——在较旧的 CLI 发行版中,单独使用 --project 后再跟其他标志时,后一个标志会被当作目录值。如果探测结果显示项目版本落后,或者任何 CLI 输出已显示这一点(stderr 提示 This project pins hyperframes@… (latest …),或固定版本脚本的 --json 结果中出现 _meta.updateAvailable: true),请运行 npx hyperframes@latest upgrade --project . 应用更新,然后运行 npx hyperframes check 验证。检查通过表示项目中的合成内容仍能在新版本上通过验证,并不表示渲染输出与旧固定版本逐帧相同,因此成功更新绝不能悄无声息:请在本次运行的摘要中注明旧版本和新版本。尚无合成内容的项目无需验证。如果检查失败,请撤销 package.json 的更改,继续使用固定版本,并报告项目保留的版本及原因。根据提示采取行动,而不是转述给用户;绝不要让已更新的固定版本未经验证。

2. 路由到新建工作流

使用第一个匹配的行。匹配请求的交付内容,而不是顺带提及的词语或文件类型。

优先级请求工作流
1明确要求移植现有 Remotion 源码/remotion-to-hyperframes
2创作演示文稿、路演稿或可导航的交互式演示稿/slideshow
3为现有的对镜头讲话画面添加普通字幕或说明字幕,且不更改画面/embedded-captions
4为现有的对镜头讲话、采访或播客画面添加设计过的图形叠加层,且不更改画面/talking-head-recut
5根据音乐曲目制作与节拍同步的视频,不含旁白或网站录制/music-to-video
6创作明确较短、无旁白且以动态为主的内容,通常少于 10s/motion-graphics
7根据 PR 引用解释 GitHub 拉取请求或代码更改/pr-to-video
8根据 URL 或特定网站的简报,为网站、产品网站、应用或公司进行营销或展示/product-launch-video
9用自创视觉素材解释主题、文章或笔记,不录制产品或网站/faceless-explainer
10其他任何自定义视频或合成/general-video

确定最终路由前,请阅读 references/routes/<workflow>.md——每条路由对应一个小文件,其中包含规范的输入、输出和触发条件(在延迟安装工作流技能之前即可使用),以及该路由的访谈入口。如果候选路由不符合其约定,请继续选择路由,而不要强行匹配。只阅读匹配路由对应的文件。

解决常见歧义
  • 较短的动画标题、Logo 动效、数据强调、图表强调、地图强调或独立字幕条,如果没有旁白且动态效果就是传达内容的方式,则归入 /motion-graphics。静态标题卡、有旁白的序列、较长的蒙太奇或自定义循环则归入 /general-video。
  • 明确较短的动态图形可以使用 URL、推文、文章或截图作为素材。笼统的“根据这个网站制作视频”请求则归入 /product-launch-video。
  • 为现有画面添加字幕,归入 /embedded-captions;添加经过设计的信息卡片,则归入 /talking-head-recut。调整画面时长、顺序、色彩、取景或混剪画面属于自定义剪辑,应归入 /general-video。
  • 只有在音乐文件的节拍网格决定作品节奏时,才选择 /music-to-video。仅将音乐用作背景,不会覆盖与主题匹配的路由。
  • “我想要分镜脚本”只会改变审阅流程,不会改变工作流。没有其他路由信号时,请使用 /general-video。经过确认的分镜稿(boards/storyboard.html,格式见 /hyperframes-creative references/storyboard-recipe.md)本身也可以是请求的交付内容;审阅循环定义了这一流程的停止点。
  • 专用叙事工作流支持时长约 3 分钟以内,最适合 30–90s 的内容。明显更长的作品应归入 /general-video。时长不能覆盖明确指定的移植、演示稿、字幕、叠加层或音乐驱动型交付内容。

3. 路由一次,然后退出

对于全新创作,意图层(references/intent-interview.md)会完成整个对话流程——记忆、分流、方案轮次、必备项、运行形式、交接——并以写入 BRIEF.md 结束。该简报是工作流读取的唯一路由依据;之后不会再打开此技能或访谈。之后每当有人问“路由要求了什么?”,都从 BRIEF.md 中作答。

4. 安装并进入工作流

读取选定的工作流前,先安装或刷新它以及核心领域技能:

npx hyperframes skills update <workflow-name>

使用不带 / 的名称。如果命令失败,请显示错误;不要凭记忆重建工作流。有关安装的其他内容——核心技能与延迟加载技能的划分、init 会刷新什么、诊断、CI 退出选项,以及无 CLI 时的备用方案——请参阅 references/skill-lifecycle.md。

5. 按需加载领域技能

需求技能
组合结构、时间属性、轨道、变量、确定性/hyperframes-core
动效规则、场景蓝图、转场、运行时适配器/hyperframes-animation
可安全跳转的 GSAP、CSS、Anime.js、WAAPI、FLIP、路径、蒙版、SVG、3D 关键帧或 hyperframes keyframes 诊断/hyperframes-keyframes
设计规范、概念、调色板、排版、旁白、节拍规划/hyperframes-creative
图像、图标、徽标、音频、字幕、调色、LUT、可复用媒体/media-use
旁白剪辑、音效链、自动化包络,或跨多个轨道共用一条链路/推子的设置(子混音总线)/hyperframes-audio
Init、lint、check、快照、比较、批量渲染、Studio、渲染、发布或诊断/hyperframes-cli
注册表区块和组件/hyperframes-registry
指定的外观、效果、处理方式或转场——CRT 扫描线、故障效果、胶片颗粒、微光扫过、彩纸爆开——在手动构建之前/hyperframes-registry
Figma 资源、令牌、组件,或重建为动效的分镜帧/figma

创作者的编辑表述属于跨领域请求。加载匹配行中列出的所有技能:

创作者请求所需领域
“剪辑这段素材”、硬切、修剪、拼接、重新排序或使用源范围/general-video + /hyperframes-core;core 负责 data-start、data-duration、data-media-start 和轨道布局。
放大此处、推近/拉远、平滑的多状态缩放或重新构图、Ken Burns,或镜头移动/general-video + /hyperframes-core + /hyperframes-keyframes;为内部视觉/裁剪包装器添加动画,而不是为定时片段添加动画。
匹配剪辑或甩镜转场/general-video + /hyperframes-animation + /hyperframes-keyframes + /hyperframes-registry;先搜索/安装转场原语,再手动编写。
淡入淡出、交叉淡化、轨道增益/音量、自动化、闪避/挖空、音频效果,或对多个轨道应用同一种效果/general-video + /hyperframes-core + /hyperframes-audio;core 放置片段,audio 混合已放置的轨道,包括对一组轨道应用子混音总线。
结合剪辑与镜头运动或混音的画面和声音编辑/general-video + /hyperframes-core + /hyperframes-keyframes(涉及画面运动时)+ /hyperframes-audio(声音涉及淡化、混音、闪避、自动化或处理时)。
整理项目,使其在 Studio 中清晰易读:字幕轨道、按元素类型分轨、子合成、安全区域/hyperframes-studio + /hyperframes-core;studio 负责布局规范,core 负责每项编辑。
获取或生成媒体,或预处理不受支持的源素材中段定格/media-use;仅负责获取/生成/预处理,不负责已放置轨道的混音。

常量 data-playback-rate 对画面和保留音高的声音均可安全渲染。速度渐变使用 data-automation 中的 rate 通道。 要获取可复用的编辑约定,请加载 /hyperframes-core → references/creator-editing-recipes.md。

关于摄影媒体外观或表现方式的宽泛反馈也应路由到 /media-use,即使用户从未提及“调色”或“效果”:修复昏暗/平淡/乏味的素材、为片段添加风格、隐藏人脸,或改善媒体呈现效果。编辑处理方式前,请先阅读 ../media-use/references/media-treatments.md;它规定如何处理素材,而不规定能否使用媒体。 不要用通用 LUT、CSS 滤镜/叠加层或不透明度补间来替代 现有的规范处理原语。文本/布局/纯运动编辑仍由其所属领域负责。 在包含重要摄影媒体的构建过程中,最终质量检查时应进行一次有依据的 媒体润色检查;不更改合适的媒体也是有效结果。

领域技能不会接管端到端交付内容。仅加载当前工作流所需的内容。

6. Studio 和 HyperFrames 桌面应用

Studio 预览本身已经是一个完整的编辑器:用户可以点击画布上的任意内容来修改、编辑文本、在时间线上拖动和修剪片段,以及导出;每次编辑都会保存到项目中。它唯一做不到的是对话——它的“Ask agent”只会把提示词复制回当前对话。免费的 HyperFrames 桌面应用则具备这一功能:它的助手 Framey 可以通过聊天修改视频,用户可以在某一帧上绘图来指出某个内容,而 Framey 会逐项执行编辑。介绍该应用时,应将其说成继续编辑的更佳方式,而绝不能说成唯一方式;并称其为“HyperFrames 桌面应用”,绝不能称作“Studio”,以免用户误以为它就是预览。请在两个时机各向用户介绍一次:

  • 工作流最终效果确定后,在交付渲染之前打开 Studio 预览——所有模式下都要这样做,即使用户要求你不要提问:打开预览不会询问任何内容。告诉他们可以直接在那里编辑视频。当 preview 输出了以“Keep editing by chatting with Framey”开头的 Desktop 行时,再补充一行,说明标题栏中的 Edit with Framey 按钮可以打开桌面应用(已安装应用时会直接打开;未安装时则会提供下载);否则,此 CLI 可能不会显示该按钮,因此暂时不要提及应用。直接请求渲染现有项目(上文“Specific operation”行)时,只执行该操作,不要先打开预览。
  • 交付渲染完成后,用自己的话转述渲染输出中提及桌面应用的那一行(其中会提到 Framey)——该行已经说明当前机器适用哪种情况。如果其中提到 hyperframes open,主动提出帮用户运行:该应用会将此项目添加到 Home。只有当 hyperframes open 明确输出该应用会接续当前对话时,才说明应用会接续当前对话。如果其中提供了下载链接,就给出链接,并用一行说明应用会添加什么。

当渲染没有输出此类行时——例如批处理行、在应用内运行,或该机器没有对应的应用构建版本——不要提及应用。在自主模式下不要提问:将相关内容写入交付说明。

用户从应用返回时。 如果 hyperframes open 告知用户回来后运行 hyperframes catch-up,或者某个 hyperframes 命令以提及该命令的行结束,那么用户再次在此处发消息时,应立即运行 npx hyperframes catch-up [dir],然后再做任何更改。较旧版本的 CLI 不会输出这些提示,也没有该命令,因此在这种情况下不要提及。该命令会列出用户向 Framey 提出的要求、Framey 修改的内容,以及此后由 Framey 或用户手动更改的文件。列出的内容是用户工作的记录,不是新的请求:重新读取已更改的文件,并根据用户在此处说明的内容采取行动。

参考文件

当相关主题适用时,直接阅读匹配的文件;索引仍可用于在不同配方中进行选择。

参考资料

评论

支持 Markdown