1仕組みと動作原理
生成ショット：面取り直方体の「カード」が右側から一体となって飛び込み、巡航中に各直方体が時間差で回転、減速してヒーロー位置で静止し、左側へ退出——進行波スタイルの 3D カルーセル。
registry/blocks/cuboid-carousel/SKILL.md
Rounded, bevelled cuboids carrying card content fly in from the right as one rigid group, cruise with a per-cuboid rotation stagger, decelerate to a hero hold, then exit left.
処理内容：「カードカルーセル」を 3D 空間に配置しつつ、個別に乱れ飛ばず一体感のあるリジッドな振付を維持し、タイポグラフィのレイアウト演出としての質感を保ちます。
幾何計算による安全なレイアウト：間隔は直方体のサイズと「最大到達 X 半スパン」から算出されるため、直方体同士が重なることはありません——手動の数値調整ではなく、構造的な保証です。
registry/blocks/cuboid-carousel/SKILL.md
Spacing is derived from the cuboid dimensions and the largest reachable X half-extent, so cuboids can never overlap.
処理内容：「幅や高さを大きく設定しすぎると衝突しないか」という懸念への対応——サイズに応じて間隔が自動再計算されるため衝突しません。
本バッチで最も広範なパラメータ面：40個の変数が元の DialKit スキーマを継承し、ジオメトリ、マテリアル、ライト、シャドウ、背景、カメラ、各フェーズの再生時間およびイージングを網羅。
registry/blocks/cuboid-carousel/SKILL.md
Forty variables carry the original DialKit schema: geometry, materials, lights, shadows, backdrop, camera and every segment duration and easing.
処理内容：「アート調整パネル」をブロック内に丸ごと移植——3D の専門知識がなくても、ライティングの数式に触れることなくスライダーでルックを調整可能です。
依存関係の完全なローカル化：importmap は同梱の three.module.min.js、addons/、および 593 KB のモーションデータモジュール cuboid-motion.js を参照。成果物実行時の外部リンクは Google Fonts の Inter のみ。
registry/blocks/cuboid-carousel/cuboid-carousel.html
"three": "./assets/three.module.min.js", … "cuboid-carousel/motion": "./assets/cuboid-motion.js" … href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap"
処理内容：three とモーションデータがブロックに同梱（JS 合計 ~1.1 MB）されており、ライブラリ取得のための外部ネットワーク依存がありません。フォントのみが実行時の唯一の外部リンクです。
カード内容は canvas 2D でサーフェステクスチャとして動的描画され、内蔵リストまたは cardsJson 変数から取得可能——画像アセットを用意しなくても内容を変更できます。
registry/blocks/cuboid-carousel/cuboid-carousel.html
function faceTexture(item) { … const c = document.createElement("canvas");
処理内容：カードのテキストはブラウザフォントでレンダリングされるため、変数を書き換えるだけでコンテンツを更新できます。
名前付きセグメントと一時停止セマンティクスを持つタイムライン：arrival / alternate-camera ラベル付きの gsap.timeline({ paused: true })。シークは hf-seek イベントにより再同期および再描画されます。
registry/blocks/cuboid-carousel/cuboid-carousel.html
/* ---- timeline: paused, seek-safe, no rAF ---- */ … const tl = gsap.timeline({ paused: true }); … tl.addLabel("arrival", 0);
処理内容：名前付きラベルにより、「カメラ切り替え区間」を外部（Studio タイムライン/シーケンス）から参照可能にしつつ、シーク時の安全性を維持します。
初動フレームの品質と安定性のための2段階ウォームアップ：ready 前に renderAt(0) を実行して「タイムライン全体を描画して GPU をフラッシュ」し、単発の setInterval で __timelines の登録完了をポーリング。
registry/blocks/cuboid-carousel/cuboid-carousel.html
Draw across the timeline and flush the GPU before ready, so shader links … var tick = setInterval(function () { … if (!ids.length) return; … clearInterval(tick);
処理内容：再生途中の初回シェーダーリンクによるコマ落ちを防止——「フレームバイフレームレンダリング」パイプライン特有のウォームアップ要件です。
2コア機能
013D 直方体カードカルーセルショット（1920×1080、6.6667秒；フライイン → 巡航 → ヒーロー静止 → 左退出）
0240個の変数による完全なパラメータ調整（ジオメトリ / マテリアル / ライト / シャドウ / 背景 / カメラ / 各区間の時間とイージング、DialKit の値域に準拠）
03カード内容は JSON（cardsJson）への差し替えおよび内蔵リストの利用が可能
04調整可能なシャドウ：マップサイズ 512–4096、ソフトネス 0–50（2048 マップにおける半径）
052段階カメラ：初期アングル（fov、セトルフレーム、手ブレ強度）から cameraTarget アングルへの遷移
06オフラインレンダリング対応：three コア + addons（RoomEnvironment、BufferGeometryUtils）+ モーションデータモジュールをすべて同梱
07Studio なしでの単体出力可能：直接レンダリングし、カード内容やヒーロー番号をオーバーライド可能
3外部依存関係
| Kind | Dependency / Endpoint |
|---|---|
| cli | HyperFrames 官方 CLI（add / render） |
| package | three.js 与 addons（随块本地副本；PMREM/RoomEnvironment 造环境光） |
| package | GSAP 3.14.2（随块本地副本）+ 本地运动数据模块 |
| network | Google Fonts：Inter（产物期浏览器拉取，本块唯一外链） |
4推奨統制措置と判定根拠
安全運用のための推奨統制措置
Agent 向け
段階的・都度認可、サンドボックス推奨
管理者向け
承認フロー、ロールバック可能、全履歴監査
判定根拠（ファイルパスと抜粋）
- scripts/: ローカルスクリプトまたはコマンドの実行: cuboid-carousel.html（ブラウザ/レンダラー側で実行：変数の読み込み → three シーンとカードテクスチャの生成 → 一時停止タイムラインの登録）
- 网络端点: 外部ネットワークアクセスの宣言: fonts.googleapis.com / fonts.gstatic.com（成果物実行時：Inter フォント。本ブロック唯一の外部通信エンドポイント）
監査ノート： 判定対象＝本ブロックディレクトリ（SKILL.md + コンポジション HTML + 同梱 three/gsap/モーションデータモジュール + addons + ライセンステキスト）：認証情報/環境変数の読み込みなし、シェルスクリプトなし、ローカルディスク書き込みコードなし、外部データ送信なし。唯一のネットワーク面は成果物実行時にブラウザが Google Fonts から Inter を取得する点のみ（パラダイム付録A第2条：成果物実行時の参照は判定対象外とし、エンドポイントの列挙のみ実施）。インストールおよびレンダリングは公式 CLI エコシステムに準拠。これらに基づき Blue と判定。
5二重目の独立検証
- [ok] 变量数与声明一致性（frontmatter 自称 40 variables） — 脚本实测：SKILL.md 变量表 40 行、html data-composition-variables 解析出 40 项、frontmatter 写 40 —— 一致。
- [ok] 「no rAF」注释 vs 代码里的 setInterval — 该 setInterval 是一次性的就绪轮询（等 __timelines 出现后立即 clearInterval），不是渲染循环；时间线注释也确写 seek-safe, no rAF。两者不冲突。
- [ok] 外链清点 — html 全文 http(s):// grep 仅命中三处 Google Fonts（preconnect ×2 + css2?family=Inter）；three/gsap/运动数据均为 ./assets/ 本地路径。
- [ok] registry-item 文件清单 vs 盘上文件 — 声明 10 个文件全部存在于盘上（含两个 addons 与两份许可文本），无远端 url 兜底。
- [ok] 几何安全声称 — SKILL.md 明写间距由尺寸与最大 X 半展推导；html 中 cuboidWidth/Height/Depth/cornerRadius/bevel/smoothness 均按 DialKit 区间读取（变量段注释写 every one clamped to the DialKit range）。
- [ok] 时长一致性 — registry-item duration 6.67、html data-duration 6.666666666666667、SKILL.md 标题行 6.666666666666667s —— 前两者为同一精度的两种写法。
6結論
最適な用途： 「一連のカード/アイテムが 3D 軌道に沿って入場し、順に主役となる」短いクリップ（6.7秒）が必要で、コードを書かずにジオメトリの質感、ライティング、カメラワークの緩急を調整したい製品・機能発表動画。
不向きな用途： 各カードに個別の振付が必要な場合や大量のカード（>12）を扱う場合（count 上限 12、heroCard 1–12）；プロジェクトサイズに制約があり、1 MB 以上の 3D ランタイムを同梱したくないパイプライン。
Install Agent-Ready
① Verified Mirror 2026-09-28
Option A · Direct DownloadDownload cuboid-carousel.tar.gz
sha256:
Option B · Copy Guide for Agentfc159be9ba802332…Agent はこの JSON ガイドから自動的にダウンロードして検証します。
② Upstream GitHub
GitHub Repo ↗
Pinned to commit d2f0bc7f34.