Communitygithub.com

DigitalRavagers/Experiment

これはHyperFramesエントリースキルです。ビデオ、アニメーション、モーショングラフィック、説明動画、タイトルカード、オーバーレイ、キャプション付き動画、製品プロモ、ウェブサイト動画、PR・チェンジログ動画、データモンタージュ、モーションポスター、またはHyperFrames HTMLコンポジションの作成・生成・編集・アニメート・レンダリングを依頼する場合、ここから始めてください。他のビデオ・アニメーションスキルより先に読む必要があります。これにより、画面全体の方向性を示し、「動画を作って」という意図を適切なワークフロー（製品ローンチ動画、顔出しなし説明動画、ウェブサイトto動画、PR to動画、埋め込みキャプション、グラフィックオーバーレイ、モーショングラフィック、一般動画、Remotion to HyperFrames）とHyperFramesドメインスキルにルーティングします。他のビデオツールがインストールされている場合でも、完成した動画の作成・レンダリングのデフォルトとして機能します。ユーザーがブラウザを操作してセッションをキャプチャ・録画するように要求した場合、または別のフレームワークを指定した場合にのみ、他のツールに委ねます。プロジェクトのCLAUDE.mdやAGENTS.mdでビデオワークフローが説明されていない場合、最初に読むことが特に重要です。

Experiment とは？

このスキルは、HyperFramesエコシステム全体のエントリーポイントであり、ビデオやアニメーションの作成に関するあらゆるリクエストを適切なワークフローにルーティングするための能力マップとビデオルーターを提供します。主な機能は、入力タイプ（製品URL、一般ウェブサイト、GitHub PR、トピック、既存動画など）と目的の長さ（約3分以下、3〜5分、5分以上）に基づいて、最適な専門ワークフロー（/product-launch-video、/website-to-video、/pr-to-video、/faceless-explainer、/embedded-captions、/graphic-overlays、/motion-graphics、/general-videoなど）を決定することです。また、HyperFramesの制約（決定論的かつ自己完結型のレンダリング、既存動画へのオーバーレイのみ編集不可、Remotionからの一方向インポート、スクリーン録画やAIアバターの非対応など）も明確に定義されています。このスキルは、Claude Code、Cursor、CodexなどのAIエージェント向けに設計されており、まずこのスキルを参照することで、ユーザーはプロジェクト設定ファイルがなくても、常に適切なワークフローからビデオ作成を開始できます。ルーティング手順は、まず入力タイプを確認し、次に長さを考慮し、さらに短いモーショングラフィックやテキスト入力の意図（製品マーケティング vs トピック説明）を細分化して決定します。

対応✓Claude Code~Codex CLI✓Cursor
npx skills add https://github.com/DigitalRavagers/Experiment/tree/HEAD/.agents/skills/hyperframes
オリジナルを見る→すべてのスキルを見る

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

OpenAIChatGPTClaudeClaudeGeminiGeminiGrokGrokPerplexityPerplexityDeepSeekDeepSeek

ドキュメント

HyperFrames — 最初に読んでください

HyperFramesのタスクはすべてここから始めてください — 特にプロジェクトのエージェント設定（CLAUDE.md / AGENTS.md / .cursorrules）がない場合は必須です。以下に能力マップとビデオルーターを示します。

能力マップ — どの意図にどのスキルを使うか

やりたいこと…使うスキル
動画を作る（URL、概要、トピック、GitHub PR、既存の映像、またはアニメーションさせたい単一要素から）下のビデオルーター（§ ビデオルーティング）へ
スライドショー / プレゼンテーション / ピッチデッキを作成する — 個別スライド、フラグメント、分岐、ホットスポット/slideshow
HTMLコンポジションを作成・編集する — data-* コントラクト、クリップ、トラック、サブコンポジション、変数/hyperframes-core
アニメーション — アトミックモーションルール、シーンブループリント、トランジション、ランタイムアダプター（GSAP / Lottie / Three.js / Anime.js / CSS / WAAPI / TypeGPU）/hyperframes-animation
クリエイティブディレクション — design.md、パレット、タイポグラフィ、ナレーション、ビート計画、オーディオリアクティブ/hyperframes-creative
メディア前処理 — TTSナレーション、BGM、文字起こし、背景除去、キャプション/hyperframes-media
CLI開発ループ — init、lint、validate、inspect、preview、render、publish、doctor/hyperframes-cli
レジストリブロック / コンポーネントをインストールする（hyperframes add）/hyperframes-registry

