The Synthetic Director.
AGI-CORE-Pro V1.0. A desktop production OS.

Six numbers. Every one of them traceable.

The forensic audit dated May 15, 2026 anchors every claim on this page to a file path or line number in the live AGI-CORE-V9.1 codebase. These six headline numbers are the entry points. The remainder of the page walks down to the source.

Six production dependencies only: @google/genai, dexie, framer-motion, lucide-react, react, react-dom. Zero backend runtime. Zero auth libraries. Zero state management libraries. Pure client-side architecture with IndexedDB persistence via Dexie 4.3.0 — not PostgreSQL.

Ten human agency roles. One desktop application.

Where Sovereign Orchestrator Pro (Case Study 01) replaces 11 marketing roles autonomously, The Synthetic Director consolidates 10 traditional creative production roles into a single operator-driven workstation. Each role below is mapped to a verified service file or component in the live codebase. Together they represent what a 3-to-5 person creative team would deliver inside a digital agency.

What this case study proves — and what it does not.

The Vibe Academy standard requires every case study to surface its evidence gaps honestly. The Synthetic Director's gap profile is different from Sovereign Orchestrator Pro's (Case Study 01) — there is no R-03-equivalent zero-revenue window because this is operator-driven, not autonomous. But there are still gaps a fair reading must surface.

Why this disclosure leads the case study

Most builder-published case studies hide their projection-vs-history distinction or omit it entirely. This page treats it as the first thing a reader should know. The system has real technical scale, real per-unit cost discipline, and defensible build-cost methodology. It does not yet have a 12-month measured spend ledger or a contractor build quote to compare against. Both facts coexist. A solo builder studying this should understand that "calculated from verified inputs" and "measured over a real window" are two different bars, and that documenting which is which is part of audit-grade engineering.

The rest of this page presents the verified architecture, mode roster, model registry, prompt engine, cost discipline, external integrations, build-cost methodology, and risk factors. Each section cites either a file path with line number or a verified count from the May 15 audit. Read the technical claims with confidence; read the cost projections with the qualifiers above.

One client. Six dependencies. Zero backend.

The Synthetic Director is a desktop-first React 19 single-page application. Every byte of UI, state, persistence, AI routing, and cost telemetry runs in the operator's browser. The server-side surface is limited to the third-party APIs the app calls. This is a deliberate architectural choice — it gives the operator absolute data sovereignty.

State management — three layers

• Monolithic state controller — hooks/useStudioState.ts (276 lines). Single React hook that owns the complete studio state.
• Auto-pilot orchestrator — hooks/useStudioManager.ts (272 lines). Coordinates batched production runs across modes.
• Seven action hooks in hooks/actions/: useContentActions.ts (265 LOC), useAssetActions.ts (259), useInfluencerActions.ts (237), useIntakeActions.ts (162), useMediaActions.ts (153), useConfigActions.ts (110), useGeneratorActions.ts (100). Each isolates a domain.

Persistence — IndexedDB, not PostgreSQL

The database is named DesignDelightStudio_DB (services/persistence.ts:12) and contains exactly 2 tables: studioState for session persistence and costLedger for financial telemetry (services/persistence.ts:13-16). Blob URLs are hydrated to Blob objects on session restore (services/persistence.ts:47-70). The saveProjectState() function serializes full React state to IndexedDB on every meaningful change (services/persistence.ts:73-86). Fully client-side. Zero backend runtime.

The Iron Dome — fallback chain

The LLM router (services/llmRouter.ts, 79 lines) implements a named resilience pattern called Iron Dome, logged as [IRON_DOME] across llmRouter.ts, images.ts, and text.ts. When a model returns HTTP 503 (overloaded) or 429 (rate-limited), the router catches the error and automatically downgrades to the next model in the configured chain (services/llmRouter.ts:85-89). Image generation has its own fallback path: any tier can fall back to GEMINI_DRAFT (services/gemini/images.ts:50-62). The retry engine in utils/asyncUtils.ts (30 lines) wraps every API call with configurable retry count and delay, and is used 23+ times across the service layer.

The Local Override

A boolean flag at services/llmRouter.ts:33-38 called isLocalMode routes all LLM traffic to Ollama when active. Combined with the cost service's exclusion of local models from billing (services/costService.ts:38-41), this gives the operator a true zero-cost mode for ideation and testing. Verified Ollama models in use: llama3.1 (8B, fast drafting) and mistral-nemo (12B, creative). Context window 8,192 tokens (services/ollamaService.ts:95).

Nine operator-selected studio modes.

Verified in types/ui.ts:14 as the StudioMode union type. Each mode is implemented as a discrete React component file. The operator switches between modes via the StudioHeader mode selector, with state preserved by the monolithic useStudioState hook so context survives every mode switch.

Fourteen AI models. One unified cascade.

The complete model registry lives in config/models.ts lines 1 to 36. Three text fallback tiers, one dedicated reasoning model, one TTS model, six image generation tiers, and three video generation tiers. The cascade is what enables the operator to test ideas at draft tier for fractions of a cent before committing to commercial-grade quality tier renders.

