Build an Agentic Graphic Studio Engine

Introduction

30 Second Summary

Building a brand identity from scratch is expensive and slow. A single logo project can take weeks of revisions as designers try to keep icons, typography, and color palettes visually consistent.

In this project, you will build an agentic graphic studio engine that coordinates approximately 28 AI agents across 8 specialized teams to research, generate, score, and deliver production-ready brand identity packages using flat-rate AI subscriptions.

What You'll Build

A multi-model design orchestration engine that generates brand identity assets as isolated components, refines them through scoring loops with hard caps, and packages everything into a production-ready identity kit with print specs and IP documentation.

By the end of this project, you'll have:

• An orchestration workspace with ~28 agents organized into 8 teams, dispatched and monitored through Claude Code's agent view and coordinated by Claude Cowork.
• A component isolation workflow that generates icon, wordmark, and background separately to prevent identity drift during AI refinement.
• A production identity package with vector-traced marks, print-ready specs (POD and screen print), and IP assignment documentation with AI provenance disclosure.
• Secret Mission: Wire up an Antigravity cockpit to monitor and dispatch your agent teams from a single management dashboard.

Are there any prerequisites?

This project requires active subscriptions to Claude Max 20X (with Claude Code installed), ChatGPT Pro, and Google AI Pro. You also need free accounts for Firecrawl, Figma, and Canva, plus Inkscape installed and Photopea bookmarked.

You should be comfortable working in a terminal on Windows and familiar with giving AI agents goals and reviewing their outputs.

Before We Start

This project orchestrates roughly 28 AI agents across 8 teams to produce a complete brand identity package. Before any agent can run, every tool in the stack needs to be installed, connected, and verified.

In this step, you will create a workspace directory, confirm Claude Code is ready, wire up the Firecrawl research server, and provision dedicated workspaces in ChatGPT and Gemini.

In this step, get ready to:

• Create your workspace directory and verify Claude Code.
• Configure the Firecrawl MCP server for automated web research.
• Provision your ChatGPT Project and Gemini Gem.

Create your workspace and verify Claude Code

Every file the engine produces lands in a single workspace directory. This keeps generated assets, configs, and delivery packages in one place.

• Press Cmd+Space (macOS) or the Windows key (Windows) to open your search bar.
• Type Terminal (macOS) or PowerShell (Windows) and press Enter to open it.
• Create the workspace directory by running this command:

mkdir ~/agentic-studio && cd ~/agentic-studio

• Confirm the directory exists by running:

ls ~/agentic-studio

You should see an empty directory with no output (no errors).

Now verify that Claude Code is installed at the correct version. The engine requires v2.1.139 or higher because that is the first version supporting the claude agents command.

• Check your Claude Code version by running:

claude --version

✔️ I see version 2.1.139 or higher

Your Claude Code install is ready. Move on to the next substep.

ⓧ I see an older version

You need to update Claude Code to v2.1.139 or higher.

• Update Claude Code by running:

claude update

• After the update completes, verify the new version by running:

claude --version

You should now see 2.1.139 or higher in the output.

ⓧ Command not found

Claude Code is not installed yet. You need an active Claude Max 20X subscription to use it.

• Install Claude Code using the native installer. On macOS or Linux, run:

curl -fsSL https://code.claude.com/install | bash

• On Windows (PowerShell), run:

irm https://code.claude.com/install.ps1 | iex

• Restart your terminal session, then verify the install by running:

claude --version

You should see 2.1.139 or higher in the output.

• Confirm the agent view is accessible by running:

claude agents

What is claude agents?

The claude agents command opens the agent view, which lets you monitor and dispatch parallel background sessions from one screen. Later in this project, you will use it to run four research agents simultaneously.

Agent view not opening?

Make sure your Claude Code version is v2.1.139 or higher. Run claude --version to check. If the version is correct but the command still fails, restart your terminal and try again.

Help me debug this

Configure the Firecrawl MCP server

The engine uses Firecrawl to scrape competitor sites and gather brand research automatically. Connecting Firecrawl as an MCP server lets Claude Code call web search and scrape tools without manual copy-pasting.

• Open your Firecrawl dashboard at firecrawl.dev/app and copy your API key from the API keys section.
• Back in your terminal, add the Firecrawl MCP server to Claude Code by running this command:

claude mcp add --env FIRECRAWL_API_KEY=your-api-key-here -- npx -y firecrawl-mcp

What does this command do?

This registers a local MCP server named firecrawl in your Claude Code config. When Claude Code starts a session, it automatically launches the Firecrawl server and gives Claude access to web search, scrape, and crawl tools.

The --env FIRECRAWL_API_KEY=... flag passes your API key as an environment variable to the server process. The npx -y firecrawl-mcp portion downloads and runs the MCP server package.

• Verify the connection by running:

claude mcp list

You should see firecrawl listed with a connected status.

Firecrawl showing as disconnected?

Check that Node.js is installed (npx requires it). Run node --version to confirm. If Node is missing, install it from nodejs.org before retrying.

Also verify your API key is correct. If you pasted the wrong key, remove the server and re-add it:

claude mcp remove firecrawl

Then re-run the add command with the correct key.

Help me troubleshoot this

Provision your ChatGPT Project and Gemini Gem

The engine delegates image generation to ChatGPT and Gemini through dedicated workspaces. Each workspace holds the custom instructions that turn a generic model into a specialist graphic designer.

• Open ChatGPT in your browser at chatgpt.com.
• Click Projects in the left-hand menu.
• Click New project to create a new project.
• Name it Graphic Studio Engine and press Enter.
• Leave the project empty for now. You will add instructions in a later step.

Why a Project instead of a Custom GPT?

ChatGPT Projects and Custom GPTs are separate systems. Projects hold chats, files, and instructions in one workspace with project-only memory. The engine uses a Project because you will paste evolving briefs and reference files into it across multiple sessions.

The instructions ARE the reusable asset. You do not need a Custom GPT because the Project's instruction field serves the same purpose without the friction of maintaining a separate GPT.

Now set up the Gemini Gem for brand research.

• Open the Gemini web app at gemini.google.com.
• Click Open sidebar on the left.
• Click Gems.
• Click New Gem.
• Enter Brand Research Gem as the name.
• Leave the instructions field empty for now. You will add research instructions in a later step.
• Click Save.

What is a Gem?

A Gem is a saved set of custom instructions that shape how Gemini responds in every chat you open with it. Your Brand Research Gem will later hold detailed instructions for analyzing competitor visual identities and generating mood boards.

When generating images with this Gem, you will select the Pro model or use Redo with Pro to access Nano Banana Pro quality.

Don't see the Gems option?

Gems are only available in the Gemini web app. Make sure you are on gemini.google.com (not the mobile app). Also confirm you are signed in with the Google account that has your AI Pro subscription.

Help me find the Gems option

Your environment is ready. Every tool the engine depends on is installed, connected, and verified. Next up, you will load the research agents and start gathering brand intelligence.

Scaffold the Agent Teams

An engine with ~28 agents across 8 teams needs a clear organizational structure before any agent starts working. Without it, handoffs get lost, outputs land in the wrong place, and the operator spends more time managing chaos than directing creativity.

In this step, you will create the physical directory structure for each team, write a master orchestrator prompt that defines every agent's role and handoff contract, and build a quick-reference index of all agents and their tool bindings.

In this step, get ready to:

• Create eight team directories inside your workspace.
• Write a master orchestrator prompt defining all agents, confidence gates, and scoring caps.
• Build an agent index mapping every agent to its team and tool binding.

Create the team directories

Each team in the engine gets its own directory. Later steps will populate these with team-specific prompt files and output folders.

• In your Claude Code terminal, make sure you are inside the agentic-studio folder by running:

cd ~/agentic-studio

• Create all eight team directories by running this command:

mkdir research brief concept generation review refinement production delivery

• Confirm the directories exist by running:

ls

You should see eight folders listed: brief, concept, delivery, generation, production, refinement, research, and review.

Don't see eight directories?

Check that you ran the mkdir command from inside ~/agentic-studio and not from your home directory. Re-run cd ~/agentic-studio and try again.

help me find where my directories were created

Write the master orchestrator prompt

The orchestrator prompt is the single source of truth for how the engine operates. It defines every agent, the rules they follow, and the contracts that govern handoffs between teams.

• Create orchestrator.md in your agentic-studio folder and paste the following content. This is the global rules section that sets confidence gates and scoring caps:

# Graphic Studio Engine — Master Orchestrator

## Global Rules

### Confidence Gates
- Research outputs must score ≥ 7/10 on relevance before passing to Brief.
- Brief must receive operator BRIEF_APPROVED gate before Concept begins.
- Generation outputs must score ≥ 6/10 on brand alignment before entering Review.

