AI image generation for SEO assets: OG/social preview images, blog hero images, schema images, product photography, infographics. Powered by Gemini via nanobanana-mcp. Requires banana extension installed. Use when user says "generate image", "OG image", "social preview", "hero image", "blog image", "product photo", "infographic", "seo image", "create visual", "image-gen", "favicon", "schema image", "pinterest pin", "generate visual", "banner", or "thumbnail".
Generate production-ready images for SEO use cases using Gemini's image generation via the banana Creative Director pipeline. Maps SEO needs to optimized domain modes, aspect ratios, and resolution defaults.
This extension is built on Claude Banana, the standalone AI image generation skill for Claude Code.
This skill has two components with distinct roles:
/seo image-gen commands for generating imagesagents/seo-image-gen.md): Audit-only analyst spawned during /seo audit to assess existing OG/social images and produce a generation plan (never auto-generates)This skill requires the banana extension to be installed:
./extensions/banana/install.sh
Check availability: Before using any image generation tool, verify the MCP server
is connected by checking if gemini_generate_image or set_aspect_ratio tools are
available. If tools are not available, inform the user the extension is not installed
and provide install instructions.
| Command | What it does |
|---|---|
/seo image-gen og <description> | Generate OG/social preview image (1200x630 feel) |
/seo image-gen hero <description> | Blog hero image (widescreen, dramatic) |
/seo image-gen product <description> | Product photography (clean, white BG) |
/seo image-gen infographic <description> | Infographic visual (vertical, data-heavy) |
/seo image-gen custom <description> | Custom image with full Creative Director pipeline |
/seo image-gen batch <description> [N] | Generate N variations (default: 3) |
Each use case maps to pre-configured banana parameters:
| Use Case | Aspect Ratio | Resolution | Domain Mode | Notes |
|---|---|---|---|---|
| OG/Social Preview | 16:9 | 1K | Product or UI/Web | Clean, professional, text-friendly |
| Blog Hero | 16:9 | 2K | Cinema or Editorial | Dramatic, atmospheric, editorial quality |
| Schema Image | 4:3 | 1K | Product | Clean, descriptive, schema ImageObject |
| Social Square | 1:1 | 1K | UI/Web | Platform-optimized square |
| Product Photo | 4:3 | 2K | Product | White background, studio lighting |
| Infographic | 2:3 | 4K | Infographic | Data-heavy, vertical layout |
| Favicon/Icon | 1:1 | 512 | Logo | Minimal, scalable, recognizable |
| Pinterest Pin | 2:3 | 2K | Editorial | Tall vertical card |
For every generation request:
set_aspect_ratio MCP toolreferences/prompt-engineering.md for the 6-component systemgemini_generate_image MCP toolIf the user mentions a brand or has SEO presets configured:
python3 scripts/presets.py list
Load matching preset and apply as defaults. Also check references/seo-image-presets.md
for SEO-specific preset templates.
After every successful generation, guide the user on:
keyword-description-widthxheight.webpmagick output.png -quality 85 output.webp
ImageObject schema for the generated image:
{
"@type": "ImageObject",
"url": "https://example.com/images/keyword-description.webp",
"width": 1200,
"height": 630,
"caption": "Descriptive caption with target keyword"
}
<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" />
Image generation costs money. Be transparent:
python3 scripts/cost_tracker.py log --model MODEL --resolution RES --prompt "brief"cost_tracker.py summary if user asks about usageApproximate costs (gemini-3.1-flash):
| Scenario | Model | Why |
|---|---|---|
| OG images, social previews | gemini-3.1-flash-image-preview @ 1K | Fast, cost-effective |
| Hero images, product photos | gemini-3.1-flash-image-preview @ 2K | Quality + detail |
| Infographics with text | gemini-3.1-flash-image-preview @ 2K, thinking: high | Better text rendering |
| Quick drafts | gemini-2.5-flash-image @ 512 | Rapid iteration |
| Error | Resolution |
|---|---|
| MCP not configured | Run ./extensions/banana/install.sh |
| API key invalid | New key at https://aistudio.google.com/apikey |
| Rate limited (429) | Wait 60s, retry. Free tier: ~10 RPM / ~500 RPD |
IMAGE_SAFETY | Rephrase prompt - see references/prompt-engineering.md Safety section |
| MCP unavailable | Fall back: python3 scripts/generate.py --prompt "..." --aspect-ratio "16:9" |
| Extension not installed | Show install instructions: ./extensions/banana/install.sh |
/seo images identify missing or low-quality images; use those findings to drive /seo image-gen commandsImageObject schema markup pointing to the new assetsLoad on-demand. Do NOT load all at startup:
references/prompt-engineering.md:6-component system, domain modes, templatesreferences/gemini-models.md:Model specs, rate limits, capabilitiesreferences/mcp-tools.md:MCP tool parameters and responsesreferences/post-processing.md:ImageMagick/FFmpeg pipeline recipesreferences/cost-tracking.md:Pricing, usage trackingreferences/presets.md:Brand preset managementreferences/seo-image-presets.md:SEO-specific preset templatesAfter generating, always provide: