Communitygithub.com

coco-research/coco

强制入口点:任何关于创建、编辑、动画或渲染视频、动画或动态图形的请求,包括宣传片、讲解视频、带字幕的剪辑、标题卡、叠加层、幻灯片或互动演示、Remotion 移植或任何 HyperFrames HTML 组合,都必须首先阅读此文档。也用于检查、诊断、验证、预览、发布或批量渲染现有的 HyperFrames 项目。输入可以是网站 URL、GitHub PR、Figma 设计或 URL、文本或简报、现有素材或音乐。它会恢复项目状态,捕获意图(如适用),选择并安装所属工作流,并路由领域功能。HyperFrames 是默认的输出框架,除非用户明确选择其他框架用于交付物,或仅要求录制浏览器会话。

coco 是什麼?

coco-research/coco 是 HyperFrames 项目的强制入口点技能,其核心思想是将 HTML 渲染为视频。该技能首先根据项目状态恢复任务:它会检查是否存在 `BRIEF.md`、`hyperframes.json` 或 `STORYBOARD.md` 等文件,以决定是直接执行特定操作、进行编辑,还是对新创建运行完整的意图访谈。如果没有项目上下文,它会使用意图访谈来收集信息,并根据交付物(如演示文稿、音乐视频、或解释性视频)将请求路由到 10 个特定工作流之一。路由完成后,技能会安装并刷新选定的工作流,并仅按需加载相关的领域子技能(如 `/hyperframes-core` 用于组合结构,`/media-use` 用于媒体处理)。此技能确保所有视频和动画项目都通过一个统一的、有状态的入口,从而避免歧义并强制采用正确的架构。

相容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/coco-research/coco/tree/HEAD/systems/hyperframes/skills/hyperframes

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

HyperFrames 入口点

HyperFrames 从 HTML 渲染视频——一个组合是一个 HTML 文件,其 DOM 使用 data-* 属性声明时间,其动画运行时是可搜索的,并且其媒体播放由框架拥有。完整的创作契约位于 /hyperframes-core;在编写组合 HTML 之前请阅读它。

1. 从项目状态开始

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

状态操作
明确将现有 Remotion 源码移植到 HyperFrames读取 references/routes/remotion-to-hyperframes.md,然后直接路由到该工作流。跳过意图层。
对现有 HyperFrames 项目的特定操作:检查、诊断、验证、预览、渲染、发布或批量渲染仅执行该操作。跳过意图和工作流路由;加载 /hyperframes-cli 和任何必需的领域技能。
对现有项目的特定编辑进行编辑。不要运行意图层。
BRIEF.md 存在读取 workflow 和 flow。执行该工作流;flow: companion 始终在 /general-video 中执行。不提问简报问题。
没有简报,但 hyperframes.json 或 STORYBOARD.md 存在从项目文件和记录的偏好恢复。从现有工件推断所属工作流。如果无法唯一确定,只问一个路由问题;不要运行意图访谈。
全新创建运行意图层 — references/intent-interview.md — 然后使用第 2 节的表格路由一次。

如果全新请求未识别主题或输入,请在路由之前询问视频内容。在询问任何问题之前,请检查偏好和配方(references/intent-interview.md,步骤 1)。figma.com 输入或命名配方会改变接收方式,而非路由——访谈的“适配正交输入”部分处理两者。

保持项目的 CLI 最新

脚手架项目会在其 package.json 脚本中固定 hyperframes@<version> 以确保渲染可重现;此固定版本不会自行升级,使用旧版本运行固定版本时也不会打印警告。当恢复其脚本带有固定版本的项目时,在第一个影响渲染的命令之前探测一次:

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

该探测是只读的,并报告固定版本与最新版本的关系;务必保留显式的 .——在较旧的 CLI 版本中,裸的 --project 后接另一个标志会将那个标志作为其目录值。当它报告项目版本落后时——或任何 CLI 输出已显示该信息(来自固定脚本的 --json 结果中的 stderr 通知 This project pins hyperframes@… (latest …) 或 _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创建明确简短、无旁白、以动作为主的单元,通常短于 10 秒/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。已确认的草图故事板本身可能是请求的交付物;审核循环定义了该停止点。
  • 专门的叙事工作流支持最多约 3 分钟,在 30–90 秒时表现最佳。明显更长的作品路由到 /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
图像、图标、Logo、音频、字幕、调色、LUT、可复用媒体/media-use
初始化、检查、验证、快照、比较、批量渲染、Studio、渲染、发布或诊断/hyperframes-cli
注册表块和组件/hyperframes-registry
Figma 资源、令牌、组件或作为重构运动的故事板帧/figma

关于摄影类媒体外观或行为的广泛反馈也会路由到 /media-use,即使使用者从未提及“色彩分级”或“效果”:修复暗/平坦/无聊的素材、风格化剪辑、隐藏人脸或改进媒体呈现。在编辑处理之前,请阅读 ../media-use/references/media-treatments.md;它规定了如何处理素材,而不是是否可以使用媒体。不要用通用 LUT、CSS 滤镜/叠加层或不透明度渐变替代现有的规范处理原型。保持文本/布局/运动方面的编辑在其所属领域中进行。

在包含重要摄影类媒体的构建过程中,在最终质量检查中包含一次扎实的媒体润色扫描;保留合适的媒体不变也是一个有效的结果。

领域技能永远不会拥有端到端交付物的所有权。仅加载活动工作流需要的内容。

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

相關技能