### Scoring Loop Caps
- Max 3 iterations per review cycle. If score does not reach threshold after 3 loops, escalate to operator.
- Max 2 refinement passes per component. After cap, present best-scored variant for operator decision.

### Named Approval Gates
1. RESEARCH_COMPLETE — operator confirms research is sufficient.
2. BRIEF_APPROVED — operator signs off on creative brief.
3. CONCEPT_LOCKED — operator selects final concept direction.
4. GENERATION_ACCEPTED — operator approves raw generated assets.
5. REVIEW_PASSED — scoring meets thresholds across all criteria.
6. REFINEMENT_FINAL — operator confirms refined assets are ready for production.
7. PRODUCTION_READY — all files exported and verified.
8. DELIVERY_CONFIRMED — client package assembled and IP docs complete.

### Operator-in-the-Loop
- The operator is a human designer. No gate passes without explicit operator approval.
- Agents present options and recommendations. They never auto-advance past a named gate.

What are confidence gates?

Confidence gates prevent low-quality outputs from propagating downstream. A research agent that finds weak brand data (below 7/10 relevance) cannot hand off to the Brief team. The agent must iterate or escalate to the operator instead.

Scoring loop caps prevent infinite refinement. Without caps, a review agent could endlessly request changes. The hard limit of 3 iterations forces a decision.

• Now add the team definitions below the Global Rules section. This block defines the Research and Brief teams:

## Teams

### 1. Research Team (4 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| brand-historian | Researches client's brand history, values, and existing visual identity. | Claude Code + Firecrawl |
| competitor-scanner | Identifies competitor visual identities and market positioning. | Claude Code + Firecrawl |
| audience-profiler | Maps target audience demographics, preferences, and visual expectations. | Claude Code + Firecrawl |
| trend-scout | Tracks current design trends, color forecasts, and typography movements. | Claude Code + Firecrawl |

**Handoff contract**: Research team outputs a structured research dossier (JSON). All four agents contribute sections. Dossier passes to Brief only when operator grants RESEARCH_COMPLETE gate.

### 2. Brief Team (3 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| brief-compiler | Synthesizes research dossier into a creative brief with constraints. | Claude Code |
| constraint-validator | Checks brief against technical requirements (file formats, sizes, color spaces). | Claude Code |
| reference-curator | Selects 5-10 visual references that align with brief direction. | Claude Code + Firecrawl |

**Handoff contract**: Brief team outputs a creative brief document with embedded constraints and reference links. Passes to Concept only after BRIEF_APPROVED gate.

• Continue adding the Concept and Generation team definitions below the Brief team:

### 3. Concept Team (4 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| concept-ideator | Generates 3-5 distinct concept directions from the brief. | Claude Code |
| moodboard-builder | Assembles visual moodboards for each concept direction. | Claude Code + Firecrawl |
| palette-designer | Proposes color palettes (primary, secondary, accent) per concept. | Claude Code |
| type-selector | Recommends typography pairings per concept direction. | Claude Code |

**Handoff contract**: Concept team outputs concept decks (one per direction) with moodboard, palette, and type specs. Operator selects one direction at CONCEPT_LOCKED gate.

### 4. Generation Team (4 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| icon-generator | Generates icon/symbol variations using image AI. | ChatGPT Pro image gen |
| wordmark-generator | Generates wordmark/logotype variations using image AI. | Gemini Pro (Nano Banana Pro) |
| background-generator | Generates background textures and patterns. | ChatGPT Pro image gen |
| composition-assembler | Composites icon + wordmark + background in editor. | Claude Code (instructs Photopea/Figma) |

**Handoff contract**: Generation team outputs isolated components (icon, wordmark, background) as separate files plus one assembled composition. Components stay separated to prevent identity drift. Passes to Review after GENERATION_ACCEPTED gate.

Why generate components separately?

AI image generators return one flattened image. Re-prompting to fix one element re-rolls the entire composition. Generating icon, wordmark, and background separately lets you refine each without destroying the others.

The composition-assembler then layers them in a real editor. This eliminates identity drift during refinement.

• Add the Review and Refinement team definitions next:

### 5. Review Team (3 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| brand-alignment-scorer | Scores generated assets against brief criteria (0-10 scale). | Claude Code |
| quality-reviewer | Checks technical quality (resolution, artifacts, edge cleanliness). | Claude Code |
| accessibility-checker | Validates contrast ratios, legibility at small sizes, color-blind safety. | Claude Code |

**Handoff contract**: Review team outputs a score card per component. Components scoring ≥ 6/10 on all criteria pass to REVIEW_PASSED. Components below threshold return to Generation or Refinement (max 3 loops).

### 6. Refinement Team (4 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| color-refiner | Adjusts hues, saturation, and contrast based on review feedback. | Claude Code (instructs Photopea) |
| shape-refiner | Cleans edges, adjusts proportions, and fixes artifacts. | Claude Code (instructs Photopea) |
| type-refiner | Adjusts kerning, weight, and spacing on wordmark. | Claude Code (instructs Photopea) |
| iteration-tracker | Logs each refinement pass with before/after and score delta. | Claude Code |

**Handoff contract**: Refinement team outputs updated component files plus iteration log. Max 2 passes per component. After cap, best-scored variant goes to operator at REFINEMENT_FINAL gate.

• Add the final two teams, Production and Delivery:

### 7. Production Team (3 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| vector-tracer | Traces approved raster marks to clean SVG vectors. | Claude Code (instructs Inkscape) |
| file-exporter | Exports final assets in all required formats (SVG, PNG, PDF, EPS). | Claude Code (instructs Inkscape/Figma) |
| print-spec-writer | Documents print production specs (POD and screen print: color codes, bleed, min size). | Claude Code |

**Handoff contract**: Production team outputs a complete file set plus print spec document. All files verified at PRODUCTION_READY gate.

### 8. Delivery Team (3 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| package-assembler | Organizes all deliverables into client-ready folder structure. | Claude Code |
| ip-documenter | Writes IP assignment schedule and AI provenance disclosure (includes SynthID watermark note). | Claude Code |
| handoff-coordinator | Prepares delivery email/message with usage guidelines. | Claude Code |

**Handoff contract**: Delivery team outputs a zipped package with all assets, IP schedule, provenance disclosure, and usage guide. DELIVERY_CONFIRMED gate closes the project.

Why does ip-documenter mention SynthID?

All images generated through Gemini (Nano Banana Pro) carry invisible SynthID digital watermarks. The IP schedule must disclose that certain assets contain AI-generated watermarks. This is a professional best practice for client transparency.

• Save orchestrator.md.
• Verify the file exists by running:

ls orchestrator.md

You should see orchestrator.md listed in the output.

File not showing up?

Make sure you saved the file inside ~/agentic-studio/ and not inside one of the team subdirectories. Run pwd to confirm your current location.

help me find where orchestrator.md was saved

✔️ Awesome, I've got everything!

Great. Double check you have saved orchestrator.md and move on to the next substep.

ⓧ I'd like to double check the full code

# Graphic Studio Engine — Master Orchestrator

## Global Rules

### Confidence Gates
- Research outputs must score ≥ 7/10 on relevance before passing to Brief.
- Brief must receive operator BRIEF_APPROVED gate before Concept begins.
- Generation outputs must score ≥ 6/10 on brand alignment before entering Review.

### Scoring Loop Caps
- Max 3 iterations per review cycle. If score does not reach threshold after 3 loops, escalate to operator.
- Max 2 refinement passes per component. After cap, present best-scored variant for operator decision.

### Named Approval Gates
1. RESEARCH_COMPLETE — operator confirms research is sufficient.
2. BRIEF_APPROVED — operator signs off on creative brief.
3. CONCEPT_LOCKED — operator selects final concept direction.
4. GENERATION_ACCEPTED — operator approves raw generated assets.
5. REVIEW_PASSED — scoring meets thresholds across all criteria.
6. REFINEMENT_FINAL — operator confirms refined assets are ready for production.
7. PRODUCTION_READY — all files exported and verified.
8. DELIVERY_CONFIRMED — client package assembled and IP docs complete.

### Operator-in-the-Loop
- The operator is a human designer. No gate passes without explicit operator approval.
- Agents present options and recommendations. They never auto-advance past a named gate.

## Teams

### 1. Research Team (4 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| brand-historian | Researches client's brand history, values, and existing visual identity. | Claude Code + Firecrawl |
| competitor-scanner | Identifies competitor visual identities and market positioning. | Claude Code + Firecrawl |
| audience-profiler | Maps target audience demographics, preferences, and visual expectations. | Claude Code + Firecrawl |
| trend-scout | Tracks current design trends, color forecasts, and typography movements. | Claude Code + Firecrawl |

**Handoff contract**: Research team outputs a structured research dossier (JSON). All four agents contribute sections. Dossier passes to Brief only when operator grants RESEARCH_COMPLETE gate.

### 2. Brief Team (3 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| brief-compiler | Synthesizes research dossier into a creative brief with constraints. | Claude Code |
| constraint-validator | Checks brief against technical requirements (file formats, sizes, color spaces). | Claude Code |
| reference-curator | Selects 5-10 visual references that align with brief direction. | Claude Code + Firecrawl |

**Handoff contract**: Brief team outputs a creative brief document with embedded constraints and reference links. Passes to Concept only after BRIEF_APPROVED gate.

### 3. Concept Team (4 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| concept-ideator | Generates 3-5 distinct concept directions from the brief. | Claude Code |
| moodboard-builder | Assembles visual moodboards for each concept direction. | Claude Code + Firecrawl |
| palette-designer | Proposes color palettes (primary, secondary, accent) per concept. | Claude Code |
| type-selector | Recommends typography pairings per concept direction. | Claude Code |

**Handoff contract**: Concept team outputs concept decks (one per direction) with moodboard, palette, and type specs. Operator selects one direction at CONCEPT_LOCKED gate.

### 4. Generation Team (4 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| icon-generator | Generates icon/symbol variations using image AI. | ChatGPT Pro image gen |
| wordmark-generator | Generates wordmark/logotype variations using image AI. | Gemini Pro (Nano Banana Pro) |
| background-generator | Generates background textures and patterns. | ChatGPT Pro image gen |
| composition-assembler | Composites icon + wordmark + background in editor. | Claude Code (instructs Photopea/Figma) |

**Handoff contract**: Generation team outputs isolated components (icon, wordmark, background) as separate files plus one assembled composition. Components stay separated to prevent identity drift. Passes to Review after GENERATION_ACCEPTED gate.

### 5. Review Team (3 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| brand-alignment-scorer | Scores generated assets against brief criteria (0-10 scale). | Claude Code |
| quality-reviewer | Checks technical quality (resolution, artifacts, edge cleanliness). | Claude Code |
| accessibility-checker | Validates contrast ratios, legibility at small sizes, color-blind safety. | Claude Code |

**Handoff contract**: Review team outputs a score card per component. Components scoring ≥ 6/10 on all criteria pass to REVIEW_PASSED. Components below threshold return to Generation or Refinement (max 3 loops).

### 6. Refinement Team (4 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| color-refiner | Adjusts hues, saturation, and contrast based on review feedback. | Claude Code (instructs Photopea) |
| shape-refiner | Cleans edges, adjusts proportions, and fixes artifacts. | Claude Code (instructs Photopea) |
| type-refiner | Adjusts kerning, weight, and spacing on wordmark. | Claude Code (instructs Photopea) |
| iteration-tracker | Logs each refinement pass with before/after and score delta. | Claude Code |

**Handoff contract**: Refinement team outputs updated component files plus iteration log. Max 2 passes per component. After cap, best-scored variant goes to operator at REFINEMENT_FINAL gate.

### 7. Production Team (3 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| vector-tracer | Traces approved raster marks to clean SVG vectors. | Claude Code (instructs Inkscape) |
| file-exporter | Exports final assets in all required formats (SVG, PNG, PDF, EPS). | Claude Code (instructs Inkscape/Figma) |
| print-spec-writer | Documents print production specs (POD and screen print: color codes, bleed, min size). | Claude Code |

**Handoff contract**: Production team outputs a complete file set plus print spec document. All files verified at PRODUCTION_READY gate.

### 8. Delivery Team (3 agents)

| Agent | Role | Tool Binding |
|-------|------|--------------|
| package-assembler | Organizes all deliverables into client-ready folder structure. | Claude Code |
| ip-documenter | Writes IP assignment schedule and AI provenance disclosure (includes SynthID watermark note). | Claude Code |
| handoff-coordinator | Prepares delivery email/message with usage guidelines. | Claude Code |

**Handoff contract**: Delivery team outputs a zipped package with all assets, IP schedule, provenance disclosure, and usage guide. DELIVERY_CONFIRMED gate closes the project.

Build the agent index

The AGENTS.md file serves as a quick-reference card. It lets you see every agent's name, team, and tool binding at a glance without scrolling through the full orchestrator prompt.

• Create AGENTS.md in your agentic-studio folder and paste the following:

# Agent Index

## Summary
- **Total agents**: 28
- **Teams**: 8
- **Tool bindings**: Claude Code, ChatGPT Pro (image gen), Gemini Pro (Nano Banana Pro), Firecrawl

## Full Roster

| # | Agent | Team | Tool Binding |
|---|-------|------|--------------|
| 1 | brand-historian | Research | Claude Code + Firecrawl |
| 2 | competitor-scanner | Research | Claude Code + Firecrawl |
| 3 | audience-profiler | Research | Claude Code + Firecrawl |
| 4 | trend-scout | Research | Claude Code + Firecrawl |
| 5 | brief-compiler | Brief | Claude Code |
| 6 | constraint-validator | Brief | Claude Code |
| 7 | reference-curator | Brief | Claude Code + Firecrawl |
| 8 | concept-ideator | Concept | Claude Code |
| 9 | moodboard-builder | Concept | Claude Code + Firecrawl |
| 10 | palette-designer | Concept | Claude Code |
| 11 | type-selector | Concept | Claude Code |
| 12 | icon-generator | Generation | ChatGPT Pro image gen |
| 13 | wordmark-generator | Generation | Gemini Pro (Nano Banana Pro) |
| 14 | background-generator | Generation | ChatGPT Pro image gen |
| 15 | composition-assembler | Generation | Claude Code (Photopea/Figma) |
| 16 | brand-alignment-scorer | Review | Claude Code |
| 17 | quality-reviewer | Review | Claude Code |
| 18 | accessibility-checker | Review | Claude Code |
| 19 | color-refiner | Refinement | Claude Code (Photopea) |
| 20 | shape-refiner | Refinement | Claude Code (Photopea) |
| 21 | type-refiner | Refinement | Claude Code (Photopea) |
| 22 | iteration-tracker | Refinement | Claude Code |
| 23 | vector-tracer | Production | Claude Code (Inkscape) |
| 24 | file-exporter | Production | Claude Code (Inkscape/Figma) |
| 25 | print-spec-writer | Production | Claude Code |
| 26 | package-assembler | Delivery | Claude Code |
| 27 | ip-documenter | Delivery | Claude Code |
| 28 | handoff-coordinator | Delivery | Claude Code |

## Tool Binding Legend
- **Claude Code**: orchestration, reasoning, file management, editor instruction
- **ChatGPT Pro image gen**: raster image generation (icon, background) via ChatGPT Pro subscription
- **Gemini Pro (Nano Banana Pro)**: raster image generation (wordmark) via Google AI Pro subscription
- **Firecrawl**: web research and data extraction (free tier: 5 daily runs, 1000 credits/month)

What does this index do?

When you dispatch agents in later steps, you will reference them by their exact names from this index. The tool binding column tells you which platform each agent runs on. Agents bound to ChatGPT Pro or Gemini Pro require manual operator interaction (pasting briefs, triggering generation).

Agents bound to Claude Code can run autonomously in background sessions via claude agents. Agents bound to Firecrawl use the MCP connection you set up in the previous step.

• Save AGENTS.md.
• Verify the full workspace structure by running:

ls

You should see: AGENTS.md, orchestrator.md, and the eight team directories (brief/, concept/, delivery/, generation/, production/, refinement/, research/, review/).

Missing AGENTS.md or orchestrator.md?

If either file is missing from the listing, check that you saved it to ~/agentic-studio/ at the project root, not inside one of the team subdirectories.

help me verify my agentic-studio workspace structure

✔️ Awesome, I've got everything!

Great. Double check you have saved AGENTS.md and you are ready to move on.

ⓧ I'd like to double check the full code

# Agent Index

## Summary
- **Total agents**: 28
- **Teams**: 8
- **Tool bindings**: Claude Code, ChatGPT Pro (image gen), Gemini Pro (Nano Banana Pro), Firecrawl

## Full Roster

