Claude Codeで動画作成までできたら、ブログの図解がそのまま動き出すかもしれません。
少し前に、ぼくがClaude Codeの中で回している仮想会社ALBA（アルバ）で、動画で紹介されていたスキル10個を一つずつ答え合わせした記事を書きました。その中の見出しに「スライドや動画まわりは無かったけど、今のところ困っていません」と付けて、「スライドを作る仕事や、動画を編集する仕事が来たら、そのとき考えればいい話だと思っています」とも書いています。
そんなときに見かけたのが、ハム先生の動画です。ハム先生は「ハム先生のAI教室【AI動画の実務活用】」というYouTubeチャンネル（登録者3.45万人。2026年10月2日時点）で、AI動画の仕事での使い方を発信している方です。概要欄の自己紹介によると、アクセンチュアでDX案件に携わったあと、事業会社で10万人超の法人YouTubeの運営を複数経験されたそうです。
その動画では、Claudeだけで30秒ほどのアニメーションが作れると話していました。ぼくは「これ、Claude Codeでも使える形にしておきたい」と思いました。図解が動画になれば、読む人にも伝わりやすくなりそうです。
Claude Codeでも動画作成できる？ハム先生の動画で見た3つの使い方
動画のタイトルは「Claude Opus 5.5、使って感動した3つの活用法」です。話されていた3つを、順に紹介します。
Claudeだけで作るアニメーション
1つ目は、Claudeのアプリでアニメーションを作る使い方です。桃太郎のあらすじがわかる30秒ほどのアニメーションを作って、と頼むだけで、Claudeが画面の中で動くアニメーションを作ってくれる様子が出てきました。裏側ではHTMLやCSS（Webページの形と見た目を決める書き方です）、Pythonといったプログラムが動いているそうです。
ナレーションも付いていました。最初は無料の合成音声（コンピューターが文章を読み上げる声です）を選んだものの、機械っぽさが残ったので、GeminiのTTS（Text To Speech。文章を声にする音声合成のことです）をAPI（外のサービスに頼みごとをするための窓口です）でつないだ、という流れです。ハム先生の動画では、このTTSは枠に限りはあるものの無料で使えて、1時間あたり1ドル程度、120円くらいと安い、という説明でした。
かかった時間と使った量も語られていて、最初の30秒の動画は10分ほど、Claudeの週ごとの利用上限のうち5%程度でできたそうです。字幕を声に合わせたり、BGMや効果音を足したりするのも、プロンプト（Claudeに送る指示の文章です）で頼んでいました。直したいところの画面を撮って、変えたい内容を一言添えて頼むと、そこだけ直る様子も出てきます。
AI動画やAdobeと組み合わせる2つの使い方
2つ目は、AI動画のサービスと組み合わせる使い方です。実写のような人物の映像や物理的な動き、カメラワークはAI動画が受け持ち、Claudeがその上にテキストのアニメーションを重ねる形でした。つなぐサービスとして出てきたのがHiggsfieldで、MCP（Claudeに外のサービスをつなぐための共通の決まりです）で呼び出すそうです。
3つ目は、Adobeのアプリとの連携です。Premiere（動画編集のアプリ）でのカット編集、After Effects（動画に動きや効果を付けるアプリ）、Photoshop（画像を加工するアプリ）でのサムネイル作りが出てきました。Premiereでは、撮影した素材を渡してカット編集を頼むと、自動でカットしてくれます。カットや表記のルールをスキル（Claudeに覚えさせる手順書です）にまとめているので、編集の8割ほどを自動化できている、という説明でした。
ハム先生が使っていたのはClaudeのアプリです。ぼくが普段使っているのはClaude Codeで、Claudeにパソコン上の作業フォルダを任せて、ファイルを作らせたり命令を実行させたりする道具です（公式の概要ページと、ぼくの入門記事があります）。動画を作る手順をClaude Codeの道具として残せたら、毎回頼み直さなくて済みそうだと考えました。
Claude Codeを一から知りたい方向けの入門書も、いくつか出ています。
Claude Codeに動画作成の道具を持たせると…
ぼくは、動画を作る手順を道具としてまとめました。道具といっても難しいものではなく、台本を書いて、声にして、絵を描いて撮って、合わせるまでを順番に呼び出せるようにしたものです。流れは次のとおりです。
外のサービスに頼むのは、声にするところだけです。Claude Codeを動かす分の利用枠は別に使います（Claude Codeのクレジットの話はこちらの記事に書きました）。
AI動画のクレジットを使わずに作れるのは、どこまで？
Higgsfieldのようなサービスでは、動画を作るたびにクレジットを使うそうです。ぼくの道具は、絵を描くのも、1コマずつ撮るのも、声と合わせてmp4に書き出すのも手元の処理で済むので、そこに費用は出ません。出るのは、声にする部分だけです。
見本の30秒では、台本5文・108字を読み上げて、Geminiの使用量は746トークンでした（入力が67、音声の出力が679。トークンは文章や音声を数える単位です）。できた声は21.2秒です。ハム先生の動画では、1時間あたり1ドル程度という説明でした。
字幕や数字は、書いたとおりに出るのか
動画の字幕と見出しは、パソコンに入っているIPAゴシックという日本語フォントで描いています。AIに絵として作らせるのではなく、文字をそのまま描く形なので、台本に書いた文字がそのまま画面に出ます。試しに作った桃太郎の30秒動画からコマを取り出して見てみると、字幕は台本に書いた秒どおりに切り替わっていました。
ハム先生の動画には、AI動画だと絵文字が崩れたり、調整が効かなかったりすることが多い、という話がありました。ぼくはAI動画のほうを試していないので比べられませんが、こちらは書いた文字がそのまま出ます。コードで作ると細かい調整がしやすい、という点も同じ話でした。
次の動画は、題材を言うだけで出てくるのか
手順を道具にしたので、絵のHTML、字幕の書式、声を作る手順が手元に残りました。桃太郎の試作と2本の見本で、同じ道具から題材の違う動画を3本作れています。ただ、3本とも台本や絵の動きを細かく指示して作りました。「次は○○の動画を」と一言伝えるだけで完成まで進むかは、まだ試していません。
道具として実装できたこと
ここまでの作業で、道具にできたことを並べます。
- HTMLで描いた絵を、時刻を決めて1コマずつ撮り、音のない動画（mp4）にする
- Pythonで1コマずつ絵を描いて、同じように音のない動画にする
- 台本の文を、Geminiの音声合成で声にする
- できた声の長さを測り、その秒を字幕のファイルに書いておけば、字幕と見出しが声に合わせて切り替わる（秒を決めるのは手作業です）
- 音のない動画と声を合わせて、音声つきの動画にする
- 縦長（1080×1920）の画面にも出せる（横の画面を縮めて中央に置く形で、縦長向けに組み直してはいません）
この道具で作れそうな動画の例
実際に作ったのは、桃太郎の試作1本と見本2本です。次の10個は、そこで確かめた文字・図形・字幕・声・縦長の範囲で作れそうなものの例です。実写のような人物や、本物らしい物理の動きは、ハム先生の動画でもAI動画の受け持ちとされていたので入れていません。
- 商品の比較表が1行ずつ出てくる解説動画（買う前に、違いが順番に見える）
- ブログ記事の要点を30秒にまとめた縦長のショート動画（記事を読む前に中身が分かる）
- 設定や配線の順番を、図とテロップで見せる手順の動画（やる順番を目で追える）
- 数字の推移のグラフが伸びていく動画（増えた・減ったが実感できる）
- 用語解説のテロップ動画（難しい言葉を、声と字幕で覚えられる）
- ゲームのスコアや順位の推移の動画（伸び方を振り返れる）
- 家計の内訳が円グラフになる動画（何にお金が出ているかが見える）
- 料金プランの違いを、金額が切り替わる様子で見せる動画（自分に合うプランを選びやすい）
- 英単語の暗記カードの動画（単語を見て、声で答え合わせできる）
- アプリや道具の使い方を、操作の順番の図で見せる案内動画（画面を撮らなくても作れる）
30秒の見本動画を作ってみました
題材はスーツの起動。4つの手順を30秒で
見本の題材は、マーベルの映画『アイアンマン』の1作目（2008年）へのオマージュにしました。スーツの起動を「電源、センサー、推力、飛行」の4つの場面で説明する30秒です。映画の映像や台詞、音楽は使っていませんし、人の形も出していません。中央に六角形を並べた格子と回る光の帯を置いて、画面の端に電力のゲージ、周囲を調べるレーダー、推力の棒グラフ、部品の設計図が順に出てきます。左下に流れる起動ログは、この道具の実際の手順（描く、撮る、声にする、合わせる）です。画面の中のAIアシスタントの名前は、仮想会社と同じALBAにしました。
本当は、スーツが組み上がって飛んでいく姿まで作りたかったのですが、今回は映画のスーツの形を借りないことを優先して、人の形を出さない側に寄せました。それでも、いい出来になったので、これでよしとしました。
この記事の2本の動画は、映画『アイアンマン』（2008年）へのオマージュとしてALBAが作った非公式のもので、映画の製作・配給にかかわる各社とは関係ありません。声はAI（Geminiの音声合成）が作ったものです。
組み上がって飛び立つ姿を、もう1本
2本目は、映画のスーツとは別の形で作りました。映画『アイアンマン』へのオマージュとして、木でできたスーツが組み上がって飛び立つ30秒です。画面の主役には、ALBA Mk-W（アルバ マークW）という名前を付けました。ALBAは仮想会社の名前、Wは木（Wood）の頭文字です。動画の最後には、この名前が画面に出ます。
作業台の上で、木の部品が自分で飛んで組み上がっていきます。緑の植物の栄養剤が入った縦長のガラスのカプセルが胸に収まると、光が管を巡って、横一本のバイザーが灯ります。そのあと背中と足のかかとから噴射して、夜の森から空へ飛び立ち、最後は空に小さな緑の点になります。
こちらも30秒・900コマで、撮影には5分ほどかかりました（1本目は3分20秒ほど）。声の種類は1本目と同じにして、7文・115字で、使用量は930トークンでした。字幕と声のずれは、7文すべてで最大0.005秒でした。
動く絵は、Webページと同じ書き方で作る
絵を動かす部分は、Webページを作るときと同じHTMLとCSSで書きました。ブラウザで開いた画面を、時刻を決めて1コマずつスクリーンショットに撮り、30秒ぶんの900コマ（30fps。1秒に30コマ、ということです）を並べて動画にします。時刻を決めて撮るのは、実時間のまま撮ると撮影に時間がかかった分だけコマが落ちて、動画の長さがずれるからです。
同じことを自分でやるのに要るものは、Claude Code、動画を書き出すためのffmpeg（無料のソフトです）、画面を1コマずつ撮るためのブラウザを動かす部品、声に使うGeminiのAPIキー（声の合成に使うための鍵です）の4つです。Claude Code自体の利用枠のほかに、外のサービスへ費用が出るのは、Geminiで声を作るところだけです。ぼくは、ここまでの流れをClaude Codeに頼んで、道具として作ってもらいました。同じ流れは、Claude Codeに頼めば作らせられます。
声はGeminiの読み上げで付ける
声は、Geminiの音声合成のモデル（gemini-3.8-flash-tts）で作りました。声の種類はKoreという名前のものです。1本目の台本は5文・108字で、できた声は21.2秒。動画の2秒目から鳴らして、映像に重ねています。
聞いてみると、大人の落ち着いた女性の声でした。映画に出てくる執事のようなAIを思わせる少し機械っぽさがあって、これはこれでいい感じでした。
Gemini自体を触り始めたい方には、入門書もあります。
Pythonで描く方法でも作って、見比べました
同じ台本・字幕・場面割りで、Pythonで描く方法も作りました。HTMLの代わりに、Pillow（Pythonで画像を描くための部品です）で1コマずつ絵を描いて、同じように動画にします。Pillowは別に入れる必要があります。どちらも最後の書き出しにはffmpeg（動画をつなぐ・書き出すための無料のソフトです）を使います。
2つの動画の絵がどれだけ近いかは、PSNR（2枚の絵の近さを表す数値。大きいほど近い）で測ると、平均32.05dBでした。何dBなら同じ絵と言えるのかの基準は、ぼくは持っていません。目で見ると、同じ13秒のコマはこうなります。
書きやすさの違いは、動きの種類で出ました。回転やフェード、線が描かれていく動きは、HTMLならCSSの数行で済みます。Pythonだと、時刻から回転の角度や線の長さを計算して、毎コマ描き直します。ただ、見本1本と各1回の計測だけなので、どちらが上とは言えません。
作ってみて引っかかったところ
1.5秒の時点で、絵のいる場所が合わなかった
道具ができたあと、動きを試験してみると、動画の1秒目から2秒かけて0pxから1000pxまで動く絵が、1.5秒の時点で250pxの場所にいるはずが、750pxまで進んでいたんです。
原因は、すべての動きに、動画が始まってからの経過時間をそのまま入れていたことでした。途中から始まる動きは、始まるまでの時間の分だけ先に進んでしまいます。そこで、その動きを初めて見たコマの時刻から数えるように直して、同じ試験をやり直すと、1.5秒で250pxの位置になりました。
声のファイルの先頭で、何が起きていたのか
Geminiが返してきた音声は、最初から完成したwavのファイルでした（wavは音声ファイルの形式のひとつで、先頭に長さなどの情報を書いたヘッダが付きます）。ぼくの道具はこれを生の音声データ（PCM）だと思い込んで、ヘッダをもう一度付けてしまい、先頭にノイズが入るファイルを作っていました。返ってきたものが、wavの先頭に付く決まった4文字（RIFF）で始まるかを見て、処理を分けるように直しています。
字幕と声は、どこまで合っているのか
1本目の見本の字幕は5文ぶんあります。声の始まりと比べると、2文目から5文目は0.07秒以内で合っていますが、1文目だけは字幕が約0.22秒早く出ます。1文目の秒を合わせ直す余地が、まだ残っています。
HiggsfieldとAdobeは、どこから使うのか
ハム先生の動画の2つ目と3つ目は、ClaudeにHiggsfieldやAdobeのアプリをつないで使う、別の入口でした。ぼくが作った道具とは、つなぐ場所が違います。
Higgsfieldは、どこからつなぐのか
ハム先生の動画では、Claudeアプリの設定からつなぐ手順も紹介されていました。概要欄にあるMCP連携用のリンクを開いて、接続のボタンと続けるのボタンを順に押すと、Claudeのカスタムコネクター（外のサービスをつなぐための画面です）にHiggsfieldが加わります。設定が終わると、Claudeアプリの設定にあるコネクターの項目に表示される、という流れでした。生成にはHiggsfield側のクレジットを使うそうです。ぼくはまだ触っていないので、動画で見た範囲の紹介です。
Premiereは、どこで動くのか
PremiereはAdobeの動画編集のアプリで、手元のパソコンに入れて使います。ハム先生の動画では、Googleドライブに入れた撮影素材を使ってカット編集を頼み、できた結果をPremiereのプロジェクトファイルに保存していました。こちらもぼくはまだ触っていません。動画編集そのものを一から知りたい方には、Premiereの入門書があります。
ハム先生のやり方と、ぼくのやり方を並べると
まとめ
Claude Codeに動画作成の道具を持たせて、見本を作ってみました。手に入ったものは3つです。
- AI動画のクレジットを使わずに、30秒の解説動画を作れる。外に費用が出るのは声の部分だけ
- 字幕や見出しの文字が、書いたとおりに画面に出る
- 手順が道具になったので、台本・字幕・絵を差し替えれば次の動画も同じ流れで作れる（見本は2本とも、この道具で作った）
1本目の起動画面に続いて、2本目の組み上がって飛び立つ姿まで、同じ道具で作れました。ここまでの流れは、Claude Codeに頼んでいけば、題材を変えて繰り返せます。
Claude Codeの基本から知りたい方、モデルの選び方が気になる方は、次の2つの記事もどうぞ。
コメント