首页 / 全部技能 / 内容创作 / hyperframes-video-beats
内容创作 · nateherkai/hyperframes-student-kit

hyperframes-video-beats

Plan, write, time, style, and validate motion-graphic beats for long-form talking-head HyperFrames videos. Use when Codex is asked to add or improve visual beats, glassmorphism lower thirds, crumpled-paper full-screen takeovers, transcript-synced callouts, pacing coverage, YouTube retention graphics, or render-ready overlays in an existing HyperFrames video project.

L4 高权限 · 分级授权与审计V1 已固定执行命令联网读写文件Dual-pass Audit
Author nateherkaiGitHub nateherkai/hyperframes-student-kit ↗Stars 1070License NOASSERTION(仓库根 LICENSE,实为 MIT 文本)Commit 0d30152a82
管控等级描述 skill 的能力与建议配套的管控措施,不代表质量或安全认证,也不表示可用或不可用。是否使用由用户和管理者决定。不同 agent 宿主对权限的约束各不相同,请勿假定宿主一定会提供安全兜底。第三方 skill 版权归原作者,使用风险由使用者自行承担。

1实现原理 · 为什么它能做到

定位是「审片编辑」而非「生成器」:把口播视频 + 转录变成有节奏的动效节拍组,原则是不遮挡说话人、不为填空而加图。

.claude/skills/hyperframes-video-beats/SKILL.md
Use this skill to turn a talking-head video plus transcript into a paced set of motion graphics that support the narration without covering the speaker unnecessarily.
判据被写成四个问题(该记住什么/哪个概念需要结构/哪个数据值得强调/哪里节奏变慢会掉观众),而不是时间戳驱动。

第一步是读工程现状:AGENTS.md、根 composition、现有节拍表、共享 CSS、转录,然后从 data-start/data-duration 或 master SHOW 数组建覆盖图。

.claude/skills/hyperframes-video-beats/SKILL.md
3. Build a coverage map from the root `data-start` / `data-duration` entries or the master `SHOW` array. … 5. Identify topic spans by narration, not by arbitrary timestamps.
工具选择偏本地快速命令:Prefer `rg`, `Select-String`, and small Node/PowerShell transcript scripts.(不做网络检索)

两类节拍有明确分工:整屏皱纸(paper takeover)用于论点/清单/章节/引言/数据,玻璃下三分(glass lower-third)用于解释型、话题标签、公式式心智模型,且必须不遮脸。

.claude/skills/hyperframes-video-beats/SKILL.md
Use a paper takeover when the narration reaches a major thesis, list, section marker, quote, or stat that should briefly become the whole frame. … Use a glass lower-third when the speaker should remain visible and the graphic should support the current idea.
整屏规则:通常 4-12 秒、黑字为主、只有真正的统计数字或一个关键词用强调色;下三分规则:留在下三分/下半屏、一条标题 + 可选短副标或 2-4 条列表。

节奏用可量化的覆盖阈值兜底:开头不超过 20-30 秒无节拍,正文不超过 30-45 秒,并把 30s 设为严格扫描阈值、45s 设为正文上限。

.claude/skills/hyperframes-video-beats/SKILL.md
- Early video: avoid more than 20-30 seconds without a visual beat. … - Main body: avoid more than 30-45 seconds without a beat.
扫描时要求按真实可见区间报缺口:report true gaps from the visibility schedule, not just the DOM order.(有 SHOW 数组时以它为准)

对时方法锚在词上:找到话题起始词、提前 0.2-0.6 秒进场、话题结束或自然交棒才收起,下一拍紧接时提前 0.1-0.5 秒清场。

.claude/skills/hyperframes-video-beats/SKILL.md
2. Start the beat 0.2-0.6 seconds before that anchor when possible. … 4. If the next beat begins immediately, clear 0.1-0.5 seconds before it unless the handoff is intentional.
点名了一个反复出现的失败模式:卡片对了话题但只活 5-8 秒,而说话人还讲了 20-40 秒 —— 正确做法是一张卡活过整个话题、中途用副标或列表递进。

