Nano Banana - UI Mockup Generator

Generate UI mockups using Gemini 3 Pro Image.

Image Generation API

Delegate to a subagent to isolate token usage:

Task(
  subagent_type: "general-purpose",
  model: "haiku",
  prompt: "Generate image with Gemini API. Run this bash command and return the output file path:
    P=\"YOUR_PROMPT\" A=\"16:9\" R=\"2K\" O=\"/tmp/nb-$(date +%s)\"
    RESP=$(curl -s \"https://generativelanguage.googleapis.com/v1beta/models/gemini-3-pro-image-preview:generateContent\" \\
      -H \"x-goog-api-key: $GEMINI_API_KEY\" -H \"Content-Type: application/json\" \\
      -d \"$(jq -n --arg p \"$P\" --arg a \"$A\" --arg r \"$R\" '{contents:[{parts:[{text:$p}]}],generationConfig:{responseModalities:[\"TEXT\",\"IMAGE\"],imageConfig:{aspectRatio:$a,imageSize:$r}}}')\")
    IMG=$(echo \"$RESP\"|jq -r '.candidates[0].content.parts[]|select(.inlineData)|.inlineData')
    [[ $(echo \"$IMG\"|jq -r '.data') == \"null\" ]] && { echo \"$RESP\"|jq -r '.error.message//.candidates[0].content.parts[].text' >&2; exit 1; }
    EXT=$(echo \"$IMG\"|jq -r 'if .mimeType==\"image/png\" then \"png\" elif .mimeType==\"image/webp\" then \"webp\" else \"jpg\" end')
    echo \"$IMG\"|jq -r '.data'|base64 -d > \"$O.$EXT\" && echo \"$O.$EXT\"
  Return ONLY the output file path.",
  description: "Generate UI mockup"
)

CRITICAL: Do NOT run the API directly via Bash - always delegate to the Task subagent. This avoids shell parsing issues with parentheses and special characters in prompts.

Parameters

• A (aspect ratio): 1:1, 16:9, 9:16, 3:4, 21:9
• R (resolution): 1K, 2K, 4K

Workflow

1. If user mentions screenshot/clipboard: pngpaste /tmp/nb-input.png
2. Optionally gather style context from project (colors, typography, existing components)
3. Set P, A, R, O vars and run the curl command
4. open the result for user to view
5. Read the generated image to inspect if needed

Prompt Tips

• Be specific about layout, colors, typography
• Reference existing design systems when applicable
• Include device context (mobile, desktop, tablet)