mcpField
S
seo-image-gen

seo-image-gen

github.com/sickn33Marketing & growth48.7k86 installsUpdated 1d ago
Repository

About seo-image-gen

seo-image-gen is a skill for creating SEO image assets such as social previews, blog heroes, product photos, and infographics. It selects image ratios and resolutions by use case and invokes generation tools through the banana extension; that extension and referenced materials must be supplied separately.

Key features

  1. 01Generate social preview and blog hero images
  2. 02Set ratios and resolutions by image use
  3. 03Create product photos, infographics, and icons
  4. 04Generate batches of image variations
  5. 05Provide post-generation SEO checks

Use cases

  1. 01Create OG or social preview images for pages
  2. 02Make blog hero images or product photos
  3. 03Generate infographics, schema images, or icons
  4. 04Plan image generation from audit findings

MCP support

The skill uses the MCP tool set_aspect_ratio to set image proportions and gemini_generate_image to generate images. The banana extension and required tools must be available before use.

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/sickn33/agentic-awesome-skills --skill seo-image-gen

After installing, type/seo-image-genin Claude Code to confirm it loaded.

Details

From the project README

Supporting material availability

This catalog copy contains the inline guidance below, but does not include the following supporting paths. They are external prerequisites, not bundled files:

  • <support-root>/references/prompt-engineering.md
  • <support-root>/references/seo-image-presets.md
  • <support-root>/references/gemini-models.md
  • <support-root>/references/mcp-tools.md
  • <support-root>/references/post-processing.md
  • <support-root>/references/cost-tracking.md
  • <support-root>/references/presets.md

Obtain the required material from the declared upstream source, or from a user-provided installation of that source. Resolve each path relative to that installation, inspect its contents, and verify any applicable license and execution prerequisites. Do not run a command or claim a referenced procedure was followed until its required file exists. Do not fabricate the missing scripts or treat an unrelated file with the same name as equivalent. Independent steps fully documented here can proceed within the user’s authorized scope; report any dependent step as unavailable.

SEO Image Gen: AI Image Generation for SEO Assets (Extension)

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.

When to Use

  • Use when generating OG images, hero images, schema visuals, infographics, or similar SEO assets.
  • Use when image generation is part of a broader SEO or publishing workflow.
  • Use only when the required image-generation extension is available.

Architecture Note

This skill has two components with distinct roles:

  • SKILL.md (this file): Handles interactive /seo image-gen commands for generating images
  • Agent (agents/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)

Prerequisites

The installer, agent and scripts named below are not bundled here. Do not execute a guessed path or install an extension automatically; use an inspected, fixed upstream revision only with setup authorization. Tool availability, model IDs, costs and quotas must be checked against the actual provider before use; historical estimates below are not a billing guarantee. Respect the host/user’s chosen image tool. Generation does not authorize publishing, and supplied private images need permission for provider upload.

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.

Quick Reference

CommandWhat 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)

SEO Image Use Cases

Each use case maps to pre-configured banana parameters:

Use CaseAspect RatioResolutionDomain ModeNotes
OG/Social Preview1200:630 (crop/resize if unsupported)1KProduct or UI/WebClean, professional, text-friendly
Blog Hero16:92KCinema or EditorialDramatic, atmospheric, editorial quality
Schema Image4:31KProductClean, descriptive, schema ImageObject
Social Square1:11KUI/WebPlatform-optimized square
Product Photo4:32KProductWhite background, studio lighting
Infographic2:34KInfographicData-heavy, vertical layout
Favicon/Icon1:1512LogoMinimal, scalable, recognizable
Pinterest Pin2:32KEditorialTall vertical card

Generation Pipeline

For every generation request:

  1. Identify use case from command or context (og, hero, product, etc.)
  2. Apply SEO defaults from the use cases table above
  3. Set aspect ratio via set_aspect_ratio MCP tool
  4. Construct Reasoning Brief using the banana Creative Director pipeline:
    • Load references/prompt-engineering.md for the 6-component system
    • Apply domain mode emphasis (Subject 30%, Style 25%, Context 15%, etc.)
    • Be SPECIFIC and VISCERAL: describe what the camera sees
  5. Generate via gemini_generate_image MCP tool
  6. Post-generation SEO checklist (see below)