把 HyperFrames 的硬约束写成实现清单:每个挂载的定时元素要有 data-start/data-duration/data-track-index,子组合要注册暂停的 GSAP 时间线到 window.__timelines,并用 tl.set({}, {}, SLOT); 钉住槽位,不许出现非确定性逻辑。

.claude/skills/hyperframes-video-beats/SKILL.md
- Every mounted timed element needs `data-start`, `data-duration`, and `data-track-index`. … - Sub-compositions should register a paused GSAP timeline on `window.__timelines`. … - Pin each sub-composition timeline with `tl.set({}, {}, SLOT);`.
改完节拍的五步流程(建文件 → 根部挂载 → 更新可见表 → SLOT 对齐时长 → 查同轨重叠)与收尾 `npx hyperframes lint` 都写在 SKILL.md 里。

收尾是自检 + 汇报:跑 lint、清零错误、单列已知非阻断告警;若用户要可渲染产物就渲染或冒烟渲染,并给出精确的文件路径与时间戳。

.claude/skills/hyperframes-video-beats/SKILL.md
1. Run the HyperFrames linter. 2. Fix all errors. 3. Mention warnings separately if they are known and non-blocking. … 5. Give the user exact file paths and timestamps changed.
还有一组实用默认值(整屏概览 8-10s、整屏数据 5-8s、玻璃解释 12-30s、长话题玻璃卡 25-45s、下三分宽 68-72vw / 上限 1240-1280px)供无上下文时兜底。

2核心能力

01先建覆盖图再动手,且明确「不为填空而加图」
02节拍类型决策树:整屏皱纸 vs 玻璃下三分 vs 不加,各带用途清单
03时长纪律:整屏 4-12 秒且克制,下三分一条标题 + 可选短副标或 2-4 条列表
04按叙事话题对时(转录锚点 ±0.2-0.6 秒进场、0.1-0.5 秒清场),并点名「对了话题但活太短」的失败模式
05缺口扫描阈值可执行:严格 30s、正文上限 45s,并按真实可见区间(SHOW 数组)报缺口
06文案写法规范:1 秒内读懂,短名词短语/直白标签/一张卡一个心智模型,并给出正例句式
07视觉规范与样式复用:黑字为主、强调蓝只给大数字/关键词、玻璃卡沿用既有 class、下三分宽度 68-72vw
08HyperFrames 实现合规清单(data-* 属性、window.__timelines、SLOT 锚、同轨不重叠、运行 lint)
09交付前自检与汇报:跑 lint、清零错误、单列非阻断告警,并给出改动文件与时间戳
10把用户口味当约束:被砍短的节拍不因通用覆盖规则而恢复,已批准的样式继续复用

3外部依赖

KindDependency / Endpoint
cliHyperFrames CLI(对编辑后的 HTML 跑 lint;用户要 render-ready 时渲染或冒烟渲染,用法由 ../hyperframes-cli 提供)
cli本地搜索/脚本工具(rg、Select-String、小型 Node/PowerShell 转录脚本)
packageNode.js(跑 lint/转录小脚本的环境前提)

4管控建议与判定依据

