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.
判断基準はタイムスタンプ主導ではなく、4つの問い（記憶すべきものは何か／どの概念に構造が必要か／どのデータを強調すべきか／どのテンポ低下が離脱を招くか）として定義されています。
最初のステップはプロジェクトの現状把握：AGENTS.md、ルート composition、既存ビート表、共有 CSS、文字起こしを読み込み、data-start/data-duration またはマスター 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（外部ネットワーク検索は行いません）。
2種類のビートによる明確な役割分担：全画面の皺紙（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秒、黒文字主体、真の統計値または1つのキーワードのみに強調色を使用。下三分ルール：画面下三分または下半分に収め、タイトル1行＋任意の短いサブタイトルまたは2〜4行のリストで構成。
定量化されたカバー率しきい値によるテンポ維持：冒頭は20〜30秒以上、本文は30〜45秒以上のビートなし区間を作らず、30秒を厳密なスキャンしきい値、45秒を本文の上限値として設定します。
.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秒話し続けているケース。正しいアプローチは、1枚のカードをトピック全体で維持し、途中でサブタイトルやリストを用いて段階的に展開することです。
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);`.
ビート修正後の5ステップフロー（ファイル作成 → ルートマウント → 可視表更新 → 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〜10秒、全画面データ 5〜8秒、ガラス調解説 12〜30秒、長尺トピックガラスカード 25〜45秒、下三分幅 68〜72vw / 上限 1240〜1280px）も備えています。
2コア機能
01着手前にカバー率マップを作成し、「隙間埋めのための画像追加はしない」方針を明確化
02ビートタイプの決定ツリー：全画面皺紙 vs ガラス調下三分 vs 追加なし（各用途リスト付き）
03尺の規律：全画面は4〜12秒で抑制的に、下三分はタイトル1行＋任意の短いサブタイトルまたは2〜4行のリスト
04ナラティブのトピックに合わせたタイミング調整（文字起こしアンカー基準で ±0.2〜0.6秒イン、0.1〜0.5秒アウト）、「トピックは合っているが表示期間が短すぎる」失敗パターンを指摘
05実行可能なギャップスキャンしきい値：厳密30秒、本文上限45秒、実際の可視区間（SHOW 配列）に基づいて不足を検出
06コピーライティング規約：1秒で理解できる短い名詞句／簡潔なラベル／1カード1思考モデル、推奨構文パターンを提示
07ビジュアル仕様とスタイル再利用：黒文字主体、強調ブルーは大数字／キーワードに限定、既存のガラスカード class を継承、下三分幅 68〜72vw
08HyperFrames 実装準拠チェックリスト（data-* 属性、window.__timelines、SLOT アンカー、同一トラック非重複、lint 実行）
09納品前のセルフチェックと報告：lint 実行、エラーゼロ化、非ブロッキング警告のリスト化、変更ファイルとタイムスタンプの提示
10ユーザーの好みを制約として尊重：意図的に短縮されたビートを一般的なカバー率ルールで勝手に復元せず、承認済みのスタイルを継続利用
3外部依存関係
| Kind | Dependency / Endpoint |
|---|---|
| cli | HyperFrames CLI（对编辑后的 HTML 跑 lint；用户要 render-ready 时渲染或冒烟渲染，用法由 ../hyperframes-cli 提供） |
| cli | 本地搜索/脚本工具（rg、Select-String、小型 Node/PowerShell 转录脚本） |
| package | Node.js（跑 lint/转录小脚本的环境前提） |
4推奨統制措置と判定根拠
安全運用のための推奨統制措置
Agent 向け
段階的・都度認可、サンドボックス推奨
管理者向け
承認フロー、ロールバック可能、全履歴監査
判定根拠（ファイルパスと抜粋）
- scripts/: ローカルスクリプトまたはコマンドの実行: 本スキル自体にはスクリプトが0件：ディレクトリ内には SKILL.md と agents/openai.yaml のみ存在（find -type f で検証済み）。
- 网络端点: 外部ネットワークアクセスの宣言: 隣接領域（判定対象外）：依存関係が不足している場合、`npx` が npm レジストリから公式の hyperframes パッケージを取得することがあります。リポジトリ内の先例に則り、公式 CLI の通常利用の範囲内と判断されます。
- 本地工作目录: ファイルの読み書きと成果物の出力: 対象プロジェクト内に compositions/beats/NNN-short-name.html（ビートのサブコンポジション）を新規作成します。
監査ノート： 判定対象＝本スキル自体のディレクトリ（SKILL.md + agents/openai.yaml の計2ファイルのみ）。本スキルは純粋な指示型ワークフローであり、プロジェクトファイルと文字起こしを読み込み、ビート設計とタイミング規則を提供し、エージェントに HTML の記述と外部 lint の実行を指示します。自身にはスクリプト、認証情報の読み取り、外部ネットワーク送信、破壊的操作は一切ありません。Green 判定とならない理由は、ワークフローがプロジェクト内の composition/index.html および可視表を実際に書き換え（ローカルディスクへの書き込み）、公式の hyperframes CLI やローカル検索／スクリプトツールに依存して検証を完了するためです（「ローカルツール/CLI およびローカル読み書きのみ」に該当する Blue の特徴）。Red 判定の特徴（サンドボックス無効化、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結論
最適な用途： 最適：既存の 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:
Option B · Copy Guide for Agentf17e6d21395b29b4…Agent はこの JSON ガイドから自動的にダウンロードして検証します。
② Upstream GitHub
GitHub Repo ↗
Pinned to commit 0d30152a82.