| # | Agent | Team | Tool Binding |
|---|-------|------|--------------|
| 1 | brand-historian | Research | Claude Code + Firecrawl |
| 2 | competitor-scanner | Research | Claude Code + Firecrawl |
| 3 | audience-profiler | Research | Claude Code + Firecrawl |
| 4 | trend-scout | Research | Claude Code + Firecrawl |
| 5 | brief-compiler | Brief | Claude Code |
| 6 | constraint-validator | Brief | Claude Code |
| 7 | reference-curator | Brief | Claude Code + Firecrawl |
| 8 | concept-ideator | Concept | Claude Code |
| 9 | moodboard-builder | Concept | Claude Code + Firecrawl |
| 10 | palette-designer | Concept | Claude Code |
| 11 | type-selector | Concept | Claude Code |
| 12 | icon-generator | Generation | ChatGPT Pro image gen |
| 13 | wordmark-generator | Generation | Gemini Pro (Nano Banana Pro) |
| 14 | background-generator | Generation | ChatGPT Pro image gen |
| 15 | composition-assembler | Generation | Claude Code (Photopea/Figma) |
| 16 | brand-alignment-scorer | Review | Claude Code |
| 17 | quality-reviewer | Review | Claude Code |
| 18 | accessibility-checker | Review | Claude Code |
| 19 | color-refiner | Refinement | Claude Code (Photopea) |
| 20 | shape-refiner | Refinement | Claude Code (Photopea) |
| 21 | type-refiner | Refinement | Claude Code (Photopea) |
| 22 | iteration-tracker | Refinement | Claude Code |
| 23 | vector-tracer | Production | Claude Code (Inkscape) |
| 24 | file-exporter | Production | Claude Code (Inkscape/Figma) |
| 25 | print-spec-writer | Production | Claude Code |
| 26 | package-assembler | Delivery | Claude Code |
| 27 | ip-documenter | Delivery | Claude Code |
| 28 | handoff-coordinator | Delivery | Claude Code |

## Tool Binding Legend
- **Claude Code**: orchestration, reasoning, file management, editor instruction
- **ChatGPT Pro image gen**: raster image generation (icon, background) via ChatGPT Pro subscription
- **Gemini Pro (Nano Banana Pro)**: raster image generation (wordmark) via Google AI Pro subscription
- **Firecrawl**: web research and data extraction (free tier: 5 daily runs, 1000 credits/month)

Your engine scaffold is complete. Every agent has a name, a team, a tool binding, and clear rules for when it can pass work downstream. Next up, you will bring the Research team to life by dispatching the first parallel agent sessions.

Run Two-Phase Brand Research

Your workspace is wired up and every agent knows its role. Now comes the engine's first real output: brand research that feeds every decision downstream.

A single research pass rarely captures enough signal to brief a design team confidently. This engine uses a two-phase approach. Phase 1 dispatches Firecrawl-powered agents to scrape live competitor pages. Phase 2 feeds that raw data into your Gemini Gem for structured synthesis. A confidence gate between the phases decides whether the findings are strong enough to proceed or whether a second scrape pass is needed.

In this step, get ready to:

• Dispatch Phase 1 research agents via Claude Code's agent view to scrape competitor brand pages with Firecrawl.
• Synthesize raw findings into structured brand intelligence using your Gemini Gem.
• Evaluate the confidence gate and produce a final research brief for the Brief team.

Dispatch Phase 1 research agents with Firecrawl

Phase 1 uses your Research team agents to scrape competitor brand pages and industry references in parallel. Each agent session leverages the Firecrawl MCP connection you set up earlier to pull live page content.

Why parallel agents instead of one big crawl?

Each research angle (competitor logos, typography choices, colour palettes, positioning language) benefits from a focused scrape prompt. Running them as separate background sessions keeps each agent's context tight and its output clean.

Firecrawl's free tier gives you 5 daily runs and 1000 credits per month. The engine sets maxCredits to 500 per task to stay well within budget.

• Return to Claude Code in your terminal.
• Open the agent view by running this command:

claude agents

You should see the agent view dashboard open, showing an empty session list.

• Dispatch your first research agent by typing the following prompt into the agent view input and pressing Enter:

Using the Firecrawl MCP tools, scrape 3-4 competitor brand pages in our target industry. For each page, extract: logo style, primary colours, typography choices, and positioning language. Save all raw findings to research/phase1-raw.md in the agentic-studio workspace. Cap usage at maxCredits 500.

What does this prompt do?

The prompt tells your Research agent to use Firecrawl's scrape tool (exposed via MCP) to pull structured brand data from competitor sites. It saves everything to research/phase1-raw.md so the next phase can read it directly.

Each prompt you type in agent view starts its own background session. The session runs independently and shows its status (working, waiting, done) as a row in the dashboard.

• Watch the session row update from "working" to "done" in the agent view. This typically takes 1-3 minutes depending on the sites scraped.
• Once the session shows as done, verify the output exists by running this command in a separate terminal:

cat ~/agentic-studio/research/phase1-raw.md

You should see raw markdown containing competitor brand data: logo descriptions, colour hex codes, font names, and positioning quotes.

Agent session stuck on "waiting"?

If the session shows "waiting on you", the agent likely hit a permission prompt for the Firecrawl tool. Attach to the session by selecting it and pressing Enter, then approve the tool use.

If you see a credit limit error, confirm your Firecrawl free tier has remaining daily runs (5 per day maximum).

Help me debug my Firecrawl agent session in Claude Code

Synthesize research with the Gemini Gem

Phase 2 transforms raw scrape data into structured brand intelligence. Your Brand Research Gem has custom instructions that tell it how to organize findings into categories the Brief team can act on.

• Open the raw findings file at research/phase1-raw.md and copy its full contents.
• Switch to the Gemini app in your browser where your Brand Research Gem is already set up.
• Start a new conversation with the Gem.
• Paste the raw findings and add this instruction above them:

Synthesize the following raw brand research into a structured intelligence brief. Organize into these sections:
1. Visual Identity Patterns (logos, colour palettes, typography)
2. Positioning Language Themes
3. Differentiation Opportunities (gaps we can exploit)
4. Risk Zones (overused patterns to avoid)

Assign a confidence score from 1-10 for each section based on data quality and coverage.

RAW FINDINGS:
[paste your phase1-raw.md contents here]

• Select the Pro model for generation. If you see a default model, click the three-dot menu and select Redo with Pro after generation completes.

Why use Pro for synthesis?

Nano Banana Pro (Gemini 3 Pro Image) provides advanced reasoning with its Thinking mode enabled by default. For text synthesis tasks, it produces more structured and thorough analysis than the standard model. Your Google AI Pro subscription includes unlimited use through the app interface.

• Once Gemini returns the structured synthesis, copy the full response.
• Save it to research/phase2-synthesis.md in your workspace. You can do this by creating the file in your editor or running:

# Paste the Gemini synthesis into this file
nano ~/agentic-studio/research/phase2-synthesis.md

• Save and close the file.
• Confirm the file exists by running:

ls ~/agentic-studio/research/

You should see both phase1-raw.md and phase2-synthesis.md listed.

Gemini not giving structured output?

Make sure you started the conversation inside your Brand Research Gem, not a generic Gemini chat. The Gem's custom instructions guide the synthesis format.

If the output is too short, paste only the research data (no extra commentary) and re-run with the prompt above.

Help me get better structured output from my Gemini Gem

Evaluate the confidence gate

The confidence gate is where the engine decides if research quality is high enough to move forward. If the average section confidence score from Phase 2 meets the threshold defined in your orchestrator, the pipeline advances. If not, you trigger a focused second Firecrawl pass to fill gaps.

• Open research/phase2-synthesis.md and review the confidence scores Gemini assigned to each section.
• Calculate the average score across all four sections.
• Create the confidence gate file by running:

nano ~/agentic-studio/research/confidence-gate.md

• Record your gate decision using this structure:

# Confidence Gate - Research Phase

## Section Scores
- Visual Identity Patterns: [score]/10
- Positioning Language Themes: [score]/10
- Differentiation Opportunities: [score]/10
- Risk Zones: [score]/10

## Average Score: [average]/10

## Gate Decision
- Threshold: 7/10
- Result: PASS / FAIL
- Action: [Advance to Brief team / Trigger second Firecrawl pass]

## Notes
[Any gaps identified or areas needing deeper research]

What if the gate fails?

If your average score is below 7, return to the agent view and dispatch a second, more targeted Firecrawl agent. Focus the prompt on the weakest section (the one with the lowest score). Append the new findings to phase1-raw.md and re-run the Gemini synthesis.

The engine caps this at one retry to stay within Firecrawl's 5 daily runs. If the gate still fails after the retry, proceed with a note in the brief flagging the weak area.

• Once the gate passes (or you have documented the exception), create the final research brief by running:

nano ~/agentic-studio/research/research-brief.md

• Combine your key findings from the synthesis into a brief that the Brief team agents can consume. Include the confidence gate result at the top, followed by the actionable intelligence from each section.
• Save and close the file.
• Confirm all four research files are in place:

ls ~/agentic-studio/research/

You should see phase1-raw.md, phase2-synthesis.md, confidence-gate.md, and research-brief.md listed.

Missing a file?

Double-check you saved each file after editing. If phase1-raw.md is missing, your agent session may not have completed. Return to agent view with claude agents and check the session status.