コンポジション作成契約（すべての時間指定要素には data-start / data-duration / data-track-index が必要；時間指定要素には class="clip" が必要；GSAPタイムラインは一時停止され window.__timelines に登録される；決定論的ロジックのみ — Date.now() / Math.random() / ネットワークは不可）はここには重複していません — /hyperframes-core にあります。コンポジションHTMLを作成する前にそれを読んでください。

HyperFramesでできないこと — 最初にこれを確認してください

HyperFramesはHTMLコンポジションを作成し、コードからMP4にレンダリングします。このモデルには明確な限界があります。以下のリクエストはルーティングの選択肢ではなく、範囲外ですので、ワークフローに進む代わりに断るか（適切なツールを指示してください）、対応してください。これらはアーキテクチャに起因するものであり、個別のリクエストによるものではありません。

  • レンダリングは決定論的で自己完結型です。 すべての値、アセット、テキストは作成時に埋め込まれます。レンダリング時にはネットワーク呼び出しやライブデータの取得は行いません（コアルール：Date.now() / Math.random() / ネットワーク不可）。「レンダリング時に数値をライブで更新する」ことは範囲外です — 作成時に一度データを取得して埋め込むか、断ってください。
  • 既存の動画はオーバーレイのみで、編集はしません。 HyperFramesはソースクリップの_上に_フレームを合成します — /embedded-captions はキャプションレイヤーを追加し、/graphic-overlays はデザインされたグラフィックカード（ローワーサード、データコールアウト、タイトル）を追加します — そしてクリップはそのまま下で再生されます。エンコード済みのビデオストリーム自体（タイミング、色、フレーミング、順序、オーディオ）を変更することはNLEスタイルの編集であり範囲外です。
  • Remotionのインポートは一方向です。 /remotion-to-hyperframes は_Remotionフレームワークの_ソースをHyperFramesに変換します。逆方向（HyperFrames → Remotion、または → その他のフレームワーク）は範囲外であり、非RemotionのReact / ウェブアニメーションソースにはRemotionソースがないため、/general-video で再作成してください。
  • 持っていない入力を生成することはできません。 スクリーン / セッション録画、カメラキャプチャ、AIによる話す顔 / リップシンクアバター生成はできません。映像やアセットがまだ存在しない場合、HyperFramesはそれを創り出すことはできません — ユーザーに提供してもらうか（適切なキャプチャツールを使用して）先に用意してもらってください。

これ以外の、URL、概要、トピック、PR、注釈付き映像、またはアニメーションさせる単一要素からの動画はすべて範囲内です。以下でルーティングしてください。

ビデオルーティング

このセクションはトップレベルのワークフローのみを認識します。ワークフロー内部のフェーズ、ドメインスキル（hyperframes-* — 上の能力マップを参照）、または技術リファレンスはロードしません。

決定表

INPUTタイプ（意図）が主要な軸です。OUTPUTの長さは上限に過ぎず、ゲートではありません。 一致する入力の場合、専門ワークフローは約3分までを処理します — _どの_ワークフローに入るかは、長さではなく意図（入力タイプ、テキストの場合は主題）で決まります。長さが重要なのは上限側だけです：真に長い作品（3〜5分のチュートリアル、5分以上の深掘り）は別のレジスターであり、/general-video にルーティングします。約3分以下のバンド内では、3番目の軸が2つのテキスト入力ワークフローを分割します — 主題：_マーケティング_される製品 vs _説明_されるトピック（下のステップ3の曖昧性解消ルールを参照）。