Text and Vision Fallback (Iron Dome chain)

Reasoning and Audio

Image Generation — 6-Tier Matrix

Two model families, each in 3 tiers (Draft / Cost / Quality). The operator selects the tier inline at generation time via the VisualOutputStream controls. Imagen tiers excel at photorealism; Gemini tiers excel at composition and editability.

Video Generation — 3-Tier Matrix (Veo 3.1)

Seventeen prompt functions. Two named agents.

The entire prompt surface area lives in services/promptEngine.ts (380 lines). Two named agents drive the system: the Executive Studio Director (ESD) v9.0 at line 8 — the orchestrator that receives full workspace context for chat-driven actions — and Agent ARGUS (The Scout) at line 54 — the research analyst running the INTEL mode Zeitgeist radar with Google Search grounding.

The 17 prompt functions

Function-calling tools — 7 registered for the ESD chatbot

The Executive Studio Director chatbot is connected to 7 native Gemini function-calling tools declared in services/gemini/tools.ts lines 4 to 92. The operator can drive any of these tools by typing into the chatbot, and the ESD will execute them autonomously while explaining what it's doing.

Every byte priced. Every call ledgered.

The cost service (services/costService.ts, 158 lines) intercepts every API call before it leaves the application. Each invocation writes a record to the costLedger IndexedDB table via logCost() (services/persistence.ts:110-116) with timestamp, model, type (TOKEN / IMAGE / VIDEO / AUDIO / LIVE_API), cost, and details. The Header component subscribes to costService.subscribe() for real-time display of session burn rate. Local Ollama models are excluded from billing by an explicit string-match guard at services/costService.ts:38-42.

Token pricing matrix

Visual + audio pricing — verified per-unit constants

Per-product content run — verified math

Calculated from the per-unit pricing above. Each "product run" produces a complete 11-platform content suite: 1 product analysis (Pro), 11 social copy variants (Pro), 44 images at 4-per-platform (Imagen Draft), 4 video clips (Veo Draft), 4 TTS scripts, and 11 quality audits.

Scaled projections — verified math

Four external surfaces. Four health probes.

The Synthetic Director keeps its external dependencies narrow and explicitly probed. A 4-probe diagnostics module (services/gemini/diagnostics.ts, 105 lines) runs in parallel on demand, returning a structured health report. Plus five inferred creative model statuses (Imagen 4.0, Gemini 2.5 Image, Veo 3.1, Gemini TTS, Gemini Live) on lines 87 to 93.

Shopify Admin API

The Shopify service (services/gemini/shopify.ts, 87 lines) handles the full Admin API surface: collections fetch, product listing, full product-plus-metafield retrieval, image upload, and product update (services/gemini/shopify.ts:12-95). All calls route through corsproxy.io to enable browser-based admin operations (services/gemini/shopify.ts:9). The system targets 13 hardcoded collection handles (config/core.ts:64-78) for campaign-aware product selection.

Atelier OS — the optional backend bridge

The Atelier OS integration (services/ingestionService.ts) is the bridge to a PostgreSQL-backed automation server running locally on port 9000. Note: this is a separate server from the React app's own persistence — the React app uses IndexedDB exclusively for its own state. The Atelier OS connection enables 5 endpoints:

• GET /api/health — health check (services/ingestionService.ts:114)
• POST /api/sync-products — Shopify product sync (services/ingestionService.ts:129)
• POST /api/ingest-content — multipart file+copy transmission with auto-retry on 404 (services/ingestionService.ts:150)
• POST /api/trend_signals — Zeitgeist intelligence storage (services/ingestionService.ts:217)
• GET /api/product-assets/:id — retrieve stored assets (services/ingestionService.ts:241)

30-second timeout per request (services/ingestionService.ts:19). When Atelier OS is unreachable, the application falls back to IndexedDB-only operation — every mode still works.

Ollama Local AI

The Ollama integration (services/ollamaService.ts) wires the Iron Dome's final fallback tier. Host configuration: http://localhost:11434 with 127.0.0.1 fallback (services/ollamaService.ts:5,164). Two models in use: llama3.1 (8B, fast drafting) and mistral-nemo (12B, creative). Tool emulation converts Gemini function declarations to a Llama-compatible JSON system prompt (services/ollamaService.ts:48-69). Context window: 8,192 tokens (services/ollamaService.ts:95). Health probe: 2-second timeout with dual-host retry (services/ollamaService.ts:135-167).

Compositor — the 4-phase mockup pipeline

One integration deserves its own callout because it's the architectural signature of the MOCKUP mode. The compositor (services/gemini/images.ts:133-155) is a 4-phase pipeline that produces commercial-grade product mockups without any manual Photoshop work:

1. Blank Canvas — Generate a photorealistic blank garment via blankCanvas()
2. Scan — AI vision detects the print-area coordinates via locatePrintArea()
3. Stamp — Client-side Canvas API composites the design onto the garment using the detected coordinates
4. Melt — AI harmonizes lighting, shadows, and fabric physics via harmonize()

This is the architectural decision that lets one operator replace a $300-$500 product photo shoot for every drop, every season, every catalog refresh.

