ブログ画像をAIが全自動生成する仕組みを作った話｜Claude Code×Codex連携スキル＋プロンプト全文配布

ブログ記事を書くたびに「どんな挿絵を入れればいいか」を考えて、プロンプトを書いて、Codexに送って、生成された画像を確認して…という作業が地味に時間を食う。1記事で4〜6枚必要で、しかも毎回キャラクターの顔が少しずつズレていく。

これを解決するために、Claude CodeからCodexを直接呼び出す「/evahas-imageスキル」を作った。記事ファイルを渡すと、どこに何枚の画像を入れるかを自動で考えて、プロンプトを書いて、画像まで生成してくれる。私がやることは1行入力するだけだ。

この記事では、そのスキルの仕組みとそのまま使えるプロンプトテンプレートを全文公開する。

そもそも何が問題だったのか

ブログの挿絵制作で時間がかかる理由は3つある。

問題1: 毎回「どこに画像を置くか」を考える

記事を書き終えた後、「ここに画像があると分かりやすい」「ここで読者が離脱しそう」という判断を毎回手動でやっていた。これが意外と頭を使う。

問題2: キャラクターの一貫性が保てない

同じキャラクターを使うためには毎回「銀灰色の長髪・青灰色の瞳・灰色の獣耳」と手でプロンプトを書き直す必要がある。少しでも表現を変えると前回と顔つきがズレる。10記事書いたら10通りの顔になってしまう。

問題3: 配置から生成までの手数が多い

配置案を考える→プロンプトを書く→Codexに送る→結果を確認する→記事に挿入する、という5ステップが毎回発生する。これを4〜6枚分繰り返すと軽く1時間が飛ぶ。

Claude Code × Codexスキルで解決したこと

作った/evahas-imageスキルは、上の3問題を一気に片付ける。

ワンコマンドで動く流れ

1. Claude Code上で/evahas-imageと入力する
2. スキルが記事ファイル（article.txt）を読み込む
3. 記事の構成を分析して「ここに画像が必要」という配置案を自動で作る（4〜6枚）
4. 各シーンのCodexプロンプトをAIが自動生成する
5. Codex MCPを呼び出して画像を生成・指定フォルダに保存する

私がやることは「/evahas-imageを入力してEnterを押す」だけ。あとはAIが全部やる。

キャラクター一貫性の問題は、参照画像を毎回指定することで解決した。同じ画像を参照させると、モデルが前回と同じ顔を再現してくれる。

実際にこのスキルで作った記事2本

直近2本の記事でこのスキルを使った。

PC配線をType-Cハブ1本に集約した話 では、ケーブル地獄に囲まれた困り顔・ハブを発見した瞬間の驚き顔・スッキリデスクでサムズアップの3場面を生成した。記事のストーリー展開に合わせてシーンが自動で決まるので、画像が記事から浮かない。

残価設定ローンの罠に気づいて約50万円節約した話 では、見積書739,421円を見てショックを受けるシーン・利率差を解説するホワイトボードシーン・銀行ローン承認でサムズアップのシーンを生成した。

どちらの記事も、画像生成にかけた時間は5〜10分。スキル実行後にCodexが動いている間に別の作業ができる。

セットアップに必要なもの

このスキルを動かすには以下が必要だ。

Codex自体は無料で使える（2026年5月現在）。コストがかかるのはClaude Proサブスクリプション（月20ドル〜）のみだ。

そのまま使えるプロンプトテンプレート

このテンプレートをCodexに渡せば、スキルを使わなくても同じことが手動でできる。「人物特徴」の部分を自分のキャラクターに差し替えるだけで使える。

“`
以下のパスにある参照画像を読み込み、その人物をモデルとして使って画像を生成してください。
参照画像パス: [自分の参照画像のフルパスを入力]

人物の髪色・耳・目・雰囲気は参照画像に合わせて統一してください。
参照画像の人物特徴を維持してください:
[自分のキャラクターの外見特徴を記載]
（例: 銀灰色の長髪、青灰色の瞳、灰色の獣耳、ふわっとした尾、柔らかい上品な雰囲気）

画像1:
– ファイル名: img-01-eyecatch.png
– サイズ: 1024×1024（アイキャッチ用・正方形）
– 用途: アイキャッチ画像
– 内容: [記事テーマに合わせて：問題に直面して困惑しているシーン]
– 文字: なし

画像2:
– ファイル名: img-02-discovery.png
– サイズ: 1536×1024（記事内・横長）
– 用途: 記事内イラスト（気づきシーン）
– 内容: [解決策を発見して目を輝かせているシーン]
– 文字: なし

画像3:
– ファイル名: img-03-explanation.png
– サイズ: 1536×1024
– 用途: 記事内イラスト（説明シーン）
– 内容: [ホワイトボードや図解で仕組みを解説しているシーン]
– 文字: なし

画像4:
– ファイル名: img-04-success.png
– サイズ: 1536×1024
– 用途: 記事内イラスト（解決シーン）
– 内容: [問題が解決して満足しているシーン・サムズアップ等]
– 文字: なし

各画像を[保存先フォルダのパス]に保存してください。
全画像を生成・保存後、保存先パスと各画像の概要を報告してください。
“`

シーン構成の基本は「問題→気づき→説明→解決」の4枚組だ。記事の読者がたどる感情の動きに合わせると、画像が記事の流れと一致して読みやすくなる。

まとめ

このスキルを作る前は、1記事あたりの画像制作に30〜60分かかっていた。今は5〜10分。削減できた時間を記事の質を上げることに回せるようになった。

AIツールは使わないのが一番の機会損失だ。難しく考えなくていい。まずテンプレートをコピーして試してみるところから始めるといい。

アメノヴァ（このブログ）について・私evahasについてはこちらから。どんな考え方でこのブログを運営しているかを書いている。