seo-image-gen

SEO Image Gen：SEO アセット向け AI 画像生成（拡張機能）

共有データキャッシュ

ステップ 0 -- 共有データキャッシュを確認：

情報を収集する前に、関連する SEO スキルで再利用できるコンテキストが .seo-cache/ にあるか確認します。 参照先：スキーマと依存関係マップについては ../seo/references/shared-data-cache.md を参照してください。

次のキャッシュファイルがあれば確認します：

• .seo-cache/site-meta.json：ドメイン、ビジネスタイプ、業界、クロールのコンテキスト

• .seo-cache/audit-scores.json：以前のフル監査での優先事項

• .seo-cache/pages/{url-slug}/page-analysis.json：URL が指定されている場合のページ単位のコンテキスト

• 見つかった場合：明らかに有効なフィールドを解析して使用します（「[date] のキャッシュ済み [X] を使用」と記録します）

• 見つからない場合、破損している場合、または無関係な場合：新しい根拠を使って続行します

• ユーザーが「refresh」または「re-run」と指示した場合：キャッシュの読み取りを無視し、書き込み時に上書きします

banana Creative Director パイプライン経由で Gemini の画像生成を使用し、SEO の用途に適した本番品質の画像を生成します。 SEO のニーズを、最適化されたドメインモード、アスペクト比、解像度のデフォルト設定に対応付けます。

アーキテクチャに関する注記

この拡張機能は、Codex の SEO 固有の画像ワークフロー向けに、 Banana の画像生成パイプラインを基盤としています。

このスキルは、役割の異なる 2 つのコンポーネントで構成されています：

• SKILL.md（このファイル）：画像を生成する対話型の /seo image-gen コマンドを処理します
• エージェント（agents/seo-image-gen.toml）：既存の OG／ソーシャル画像を評価して生成計画を作成する、/seo audit 中に起動される監査専用のアナリストです（自動生成は行いません）

前提条件

このスキルを使用するには、banana 拡張機能がインストールされている必要があります：

./extensions/banana/install.sh

利用可能か確認： 画像生成ツールを使用する前に、gemini_generate_image または set_aspect_ratio ツールが利用可能かを確認し、MCP サーバーが接続されていることを検証します。ツールが利用できない場合は、拡張機能がインストールされていないことをユーザーに伝え、インストール手順を案内します。

クイックリファレンス

コマンド	機能
/seo image-gen og <description>	OG／ソーシャルプレビュー画像を生成します（1200x630 相当）
/seo image-gen hero <description>	ブログのヒーロー画像を生成します（ワイドスクリーン、ドラマチック）
/seo image-gen product <description>	商品写真を生成します（クリーンな白背景）
/seo image-gen infographic <description>	インフォグラフィック画像を生成します（縦型、データ量多め）
/seo image-gen custom <description>	Creative Director パイプライン全体を使用してカスタム画像を生成します
/seo image-gen batch <description> [N]	N 個のバリエーションを生成します（デフォルト：3）

SEO 画像の用途

各用途は、事前設定済みの banana パラメーターに対応しています：

用途	アスペクト比	解像度	ドメインモード	注記
OG／ソーシャルプレビュー	16:9	1K	Product または UI/Web	クリーンでプロフェッショナル、テキストに適しています
ブログのヒーロー画像	16:9	2K	Cinema または Editorial	ドラマチックで雰囲気があり、エディトリアル品質
スキーマ画像	4:3	1K	Product	クリーンで説明的、schema ImageObject 向け
ソーシャル用スクエア画像	1:1	1K	UI/Web	プラットフォームに最適化された正方形
商品写真	4:3	2K	Product	白背景、スタジオ照明
インフォグラフィック	2:3	4K	Infographic	データ量が多い縦型レイアウト
ファビコン／アイコン	1:1	512	Logo	シンプルで、拡大縮小でき、認識しやすい
Pinterest ピン	2:3	2K	Editorial	縦長のカード

生成パイプライン

生成リクエストごとに、次の手順を実行します：

1. コマンドまたはコンテキストから用途（og、hero、product など）を特定します
2. 上記の用途一覧から SEO のデフォルト設定を適用します
3. set_aspect_ratio MCP ツールでアスペクト比を設定します
4. banana Creative Director パイプラインを使用して Reasoning Brief を作成します：
   • 6 コンポーネントシステムについて references/prompt-engineering.md を読み込みます
   • ドメインモードの重点配分（Subject 30%、Style 25%、Context 15% など）を適用します
   • 具体的かつ生々しく、カメラに映るものを描写します
5. gemini_generate_image MCP ツールで生成します
6. 生成後の SEO チェックリストを実施します（以下を参照）

プリセットを確認する

ユーザーがブランド名に言及した場合、または SEO プリセットが設定されている場合：

python3 scripts/presets.py list

該当するプリセットを読み込み、デフォルトとして適用します。SEO 固有のプリセットテンプレートについては、references/seo-image-presets.md も確認してください。