Check for Presets

If the user mentions a brand or has SEO presets configured:

python3 ~/.claude/skills/seo-image-gen/scripts/presets.py list

Load matching preset and apply as defaults. Also check references/seo-image-presets.md for SEO-specific preset templates.

Post-Generation SEO Checklist

After every successful generation, guide the user on:

  1. Alt text:Write concise descriptive alt text for the image’s purpose; use empty alt for decorative images and avoid keyword stuffing for the generated image
  2. File naming:Rename to SEO-friendly format: keyword-description-widthxheight.webp
  3. WebP conversion:Convert to WebP for optimal page speed:
    magick output.png -quality 85 output.webp
    
  4. File size:Target under 200KB for hero images, under 100KB for thumbnails
  5. Schema markup:Suggest 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"
    }
    
  6. OG meta tags:For social preview images, remind about:
    <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" />
    

Cost Awareness

Image generation costs money. Be transparent:

  • Show estimated cost before generating (especially for batch)
  • Log every generation: python3 ~/.claude/skills/seo-image-gen/scripts/cost_tracker.py log --model MODEL --resolution RES --prompt "brief"
  • Run cost_tracker.py summary if user asks about usage

Historical illustrative costs (verify current model/pricing first):

  • 512: ~$0.02/image
  • 1K resolution: ~$0.04/image
  • 2K resolution: ~$0.08/image
  • 4K resolution: ~$0.16/image

Model Routing

ScenarioModelWhy
OG images, social previewsgemini-3.1-flash-image-preview @ 1KFast, cost-effective
Hero images, product photosgemini-3.1-flash-image-preview @ 2KQuality + detail
Infographics with textgemini-3.1-flash-image-preview @ 2K, thinking: highBetter text rendering
Quick draftsgemini-2.5-flash-image @ 512Rapid iteration

Error Handling

ErrorResolution
MCP not configuredRun ./extensions/banana/install.sh
API key invalidNew key at https://aistudio.google.com/apikey
Rate limited (429)Honor Retry-After and use bounded backoff; quota depends on the current account/model
IMAGE_SAFETYRephrase prompt - see references/prompt-engineering.md Safety section
MCP unavailableFall back: python3 ~/.claude/skills/seo-image-gen/scripts/generate.py --prompt "..." --aspect-ratio "16:9"
Extension not installedShow install instructions: ./extensions/banana/install.sh

Cross-Skill Integration

  • seo-images (analysis) feeds into seo-image-gen (generation): audit results from /seo images identify missing or low-quality images; use those findings to drive /seo image-gen commands
  • seo-audit spawns the seo-image-gen agent (not this skill) to analyze OG/social images across the site and produce a prioritized generation plan
  • seo-schema can consume generated images: after generation, suggest ImageObject schema markup pointing to the new assets

Reference Documentation

Load on-demand. Do NOT load all at startup:

  • references/prompt-engineering.md:6-component system, domain modes, templates
  • references/gemini-models.md:Model specs, rate limits, capabilities
  • references/mcp-tools.md:MCP tool parameters and responses
  • references/post-processing.md:ImageMagick/FFmpeg pipeline recipes
  • references/cost-tracking.md:Pricing, usage tracking
  • references/presets.md:Brand preset management
  • references/seo-image-presets.md:SEO-specific preset templates

Response Format

After generating, always provide:

  1. Image path:where it was saved
  2. Crafted prompt:show what was sent to the API (educational)
  3. Settings:model, aspect ratio, resolution
  4. SEO checklist:alt text suggestion, file naming, WebP conversion
  5. Schema snippet:ImageObject or og:image markup if applicable

Limitations

  • Use this skill only when the task clearly matches the scope described above.
  • Do not treat the output as a substitute for environment-specific validation, testing, or expert review.
  • Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.

Comments

Markdown supported