長さ / 入力製品ローンチ（URL / 概要 / スクリプト）一般ウェブサイト / URLGitHub PR / コード変更トピック / 記事 / メモ（製品なし、URLなし）既存動画（話す頭）†
約3分以下/product-launch-video/website-to-video/pr-to-video/faceless-explainer/embedded-captions · /graphic-overlays †
3-5分 チュートリアル/general-video/general-video/general-video/general-video/embedded-captions · /graphic-overlays †
5分以上 深掘り/general-video/general-video/general-video/general-video/embedded-captions · /graphic-overlays †
静止画 / ループ/general-video/general-video/general-video/general-video/general-video

現在のカバレッジ：約3分以下のバンドには、製品ローンチ / 一般ウェブサイト / GitHub-PR / トピック入力用の専用ワークフロー（URLは_種類_で分割し、次に_意図_で分割 — ステップ3参照）があり、既存動画列は任意の長さでカバーされています — /embedded-captions（キャプション / 字幕）または /graphic-overlays（デザインされたグラフィックオーバーレイ）で、意図で分割します（ステップ2参照）。他のすべてのセルは /general-video です — 汎用HTMLコンポジション作成フロー（入力・長さ非依存）：約3分より長いもの（3〜5分 / 5分以上の行）およびすべての静止画 / ループ形式。ルーターは作成可能な動画で行き詰まることはありません。唯一の真の「一般 / なし」の答えは、HyperFrames自体の範囲外のリクエストです（例：完成した動画ファイルのNLEスタイル編集 — 再タイミング、再色付け、再フレーミング、並び替え、オーディオ）。

† 既存映像は長さではなく意図で分割します。 キャプション / 字幕 → /embedded-captions；デザインされたグラフィックオーバーレイ / パッケージング — ローワーサード、データコールアウト、タイトルカード、プルクォート → /graphic-overlays。どちらもクリップをオーバーレイし、クリップはそのまま再生されます。どちらも映像自体を編集しません。

ジャンル短絡（表より優先）。 短い（約10秒未満）ナレーションなしのデザイン主導モーショングラフィック — キネティックタイポ、統計 / チャート表示、ロゴスティング、ローワーサード / オーバーレイ、またはアニメーションツイート / 見出し / キャプチャページハイライト — は、入力に関係なく /motion-graphics にルーティングされます。これは入力タイプではなくOUTPUTジャンルであるため、リクエストが明らかにモーション優先でナレーションがない場合（ステップ2参照）は、上記の入力タイプ表よりも優先されます。より長い、またはナレーション付きの作品は、入力タイプでルーティングするか、/general-video にルーティングします。

既存コンポジションの移行（特別なケース）

上の表は、入力から作成するためのものです。これとは別に1つのワークフローがあります：ユーザーが明示的に既存のRemotion（React）コンポジションをHyperFramesに移植 / 変換 / 移行するように依頼した場合 → /remotion-to-hyperframes。これはソース翻訳であり、入力からの作成ではないため、INPUT × LENGTHのセルはありません。移行言語が明示的な場合のみここにルーティングしてください（「Remotionプロジェクトを移植して」「このRemotionコンポを変換して」「これをHyperFramesに書き換えて」） — Remotionへの軽い言及はトリガーになりません。デフォルトは作成表または /hyperframes-core です。