生成後の SEO チェックリスト

生成が成功するたびに、以下についてユーザーを案内します。

1. 代替テキスト：生成した画像について、説明的でキーワードを含む代替テキストを作成します
2. ファイル名：SEO に適した形式に変更します：keyword-description-widthxheight.webp
3. WebP 変換：ページの読み込み速度を最適化するため、WebP に変換します：

   magick output.png -quality 85 output.webp
   

4. ファイルサイズ：ヒーロー画像は 200KB 未満、サムネイルは 100KB 未満を目標にします
5. スキーママークアップ：生成した画像に ImageObject スキーマを提案します：

   {
     "@type": "ImageObject",
     "url": "https://example.com/images/keyword-description.webp",
     "width": 1200,
     "height": 630,
     "caption": "Descriptive caption with target keyword"
   }
   

6. OG メタタグ：ソーシャルプレビュー画像について、以下を忘れないように案内します：

   <meta property="og:image" content="https://example.com/images/og-image.webp" />
   <meta property="og:image:width" content="1200" />
   <meta property="og:image:height" content="630" />
   <meta property="og:image:alt" content="Descriptive alt text" />
   

コストへの配慮

画像生成には費用がかかります。透明性を保ってください。

• 生成前に推定コストを提示します（特にバッチ処理の場合）
• 生成のたびに記録します：python3 scripts/cost_tracker.py log --model MODEL --resolution RES --prompt "brief"
• ユーザーから利用状況について質問された場合は、cost_tracker.py summary を実行します

概算コスト（gemini-3.1-flash）：

• 512：画像 1 枚あたり約 $0.02
• 1K 解像度：画像 1 枚あたり約 $0.04
• 2K 解像度：画像 1 枚あたり約 $0.08
• 4K 解像度：画像 1 枚あたり約 $0.16

モデルの振り分け

シナリオ	モデル	理由
OG 画像、ソーシャルプレビュー	gemini-3.1-flash-image-preview @ 1K	高速で、コスト効率に優れています
ヒーロー画像、商品写真	gemini-3.1-flash-image-preview @ 2K	品質とディテールを両立します
テキスト入りインフォグラフィック	gemini-3.1-flash-image-preview @ 2K, thinking: high	テキストの描画品質が向上します
手早い下書き	gemini-2.5-flash-image @ 512	素早く反復できます

エラー処理

エラー	解決方法
MCP が設定されていません	./extensions/banana/install.sh を実行します
API キーが無効です	https://aistudio.google.com/apikey で新しいキーを取得します
レート制限（429）	60 秒待ってから再試行します。無料枠：およそ 10 RPM／およそ 500 RPD
IMAGE_SAFETY	プロンプトを言い換えます。references/prompt-engineering.md の Safety セクションを参照してください
MCP が利用できません	代わりに python3 scripts/generate.py --prompt "..." --aspect-ratio "16:9" を実行します
拡張機能がインストールされていません	インストール手順を表示します：./extensions/banana/install.sh

スキル間の連携

• seo-images（分析）から seo-image-gen（生成）へ情報を渡します：/seo images の監査結果から、不足している画像や品質の低い画像を特定し、その結果をもとに /seo image-gen コマンドを実行します
• seo-audit は seo-image-gen の エージェント（このスキルではありません）を起動し、サイト全体の OG／ソーシャル画像を分析して、優先順位を付けた生成計画を作成します
• seo-schema は生成した画像を利用できます：生成後、新しいアセットを参照する ImageObject スキーママークアップを提案します

リファレンスドキュメント

必要に応じて読み込みます。起動時にすべて読み込まないでください。

• references/prompt-engineering.md：6 要素のシステム、ドメインモード、テンプレート
• references/gemini-models.md：モデルの仕様、レート制限、機能
• references/mcp-tools.md：MCP ツールのパラメーターと応答
• references/post-processing.md：ImageMagick／FFmpeg のパイプラインレシピ
• references/cost-tracking.md：料金、利用状況の追跡
• references/presets.md：ブランドプリセットの管理
• references/seo-image-presets.md：SEO 固有のプリセットテンプレート

応答形式

生成後は、必ず以下を提示します。

1. 画像パス：保存先
2. 作成したプロンプト：API に送信した内容（学習用）
3. 設定：モデル、アスペクト比、解像度
4. SEO チェックリスト：代替テキストの提案、ファイル名、WebP 変換
5. スキーマのスニペット：該当する場合は ImageObject または og:image のマークアップ

共有データキャッシュへの書き込み

すべての作業が完了したら、ワークフローで永続的な知見が得られた場合に、簡潔な JSON の要約を .seo-cache/ に書き込みます。 ../seo/references/shared-data-cache.md にあるスキーマと命名規則に従い、少なくとも cache_type、analyzed_at、ソース URL／ドメイン、主な調査結果、問題点、推奨事項、ツールの制限事項を含めます。.gitignore に .seo-cache/ がない場合は追加します。