>_ DevTrendsja

言語

ホーム

言語

セクション

フロントエンド バックエンド モバイル DevOps AI / ML ゲーム開発 ブロックチェーン 組み込み セキュリティ
TypeScript

Claude Codeに動画の視聴と画面内容の理解をさせる方法

claude-video-vision

昨日、スクリーンキャストのどこでユーティリティがエラーを投げるかをClaude Codeに正確に説明しようとしていた。手動でスクリーンショットを撮って、関連する部分を切り抜き、ファイルをチャットにドロップする必要があった。バグが複数あったり、ミーティング録画の10分後に問題が発生したりすると、この手動のやり方はすぐに面倒になる。

ほとんどの言語モデルは重いMP4ファイルを直接ストリーミングしたり読み取ったりできない。开发者Jordan Vasconcelosさんのリポジトリclaude-video-visionがこの問題をエレガントに解決している。Claude Code用のプラグインであると同時にMCPサーバーでもあり、知覚レイヤーとして機能する。動画をフレームとタイムスタンプ付き文字起こしに変換し、ニューラルネットワークにすべてをフィードする。

内部動作の仕組み

ワークフローはかなりシンプルだ。メディアデータのスライスと抽出という技術的な処理はすべてNode.js MCPサーバーが担当する。

Claudeに動画の分析を依頼すると、2つのプロセスが並行して起動する:

  1. ffmpegがJPEG、PNG、WebP形式でフレームをスライスしてbase64にエンコードする。
  2. オーディオバックエンドがサウンドトラックを取得して、タイムスタンプ付き文字起こしに変換する。

その後、Claudeは готовый画像セットと時系列テキストを受け取る。興味深い詳細として、モデルは自らフレームレートと解像度を決めて動画をスライスする。

「90秒目のボードに何と書いてある?」と質問した場合、プラグインは1時間分の動画全体を処理しない。モデルは01:25から01:35のセグメントに特化した高解像度で高頻度のフレームをリクエストする。講義全体の簡単なサマリーを依頼すれば、プラグインはフレームレートを下げて動画全体にわたって稀疏なプレビューを収集する。

内部動作:バックエンドオプション

音声処理には、3つのオプションが用意されている:

  • Gemini API。1日15,000リクエストの無料枠はほとんどのタスクをカバーし、Speechだけでなくバックグラウンドサウンドイベントも処理してくれる。APIキーだけでいい。
  • Local Whisper。Dockerのwhisper.cppまたはPythonパッケージのopenai-whisper経由で動作する。完全にオフラインで動作し、必要なモデルは初回起動時に自動的にダウンロードされる。
  • OpenAI API。ローカルプロセッサをロードしたくない場合やGoogle AI Studioのアカウントを設定したくない場合に、OpenAIの有料Whisper APIを使用する。

YouTubeサポートは別途言及する価値がある。動画リンクを渡すと、プラグインはyt-dlpのyt-dlpで動画をダウンロードする。サーバーはまず手動字幕の取得を試みる。なければYouTubeの自動生成キャプションを取得する。キャプションが欠落していたり断片적이すぎたりする場合は、選択したオーディオバックエンドが起動する。Claudeは文字起こしのソースとテキストの精度レベルを理解する。

セットアップと最初のコマンド

プラグインはClaude Codeセッション内で直接インストールできる。コマンドを順番に実行するだけだ:

/plugin marketplace add https://github.com/jordanrendric/claude-video-vision
/plugin install claude-video-vision

インストール後、インタラクティブなセットアップウィザードが起動する:

/claude-video-vision:setup-video-vision

ウィザードはffmpegのffmpegをチェックし、オーディオバックエンドを選択させ、オフラインモードを選んだ場合はWhisperモデルをダウンロードする。設定はconfig.jsonの~/.claude-video-vision/config.jsonに保存される。そこではデフォルトのフレーム解像度、画像フォーマット(例えばPNGはスクリーンショットのテキストをくっきりとさせるのに役立つ)、リクエストあたりの最大フレーム数を設定できる。

プラグインは特別なコマンド経由でも通常のチャット形式でも使える:

/watch-video ~/Downloads/demo.mp4 "какой язык программирования используется в туториале?"
/watch-video https://www.youtube.com/watch?v=... "сделай краткое содержание"

またはチャットに直接入力する:

~/videos/bug-report.movの最初の1秒間のバグを見て、何が問題だったかを教えて。

便利な活用シーン

このツールはいくつかの一般的な開発タスクをカバーする:

  1. バグ報告の分析。ユーザーやQAエンジニアがスクリーンキャストを送ってきた。動画を再視聴する代わりに、ファイルをClaudeにドロップして、3秒目にコンソールに何のエラーが表示されたかを質問できる。
  2. トークやチュートリアルのメモ取り。1時間のYouTubeプレゼンテーションのリンクをドロップして、タイムスタンプと主要スライドのスクリーンショット付き構造化アウトラインを取得できる。
  3. UIアニメーションレビュー。フレームがロスレスPNG形式で送信される場合、モデルは動画内のレイアウトとトランジションの滑らかさを評価できる。
  4. ミーティング録画の素早い検索。1時間分のミーティング録画を、手動でスクラブする時間を無駄にせず、主要トピックで素早くフィルタリングできる。

試してみる価値はあるか

プロジェクトは新しいが、GitHubで既に1,000スターを超えている。主な強みは、考え抜かれたアーキテクチャ、適応型fpsによるコンテキストウィンドウの賢い処理、Dockerのwhisper.cppによる完全ローカル動作の能力だ。

注意点として、ffmpegのffmpegのインストールが必要で、YouTube動画にはyt-dlpのyt-dlpも必要だ。macOSではすべての依存関係がHomebrewで数クリックでインストールできる。他のOSでは手動でインストールする必要がある。

ターミナルでClaude Codeを активно使い、録画やデモクリップ регулярно動画を扱うなら、このプラグインは大幅な時間節約になる。

関連プロジェクト