AI Banner Lab MVP 実装計画

技術選定

• React + Vite の単一ページアプリ。初期検証を速くし、Vercel公開経路と相性がよい。
• 保存は localStorage。認証・共有DBを先行させず、案件の再開と履歴確認を検証する。
• バナーはVercel Serverless APIからOpenAI Image APIのgpt-image-2へ接続し、人物・背景・構図・日本語コピー・CTAを含む完成PNGを直接生成する。Canvas、SVG、固定テンプレートでは代替しない。
• Node標準テストで決定論的生成と入力制約を確認する。

データモデル

Project は id, input, targets, targetIndex, angles, angleIndex, copy, banners, selectedBanner, history, updatedAt を持つ。Banner は方向、palette、seed、revisionを保持し、再生成を追跡する。ブラウザごと最大20案件を保存する。

Provider Adapter

ターゲット、訴求、コピーはクライアント内の決定論的Strategy Provider (src/engine.js)が生成する。完成バナーは/api/generate-bannersだけがOpenAI Image APIへ接続し、モデル名をgpt-image-2に固定する。OPENAI_API_KEYはServerless環境だけで読み、クライアントへ返さない。公開顧客リクエストをCodex/Claude subscriptionへ中継しない。

脅威境界

• URL・資料・概要は信用しない外部データ。システム命令と明示的に分離し、取得URLはHTTP(S)のみ、private/loopback/link-local IP、リダイレクト、巨大応答を拒否する。
• PDFは安全なテキスト抽出Adapterでサイズ・ページ・文字数を制限し、埋め込みスクリプト等を実行しない。現DEMOはファイル名のみ保持する。
• 入力長と制御文字を制限し、出力はReactのテキスト描画に限定する。顧客素材の権利確認チェックと保存期間表示をAPI接続前に追加する。
• APIキー、原文資料、生成ログをクライアント配布しない。削除・エクスポート導線を本保存導入時に用意する。

外部API接続に必要な承認事項

1. 画像生成はOpenAI Image APIのgpt-image-2だけを使用する。API組織でモデル利用に必要なVerificationが完了していることを確認する。
2. 初期API予算上限は2,500円。1操作3枚まで、各画像1088x1088・medium。公式の1024角medium参考価格は画像出力1枚0.053米ドルで、3枚0.159米ドルに入力トークン費用が加わる。実費はUsageで確認する。
3. APIキーはVercel Serverless環境だけで保持する。顧客入力は生成時だけOpenAI APIへ送信し、アプリ側の案件・base64 PNGは利用者ブラウザのIndexedDBに保存する。サーバーでは入力・画像を保存せずログにも出さない。
4. 公開前にOpenAI側のプロジェクト予算上限・アラートを設定する。認証や永続レート制限がない段階では一般公開せず、承認された少数ベータに限定する。

市場調査要約（2026-08-19）

• Google AdsはPerformance Maxで7点以上の画像と頻繁な更新を推奨: https://support.google.com/google-ads/answer/14528221?hl=en
• MetaはAdvantage+ Creativeでバリエーション生成を提供し、AI機能を400万超の広告主が利用と説明: https://www.facebook.com/business/ads/meta-advantage-plus/creative
• Canva FreeはAI広告作成を含み、Proは年144米ドル: https://www.canva.com/pricing/
• AdCreative.ai Starterは月39米ドル・10クレジット: https://www.adcreative.ai/
• Adobe Expressは無料枠とPremium、月250生成クレジット等を提供: https://www.adobe.com/express/pricing

差別化は汎用画像編集ではなく、日本語のサービス概要からターゲット→訴求→コピー→同条件3案比較→案件履歴を一続きにすること。国内顧客の反復頻度と課金意向、生成原価、日本語入り画像品質はベータで未検証。