ホーム / 全スキル / コンテンツ制作 / frost-sequence-camera-orbit
コンテンツ制作 · heygen-com/hyperframes

frost-sequence-camera-orbit

旋回するカメラが氷のロゴを追跡し、粉々に砕け、2つのテキストシーンへと再構成されてフェードアウトします。HyperFramesブロック、1920×1080、22.5秒、216変数。

L4 高権限 · 段階的認可と監査V1 コミット固定コマンド実行ネットワーク通信ファイル書き込みDual-pass Audit
Author heygen-comGitHub heygen-com/hyperframes ↗Stars 44283License Apache-2.0(仓库根 LICENSE = Apache License Version 2.0;块内随带第三方许可文本:three.js MIT、GSAP 标准许可、Geist/Archivo/Cormorant Garamond OFL 等)Commit d2f0bc7f34
管理レベルは Skill の能力と推奨統制措置を示すものであり、品質や安全性の認証、利用可否の判定ではありません。使用の可否はユーザーおよび管理者が決定します。Agent 環境によって制約が異なるため、自動保護を仮定しないでください。第三者製 Skill の著作権は原著作者に帰属し、利用リスクは利用者が負います。

1仕組みと動作原理

出力映像:22.5秒の完全な「氷シーケンス」——ロゴ → 1つ目のテキスト → 2つ目のテキスト → 破砕 → フェードアウト。カメラは固定された対象の周りを公転し、可読性を高めるため正面通過時は減速します。同一のパーティクルフィールドがすべてのトランジションを担います。

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.
処理内容:単一ショットではなく、ショートフィルム全体の「氷テーマ」シークエンスです。直接変更可能なのは2つのテキストシーンとSVGロゴのみであり、カメラや全体のタイミングを変更する場合は 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で登録)。マウントやレンダリング時にディレクトリ名から推測しないでください。

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 で確認できます。

WebGL ではなく WebGPU/TSL でレンダリング: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 コンピュートを使用しているため、レンダリングホストに対してより高い要件を求めます。

ビルド前に2重の自己診断を実行:ソースレベルの TypeScript 事前検証と、コンパイル時のみ発覚するシェーダー欠陥を捕捉する「GPU非依存の WGSL シェーダーコンパイルプローブ」を実施。

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 コードを「一度実行して結果を確認する」方法で検証するのは時間がかかりすぎるため、シェーダー生成を 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 をサポートしていない場合は判読可能なエラーを出力します。

ロゴはプロジェクトアセットからのみ取得可能:URLホワイトリストによりスキーマやプロトコル相対ホストを拒絶し、相対/ルート相対パスおよびインライン 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 を入力できる」入力面をローカルアセットのみに絞り込み、合成レンダリング時に外部画像を取得するのを防止します。

インストール時に2つのバイナリアセット(破片アトラスと氷の内包物テクスチャ)の補完が必要——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"
処理内容:これら2枚の画像は容量が大きくリポジトリ管理に適さないため、マニフェストに URL のみを残し、インストール時に公式 CLI が取得します(そのためインストールにはネットワーク接続が必要です)。

2コア機能

0122.5秒のマルチステージ氷シーケンス(ロゴ + 2段の可読テキスト + 破砕 + フェードアウト、1920×1080)
02216変数のコントロールサーフェス(マテリアル光学、パーティクル挙動、テキストメッシュなど)
03ロゴ差し替え可能:logoUrl でプロジェクト内 SVG を指定(デフォルト assets/logo.svg)、プロジェクトアセットパスのホワイトリストで保護
04編集可能なソースサブセット:完全な TypeScript ソース + esbuild ビルドスクリプト(frost.js および motion.js を出力)
05WebGPU/TSL による氷マテリアルと GPU パーティクルシステム(curl ノイズ乱流を含む)、BVH による高速化。バンドル成果物には明示的な出所バナーを付与
06ランタイムの外部リンクゼロ:frost.js、ローカル gsap、3種類の Geist フォント、ノイズテクスチャをすべてブロック内に同梱
07Studio なしでもレンダリング可能:composition を直接描画し、2つのテキストをオーバーライド(改行は | で指定)
08インストール時のリモートバイナリを明記:2つの registry-assets エントリに URL を保持し、SKILL.md にも「fetched from the CDN at install」と記載

3外部依存関係

KindDependency / Endpoint
cliHyperFrames 官方 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推奨統制措置と判定根拠

安全運用のための推奨統制措置
Agent 向け
段階的・都度認可、サンドボックス推奨
管理者向け
承認フロー、ロールバック可能、全履歴監査
判定根拠(ファイルパスと抜粋)
  • scripts/: ローカルスクリプトまたはコマンドの実行: assets/frost.js(composition 内で <script src> により読み込み・実行:WebGPU/TSL 氷シーケンスランタイム、window.Frost を公開)
  • 网络端点: 外部ネットワークアクセスの宣言: インストール時(ホスト CLI の npx hyperframes add により実行): static.heygen.ai/hyperframes-oss/regist
  • 本地工作目录: ファイル読み書きおよび成果物出力: ランタイム(composition):ディスクへの書き込みなし。canvas および WebGPU リソースはすべてメモリ上で作成され、dispose 時に解放。
監査ノート: 判定対象=本ブロックディレクトリ(SKILL.md + composition + バンドル成果物 frost.js + フォント/テクスチャ + source/ 編集可能ソースサブセット):認証情報/env/cookie の読み取りなし(process.env スキャンでヒットゼロ)、データ外部送信なし、ランタイム時の外部リンクゼロ。ロゴ入力はホワイトリストによりプロジェクトアセットパスまたはインライン SVG に限定されています。ディレクトリ内には実行可能なビルドスクリプトが存在しますが(source/build.mjs は esbuild を呼び出し、run-shard-compile.mjs は child_process spawnSync で一時コンパイルを実行)、ユーザーがソースサブセットを明示的に再ビルドする際にのみ実行され、その動作もローカルバンドルと一時ディレクトリに限定されるため「ローカルスクリプト/ローカル読み書き」の範疇となり blue と判定。インストール時にはファーストパーティ CDN から2つのバイナリアセットを取得するためネットワーク接続が必要であり(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結論

  • コマンド1つで22.5秒のプロダクション品質の氷シーケンスを生成
  • 最も充実したパラメータと完全なカスタマイズ経路
  • 適切に絞り込まれた入力インターフェース
  • 同一バッチと共通する決定論的コントラクト
  • 最適な用途: 完全な「氷/結晶テーマ」のブランド向けショートシークエンス(20秒規模、ロゴから2つのスローガンを経て破砕・フェードアウト)を必要とし、レンダリング環境が WebGPU に対応しており、ソースコードのサブセットを用いた詳細な改変を行うチーム。
    不向きな用途: レンダリングホストが WebGPU をサポートしていない、または完全オフラインでのインストールが必須な(インストール時に2つの CDN アセット取得が必要)パイプライン。8〜12秒程度の単一ショットのタイトルカードなど軽量なシーンを求める場合(同バッチの他ブロックで代替可能)。
    Install Agent-Ready
    ① Verified Mirror 2026-09-28
    Option A · Direct DownloadDownload frost-sequence-camera-orbit.tar.gz
    sha256: d873fafcf97f3f6b…
    Option B · Copy Guide for Agent
    install.json
    Agent はこの JSON ガイドから自動的にダウンロードして検証します。
    ② Upstream GitHub
    GitHub Repo ↗
    Pinned to commit d2f0bc7f34.