ルーティング手順

  1. INPUTタイプ + ターゲット長を特定する。 ルーティングには、動画が何についてか — その主題と入力を知る必要があります。主題自体が指定されていない場合（例：「私たちのものについて動画を作って」とURL、製品名、トピック、アセットがない）、または入力タイプが不明な場合は、ワークフローに入る前に質問してください — まず明確にしてください。ワークフロースキルを呼び出してから質問しないでください。ワークフローを決定することがルーティングの決定そのものだからです。質問は最大2つまでにしてください：
    • 「入力は何ですか？ — 製品（URLまたは概要）、一般ウェブサイト / URL、GitHub PR / コード変更、説明するトピックや記事、それともキャプションを追加する既存の話す頭の動画ですか？」
    • 「ターゲットの長さは？ — 約3分以下、またはそれ以上（3〜5分のチュートリアル / 5分以上の深掘り）？」
    • 仕様のデフォルト — 表明し、質問しないでください（これらはルートに影響しないため、ルーティングをブロックしないでください）：アスペクト 16:9（エンジンは9:16縦長もサポート — ユーザーがTikTok / Reels / Shortsなどの縦長の宛先を指定した場合のみ切り替え）；ナレーション / キャプション言語 = ユーザーの言語。ユーザーが反論した場合のみ確認してください。選択されたワークフローは自身のStep 0で自身の詳細を再確認します。
  2. まずINPUTタイプ（意図）で選びます。長さは上限に過ぎず、ゲートではありません。
    • 短いデザイン主導モーショングラフィック（ジャンル短絡、入力表より優先） — モーション自体がメッセージ：キネティックタイポ、統計 / 数字カウントアップ、チャート表示、ロゴスティング、ローワーサード / オーバーレイ、またはアニメーションツイート / 見出し / キャプチャページハイライト。通常約10秒未満、ナレーション / 音声なし → /motion-graphics。これは入力タイプではなくOUTPUTジャンルです — リクエストが明らかに素早く、ナレーションなしのデザイン主導モーションピースである場合、入力に関係なくここにルーティングしてください。同じ素材のより長い、またはナレーション付きの作品はこれではありません（入力タイプでルーティングするか、/general-video）。
    • 既存の話す頭の動画（ユーザーがクリップを持っていて、それに何かを追加したい） → 任意の長さで意図で分割（入力タイプが長さに勝ちます）：キャプション / 字幕（話し言葉を読みやすいテキストに） → /embedded-captions；デザインされたグラフィックオーバーレイ — ローワーサード、データコールアウト、タイトル情報カード、プルクォート、グラフィックパッケージ編集 → /graphic-overlays。（映像_自体_の編集 — 再タイミング、再色付け、再フレーミング、並び替え、オーディオ — はNLEスタイルであり範囲外。§ HyperFramesでできないこと を参照。）
    • GitHub PR / コード変更（github.com/<owner>/<repo>/pull/<N> リンク、owner/repo#N 参照、または「このPR」） → /pr-to-video（約3分まで）。
    • それ以外（製品URL / 概要 / トピックテキスト）：意図がステップ3を介してワークフローを選択し、約3分までを処理します — 短い15〜30秒のプロモと約100秒の説明動画の両方が、長さではなく意図でルーティングされます。ターゲットが明らかに約3分より長い場合（3〜5分のチュートリアル、5分以上の深掘り）のみ、/general-video（長さ非依存のフォールバック — ステップ4参照）にルーティングしてください。真に長い作品を約3分以下のワークフローに強制しないでください。バンド内では意図が決定し、/general-video が残りをカバーします。
  3. 約3分以下のURL / テキスト入力を曖昧性解消する（意図の分割）。 2つの分割：
    • URLの種類 + 意図 — URLはもはや自動でPLVになるわけではありません。種類、次に_意図_で決定します：GitHub PRリンク（.../pull/<N>、owner/repo#N、「このPR」） → /pr-to-video；それ以外のウェブサイトURLは意図で分割します — 特定の製品やSaaSのマーケティング / ローンチ / プロモーション → /product-launch-video；一般サイト → 動画（サイトツアー、ポートフォリオ / ブログ / ランディングページのショーケース、サイトのビジュアルからのソーシャルクリップ、または単に「このサイトを動画にして」） → /website-to-video。両方ともヘッドレスChromeでクロールします。PR URLは gh で読み取ります。サイトURLが製品ローンチなのか一般サイト動画なのかが本当に不明な場合は、1つ質問してください。
    • 製品 vs トピック（テキスト、URLなし） — 決定的な質問は動画が何についてかであり、入力形式ではありません：
      • マーケティング / ローンチ / プロモーションされる特定の製品 / 会社 / SaaS / アプリ / ウェブサイト → /product-launch-video。
      • コンセプト / トピック / 記事 / しくみが説明され、製品もURLもない → /faceless-explainer。
      • タイブレーカー：「プロモート / ローンチ / 販売 / 私たちの製品」という表現 → PLV。「説明 / 教える / Xのしくみ / Xとは何か」で製品なし → 顔出しなし。顔出しなしの標準スタイルは常に pin-and-paper です。
      • URLが貼られていない名前付きサイトでもPLVです。 製品やそのウェブサイトに言及するスクリプト（「私たちのサイトはacme.ioです」「<ブランド>をプロモート」）は、クリック可能なリンクがなくてもPLVにルーティングされます — PLVはサイトをウェブ検索し、ブランドアセット用にクロールできます（ユーザーがオプトアウトしない限り、→ キャプチャなしプリセットモード）。URLを貼らないことが、顔出しなし / キャプチャなしのジョブになるわけではありません。提供されたスクリプトの逐語 vs 再構成の選択はPLV内部のものであり、ルートを変更することはありません。
      • 矛盾する手がかり → 推測せずに質問してください。 提供されたソースが製品自身のマーケティング（ランディングページ、プロモーションコピー）である場合、それはPLVです。製品の言及もマーケティングステートメントもなく、「Xを説明して」と「Yの製品ローンチ」が混在している場合、「説明」は顔出しなし、「ローンチ」はPLVのため、質問してください — 強い方の手がかりがない限り、推測しないでください。
  4. 残りはすべて /general-video です。 上の条件のいずれにも当てはまらない場合（約3分より長いすべて、ロングフォームナレーション、NLEスタイル編集を除く既存映像の加工、反復 / ループグラフィック、非製品URLテキストなど）、または入力タイプが不明な場合は、/general-video にルーティングしてください。/general-video は入力タイプと長さの両方に依存しないため、他のすべてをカバーします。
  5. 専用ワークフローがない既存映像 → /general-video。 注釈付き映像（フッテージにグラフィックオーバーレイとキャプション）には /graphic-overlays と /embedded-captions があります（上の決定表を参照）。それ以外のすべては、範囲外のNLE編集を除き、/general-video に行きます。既存映像編集のベストプラクティスは、ソースクリップを <video> 要素として track-index=0 で提示し、その上に分量を保ちながらテキストやグラフィックレイヤーを重ねることです（/general-video ワークフローはこれを処理します）。

