Communitygithub.com

pranav7/video-explainers

ユーザーが解説ビデオ、アニメーション説明、ナレーション付き動画、「3Blue1Brownスタイル」や「3b1bスタイル」の動画、またはあらゆるトピックに関するManimアニメーションをリクエストしたときに使用します。

video-explainers とは?

このスキルは、あらゆるトピックについてナレーション付きの3Blue1Brownスタイル解説ビデオを作成するためのものです。視覚要素にはManim(Community Edition)を使用し、ナレーションにはローカルのテキスト読み上げモデルであるKokoro-82Mを利用するため、APIキーは不要でマシン上で完結します。各ナレーション行が、それに対応するアニメーションのタイミングを設定します。作業は2つの部分に分かれています。まず、あなたが script.md を書き、各ナレーション行とその再生中の画面上の内容を記述します。次に、サブエージェントが script.md からビデオを構築します。サブエージェントはシーンを書き、レンダリングし、レイアウトをチェックし、最終レンダリングを行います。ビルドは約20回のツールコールを行い、各コールで全コンテキストが再度送信されます。新しいサブエージェントはコンテキストが小さいため、ビルドはより安価で高速になります。サブエージェントはバックグラウンドでも実行されるため、ユーザーはあなたと作業を続けることができます。このスキルは、Claude Code、Cursor、CodexなどのAIエージェントと組み合わせて使用することを想定しています。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/pranav7/video-explainers/tree/HEAD/skills/explain-video

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

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

ドキュメント

ビデオ解説ツール

あらゆるトピックについて、ナレーション付きの3Blue1Brownスタイル解説ビデオを作成します。視覚要素はManim(Community Edition)を使用します。ナレーションはローカルのテキスト読み上げモデルであるKokoro-82Mを使用するため、APIキーは不要でマシン上で動作します。各ナレーション行が、それに対応するアニメーションのタイミングを設定します。

作業は2つの部分に分かれています。

  1. あなたが script.md を作成します。各行のナレーションと、その再生中に画面に表示される内容を記述します。コンテキストを持っているのはあなたなので、スクリプトを書くのもあなたです。
  2. サブエージェントが script.md からビデオを構築します。シーンを書き、レンダリングし、レイアウトをチェックし、最終レンダリングを行います。

ビルドは約20回のツールコールを行い、各コールで全コンテキストが再度送信されます。新しいサブエージェントはコンテキストが小さいため、ビルドはより安価で高速になります。また、サブエージェントはバックグラウンドでも実行されるため、ユーザーはあなたと作業を続けることができます。

explainer コマンドが残りの作業を行います。このコマンドは PATH 上にある必要があります。セットアップ方法については、https://github.com/pranav7/video-explainers を参照してください。コマンドの一覧を表示するには explainer -h を実行します。

0. セットアップ(マシンごとに1回)

explainer doctor を実行します。これにより、Homebrewパッケージ、フォント、TinyTeX、Python環境とアイコンがインストールされ、KokoroとLaTeXのテストが行われます。再実行しても安全です。依存関係の不足でコマンドが失敗した場合に実行してください。

1. 計画

  • 保存場所。 会話が、ドキュメント用の独自フォルダを持つプロジェクトに関するものであれば、ビデオはその中の videos/<slug>/ フォルダに配置します。それ以外の場合は ~/Movies/explainers/<slug>/ を使用します。
  • 対象者と長さ。 リクエストで明確になっていない場合のみ質問します。デフォルト:そのトピックについて予備知識のない好奇心旺盛な成人向け、2~4分。
  • スクリプトの長さ。 Kokoroは1分間に約170語を話すため、3分のビデオには約500語のナレーションが必要です。30~45秒ごとに1つの章を書きます。

トピックに合った形式を選択します。

概念(アルゴリズム、数学や科学のアイデア)の場合:

  1. 定義ではなく、具体的な質問やパズルから始めます。
  2. 視聴者が見ることのできる具体的な例を1つ使って直感を構築します。
  3. 一般化し、その後にのみ数式を示します。数式は、すでに見たものに名前を付けます。
  4. 1つの絵で主要なアイデアをまとめて終了します。