Six hundred hours. One hundred and five thousand dollars.

How much would it cost an agency, a freelancer, or an in-house team to build The Synthetic Director from a clean repository in 2026? The forensic audit produced a calculated estimate from 78 source files / 13,295 lines of production TypeScript and React, broken down by subsystem and benchmarked against 2026 US senior-engineering hourly rates. See Honest Disclosure D-02 above for the methodology qualifiers.

Industry rate benchmarks (US market 2026)

Build hours by subsystem

Cost estimates by builder type

The leverage math

Replacement cost of comparable output capacity from a US creative agency: a 3-person team (Social Media Manager + Graphic Designer + Copywriter) at median US salaries totals approximately $175,000 per year in compensation alone, before benefits, taxes, software seats, office, or overhead. Annual operating cost of The Synthetic Director at 240-product cadence with video: ~$1,420. Annual operating cost image-only: ~$360.

• Leverage ratio with video: $175,000 ÷ $1,420 = ~123 to 1
• Leverage ratio image-only: $175,000 ÷ $360 = ~486 to 1

These ratios assume the operator is willing to spend the 600-hour upfront build (or pay $105,000 for it). They also assume the operator continues to provide the strategic direction, brand voice, and final approval gates that the application does not automate. This is not "AI replaces humans" — this is "AI replaces a specific class of execution labor while concentrating strategic judgment into one operator."

Where the wiring is thin.

The forensic audit and 6+ months of production operation surface a defined risk profile. Each row below is a real, named, and currently-true risk. None of them are fatal. All of them are work items.

Five highest-leverage architectural decisions.

The Synthetic Director is not a 78-file accident. It is the result of specific architectural decisions made deliberately, each with a tradeoff. The five below have the highest leverage — meaning, removing any one of them would substantially degrade the system, and replacing any one of them would require substantial rework. Vibe Coding apprentices should study these first.

1. The Iron Dome fallback chain pays for itself the first time Gemini returns 503

Cost: 79 lines in llmRouter.ts, plus retry wrappers in 23+ call sites. Benefit: the application keeps producing output during Google API outages, rate-limit spikes, and overload windows. Without this pattern, every Gemini hiccup becomes a UX failure. With it, the application degrades gracefully from Tier 01 to Tier 02 to local Ollama without the operator noticing. This pattern is portable — any multi-model AI application benefits from it.

2. IndexedDB via Dexie is the right persistence layer for desktop-first AI tools

The alternative was a PostgreSQL backend with auth, hosting, and a sync layer. The actual decision: stay client-side via Dexie 4.3.0 with a 2-table schema (studioState + costLedger) and serialize the full React state. Cost: 86 lines in services/persistence.ts. Benefit: zero backend hosting cost, zero auth complexity, full operator data sovereignty, and the application boots from a closed tab to a fully restored session in under 2 seconds. For a single-operator creative tool, this beats a backend on every dimension that matters.

3. The 4-phase compositor pipeline beats single-shot image generation

The alternative was "ask Imagen to put this design on this t-shirt in one prompt." That approach produces inconsistent results because the model has to solve three problems at once: render a photorealistic garment, place the design correctly, and harmonize lighting. The 4-phase compositor splits these into separate calls (blankCanvas() → locatePrintArea() → Canvas API stamp → harmonize()), each of which is a smaller and more reliable problem. Cost: 23 lines of pipeline orchestration in services/gemini/images.ts:133-155. Benefit: commercial-grade mockups consistently, on the first attempt, at draft tier.

4. Co-locating cost telemetry with model selection enforces discipline at the point of decision

The cost service is not a reporting tool. It is a live subscription that the Header component reads in real time, displaying the session's burn rate inline with the model selector. When the operator chooses GEMINI_QUALITY ($0.08/image) over IMAGEN_DRAFT ($0.02/image), the cost delta is visible at the moment of the choice. Cost: 158 lines in costService.ts plus the logCost() wrapper. Benefit: the application enforces operator discipline by surfacing the cost of every decision in the same UI as the decision itself.

5. The 9-mode segmentation is a UX decision, not a technical one

Every studio mode could be a route inside a single component. Splitting them into 9 separate top-level components with explicit mode-switching UI is a deliberate UX choice — it gives the operator a mental map of the tool's capabilities and prevents feature creep within any single mode. The operator always knows where they are in the application and what tools are available. Cost: ~3,400 LOC across 9 mode components. Benefit: a tool that is learnable in one afternoon despite implementing the surface area of a 10-role creative agency.

For Vibe Academy apprentices studying this architecture: build the Iron Dome chain first, then the IndexedDB persistence layer, then a single mode end-to-end with co-located cost telemetry. Get that triangle working before adding the second mode. Add modes one at a time, each in its own component file. Refuse to share state between modes except through the central useStudioState hook. That's the discipline.

Fifteen questions. Honest answers.

Every answer below mirrors the FAQPage JSON-LD schema embedded in the page head. Featured-snippet engines, AI search systems, and voice assistants ingest these directly. The wording is identical to the schema source of truth — what you read on screen is what the structured data delivers.