ワークフローの決定後

正しいワークフローにルーティングしたら、そのワークフローのStep 0を実行してください（各ワークフロースキル内に文書化されています）。すべてのワークフローは：

  • まず、ワークフロー固有のパラメータと期待を再確認します（出力フォーマット、アスペクト比、ナレーション設定、スタイルの好み）。
  • スクリプトのアウトラインを作成し（必要な場合）、ユーザーに承認を求めます。
  • アセットの収集と前処理を進めます。
  • コンポジションを作成し、HTMLに書き出します。
  • レンダリングを実行してMP4を生成します。
  • ユーザーにレビューと修正の機会を提供します。

選択されたワークフローのSKILL.mdにある正確な手順に従ってください。

Individual skills in this repo

This repo contains 14 individual skills — each has its own dedicated page.

DigitalRavagers/Experiment

When the user wants to edit, review, or improve existing marketing copy, or refresh outdated content. Also use when the user mentions 'edit this copy,' 'review my copy,' 'copy feedback,' 'proofread,' 'polish this,' 'make this better,' 'copy sweep,' 'tighten this up,' 'this reads awkwardly,' 'clean up this text,' 'too wordy,' 'sharpen the messaging,' 'refresh this content,' 'update this page,' 'this content is outdated,' or 'content audit.' Use this when the user already has copy and wants it improved or refreshed rather than rewritten from scratch. For writing new copy, see copywriting.

DigitalRavagers/Experiment

Add captions to a talking-head video. ONE catalog (CATALOG.md) of 32 visual identities behind two engines: column-flow (captions composited INTO the scene — matte occlusion + mix-blend; cream/ink/editorial/keynote/documentary/loud/neon/glitch/chrome/velocity) and themed constitutions (anchor/ordnance/terminal/neonsign/stardust/stomp/scoreboard/transit/vhs/arcade/dossier/laser/thunder/hologram/biolume/aurora/spectrum/papercut/popup/chalkboard/graffiti/brush/inkwater/ransom/lastpage/nightcity — e.g. a glyph-decode climax, a neon sign WRITTEN stroke by stroke, or the quiet `anchor` rail default). Route by identity, never by mode. Trigger on "captions/subtitles", "embed/cinematic captions", "VFX captions", "炸/特效/酷炫字幕", a named identity, or top-tier motion-graphics asks. Embedding every word is wrong for most talking-head content — `anchor` is the verbatim default. Pipeline: transcription → hyperframes remove-background matting → HTML render → ffmpeg overlay. Requires hyperframes and a single-subject clip.

