hyperframes（ライブ上流ポインタ）
上流: https://github.com/heygen-com/hyperframes · ドキュメント: https://hyperframes.heygen.com · カタログ: https://hyperframes.heygen.com/catalog
1. 推奨インストール方法（自動更新付きバージョン管理プラグイン）
claude plugin marketplace add heygen-com/hyperframes
claude plugin install hyperframes@hyperframes
# またはプロジェクトごと:
npx hyperframes skills update
その後は /hyperframes:hyperframes（ルーター）に加え、figma、hyperframes-cli、hyperframes-registry、media-use、reverse-any-video、slideshow、remotion-to-hyperframes を使用できます。
2. フォールバック：ライブスキルを直接読み込む
bash ~/.claude/skills/design-engineer/scripts/upstream.sh hyperframes # sparse checkout: skills/, docs/guides, README, AGENTS
<PATH>/skills/hyperframes/SKILL.md（レンダリング契約とワークループ）から始めてください。次に、該当するサブスキルを選択します。
- Figma リンクまたはブランドトークン →
skills/figma/SKILL.md - 名前付きビジュアル（グリッチ、グレイン、チャート、地図）→ 手動で作成する前に
skills/hyperframes-registry/SKILL.md - 音楽、効果音、ナレーション、アバター、切り抜き →
skills/media-use/SKILL.md - 既存の動画をコピー →
skills/reverse-any-video/SKILL.md - デッキ / ライブプレゼンテーション →
skills/slideshow/SKILL.md - Remotion / Lottie / Three / Manim の移植 →
skills/remotion-to-hyperframes/SKILL.md
3. CLI（Node 22+）
npx hyperframes init my-video && cd my-video
npx hyperframes add data-chart
npx hyperframes preview
npx hyperframes render
4. Remotion との比較による選択
チームがすでに React / Remotion を使用 → remotion。実ページのプロモーションでショットカードを使用 → video-shotcraft。ナレーションとスコア付きのスタイリッシュなショートフィルム → lemo-opuscar。