1实现原理 · 为什么它能做到
产出镜头：一条 22.5s 的完整「冰序列」——logo → 第一段文字 → 第二段文字 → 碎裂 → 淡出；相机绕着固定物体公转，并为可读性安排更慢的正面通过；同一套粒子场承载每一次转场。
registry/blocks/frost-sequence-camera-orbit/SKILL.md
A complete 22.5-second ice sequence: logo, first text, second text, breakup, and fade. The camera orbits the fixed objects with slower front-facing passes for reading. The same particle field carries each transition.
注：这里在做什么：不是单镜头而是一整支短片的「冰主题」段；可改的只有两个文本时刻与 SVG logo，相机与装配时序要去 source/ 改。
参数面 216 个变量，是本批之最（含材质 IOR/厚度/吸收/背光、粒子飞行重力与湍流、文字网格细节等）。
registry/blocks/frost-sequence-camera-orbit/SKILL.md
HyperFrames block, 1920×1080, 22.5s, 216 variables. … | `textMeshDetail` | number | `4` | Type · Text mesh detail (1-4; higher = smoother deformation) 1–4 step 1 |
注：这里在做什么：几乎全部视觉维度都有滑杆，代价是变量表极长、上手需要索引。
composition id 与目录名不同：目录/条目名是 frost-sequence-camera-orbit，而 composition id 是 frost-sequence-rig（时间线也注册在这个 id 下），挂载与渲染时不要按目录名猜 id。
registry/blocks/frost-sequence-camera-orbit/SKILL.md
data-composition-id="frost-sequence-rig" … One paused GSAP timeline registered as `window.__timelines["frost-sequence-rig"]`.
注：这里在做什么：目录名是 registry 条目名，composition id 沿用原工程命名；两者不一致是历史遗留，可见于 SKILL.md 与 html 的 data-composition-id。
渲染走 WebGPU/TSL 而非 WebGL：assets/frost.js 是约 1.5 MB 的 IIFE 打包产物（暴露 window.Frost），由 src/frost.ts + [email protected] 的 WebGPU/TSL 与 three-mesh-bvh 打出来。
registry/blocks/frost-sequence-camera-orbit/source/build.mjs
// Bundle src/frost.ts (+ [email protected] WebGPU/TSL, three-mesh-bvh) into one … classic IIFE at assets/frost.js exposing `window.Frost`.
注：这里在做什么：与同批其它块（three WebGL）不同，本块的材质与粒子用 TSL 节点 + WebGPU 计算，因此对渲染主机有更高门槛。
构建前有两道自检：源码级 TypeScript 预检，以及「无 GPU 生成 WGSL 的 shader 编译探针」，用来抓只在编译期暴露的 shader 缺陷。
registry/blocks/frost-sequence-camera-orbit/source/README.md
`build.mjs` runs two checks before bundling: a source-only TypeScript pass (`tools/compile-preflight.mjs`) and a headless shader-compile probe (`tools/run-shard-compile.mjs`) that generates the WGSL for one shard without a GPU, to catch a class of shader bug that only shows up at compile time.
注：这里在做什么：1.5 MB 的 GPU 代码靠「跑一遍看结果」验证太慢，于是把 shader 生成拉进 CPU 侧的构建前检查。
WebGPU 是硬要求：拿不到 navigator.gpu 或适配器就直接抛错。
registry/blocks/frost-sequence-camera-orbit/source/src/frost.ts
if (!nav.gpu) throw new Error("Frost: navigator.gpu is unavailable (WebGPU required)"); … const adapter = await nav.gpu.requestAdapter().catch(() => null);
注：这里在做什么：明确失败优于静默降级——渲染主机不支持 WebGPU 时会给出可读错误。
logo 只能来自项目资产：URL 白名单拒绝任何 scheme 或协议相对 host，只允许相对/根相对路径与内联 SVG data URI，越界直接抛错。
registry/blocks/frost-sequence-camera-orbit/source/src/shape/logo.ts
A relative or root-relative path, or an inline SVG data URI: never a scheme or protocol-relative host. … if (!isProjectAssetUrl(url)) throw new Error("The logo must be a project asset path, not " + url);
注：这里在做什么：把「用户可填 logoUrl」这个输入面收窄到本地资产，避免合成渲染时去外部取图。
装机期需要补两个二进制资产（碎片图集与冰内含物贴图）——registry-item 里带 static.heygen.ai 的 url，SKILL.md 明写 fetched from the CDN at install。
registry/blocks/frost-sequence-camera-orbit/registry-item.json
"url": "https://static.heygen.ai/hyperframes-oss/registry-assets/122961c82d240e47.png" … "url": "https://static.heygen.ai/hyperframes-oss/registry-assets/4bea3a8ab90c9527.png"
注：这里在做什么：这两张图太大/不便进仓库，于是只在清单里留 URL，由官方 CLI 在安装时拉取（因此安装需联网）。
2核心能力
0122.5s 多段冰序列（logo + 两段可读文字 + 碎裂 + 淡出，1920×1080）
02216 个变量的控制面（材质光学、粒子飞行、文字网格等）
03可换 logo：logoUrl 指向项目内的 SVG（默认 assets/logo.svg），并受项目资产路径白名单约束
04可编辑源码子集：完整 TypeScript 源码 + esbuild 构建脚本（产出 frost.js 与 motion.js）
05WebGPU/TSL 冰材质与 GPU 粒子系统（含 curl 噪声湍流），并以 BVH 加速；打包产物带明确来源横幅
06零运行时外链：frost.js、本地 gsap、三套 Geist 字体与噪声贴图全部随块分发
07脱离 Studio 也能出片：直接渲染 composition 并覆盖两段文字（用 | 表示换行）
08装机期远端二进制的明确登记：两项 registry-assets 带 url，SKILL.md 亦标注 fetched from the CDN at install
3外部依赖
| 类型 | 依赖 |
|---|---|
| cli | HyperFrames 官方 CLI（add / render；安装时按 registry-item 的 url 拉资产） |
| network | 装机期资产下载（官方 CDN，两个二进制 registry-assets） |
| package | [email protected]（WebGPU/TSL）+ [email protected]，已打进 assets/frost.js（均 MIT） |
| package | 源码重建依赖（仅改 source/ 时需要）：esbuild、opentype.js、three 0.185.1、three-mesh-bvh、typescript |
| package | 随块字体（Geist Regular/SemiBold/Bold，OFL）与噪声/冰内含物贴图 |
4风险提醒 风险提醒：蓝色 · 知晓即可
风险提醒：蓝色 · 知晓即可
- WebGPU 是硬门槛 — navigator.gpu 或适配器缺失即抛错（source/src/frost.ts）；渲染主机/浏览器需支持 WebGPU，headless 环境需相应后端。
- 装机需联网 — 两个二进制资产以 CDN url 形式留在 registry-item.json，安装时由 CLI 拉取（static.heygen.ai）；镜像/内网环境需预先准备。
- 体积与内存 — frost.js 约 1.5 MB + composition 131 KB，SKILL.md 自述约 350 MB/实例、一次一个；多块并列风险高。
- 216 个变量的可用性成本 — 变量表极长，人工调参需要索引；错误值虽被 optionsFrom 拦下，但排查点会分散在 buildStatus 上。
- 源码子集不含测试与调参台 — source/README.md 明写原项目的测试套件与独立视觉调参 UI（workbench/）未包含，改了源码后需自建验证路径。
风险提醒：蓝色，知晓即可。判级对象＝本 block 目录（SKILL.md + composition + 打包产物 frost.js + 字体/贴图 + source/ 可编辑源码子集）：无凭证/env/cookie 读取（process.env 扫描零命中）、无数据外发、运行期零外链；logo 输入被白名单收窄为项目资产路径或内联 SVG。目录内确有可执行构建脚本（source/build.mjs 调 esbuild；run-shard-compile.mjs 用 child_process spawnSync 起临时编译），但只在使用者主动重建源码子集时执行，行为限于本地打包与临时目录，属「本地脚本/本地读写」范畴，故取 blue。安装期需联网拉两个第一方 CDN 二进制资产（static.heygen.ai，registry-item.json 的 url 字段），已列入 network_calls。特别提示（不改档位）：source/src/motion/editor.ts 里有 localStorage 读写（调参工作台用它记状态），但其产物 assets/motion.js 不在本块分发清单内、盘上也不存在，故安装后不构成实际接触面。
5第二遍独立确认
- [ok] 变量数与声明一致性（frontmatter 自称 216 variables） — 脚本实测：SKILL.md 变量表 216 行、html data-composition-variables 解析出 216 项、frontmatter 写 216 —— 一致（本批最大变量表）。
- [ok] composition id 与目录名不一致 — SKILL.md 挂载片段与 Runtime contract 都写 frost-sequence-rig，html data-composition-id 亦为 frost-sequence-rig；目录/条目名是 frost-sequence-camera-orbit。非缺陷，但挂载时不可按目录名猜 id。
- [discrepancy] source/README 声称与分发内容的差异 — README 说 build.mjs 会产出 ../assets/frost.js 与 ../assets/motion.js，但 registry-item.json 的分发清单只含 frost.js，盘上 assets/ 也没有 motion.js —— 安装后那份「轻量 WebGL 编辑辅助」并不随块提供。
- [ok] localStorage 出现位置 — 仅见于 source/src/motion/editor.ts（getItem/setItem 包在 try/catch 里）；该模块的产物 motion.js 未随块分发（见上一条），因此不构成安装后的实际接触面。
- [ok] 装机期 CDN 资产声称 — registry-item.json 中 shards-atlas.png 与 textures/ice-inclusions-generated.png 两项带 static.heygen.ai 的 url，盘上确实缺失，与 SKILL.md 的 fetched from the CDN at install 一致。
- [ok] WebGPU 硬门槛与构建自检 — src/frost.ts 中 navigator.gpu 缺失即 throw（并附 requestAdapter 的 null 分支）；source/README.md 描述的两道构建前自检对应 tools/compile-preflight.mjs 与 tools/run-shard-compile.mjs（后者 import node:child_process 的 spawnSync）。
- [ok] 凭证扫描 — 对 SKILL.md / html / registry-item.json / source/ 扫描 process.env、secret、token、api_key、cookie、sudo、sandbox：无真实命中（仅 curl noise 之类注释文字误配）。
6结论
适合：需要一支完整的「冰/结晶主题」品牌短片段（20s 级、logo 到双段 slogan 再到碎裂淡出），且渲染环境具备 WebGPU、愿意按源码子集深改的队伍。
不适合：渲染主机不支持 WebGPU、或必须完全离线安装（安装期要拉两个 CDN 资产）的流水线；只需要 8–12s 单镜头标题卡的轻量场景（可改用同批其它块）。
安装 agent 直装可复制
① 本站镜像 更新 2026-09-28
方式 A · 人下载镜像包下载 frost-sequence-camera-orbit.tar.gz
sha256:
方式 B · JSON 格式安装指南，复制给 agentd873fafcf97f3f6b…agent 读 JSON 指南后会自动从本站下载安装，无需更多说明。
② 上游 GitHub · 原始来源
来源信息 GitHub 原始
作者 / 仓库heygen-com / heygen-com/hyperframes
原始 GitHubheygen-com/hyperframes ↗
Stars44283
最近推送2026-09-06
本 skill commit
d2f0bc7f34许可Apache-2.0（仓库根 LICENSE = Apache License Version 2.0；块内随带第三方许可文本：three.js MIT、GSAP 标准许可、Geist/Archivo/Cormorant Garamond OFL 等）
本站信息
收录日期2026-09-06
分类内容创作
侦查报告AI 侦查 · 2 遍 · 2026-09-06
本站镜像与 GitHub 原始是不同来源：本站锁定 commit 快照经 /r2 分发；GitHub 为实时上游，内容可能已更新。