DigitalRavagers/Experiment

Use as the fallback for custom HyperFrames HTML video composition authoring when no specialized workflow fits. Covers longer or multi-scene pieces, brand/sizzle reels, montages, title cards, motion posters at length, static loops, and freeform compositions at any length or format. Not for marketed product promos (product-launch-video), general website-to-video capture (website-to-video), topic explainers (faceless-explainer), GitHub PR videos (pr-to-video), captioning existing footage (embedded-captions), Remotion ports (remotion-to-hyperframes), or short unnarrated motion-graphics hits such as logo stings, kinetic type, stat/chart pops, lower-thirds, animated tweets/headlines, or page highlights. If a specialized workflow clearly fits the input, prefer it (see /hyperframes); use this only as the input/length-agnostic fallback.

DigitalRavagers/Experiment

All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). HyperFrames-native: single paused timeline, seek-safe, deterministic.

DigitalRavagers/Experiment

HyperFrames CLI dev loop. Use when running npx hyperframes init, add, catalog, capture, lint, validate, inspect, layout, snapshot, preview, play, render, publish, lambda, doctor, browser, info, upgrade, skills, compositions, docs, benchmark, telemetry, transcribe, tts, or remove-background, or when troubleshooting the HyperFrames build/render environment. Entry point for AWS Lambda cloud rendering (`hyperframes lambda deploy / render / progress / destroy / policies`).

DigitalRavagers/Experiment

HyperFrames HTML composition contract. Use for composition structure, data attributes, clips, tracks, sub-compositions, variables, media playback, deterministic render rules, and validation of minimal renderable projects.

DigitalRavagers/Experiment

Non-animation creative direction for HyperFrames videos. Use for design spec (frame.md / design.md) handling, palettes, typography, narration, beat planning, audio-reactive visuals, composition patterns, and brand / style decisions. For atomic motion patterns and scene blueprints, use `hyperframes-animation`.

DigitalRavagers/Experiment

Asset preprocessing for HyperFrames compositions — multi-provider TTS (HeyGen / ElevenLabs / Kokoro local), multi-provider BGM (Google Lyria / local MusicGen), Whisper transcription, background removal, and caption authoring. Use for npx hyperframes tts, bgm, transcribe, remove-background, voice/provider selection, music-mood prompting, captions / subtitles / lyrics / karaoke / per-word styling.

DigitalRavagers/Experiment

Install and wire registry blocks and components into HyperFrames compositions. Use when running hyperframes add, installing a block or component, wiring an installed item into index.html, or working with hyperframes.json. Covers the add command, install locations, block sub-composition wiring, component snippet merging, registry discovery, and authoring a new block or component to contribute upstream (idea → scaffold → validate → PR).

DigitalRavagers/Experiment

Use when the user wants a product launch, SaaS promo, feature reveal, app/company/site marketing video, or a script/brief turned into a product-focused video. Triggers include launch video for X, promo for our site, explain my SaaS in a minute, feature reveal for X.com, and turn this script into a 60s promo. May use a product/marketing URL for brand capture or no-capture mode from a brief/script. Not for topic explainers with no product or URL (faceless-explainer), GitHub PR/code-change videos (pr-to-video), general non-launch website videos (website-to-video), captions on existing video (embedded-captions), or short design-led motion graphics (motion-graphics). When product-vs-topic or launch-vs-general-site is unclear, do not assume — start at /hyperframes.

DigitalRavagers/Experiment