建议配套管控措施
面向 Agent
分级或逐次授权,建议在沙箱运行
面向管理者
审批流程、可回滚、全程审计
判定依据(文件路径与关键语句摘要)
  • scripts/: 执行本地脚本或命令: 本 skill 自身 0 个脚本:目录只有 SKILL.md 与 agents/openai.yaml(find -type f 核对)
  • 网络端点: 声明外部网络访问: 相邻面(不判级):`npx` 在依赖缺失时会从 npm registry 拉取官方 hyperframes 包;按同库先例属官方 CLI 常规使用(仓
  • 本地工作目录: 文件读写与工件输出: 在目标项目内新建 compositions/beats/NNN-short-name.html(节拍子组合)
审计说明: 。判级对象=本 skill 自身目录(仅 2 个文件:SKILL.md + agents/openai.yaml)。它是纯指令型工作流:读项目文件与转录、给节拍设计与对时规则、指示 agent 写 HTML 并跑外部 lint;自身 0 脚本、0 凭证读取、0 网络外发、0 破坏性操作。之所以不落绿档,是因为流程会实际改写项目内的 composition/index.html 与可见性表(本地写盘),且依赖官方 hyperframes CLI 与本地搜索/脚本工具完成验证——属『仅本地工具/CLI 与本地读写』的蓝色特征。无红档特征(无沙箱关闭、无 TLS 降级、无反自动化绕过、无任意代码执行面)。

5第二遍独立确认

  • [ok] 目录文件清单 — find 返回 SKILL.md(8.4KB)与 agents/openai.yaml(250B);无 scripts/、无 references/、无二进制资产。
  • [ok] 网络/凭证面反例搜索 — 全目录 0 处 http(s) URL、0 处 fetch、0 处 env/API_KEY/TOKEN/SECRET;唯一外部命令是 `npx hyperframes lint` 与本地 rg/Select-String。
  • [ok] 数字口径跨章节一致性 — Pacing Heuristics 的 20-30s / 30-45s 与 Coverage Scan 的『30s 严格、45s 上限』自洽;Timing Method 的 0.2-0.6s 进场与 Practical Defaults 的『Beat start lead-in: 0.2-0.6 seconds』一致;整屏 4-12s 上限与 Practical Defaults 的 5-8s/8-10s 分档相容。
  • [ok] 实现规则是否可被 lint 校验 — 时序元素属性(data-start/data-duration/data-track-index)、子组合时间线注册(window.__timelines)、SLOT 锚(tl.set({}, {}, SLOT);)、同轨不重叠 —— 均为同仓 HyperFrames 系列 skill 反复出现的 lint 口径,文档并明确 Run `npx hyperframes lint`。
  • [ok] 是否夸大了自动化 — 文档要求人工/agent 判断(不为填空加图、按话题而非时间戳定位、保留用户口味),并给定扫描阈值与人工复核点,无『全自动生成』表述。
  • [ok] 宿主元数据内容 — agents/openai.yaml 仅含 interface.display_name / short_description / default_prompt 三项展示字段,无权限、无命令、无环境变量。

6结论

  • 把「该不该加图」的判据写成四个问题,并明确拒绝填空式加图——这是多数动效工作流最容易翻车的地方,它直接堵住了。
  • 节拍类型分工清楚(整屏皱纸讲论点/数据,玻璃下三分讲解释),且都带「不遮脸」的硬约束,适合口播长视频。
  • 对时锚在词上、覆盖阈值可量化(30s 严格 / 45s 上限),既有原则也有兜底,便于交给 agent 执行后自查。
  • 实现规则与 HyperFrames lint 口径绑定,设计决策可被工具校验,不是纯审美空谈。
  • 尊重用户口味:被砍短的节拍不许因通用规则复活,已批准的玻璃卡样式不许重设计。
  • 适合: 适合:已有 HyperFrames 工程的长视频/播客口播(YouTube 留存向)需要系统补齐动效节拍;也适合作为审稿清单,检查现有节拍表的覆盖缺口与时长失衡。
    不适合: 不适合:从零建工程(那是 make-a-video / hyperframes)、短视频 9:16 快剪(有 short-form 系列)、以及期望自动生成全部图形的场景——它产的是设计决策与合规实现规则,不是素材生成器。
    Install Agent-Ready
    ① Verified Mirror 2026-09-28
    Option A · Direct DownloadDownload hyperframes-video-beats.tar.gz
    sha256: f17e6d21395b29b4…
    Option B · Copy Guide for Agent
    install.json
    agent 读 JSON 指南后会自动从本站下载安装,无需更多说明。
    ② Upstream GitHub
    GitHub Repo ↗
    Pinned to commit 0d30152a82.