email-banner-generation

メールバナーの生成

each::senseを使用して、コンバージョン率の高いメールマーケティング用バナーやヘッダーを生成します。このスキルでは、互換性を最大限に高めるため、標準幅600pxのメールクライアントに最適化した画像を作成します。

特長

• ニュースレターヘッダー：定期配信用ニュースレターのプロフェッショナルなヘッダー
• プロモーションバナー：セール告知や割引キャンペーン
• 製品告知：新製品や新機能のローンチビジュアル
• ウェルカムメール：新規購読者に向けた第一印象となるヘッダー
• 季節キャンペーン：祝日や季節をテーマにしたバナー
• イベント招待：ウェビナー、カンファレンス、イベントのヘッダー
• フラッシュセールバナー：緊急性を演出するカウントダウン風のグラフィック
• お客様の声バナー：お客様のレビューやソーシャルプルーフのビジュアル
• メール署名：ブランドを反映したプロフェッショナルな署名バナー

クイックスタート

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create an email newsletter header, 600px wide, for a tech company weekly digest. Modern, clean design with blue gradient background."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

メールバナーのサイズとベストプラクティス

バナーの種類	寸法	用途
標準ヘッダー	600x200	ニュースレターヘッダー、一般的なお知らせ
ヒーローバナー	600x300	プロモーションキャンペーン、製品のローンチ
コンパクトヘッダー	600x150	ミニマルなヘッダー、署名バナー
フルフィーチャー	600x400	製品紹介、イベント招待
署名バナー	600x100	メール署名用グラフィック

注： 600px幅はメールで安全に使用できる標準サイズで、主要なメールクライアント（Gmail、Outlook、Apple Mailなど）すべてで正しく表示されます。

ユースケースの例

1. ニュースレッターヘッダー

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x200px email newsletter header for a tech startup weekly digest. Clean modern design with subtle geometric patterns, dark blue to purple gradient background. Include space for logo on the left side. Professional and contemporary feel."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

2. プロモーションセールバナー

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x300px promotional email banner for a 50% off summer sale. Bright, energetic design with coral and yellow colors. Include visual space for SALE headline text and shop now button. E-commerce fashion brand style."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

3. 製品告知バナー

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x300px email banner announcing a new smartphone launch. Premium tech aesthetic with dark background, subtle light rays, and space for product image placement. Apple-style minimalism with focus on elegance."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

4. ウェルカムメールヘッダー

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x250px welcome email header for a fitness app. Warm, inviting design with energetic person silhouette, sunrise gradient (orange to yellow), motivational atmosphere. Space for Welcome message and brand logo."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

5. 祝日・季節のバナー

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x300px holiday email banner for Christmas sale campaign. Festive design with snow, pine trees silhouettes, red and gold color scheme. Elegant with subtle sparkles, space for holiday greeting text and discount badge."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

6. イベント招待ヘッダー

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x350px email header for a virtual conference invitation. Professional corporate design with abstract network visualization, deep blue and teal colors. Include visual areas for event name, date, and register button. Tech conference aesthetic."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

7. 新コレクション告知

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x300px email banner for a fashion brand new spring collection launch. Elegant, high-fashion aesthetic with soft pastel colors (blush pink, sage green). Minimalist with space for NEW COLLECTION text overlay. Luxury brand feel."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

8. フラッシュセールのカウントダウンバナー

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x250px flash sale email banner with urgency. Bold design with red and black colors, dynamic diagonal stripes or lightning bolt elements. Include visual space for countdown timer display boxes (hours:minutes:seconds). High energy, act now feeling."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

9. お客様の声・レビューのバナー

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x280px email banner for customer testimonials section. Clean design with soft gradient background (light gray to white), space for circular customer photo placeholder, quote marks design element, 5-star rating visual. Trust-building, professional layout."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

10. メール署名バナー

curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x100px email signature banner for a marketing agency. Sleek horizontal design with subtle gradient, space for company logo on left, social media icon placeholders on right. Professional, minimal, brand-forward design."}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "max"
  }'

ベストプラクティス

メールで安全に使えるデザイン