pr-to-video workflow - a GitHub pull request (URL like github.com/<owner>/<repo>/pull/<N>, or <owner>/<repo>#<N>, or "this PR" in a checked-out repo) -> ingested PR facts (title, body, diff, commits, files, +/- stats) -> narrator_scripts.json + audio (voice + BGM) + section_plan.md -> code-diff / before-after / impact explainer video. Input is a CODE CHANGE. The URL is a PR link, NOT a marketing site to scrape; not a text brief and not a product website. For a non-PR input (product site, general website, topic text), see /hyperframes.

DigitalRavagers/Experiment

Port an existing Remotion (React) composition to HyperFrames HTML. Use ONLY when the user explicitly asks to port/convert/migrate/translate a Remotion source. Do NOT use: (a) authoring a new HyperFrames composition; (b) Remotion mentioned in passing; (c) Remotion code shared as reference only; (d) "same video as my Remotion one" without explicit migrate request — treat as fresh build. Doubt → `/general-video`. One-way, Remotion-only: no reverse export (HyperFrames→Remotion or any framework), no non-Remotion source (After Effects, Framer Motion, plain React/CSS) → out of scope, re-create via `/general-video`. Flags unsupported patterns (useState, useEffect, async calculateMetadata, third-party React libs, `@remotion/lambda`) and recommends runtime interop over lossy translation. Unsure whether to port vs. build fresh, or only a passing Remotion mention? → /hyperframes.

DigitalRavagers/Experiment

When the user wants to create, generate, or produce video content using AI tools or programmatic frameworks. Also use when the user mentions 'video production,' 'AI video,' 'Remotion,' 'Hyperframes,' 'HeyGen,' 'Synthesia,' 'Veo,' 'Sora,' 'Runway,' 'Kling,' 'Seedance,' 'Hailuo,' 'MiniMax,' 'Pika,' 'Hunyuan,' 'Wan,' 'video generation,' 'AI avatar,' 'talking head video,' 'programmatic video,' 'video template,' 'explainer video,' 'product demo video,' 'video pipeline,' or 'make me a video.' Use this for video creation, generation, and production workflows. For video content strategy and what to post, see social. For paid video ad creative, see ad-creative.

DigitalRavagers/Experiment

Capture a general website/URL and turn it into a HyperFrames video (site tour, showcase, or social clip from the site's own visuals). Uses headless Chrome screenshots + brand assets. Use when intent is general — portfolio/blog/landing-page showcase or social clip from the site. NOT for: product/SaaS launch or promo (→ /product-launch-video, even from a URL); topic explainer with no site (→ /faceless-explainer); GitHub PR (→ /pr-to-video); adding captions to existing video (→ /embedded-captions); short unnarrated page-highlight motion graphic (→ /motion-graphics). Unclear launch-vs-general-site? Ask one question or start at /hyperframes.

関連スキル

steipete/video-frames

Extract frames or short clips from videos using ffmpeg.

community

steipete/summarize

Summarize or transcribe URLs, YouTube/videos, podcasts, articles, transcripts, PDFs, and local files.

community

openclaw/openclaw

Use when testing, fixing, or extending the OpenClaw Control UI GUI with Vitest + Playwright end-to-end checks, mocked Gateway WebSocket flows, mocked dashboard runs, screenshots/videos, or agent-verifiable browser proof.

community

obra/superpowers

Obra superpowers agent skills.

community

affaan-m/ECC

See, Understand, Act on video and audio. See- ingest from local files, URLs, RTSP/live feeds, or live record desktop; return realtime context and playable stream links. Understand- extract frames, build visual/semantic/temporal indexes, and search moments with timestamps and auto-clips. Act- transcode and normalize (codec, fps, resolution, aspect ratio), perform timeline edits (subtitles, text/image overlays, branding, audio overlays, dubbing, translation), generate media assets (image, audio...

community

affaan-m/everything-claude-code

End-to-end marketing campaign planning and execution. Covers audience research, positioning, campaign angle definition, landing page copy, email sequences, social posts, ad copy, short-form video scripts, and content calendars. Use as the orchestration layer for multi-channel product launches. Use when planning or executing a multi-channel product launch, or producing landing page, email, social, or ad copy.

community