Image Generation via MCP

MCP를 통한 AI 이미지 생성 스킬입니다. Gemini 모델 또는 호환 서비스를 사용하여 마케팅, UI, 프레젠테이션용 고품질 이미지를 생성합니다.

When to use this skill

• 마케팅 에셋: 히어로 이미지, 배너, 소셜 미디어 콘텐츠
• UI/UX 디자인: 플레이스홀더 이미지, 아이콘, 일러스트레이션
• 프레젠테이션: 슬라이드 배경, 제품 시각화
• 브랜드 일관성: 스타일 가이드 기반 이미지 생성

---

Instructions

Step 1: Configure MCP Environment

# MCP 서버 설정 확인
claude mcp list

# Gemini CLI 사용 가능 여부 확인
# gemini-cli가 설치되어 있어야 함

필수 설정:

• Model name (gemini-2.5-flash, gemini-3-pro 등)
• API key reference (환경 변수로 저장)
• Output directory

Step 2: Define the Prompt

구조화된 프롬프트 작성:

**Subject**: [주요 피사체]
**Style**: [스타일 - 미니멀, 일러스트, 사진풍, 3D 등]
**Lighting**: [조명 - 자연광, 스튜디오, 골든아워 등]
**Mood**: [분위기 - 차분한, 역동적, 전문적 등]
**Composition**: [구성 - 중앙 배치, 삼분할 등]
**Aspect Ratio**: [비율 - 16:9, 1:1, 9:16]
**Brand Colors**: [브랜드 컬러 제약사항]

Step 3: Choose the Model

모델	용도	특징
gemini-3-pro-image	고품질	복잡한 구성, 디테일
gemini-2.5-flash-image	빠른 반복	프로토타이핑, 테스트
gemini-2.5-pro-image	균형	품질/속도 밸런스

Step 4: Generate and Review

# 2-4개 변형 생성
ask-gemini "Create a serene mountain landscape at sunset,
  wide 16:9, minimal style, soft gradients in brand blue #2563EB"

# 단일 변수 변경으로 반복
ask-gemini "Same prompt but with warm orange tones"

리뷰 체크리스트:

• 브랜드 적합성
• 구성 명확성
• 비율 정확성
• 텍스트 가독성 (텍스트 포함 시)

Step 5: Deliverables

최종 산출물:

• 최종 이미지 파일
• 프롬프트 메타데이터 기록
• 모델, 비율, 사용 노트

{
  "prompt": "serene mountain landscape at sunset...",
  "model": "gemini-3-pro-image",
  "aspect_ratio": "16:9",
  "style": "minimal",
  "brand_colors": ["#2563EB"],
  "output_file": "hero-image-v1.png",
  "timestamp": "2026-01-21T10:30:00Z"
}

---

Examples

Example 1: Hero Image

Prompt:

Create a serene mountain landscape at sunset,
wide 16:9, minimal style, soft gradients in brand blue #2563EB.
Focus on clean lines and modern aesthetic.

Expected output:

• 16:9 hero image
• Prompt parameters saved
• 2-3 variants for selection

Example 2: Product Thumbnail

Prompt:

Generate a 1:1 thumbnail of a futuristic dashboard UI
with clean interface, soft lighting, and professional feel.
Include subtle glow effects and dark theme.

Expected output:

• 1:1 square image
• Low visual noise
• App store ready

Example 3: Social Media Banner

Prompt:

Create a LinkedIn banner (1584x396) for a SaaS startup.
Modern gradient background with abstract geometric shapes.
Colors: #6366F1 to #8B5CF6.
Leave space for text overlay on the left side.

Expected output:

• LinkedIn-optimized dimensions
• Safe zone for text
• Brand-aligned colors

---

Best practices

1. Specify ratio early: 의도하지 않은 크롭 방지
2. Use style anchors: 일관된 미적 스타일 유지
3. Iterate with constraints: 한 번에 하나의 변수만 변경
4. Track prompts: 재현 가능성 확보
5. Batch similar requests: 일관된 스타일 세트 생성

---

Common pitfalls

• 모호한 프롬프트: 구체적인 스타일과 구성 지정 필요
• 크기 제약 무시: 대상 채널의 크기 요구사항 확인
• 과도하게 복잡한 장면: 명확성을 위해 단순화

---

Troubleshooting

Issue: Outputs are inconsistent

Cause: 안정적인 스타일 제약 누락 Solution: 스타일 레퍼런스와 고정 팔레트 추가

Issue: Wrong aspect ratio

Cause: 비율 미지정 또는 지원하지 않는 비율 Solution: 정확한 비율 제공 후 재생성

Issue: Brand mismatch

Cause: 컬러 코드 미지정 Solution: HEX 코드로 브랜드 컬러 명시

---

Output format

## Image Generation Report

### Request
- **Prompt**: [full prompt]
- **Model**: [model used]
- **Ratio**: [aspect ratio]

### Output Files
1. `filename-v1.png` - [description]
2. `filename-v2.png` - [variant description]

### Metadata
- Generated: [timestamp]
- Iterations: [count]
- Selected: [final choice]

### Usage Notes
[Any notes for implementation]

---

Multi-Agent Workflow

Validation & Retrospectives

• Round 1 (Orchestrator): 프롬프트 완전성, 비율 정합성
• Round 2 (Analyst): 스타일 일관성, 브랜드 정합성
• Round 3 (Executor): 출력 파일명, 전달 체크리스트 검증

Agent Roles

Agent	Role
Claude	프롬프트 구성, 품질 검증
Gemini	이미지 생성 실행
Codex	파일 관리, 배치 처리

---

Metadata

Version

• Current Version: 1.0.0
• Last Updated: 2026-01-21
• Compatible Platforms: Claude, ChatGPT, Gemini, Codex

Related Skills

• frontend-design
• presentation-builder
• video-production

Tags

#image-generation #gemini #mcp #design #creative #ai-art