Claudeで画像を動画にするには？GPT ImageとElevenLabsの組み合わせ

静止画を作っただけで終わらず、その絵を少しずつ動かして、声を付ける。Claudeを使う画像アニメーションは、この工程を分けると理解しやすくなります。

画像はGPT Image、動きはClaudeが書くコード、読み上げはElevenLabs。 ここでは、その分担で短い解説動画を試す設定例を紹介します。

出発点はSebastián Cisternaさんの投稿です。本人はGPT ImageとElevenLabsを使った制作を報告していますが、アニメーションの詳しい仕組みや音の各担当は公表内容だけでは確定できません。以下は同じ発想を試すための当サイトの構成案で、本人の実装そのものではありません。元の投稿

参考作品：この構成で作られた動画

{{tweet:https://x.com/scisterna/status/2103600499861623106}}

以下は公開情報をもとにした設定例です。投稿者が使った非公開のプロンプトや制作設定そのものではありません。

GPT ImageとClaudeで作る画像アニメーションとは

この画像アニメーションは、できあがった絵の位置・大きさ・重なりを時間に合わせて変える方法です。たとえば、背景はゆっくり動かし、手前の鳥だけを横へ移動させます。

人物が自由に振り向く映像を新しく生成する方法とは異なります。1枚の画像にズームするだけでも動画になりますが、別々の動きを付けるには素材を分ける必要があります。

GPT Image 2.5にはFlareとSunburstが公式に用意されています。ただし、元投稿がどちらを使ったかは確認できません。ここではモデル名を決め打ちしたAPI設定ではなく、ChatGPTで画像を作って保存する入り口を使います。OpenAIの公式発表

用意するのは、画像生成を利用できるChatGPT、Claude Code、Node.js 22以降とFFmpeg、ElevenLabsのアカウントです。Claude Code側で使うHyperFramesの導入はこちらの設定手順と共通です。

生成画像を切り分け、Claudeで動きを付ける

最初から「背景」と「動かす物」を別々に生成すると、切り抜き作業を減らせます。以下では森の背景と鳥の2素材で試します。

ChatGPTの新しい会話へ、まず背景用の指示を入れます。

横長16:9の、紙を重ねたような森のイラス
トを生成して。
遠くに山、中央に空、手前は広めの余白。
鳥や人物や文字は描かない。紺色、クリー
ム色、黄緑でまとめて。
後から別の鳥の画像を重ねて動かすための
背景です。

できた画像をPNG形式で保存し、assets/forest.pngとして作業フォルダへ置きます。元の形式が違う場合は、拡張子だけを変えずPNGへ変換してください。続いて、背景画像を参照として付け、鳥を別の画像で作ります。

この背景と同じ紙の質感・配色で、小鳥を
1羽だけ生成して。
横向き、全身が画面内に収まる構図。背景
は透明。
木や文字は入れない。鳥を独立した素材と
して使います。

保存先はassets/bird.pngです。背景のチェック模様が画像に描かれているだけでは透過になりません。Claudeにアルファチャンネルの有無を確認させ、透過でなければ切り抜き処理を頼みます。

HyperFramesのプロジェクトでClaude Codeを開き、次を依頼します。

/hyperframes
assets/forest.pngとassets/bird.pngで10
秒、1920×1080、30fpsの動画を作って。
背景はゆっくり拡大。鳥は2秒から7秒にか
けて左から右へ移動。
新しい画像や映像は生成しない。鳥の切り
抜きに問題があれば先に報告。
8秒から「小さな一歩を、今日から。」と
表示。
日本語が読めるフォントを使い、端で切れ
ないようにする。
構成を見せてから制作し、検査とプレビュ
ーまで進めて。

まずは音なしで見て、鳥の周囲に白い四角がないか、画像がぼやけていないかを確認します。画像を大きく引き伸ばしてしまった場合は、拡大率を下げるか、必要な解像度で画像を作り直します。

ElevenLabsで音声を加える構成と確認点

ElevenLabsの読み上げを追加するには、Claude Codeへ公式のホスト型MCPを接続する方法があります。MCPは、Claudeから外部ツールを使うための接続です。

作業フォルダのターミナルで次を実行し、Claude Codeを起動します。ElevenLabsの公式接続案内

claude mcp add --transport http elevenlabs https://api.elevenlabs.io/v1/mcp
claude

Claude Code内で/mcpを開き、ElevenLabsを選んでブラウザの認証を完了します。接続後は「利用できる読み上げツールと日本語音声の候補を示して。まだ生成しないで」と頼み、声を選びます。

選んだ声の名前またはIDを使って、以下を依頼します。

ElevenLabsで、日本語の読み上げを1本だ
け作って。
声は先ほど選んだもの。原稿は「小さな一
歩を、今日から。」。
穏やかで自然な速さにして。生成前に利用
するモデルと消費条件を示して。
私の確認後に生成し、音声を
assets/voice.mp3へ保存して。
ローカル保存できない場合は取得用のリン
クを返して。

リンクで返った場合は自分でダウンロードし、同じ保存先へ置きます。音声の長さを確認してから、「4秒地点から声を流し、終わるまで画面を残す」とClaudeに依頼します。

聞き取れない場合は映像を長くし、声を極端に速めて押し込まないほうが伝わりやすくなります。音声と絵を確認したら、ターミナルで書き出します。

npx hyperframes check
npx hyperframes render --output out.mp4

out.mp4を最後まで再生し、声の末尾が切れていないかを確認してください。MCPが認証エラーなら/mcpで接続状態を確認し、利用枠のエラーならElevenLabs側の残量を確認します。

画像生成・音声生成・修正の費用を分ける

費用は、画像、音声、Claudeの作業、動画の書き出しに分けて把握します。アカウントで接続できても、画像や音声の生成枠は各サービス側で消費します。

この手順は画像を手動で保存する方法ですが、元投稿ではAPIを使う構成が報告されています。両者を同じ課金経路として扱わないでください。

修正したい内容	まず直す場所
鳥を右へ動かしたい	アニメーションのコード
読み上げの言葉を変えたい	音声原稿と音声素材
鳥の形そのものを変えたい	画像素材
画面の文字だけ変えたい	動画内の文字要素

たとえば、移動速度を変えるだけなら、鳥の画像まで再生成する必要はありません。使う画像と音声をファイルで残すことで、どの工程をやり直すかを選べます。

まずは背景1枚、手前の素材1枚、声1本で完成させてください。素材が増えても、同じ分担で考えられます。人物の自然な演技を重視する場合は、Higgsfieldを使う構成も比較対象になります。