状況(失敗した実行、インシデント、設計、仕事のキャッチアップ)の場合:

  1. 実際の数値を使って、何が起こったかから始めます。
  2. それを引き起こしたメカニズムを、一度に1ステップずつ示します。
  3. 何が変わったかを示します:修正、決定、または次のステップ。
  4. 変更が反映されたシステム全体の1つの絵で終了します。

2. script.md を書く

ビデオディレクトリに script.md を以下の形式で作成します。

# 注文ページが遅い理由

チームのエンジニア向け。約3分。

## パレット

| 概念 | 色 |
| --- | --- |
| APIサーバー | SKY |
| データベース | VIOLET |
| 遅い、無駄な作業 | CORAL |
| 修正 | MINT |

## 1. フック:50件の注文、50回のクエリ

- 「注文ページが50件の注文を読み込むのに4秒かかります。」
  - 「4.1秒」と表示されたブラウザカード(CORAL色)、および50個の注文タグのリスト。
- 「サーバーは注文ごとにデータベースに1回問い合わせます。」
  - APIサーバーカードとデータベースカード。パケットがそれらの間を、注文ごとに1つずつ移動します。

各章の見出しは ## <番号>. <シーン名>: <章タイトル> の形式です。ビルダーは各章に対して1つのシーンクラスを作成します。章のタイトルはビデオ内のチャプターマーカーになります。

ビルダーはこの会話を見ることができません。画面上に表示されるすべての名前、数字、ラベル、値はスクリプトに記述してください。

ナレーションは書かれているとおりに読み上げられます。

  • 話し言葉で書きます:「x二乗」、「2πr」、「P O番号」、「v2」。 ナレーションにLaTeX、記号、コードを入れないでください。
  • 各行には1文を書き、最大2文までにします。各行は1つの視覚的な変化に対応します。
  • Kokoroが単語を誤って発音する場合は、インラインでその音素を指定します:[Kokoro](/kˈOkəɹO/)。
  • デフォルトの音声は af_heart です。ユーザーが音声を気にする場合は、explainer voices を実行してユーザーに聴かせてください(afplay voice-samples/<名前>.wav)。

各行の下には、スライドではなく絵を記述します。オブジェクトの名前、それらが示す内容、動くものを指定します。各概念にはパレットから1つの色を割り当てます。

パレットの色はキットのアクセントから取得します:SKY、MINT、AMBER、CORAL、VIOLET、AQUA、ROSE、PEACH、LIME。キットには、概念ではないもののための中立色もあります:SUBTLE、FAINT、INK。キットには、カード、タグ、テーブル、コードウィンドウ、パイプライン、シーケンス図、タイムライン、ツリー、吹き出し、チャート、大きな数字、Lucideアイコンがあります。これらを使用した絵を記述してください。

各数字はそのまま表示します。ゼロからカウントアップする数字は要求しないでください。

3. ビルドを引き継ぐ

サブエージェントとしてビルダーを起動します。ビルド作業用のエージェントタイプやモデルが指示で指定されている場合は、それを使用します。以下のプロンプトを与えます。

<ディレクトリ>/script.md の解説ビデオを構築してください。`explainer guide` を実行し、その手順に従ってください。ビデオのパス、その長さ、およびそのままにした各レイアウト警告とその理由を報告してください。

ユーザーがキャプションを要求した場合は、「--captions 付きでレンダリングする。」をプロンプトに追加します。

ビデオ処理中であることをユーザーに伝え、その後他の作業を続けます。サブエージェントを起動できない場合は、explainer guide を実行し、その手順を自分で行います。

4. 納品

ビルダーから報告があったら、<ディレクトリ>/video.mp4 を開きます(macOSの場合は open)。ユーザーに以下の内容を伝えます。

  • ファイルパスと長さ。
  • ビデオにチャプターマーカーがあること。
  • ビルダーが未解決のままにした問題があれば、その内容。

変更点を尋ねます。変更を行うには、ツールでメッセージを送信できる場合は同じビルダーに送信します(ビルダーはコンテキストを保持しているため)。それ以外の場合は、変更内容を指定して新しいビルダーを起動します。変更がナレーションに影響する場合は、最初に script.md を編集します。

関連スキル