Help me find my missing research files

Your research pipeline has produced a gated, quality-checked brief. Next up, you will feed this brief into the Brief team agents who translate research intelligence into a creative design brief.

Generate the Creative Brief and Concepts

Your research phase delivered a gated brief packed with brand intelligence. Now the engine needs to transform that raw intelligence into creative direction.

In this step, you will dispatch the Brief team agents to distill the research into a structured creative brief. Then you will run the Concept team to diverge into three distinct identity directions, each with a component isolation plan that prevents identity drift during generation.

In this step, get ready to:

• Dispatch Brief team agents to produce a structured creative brief from the research.
• Generate three distinct concept directions with component isolation plans.
• Evaluate the CONCEPT_GATE approval and record the selected direction.

Dispatch the Brief team agents

The Brief team's job is to read research/research-brief.md and distill it into a structured creative brief. The brief defines the brand name, tone of voice, color palette direction, typography direction, and identity system requirements that every downstream team will follow.

• Switch back to your Claude Code terminal in the ~/agentic-studio directory.
• Open agent view by running this command:

claude agents

• In the agent view input at the bottom, type the following prompt and press Enter to dispatch a new background session:

You are the Brief Director agent. Read research/research-brief.md carefully.

Produce a structured creative brief and save it to brief/creative-brief.md with these sections:
- Brand Name (proposed name and 2 alternatives)
- Tone of Voice (3-5 adjectives with rationale)
- Color Palette Direction (primary, secondary, accent with hex suggestions and reasoning)
- Typography Direction (heading and body font pairing recommendations with rationale)
- Identity System Requirements (logo usage rules, minimum sizes, clear space, do/don't list)

Ground every decision in evidence from the research brief. Cite specific findings.

What does this prompt do?

This dispatches a single background session in agent view. The session reads your research file and writes a complete creative brief. Each prompt you type in agent view starts its own independent session, so you can continue working while it runs.

The structured sections ensure the brief is machine-readable by downstream agents. Every concept direction will reference these constraints.

• Watch the session row appear in agent view. Its state shows working while it processes.
• Press Space on the session row to peek at its progress.
• Wait until the row state changes to done.

• Verify the output exists by pressing Enter on the session row to attach, then confirm it wrote brief/creative-brief.md.
• Press ← to return to the agent view list.

Session stuck on working?

If the session shows a permission prompt, peek with Space and approve the file-write permission. Claude Code needs permission to create files in the brief/ directory.

If the session failed, check that research/research-brief.md exists from the previous step. Help me debug why my Brief team agent cannot find the research brief.

Generate three concept directions

With the creative brief locked in, the Concept team diverges into three distinct identity directions. Each direction includes a component isolation plan that treats the icon, wordmark, and background as separate generation targets.

Why component isolation?

AI image generators return one flattened image. If you re-prompt to fix the icon, the entire composition re-rolls and the wordmark changes too. Generating icon, wordmark, and background separately eliminates identity drift during refinement.

Each concept direction's isolation plan tells the generation team exactly which elements to produce independently and how they composite together in the final mark.

• In agent view, type the following prompt and press Enter to dispatch Concept Agent A:

You are Concept Agent A. Read brief/creative-brief.md.

Generate a bold, high-contrast concept direction and save it to concept/concept-A.md with:
- Direction Name and one-sentence thesis
- Rationale (why this direction fits the brand)
- Moodboard References (3-5 existing brands or visual references with URLs where possible)
- Color Application (how the palette from the brief maps to this direction)
- Component Isolation Plan:
  - Icon: description, style, generation prompt guidance
  - Wordmark: typeface treatment, weight, spacing
  - Background: texture/pattern/solid, how it supports the mark
- Compositing Notes (how icon + wordmark + background layer together)

Be distinctive from directions B and C. Push toward maximum visual impact.

• Immediately type the next prompt and press Enter to dispatch Concept Agent B in parallel:

You are Concept Agent B. Read brief/creative-brief.md.

Generate a minimal, refined concept direction and save it to concept/concept-B.md with:
- Direction Name and one-sentence thesis
- Rationale (why this direction fits the brand)
- Moodboard References (3-5 existing brands or visual references with URLs where possible)
- Color Application (how the palette from the brief maps to this direction)
- Component Isolation Plan:
  - Icon: description, style, generation prompt guidance
  - Wordmark: typeface treatment, weight, spacing
  - Background: texture/pattern/solid, how it supports the mark
- Compositing Notes (how icon + wordmark + background layer together)

Be distinctive from directions A and C. Push toward restraint and elegance.

• Type one more prompt and press Enter to dispatch Concept Agent C:

You are Concept Agent C. Read brief/creative-brief.md.

Generate an expressive, playful concept direction and save it to concept/concept-C.md with:
- Direction Name and one-sentence thesis
- Rationale (why this direction fits the brand)
- Moodboard References (3-5 existing brands or visual references with URLs where possible)
- Color Application (how the palette from the brief maps to this direction)
- Component Isolation Plan:
  - Icon: description, style, generation prompt guidance
  - Wordmark: typeface treatment, weight, spacing
  - Background: texture/pattern/solid, how it supports the mark
- Compositing Notes (how icon + wordmark + background layer together)

Be distinctive from directions A and B. Push toward warmth and personality.

What is happening here?

You dispatched three sessions in rapid succession. Each one starts its own background process and appears as a separate row in agent view. They run concurrently because agent view moves each dispatched session into its own worktree automatically.

Each agent reads the same creative brief but diverges in a different aesthetic direction. The component isolation plan in each concept ensures the generation team knows exactly how to produce each element independently.

• Monitor all three rows in agent view. Wait until each one shows done.
• Peek at each session with Space to confirm all three concept files were created.

• Confirm the files exist by attaching to any completed session and running:

ls concept/

You should see concept-A.md, concept-B.md, and concept-C.md listed.

One concept agent failed or produced an empty file?

Attach to the failed session row by pressing Enter on it. Check whether it could not find brief/creative-brief.md. The Brief team session must have completed successfully before concept agents can read its output.

If the brief exists but a concept agent still failed, re-dispatch that single agent from agent view with the same prompt. Help me re-run a failed concept agent session.

Evaluate the CONCEPT_GATE and select a direction

The engine uses named approval gates to force a human decision before work continues downstream. The CONCEPT_GATE is an operator-in-the-loop checkpoint where you review all three concept directions and select the one that best serves the brand.

• Open each concept file to review the three directions. In agent view, dispatch a session with this prompt:

Read concept/concept-A.md, concept/concept-B.md, and concept/concept-C.md.

Present a side-by-side comparison table with columns: Direction Name, Thesis, Key Differentiator, Risk.

Then ask me which direction to select for the CONCEPT_GATE.

• Wait for the session to present the comparison table. It will show blocked state when it needs your input.
• Press Space to peek at the comparison, or press Enter to attach and interact.
• Type your selection (A, B, or C) and press Enter to confirm.
• After you confirm, instruct the session to save the decision by typing:

Save the CONCEPT_GATE decision to concept/selected-concept.md. Include:
- Gate name: CONCEPT_GATE
- Selected direction: [the letter and name I chose]
- Approval rationale: [summarize why this direction won based on our discussion]
- Timestamp
- Status: APPROVED

Why is this gate operator-driven?

The engine deliberately keeps concept selection as a human decision. Automated scoring could pick the safest option every time. Brand identity needs a creative judgment call that weighs risk appetite, market positioning, and gut instinct. The operator-in-the-loop is a design choice, not a limitation.

• Confirm the gate file was written by running:

cat concept/selected-concept.md

You should see the CONCEPT_GATE decision with your selected direction and approval rationale.

Session did not save the file?

If permission was denied, approve the file-write when prompted. You can also create the file manually by attaching to any session and asking it to write the gate decision based on your choice. Help me save my CONCEPT_GATE decision.

Your creative brief and selected concept direction are locked in. Next up, you will take the winning concept's component isolation plan and begin generating the actual visual assets across multiple AI image models.

Generate Identity Assets with Multi-Model Image Gen

Your selected concept defines the visual direction. Now you need to turn that concept into actual image assets.

The critical insight here is component isolation. AI image generators return a single flattened image. If you prompt for a full logo (icon plus text plus background), then try to fix one element, the generator re-rolls the entire composition. Generating each component separately and compositing later eliminates identity drift during refinement.

In this step, get ready to:

• Generate the icon and background as isolated components using ChatGPT Pro image generation.
• Generate the wordmark as an isolated component using Gemini Pro (Nano Banana Pro).
• Run the scoring loop with Review team agents and accept or regenerate assets up to a 3-round hard cap.

Generate the icon and background in ChatGPT Pro

ChatGPT Pro's subscription-bundled image generation runs on a flat rate. You are not calling a metered API. The Graphic Studio Engine project you created earlier holds the studio instructions and context files, so every generation stays aligned with your creative brief.

Why component isolation instead of a full-logo prompt?

When you ask an image generator for a complete logo, every element is baked into one raster. Tweaking the icon means the text changes too. Generating icon, wordmark, and background separately lets you refine each in isolation, then composite them in a real editor later.

This is how professional identity studios work. The AI just handles concept exploration. The assembly stays in your control.

First, have Claude Code prepare the generation briefs from your selected concept. The briefs translate your concept direction into model-specific prompts.

• Return to your Claude Code session and ask it to draft generation briefs by running:

claude --bg "Read concept/selected-concept.md and brief/creative-brief.md. Write two generation briefs: (1) generation/icon-brief.md for the icon component - describe the symbol, style, color, and mood in vivid detail suitable for an image generator. (2) generation/background-brief.md for the background/texture component - describe the pattern, gradient, or texture that complements the icon. Keep each brief under 200 words. Do NOT include text/wordmark in either brief."

What does this command do?

• claude --bg starts a background session that runs without blocking your terminal.
• The session reads your approved concept and creative brief, then distills them into focused image generation prompts.
• Each brief targets one component only, enforcing isolation.

• Monitor the session status by running:

claude agents --json

• Wait until the session state shows done. Then confirm the briefs exist by running:

ls generation/

You should see icon-brief.md and background-brief.md listed.

Now switch to your ChatGPT Pro browser tab to generate the icon.

• Open your Graphic Studio Engine project from the left-hand menu in ChatGPT.
• Open generation/icon-brief.md in your file explorer and copy its full contents.
• Start a new chat inside the project and paste the icon brief as your prompt.
• ChatGPT will generate an image. Review it against your creative brief direction.
• Right-click the generated image and select Save image as.
• Save it to ~/agentic-studio/generation/icon-v1.png.

Flat-rate generation

Your ChatGPT Pro subscription includes unlimited image generation. You are not calling a metered API, so regenerate freely if the first output misses the mark. The scoring loop later will formalize whether the asset passes.

Now generate the background texture in the same project.

• Open generation/background-brief.md and copy its full contents.
• Start another new chat inside the Graphic Studio Engine project and paste the background brief.
• Save the generated image to ~/agentic-studio/generation/background-v1.png.

• Confirm both assets are saved by running in your terminal:

ls generation/*.png

You should see icon-v1.png and background-v1.png listed.

Images not saving to the right folder?

Make sure you navigate to ~/agentic-studio/generation/ in your file browser's save dialog. If your browser defaults to Downloads, move the files manually after saving.

help me move my downloaded images to the generation folder

Generate the wordmark in Gemini Pro

The wordmark is the text-based component of your identity. Gemini Pro (Nano Banana Pro) handles typographic generation well because its thinking mode reasons through letterform composition before rendering.

• Have Claude Code prepare a wordmark-specific brief by running:

claude --bg "Read concept/selected-concept.md and brief/creative-brief.md. Write generation/wordmark-brief.md - a generation brief for the wordmark (text logo) component. Include the exact brand name text, the typographic style direction, weight, color on transparent or specified background. Under 150 words. Do NOT include the icon or background elements."

• Wait for the session to complete. Check with claude agents --json until the state shows done.
• Open generation/wordmark-brief.md and copy its full contents.

Now switch to your Gemini Pro browser tab.

• Open your studio Gem from the left sidebar in the Gemini app.
• Paste the wordmark brief into the chat input.
• After generation, click the three-dot menu on the image output and select Redo with Pro to regenerate using Nano Banana Pro for higher quality.
• Save the Pro-quality output to ~/agentic-studio/generation/wordmark-v1.png.

Why Redo with Pro?

Google AI Pro subscribers access Nano Banana Pro (Gemini 3 Pro Image) through the Redo with Pro option in the Gemini app. This uses your subscription's flat-rate allocation, not the metered API which charges per image.

Nano Banana Pro's thinking mode is enabled by default. It reasons through the composition before rendering, which produces cleaner letterforms.

• Confirm all three components exist by running:

ls generation/

You should see icon-v1.png, wordmark-v1.png, and background-v1.png alongside the brief files.

Gemini not generating images?

Make sure you selected the Pro model in the Gemini app header, or use Redo with Pro after initial generation. Image generation requires the Pro model tier on your Google AI Pro subscription.

help me troubleshoot Gemini image generation

Run the scoring loop and accept assets

The Review team agents score each generated asset against your creative brief criteria. Assets that meet the threshold advance to refinement. Failing assets get regenerated, up to a hard cap of 3 rounds. This prevents infinite loops while ensuring quality.

• Dispatch the scoring loop as a background session by running:

claude --bg "You are the Review Team lead. Read orchestrator.md for scoring criteria and thresholds. For each file in generation/ that ends in -v1.png, score it against brief/creative-brief.md on these dimensions: (1) brand alignment 1-10, (2) visual clarity 1-10, (3) component isolation quality 1-10, (4) production readiness 1-10. Write all scores and reasoning to review/scores-v1.md. For any asset scoring below 6 average, note it as NEEDS_REGEN. Hard cap: 3 regeneration rounds maximum. Then write review/accepted-assets.md listing assets that passed (average >= 6) and their final scores."

What does the scoring loop do?

• The Review agent reads each generated PNG alongside the creative brief.
• It scores four dimensions: brand alignment, visual clarity, component isolation quality, and production readiness.
• Assets averaging 6 or above pass. Anything below gets flagged for regeneration.
• The hard cap of 3 rounds prevents runaway loops. If an asset still fails after 3 attempts, it moves forward with a note for manual intervention.

• Monitor the scoring session with:

claude agents --json

• Once the session state shows done, review the scores by running:

cat review/scores-v1.md

You should see a structured scoring table with each asset's dimension scores and an overall average.

• Check which assets were accepted by running:

cat review/accepted-assets.md

You should see a list of accepted assets with their final scores and approval status.

What if an asset was flagged NEEDS_REGEN?

If the scoring loop flagged any asset, you regenerate it manually (icon or background in ChatGPT Pro, wordmark in Gemini Pro) and re-run the scoring session. The hard cap of 3 rounds means you repeat this at most 3 times total. After 3 rounds, any remaining failures advance with a manual-intervention note.

For this project, if all three assets passed on the first round, you can move forward immediately.

Scoring session stuck or failed?

Make sure orchestrator.md exists in your workspace root. The Review agent reads it for threshold definitions. Also confirm that the PNG files are saved in the generation/ folder with the exact names icon-v1.png, wordmark-v1.png, and background-v1.png.

help me debug my scoring loop session

Your identity assets are generated and scored. Next, you will composite and refine these isolated components into a cohesive identity system using layered editing.

Refine and Composite in Figma and Canva

Your scored assets passed the review gate, but they are still raw AI output. AI image generators produce flat raster files. If you tried to fix one element by re-prompting, the entire composition would re-roll and you would lose what already works.

The refinement phase uses layered editing instead. You will clean up each component in a dedicated editor, then composite them together in a design tool. This preserves every element you approved while giving you pixel-level control over the final result.

In this step, get ready to:

• Clean up the icon and wordmark in Photopea and Inkscape.
• Build a component library in Figma with frames for each asset.
• Composite the full brand lockup in Canva and pass the refinement gate.

Clean up assets in Photopea and Inkscape

Each accepted asset needs targeted cleanup before compositing. The icon needs pixel-level refinement. The wordmark needs conversion to a clean vector so it scales without loss.

• Create the refinement output folder by running this command in Claude Code:

mkdir ~/agentic-studio/refinement

Why layered editing instead of re-prompting?

Re-prompting an AI image generator re-rolls the entire image. Even a small tweak to the icon shape could change the colour palette, line weight, and proportions in unpredictable ways.

Layered editing means you fix one specific issue (a stray pixel, a rough edge) without touching anything else. The component isolation strategy from the generation phase makes this possible because each element lives in its own file.

Start with the icon cleanup in Photopea.

• Switch to your browser tab where Photopea is bookmarked and open it.
• Click File, then Open.
• Navigate to ~/agentic-studio/generation/ and select icon-v1.png.
• Zoom in to inspect edges, stray pixels, and artefacts left by the AI generator.
• Use the Eraser tool or Clone Stamp tool to clean up jagged edges and remove noise around the icon silhouette.
• If needed, use Select then Remove BG to isolate the icon on a transparent background.
• Click File, then Export As, then PNG.
• Save the exported file as icon-refined.png in ~/agentic-studio/refinement/.

What does this cleanup achieve?

AI-generated icons often have semi-transparent fringe pixels and uneven edges that look fine at preview size but break down at production resolution. Cleaning them now prevents issues when the icon is printed or scaled for app icons.

Now convert the wordmark to a clean vector in Inkscape.

• Open Inkscape from your taskbar or application launcher.
• Click File, then Import.
• Select ~/agentic-studio/generation/wordmark-v1.png and click Open.
• Click on the imported image to select it.
• Open the tracing dialog by clicking Path, then Trace Bitmap (or press Shift+Alt+B).
• Try the Brightness Threshold filter first. Adjust the threshold slider until the preview matches the original letterforms cleanly.
• Click OK to generate the traced vector paths.
• Select the traced path and simplify it by clicking Path, then Simplify (or press Ctrl+L). This reduces the node count for cleaner curves.
• Delete the original bitmap image from the canvas (select it and press Delete).
• Use the Node tool (F2) to adjust any rough nodes on the letterforms.
• Click File, then Save As.
• Save the file as wordmark-refined.svg in ~/agentic-studio/refinement/.

Why trace to vector?

AI generators output raster images (grids of pixels). A wordmark needs to scale from a favicon at 16px to a billboard at 5000px without losing quality. Vector formats like SVG use mathematical curves instead of pixels, so they scale infinitely.

• Confirm both refined assets exist by running:

ls ~/agentic-studio/refinement/

You should see icon-refined.png and wordmark-refined.svg in the output.

Don't see both files?

Make sure you saved both files into the ~/agentic-studio/refinement/ folder specifically, not the generation/ folder or your Downloads. Check the file names match exactly (lowercase, hyphens, correct extensions).

Help me find where my exported files were saved.

Build the component library in Figma

A component library organizes your brand assets into reusable, structured frames. Figma gives you a free design file where each asset lives in its own frame with consistent naming.

• Switch to your browser tab where Figma is signed in.
• Click the + button or New design file to create a new file.
• Rename the file to Brand Identity System by double-clicking the default title at the top.
• Select the Frame tool (press F) and draw a frame on the canvas. Name it Icon in the right panel.
• Draw a second frame and name it Wordmark.
• Draw a third frame and name it Background.
• Drag icon-refined.png from your ~/agentic-studio/refinement/ folder into the Icon frame.
• Drag wordmark-refined.svg into the Wordmark frame.
• Drag background-v1.png from ~/agentic-studio/generation/ into the Background frame.
• Select the contents of each frame and right-click to choose Create component. This registers them in Figma's local component library.

What is a Figma component library?

Components in Figma are reusable design elements. Once an asset is registered as a component, any design that references it automatically updates when you change the source. This is how production design systems maintain consistency across dozens of files.

You should now see three named frames on your Brand Identity System canvas, each containing its respective asset with the component diamond icon in the layers panel.

Assets not appearing in the frame?

Make sure you are dragging the file directly into the target frame, not onto the bare canvas. If an asset lands outside a frame, select it and cut (Ctrl+X), click inside the target frame, and paste (Ctrl+V).

Help me organize assets into Figma frames.

Composite the lockup in Canva and pass the refinement gate

The brand lockup combines your icon, wordmark, and background into a single composition. Canva provides a fast drag-and-drop canvas for assembling the composite without needing advanced design skills.

• Switch to your browser tab where Canva is signed in.
• Click Create a design and choose Custom size. Set the width to 1920 px and height to 1080 px.
• Click Uploads in the left sidebar.
• Upload background-v1.png from ~/agentic-studio/generation/.
• Upload icon-refined.png and wordmark-refined.svg from ~/agentic-studio/refinement/.
• Drag background-v1.png onto the canvas and resize it to fill the entire frame.
• Drag icon-refined.png onto the canvas and position it on the left or centred.
• Drag wordmark-refined.svg onto the canvas and position it beside or below the icon.
• Adjust spacing and alignment until the lockup looks balanced.
• Click Share, then Download.
• Set the file type to PNG and click Download.
• Save the downloaded file as lockup-composite.png in ~/agentic-studio/refinement/.

What is a brand lockup?

A lockup is the official arrangement of a brand's icon and wordmark together. It defines the spatial relationship, proportions, and clear space rules that every future use of the logo must follow. Think of it as the reference blueprint for how the mark appears in the wild.

Now evaluate the refinement gate. The REFINEMENT_GATE checks whether the refined and composited assets meet quality standards before they move to production packaging.

• Return to Claude Code and ask it to evaluate the refinement gate by comparing the lockup composite and individual refined assets against the creative brief criteria.
• Review the gate evaluation output. Confirm the assets pass or iterate on specific feedback.
• Record the gate decision by creating the gate file:

cat > ~/agentic-studio/refinement/refinement-gate.md << 'EOF'
# REFINEMENT_GATE

## Status: PASSED

## Evaluated Assets
- refinement/icon-refined.png
- refinement/wordmark-refined.svg
- refinement/lockup-composite.png

## Gate Criteria
- Icon: clean edges, no fringe pixels, transparent background
- Wordmark: clean vector curves, correct letterforms, scalable SVG
- Lockup: balanced composition, proper hierarchy, readable at small sizes

## Decision
All assets meet refinement quality threshold. Approved for production packaging.
EOF

What is a named approval gate?

Named gates (like REFINEMENT_GATE) are explicit checkpoints in the agentic workflow where the operator confirms quality before work advances to the next phase. They create an audit trail and prevent unreviewed assets from reaching production.

• Verify all refinement outputs exist by running:

ls ~/agentic-studio/refinement/

You should see four files: icon-refined.png, wordmark-refined.svg, lockup-composite.png, and refinement-gate.md.

Gate status shows FAILED?

If Claude Code's evaluation flagged specific issues (rough edges on the icon, broken curves in the SVG, or composition imbalance in the lockup), go back to the relevant editor and address the feedback. Then re-export and re-run the gate evaluation.

Help me understand what failed in my refinement gate.

Your identity system is refined, organized, and composited. Next up, you will package everything into production-ready deliverables with full IP documentation.

Package the Production Identity Deliverables

Your refined assets passed the REFINEMENT_GATE. The icon is pixel-clean, the wordmark is a vector, and the lockup is composited.

A professional identity package needs more than pretty pictures. Clients expect print-ready exports, brand guidelines documenting exact color values and usage rules, and a clear provenance trail showing which AI models created which assets. In this step, the production team agents assemble the full delivery package.

In this step, get ready to:

• Export production-ready files (300 DPI PNGs and clean SVGs) into the delivery directory.
• Generate documentation (brand guidelines, print specs, and IP provenance disclosure).
• Run the delivery checklist agent and evaluate the DELIVERY_GATE.

Export production files to the delivery directory

Print vendors require specific formats. Print-on-demand (POD) services need 300 DPI raster files. Screen printers need clean vector SVGs with no embedded rasters.

• Create the delivery directory and dispatch the export agents by giving Claude Code this prompt:

claude "Create the directory ~/agentic-studio/delivery/ then export production files from the refined assets:

1. icon-final.png: Copy refinement/icon-refined.png to delivery/icon-final.png. Ensure it is 300 DPI and CMYK-ready for POD print production. Use ImageMagick or similar to set DPI metadata to 300.

2. icon-final.svg: Trace the refined icon bitmap to vector. Import refinement/icon-refined.png into Inkscape, use Path > Trace Bitmap, then export as plain SVG:
   inkscape --export-plain-svg --export-filename=delivery/icon-final.svg traced-icon.svg
   This is for screen print production.

3. wordmark-final.svg: Copy refinement/wordmark-refined.svg to delivery/wordmark-final.svg as plain SVG (already vector):
   inkscape --export-plain-svg --export-filename=delivery/wordmark-final.svg refinement/wordmark-refined.svg

4. lockup-final.png: Copy refinement/lockup-composite.png to delivery/lockup-final.png at 300 DPI.

5. lockup-final.svg: Create a vector version of the lockup by compositing the vector icon and wordmark into a single plain SVG:
   inkscape --export-plain-svg --export-filename=delivery/lockup-final.svg lockup-composed.svg

All PNG finals must be 300 DPI. All SVG finals must use --export-plain-svg to strip Inkscape namespaces."

What do these export specs mean?

300 DPI is the minimum resolution print vendors accept for sharp reproduction. POD services (like Printful or Gooten) need high-resolution raster files in CMYK color space.

Screen printers need vector files because they output to physical screens at fixed mesh counts. A raster image would lose detail at large scale. The --export-plain-svg flag strips Inkscape-specific XML namespaces so the SVG is portable across tools.

• Wait for the agent to finish, then confirm the files exist by running:

ls ~/agentic-studio/delivery/

You should see icon-final.png, icon-final.svg, wordmark-final.svg, lockup-final.png, and lockup-final.svg listed.

Missing files in the delivery directory?

Check that Inkscape is installed and accessible from the terminal. The agent calls inkscape directly for SVG exports.

If the agent could not trace the icon PNG to SVG, open Inkscape manually, import refinement/icon-refined.png, use Path > Trace Bitmap, then save as plain SVG to delivery/icon-final.svg.

Why can't the agent trace my icon from the CLI?

Generate the documentation suite

The documentation agents write three markdown files that travel with the asset files. These protect the client legally and give downstream designers everything they need to use the identity correctly.

• Dispatch the documentation agents by giving Claude Code this prompt:

claude "You are the Documentation Team lead. Write three markdown files in ~/agentic-studio/delivery/:

1. brand-guidelines.md - Include:
   - Primary color hex values, CMYK equivalents, and nearest Pantone matches
   - Typography specs (font family, weights, sizes)
   - Clear-space rules (minimum padding around the mark)
   - Usage dos and don'ts (minimum size, prohibited distortions, background contrast rules)

2. print-specs.md - Include:
   - POD specifications (300 DPI, CMYK color mode, bleed requirements, file format)
   - Screen print specifications (vector-only, spot color separations, mesh count guidance, minimum stroke width)

3. ip-provenance.md - Include:
   - IP assignment statement (all generated assets are assigned to the commissioning party)
   - AI provenance disclosure listing which models generated which assets:
     * ChatGPT Pro image generation: icon and background
     * Gemini Pro (Nano Banana Pro): wordmark
   - Note that Gemini outputs carry invisible SynthID watermarks
   - Disclosure that no metered API was used (all generation via subscription UI)"

Why does IP provenance matter?

AI-generated imagery sits in a grey area for copyright in most jurisdictions. A provenance disclosure protects both the studio and the client by documenting exactly how each asset was made.

The SynthID watermark note is important because Google embeds invisible watermarks in all Nano Banana outputs. Downstream forensic tools can detect these. Disclosing this upfront prevents surprises later.

• Wait for the agent to complete, then verify the documentation files exist by running:

ls ~/agentic-studio/delivery/*.md

You should see brand-guidelines.md, print-specs.md, and ip-provenance.md in the output.

Documentation files are empty or missing sections?

If the agent produced incomplete files, re-run the prompt with a smaller scope. Ask for one file at a time. The color values should reference whatever palette your earlier generation briefs specified.

Help me fix incomplete brand documentation

Run the delivery checklist and evaluate DELIVERY_GATE

The final delivery agent audits every file against the production spec, writes a manifest, and evaluates whether the package meets the DELIVERY_GATE threshold.

• Dispatch the delivery checklist agent by giving Claude Code this prompt:

claude "You are the Delivery QA agent. Perform these tasks in ~/agentic-studio/delivery/:

1. Create delivery-manifest.md listing every file in the delivery/ directory with:
   - File name
   - Format (PNG/SVG/MD)
   - Purpose (icon, wordmark, lockup, documentation)
   - Specs (DPI for PNGs, plain-SVG confirmation for vectors)

2. Verify completeness:
   - icon-final.png (300 DPI, CMYK-ready)
   - icon-final.svg (plain SVG, vector)
   - wordmark-final.svg (plain SVG, vector)
   - lockup-final.png (300 DPI)
   - lockup-final.svg (plain SVG, vector)
   - brand-guidelines.md (has color, typography, clear-space, usage sections)
   - print-specs.md (has POD and screen print sections)
   - ip-provenance.md (has IP assignment and AI provenance disclosure)

3. Evaluate DELIVERY_GATE:
   - PASS if all 8 files exist and contain required sections
   - FAIL if any file is missing or incomplete
   Write the decision to delivery-gate.md with a clear PASS/FAIL verdict and rationale for each file."

What is a named approval gate?

Named approval gates (like REFINEMENT_GATE and DELIVERY_GATE) are checkpoints in the orchestrator where work cannot proceed until quality criteria are met. Each gate has a clear pass/fail condition and a written rationale.

This pattern prevents the agentic system from shipping incomplete work. If the gate fails, the operator reviews the rationale and dispatches a fix before re-evaluating.

• Wait for the agent to finish, then check the gate result by running:

cat ~/agentic-studio/delivery/delivery-gate.md

You should see a PASS verdict with a line-by-line rationale confirming each of the 8 deliverables is present and complete.

DELIVERY_GATE returned FAIL?

Read the rationale in delivery-gate.md to see which file failed. The most common cause is a missing section in one of the markdown documentation files.

Fix the specific file the gate flagged, then re-run only the gate evaluation prompt (step 3 from the checklist prompt above).

Help me pass the DELIVERY_GATE

✔️ Awesome, I've got everything!

Great. Double check that delivery-gate.md shows PASS and you are ready for the final wrap-up.

ⓧ I'd like to double check the full delivery

Your delivery/ directory should contain exactly these files:

~/agentic-studio/delivery/
├── brand-guidelines.md
├── delivery-gate.md
├── delivery-manifest.md
├── icon-final.png
├── icon-final.svg
├── ip-provenance.md
├── lockup-final.png
├── lockup-final.svg
├── print-specs.md
└── wordmark-final.svg

If any file is missing, re-dispatch the relevant agent from the substep that creates it.

Your production identity package is complete and gate-approved. The delivery manifest documents every asset, the brand guidelines give downstream designers clear rules, and the IP provenance disclosure protects both studio and client.

Secret mission

Wire Up the Antigravity Manager Cockpit

Your engine ran beautifully from the Claude Code terminal. But what if you could see every agent invocation, every gate decision, and every scoring loop iteration on a single dashboard? In this optional extension, you will connect Google's Antigravity managed agents platform as an orchestration cockpit and export a structured run log that proves exactly how your 8-team engine performed.

Clean Up Your Resources

Clean Up Your Resources

This project runs entirely on flat-rate subscriptions you already pay for, so there are no incremental ongoing costs. Decide whether to keep your resources in place, pause them to come back later, or delete them entirely.

Resources you used:

• Local project directory (~/agentic-studio/).
• ChatGPT Project (studio workspace with instructions and uploaded reference files).
• Gemini Gem (studio Gem with custom instructions).
• Figma file (Brand Identity System with component library).
• Firecrawl MCP server configured in Claude Code.
• Antigravity agent registrations (if you connected the optional cockpit).

Keep everything running

No action needed. Choose this if you plan to reuse the engine for future client briefs or want to refine your agent orchestration.

• Your ChatGPT Project, Gemini Gem, and Figma file remain available as reusable studio assets.
• The Firecrawl MCP server stays configured in Claude Code for future research tasks.
• Your local ~/agentic-studio/ directory contains all delivery files and the orchestrator prompt for reference.

Pause - I'll come back to this later

Free up local resources while keeping your cloud-based studio configuration intact for later.

• Close any open Claude Code sessions running background agents.
• Close the Antigravity dashboard tab if you have it open.
• Your ChatGPT Project, Gemini Gem, and Figma file persist on their respective platforms at no extra cost.

Delete - I don't want to use this again

Remove all project resources completely. Follow each step below.

• Delete the local project directory. On macOS/Linux, run:
• On Windows PowerShell, run:
• Remove the Firecrawl MCP server from Claude Code by running:
• Archive your ChatGPT Project. In ChatGPT on desktop, open the project dropdown, select your studio project, then archive it. OpenAI does not currently offer a permanent delete option for Projects.
• Delete your Gemini Gem. Go to gemini.google.com, click Open Sidebar, then Gems. Under My Gems, find your studio Gem, click Options, then Delete.
• Delete your Figma file. In the Figma file browser, right-click the Brand Identity System file and select Move to trash. To permanently remove it, open Trash in the sidebar, right-click the file, and select Permanently delete.
• If you connected Antigravity, open the Antigravity dashboard, navigate to your registered agents, and delete each agent registration.

Well Done!

Well Done!

You just built a full agentic graphic studio engine that orchestrates ~28 AI agents across 8 teams to produce a production-ready brand identity package.

What you learned:

• Orchestrated ~28 AI agents across 8 teams using Claude Code and Claude Cowork, with confidence gates, scoring loops, and named approval gates controlling handoffs between phases.
• Generated brand identity components (icon, wordmark, background) in isolation using multi-model image generation across ChatGPT Pro and Gemini Pro on flat-rate subscriptions, then composited them in vector editors to eliminate identity drift.
• Delivered a complete production identity package with 300 DPI print-ready assets, vector lockups, brand guidelines, print specs, and an IP provenance disclosure covering SynthID watermarks.
• Secret Mission: Connected an Antigravity manager cockpit to monitor all 8 agent teams, visualize gate statuses, and export a run log of agent invocations and Firecrawl credit usage.

Ready to quiz yourself?