• 幅：メールクライアントとの互換性を最大限に高めるため、常に幅を600pxにします
• ファイルサイズ：読み込みを速くするため、画像は1MB未満に抑えます
• 形式：透明背景のグラフィックにはPNG、写真にはJPGを使用します
• 代替テキスト：アクセシビリティのため、必ず説明的な代替テキストを含めます
• Retina対応：Retinaディスプレイ向けに、幅1200pxの画像を600pxに縮小する方法を検討します

ビジュアルガイドライン

• テキスト用スペース：テキストを重ねるための明確なスペースを確保します
• コントラスト：テキストを配置する領域に十分なコントラストを確保します
• ブランドの一貫性：キャンペーン全体で色やスタイルの一貫性を保ちます
• モバイル：モバイルメールクライアントを想定してデザインします（1カラム）
• セーフゾーン：重要な要素を端から離して配置します

コンテンツのヒント

• 明確な階層：最も重要な情報がすぐに目に入るようにします
• 焦点は1つに：バナーごとにメッセージを1つに絞ります
• CTAの視認性：行動喚起の領域が目立つようにします
• テキストは最小限に：可能な場合は、画像内のテキストではなく、補足となるHTMLテキストを使用します

メールバナー向けプロンプトのヒント

メールバナーを作成する際は、プロンプトに次の詳細を含めます。

1. 寸法：正確なサイズを指定します（例：600x300px）
2. バナーの種類：ヘッダー、プロモーション、告知など
3. 配色：ブランドカラーまたは希望するパレット
4. テキスト用スペース：見出しやCTAを配置する場所
5. スタイル：ミニマル、大胆、エレガント、遊び心のあるものなど
6. 業界：Eコマース、SaaS、フィットネス、ファッションなど

プロンプト構成の例

"Create a [width]x[height]px email [banner type] for [industry/brand].
[Style description] with [color scheme].
Include space for [text elements like headline, CTA, logo].
[Mood/feeling] aesthetic."

モードの選択

生成を始める前にユーザーに確認します。

「速さと低コストを重視しますか、それとも高品質を重視しますか？」

モード	最適な用途	速度	品質
max	最終キャンペーン用バナー、A/Bテストの勝者	遅い	最高
eco	すばやい下書き、コンセプトの検討、大量のバリエーション	速い	良好

複数ターンでのクリエイティブな反復

session_idを使用してメールバナーを反復的に改善します。

# Initial banner
curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x300px promotional email banner for Black Friday sale. Bold design with dark background."}],
    "model": "eachsense/beta",
    "stream": true,
    "session_id": "email-campaign-bf2024"
  }'

# Iterate based on feedback
curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Add more gold accents and make the design more premium looking. Include space for 70% OFF text."}],
    "model": "eachsense/beta",
    "stream": true,
    "session_id": "email-campaign-bf2024"
  }'

# Request size variation
curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a compact 600x150px version of this banner for email signature use."}],
    "model": "eachsense/beta",
    "stream": true,
    "session_id": "email-campaign-bf2024"
  }'

キャンペーンの一括生成

A/Bテスト用に複数のバリエーションを生成します。

# Variation A - Bold colors
curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x300px email banner for spring sale - bold vibrant colors, energetic design"}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "eco"
  }'

# Variation B - Minimal design
curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x300px email banner for spring sale - minimal clean design, soft pastels"}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "eco"
  }'

# Variation C - Photo-centric
curl -X POST https://eachsense-agent.core.eachlabs.run/v1/chat/completions \
  -H "Content-Type: application/json" \
  -H "X-API-Key: $EACHLABS_API_KEY" \
  -H "Accept: text/event-stream" \
  -d '{
    "messages": [{"role": "user", "content": "Create a 600x300px email banner for spring sale - lifestyle photography style, person in spring setting"}],
    "model": "eachsense/beta",
    "stream": true,
    "mode": "eco"
  }'

エラー処理

エラー	原因	解決策
Failed to create prediction: HTTP 422	残高不足	eachlabs.ai でチャージします
コンテンツポリシー違反	禁止されているコンテンツ	コンテンツポリシーに準拠するようプロンプトを調整します
タイムアウト	生成が複雑	クライアントのタイムアウトを最低 10 分に設定します

関連スキル

• each-sense - コア API ドキュメント
• meta-ad-creative-generation - Meta/Facebook 広告クリエイティブ
• product-photo-generation - E コマース商品画像