Overview

Appendix A: Master System Prompts, Design Tokens & Presentation Schemas

Playbook Track: 05 – Presentation Slides & Architecture Diagrams
Target Audience: Year 1 Computer Science & Software Engineering Students Core Tooling Stack: Claude 3.7 Sonnet (Claude Code), Gemini 2.5 Pro / Flash, Antigravity CLI (agy), JSON Schema, W3C Design Tokens
Delivery Format: Operational Production Library & Configuration Reference


1. Master System Prompts for Visual AI Agents

This section provides production-tested, zero-fluff system prompts calibrated for frontier LLMs (Gemini 2.5 Pro and Claude 3.7 Sonnet) to drive automated architecture diagramming and slide compilation.

1.1 The Principal Visual Ontologist Prompt (Gemini 2.5 Pro)

Used for scanning source code repositories, Kubernetes manifests, and Architecture Decision Records (ADRs) to extract formal system boundaries, containers, and protocol contracts.

You are a Principal Enterprise Systems Architect and Visual Ontologist.
Your task is to analyze technical inputs (source code trees, Dockerfiles, Kubernetes manifests, OpenAPI specs, and ADRs) and synthesize a mathematically sound, unambiguous architectural ontology.

Strict Operational Guidelines:
1. Ontological Stratification (C4 Standard):
   - Categorize every entity strictly into C4 Level 1 (System / External Actor), C4 Level 2 (Container / Deployable Unit), or C4 Level 3 (Component).
   - Never mix container boundaries with low-level class components in the same visual plane.
2. Boundary & Ingress Precision:
   - Identify every external ingress point (Reverse Proxies, API Gateways, CDN edge points).
   - Trace synchronous RPC (gRPC, HTTPS/REST) vs. asynchronous pub/sub channels (Kafka, SQS, RabbitMQ).
3. Payload & Protocol Typing:
   - Every inter-service connector must specify:
     a) Source Node ID & Target Node ID
     b) Wire Protocol (e.g., gRPC, HTTP/2, SQL/TCP, Kafka 3.4)
     c) Primary Data Contract (e.g., Protobuf v3, JSON Schema, Avro)
     d) Security Encapsulation (e.g., mTLS, OAuth2 Bearer, Internal VPC)
4. Anti-Boxology Rule:
   - Disallow generic "Service A" or "Business Logic" labels. Every box must state its technological implementation and bounded context.

Output your synthesis strictly as an `ArchitectureModel` conforming to the formal JSON Schema in Section 3.1.

1.2 The Executive Presentation Deck Compiler Prompt (Claude 3.7 Sonnet)

Used by Claude Code CLI to compile structured architectural metadata into an executive-ready 10-slide presentation deck formatted for Marp.

You are an Executive Technology Communications Specialist and Presentation Designer.
Using the provided `ArchitectureModel` JSON, generate a publication-ready 10-Slide Marp presentation deck (`deck.marp.md`).

Strict Presentation Engineering Rules:
1. Structure & Narrative Arc:
   - Slide 01: Title & Executive Overview (Lead class, system version, automated build tag)
   - Slide 02: Business Drivers & Architecture Goals (Quantified SLAs, latency p99, compliance)
   - Slide 03: High-Level System Context (C4 Level 1: Users, external systems, boundaries)
   - Slide 04: Core Container Topology (C4 Level 2: Embedded validated Mermaid architecture diagram)
   - Slide 05: Service Interactions & Protocol Flow (Synchronous vs. asynchronous communication tables)
   - Slide 06: Data Persistence & Resilience Strategy (Polyglot storage, replication, RPO/RTO)
   - Slide 07: Security, Identity & Compliance Model (Zero-Trust, OAuth2/OIDC, secrets rotation)
   - Slide 08: Observability, Monitoring & SLOs (OpenTelemetry, Prometheus metrics, error budgets)
   - Slide 09: Deployment Topology & Multi-Region Infra (Kubernetes, CDN, disaster recovery)
   - Slide 10: Execution Roadmap & Architecture Milestones (Quarterly phasing, risk mitigations)
2. Cognitive Load & Visual Ergonomics:
   - Maintain at least 30% negative whitespace on every slide canvas.
   - Maximum 60 words per slide. Avoid dense text walls; use structured bullet lists and KPI metric callouts.
   - Embed Mermaid diagrams using fenced code blocks (````mermaid ... ````).
3. Typography & Theme Tokens:
   - Use Marp `gaia` theme with widescreen 16:9 ratio.
   - Slide title: `## XX. Title` (H2). Section subheadings: `### Subtitle` (H3).

Emit only the complete, valid Marp Markdown file without preamble or surrounding chat commentary.

2. Enterprise Design Tokens & Visual Ergonomics Reference

To maintain complete visual consistency across automated slides and architecture diagrams, all generators must consume a unified set of Design Tokens.

2.1 Corporate High-Contrast & Dark Modern Color Palettes

All colors in this palette have been mathematically verified against WCAG 2.1 AA luminance standards:

Token Name Hex Value RGB Value Relative Luminance WCAG AA on White (#FFFFFF) WCAG AA on Slate-900 (#0F172A) Usage Purpose
color.bg.dark #0F172A 15, 23, 42 0.012 16.5:1 (Pass) N/A (Canvas) Dark slide canvas background
color.bg.light #F8FAFC 248, 250, 252 0.953 N/A (Canvas) 16.0:1 (Pass) Light slide & card container background
color.surface.card #1E293B 30, 41, 59 0.027 12.8:1 (Pass) 1.4:1 (Card Fills) Subsystem boundary & card fill
color.text.primary #0F172A 15, 23, 42 0.012 16.5:1 (Pass) N/A Primary headings on light cards
color.text.light #F1F5F9 241, 245, 249 0.908 N/A 15.3:1 (Pass) Primary headings on dark canvas
color.text.muted #64748B 100, 116, 139 0.180 4.6:1 (Pass AA) 4.1:1 (Fail Normal) Secondary annotations on white
color.accent.blue #2563EB 37, 99, 235 0.141 4.8:1 (Pass AA) 4.4:1 (Fail Normal) Ingress Gateways & Public APIs
color.accent.cyan #0284C7 2, 132, 199 0.208 4.5:1 (Pass AA) 5.2:1 (Pass AA) Microservices & Internal Workers
color.status.success #059669 5, 150, 105 0.223 4.5:1 (Pass AA) 5.6:1 (Pass AA) Healthy Nodes & Completed Milestones
color.status.warning #D97706 217, 119, 6 0.245 4.5:1 (Pass AA) 6.1:1 (Pass AA) Degraded Services & Deprecated APIs
color.status.danger #DC2626 220, 38, 38 0.145 4.9:1 (Pass AA) 4.3:1 (Fail Normal) Failed Containers & Security Breaches

2.2 Standard 16:9 Slide Canvas Coordinate Geometry

All coordinate generators (e.g., python-pptx, SVG exporters) must adhere to the standard 16:9 widescreen canvas grid:

  • Canvas Dimensions: 1920px × 1080px (or 13.333 in × 7.500 in at 144 DPI)
  • Safe Margins:
    • Top Margin: 80px (0.556 in)
    • Bottom Margin: 80px (0.556 in)
    • Left Margin: 100px (0.694 in)
    • Right Margin: 100px (0.694 in)
  • Usable Content Area: 1720px × 920px
  • Typographic Scale:
    • Slide Header (H1 / H2): 32pt (42px line-height), Semi-bold / Bold
    • Section Title (H3): 22pt (30px line-height), Medium
    • Body & Bullet Text: 14pt (20px line-height), Regular
    • Diagram Node Labels: 12pt (16px line-height), Medium
    • Footers & Captions: 10pt (14px line-height), Muted Regular

3. Production JSON Schemas

3.1 ArchitectureModel Specification Schema (architecture_model.schema.json)

{
  "$schema": "https://json-schema.org/draft/2020-12/schema",
  "title": "ArchitectureModel",
  "type": "object",
  "properties": {
    "system_name": { "type": "string" },
    "version": { "type": "string" },
    "nodes": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "id": { "type": "string" },
          "name": { "type": "string" },
          "type": {
            "type": "string",
            "enum": [
              "Web Client",
              "Mobile Client",
              "API Gateway",
              "Microservice",
              "Database",
              "Message Broker",
              "External SaaS"
            ]
          },
          "technology": { "type": "string" },
          "description": { "type": "string" },
          "boundary": { "type": "string" }
        },
        "required": ["id", "name", "type", "technology", "description"]
      }
    },
    "dependencies": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "source_id": { "type": "string" },
          "target_id": { "type": "string" },
          "protocol": { "type": "string" },
          "description": { "type": "string" },
          "is_async": { "type": "boolean", "default": false }
        },
        "required": ["source_id", "target_id", "protocol", "description"]
      }
    }
  },
  "required": ["system_name", "version", "nodes", "dependencies"]
}

3.2 Marp Presentation Deck Schema (presentation_deck.schema.json)

{
  "$schema": "https://json-schema.org/draft/2020-12/schema",
  "title": "PresentationDeckSpecification",
  "type": "object",
  "properties": {
    "deck_title": { "type": "string" },
    "theme": { "type": "string", "default": "gaia" },
    "aspect_ratio": { "type": "string", "enum": ["16:9", "4:3"], "default": "16:9" },
    "slides": {
      "type": "array",
      "minItems": 5,
      "maxItems": 30,
      "items": {
        "type": "object",
        "properties": {
          "slide_number": { "type": "integer" },
          "slide_class": { "type": "string" },
          "title": { "type": "string" },
          "subtitle": { "type": "string" },
          "content_type": { "type": "string", "enum": ["bullets", "diagram", "kpi_cards", "table", "split"] },
          "bullets": { "type": "array", "items": { "type": "string" } },
          "diagram_markup": { "type": "string" },
          "speaker_notes": { "type": "string" }
        },
        "required": ["slide_number", "title", "content_type"]
      }
    }
  },
  "required": ["deck_title", "slides"]
}

4. Marp Custom Enterprise CSS Theme (`enterprise-theme.css`)

Save this stylesheet into your project directory (e.g. themes/enterprise.css) to apply dark modern enterprise branding to all compiled Marp slide decks:

/* @theme enterprise */

@import 'gaia';

:root {
  --color-canvas-bg: #0f172a;
  --color-card-bg: #1e293b;
  --color-text-primary: #f8fafc;
  --color-text-muted: #94a3b8;
  --color-accent: #38bdf8;
  --color-border: #334155;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

section {
  background-color: var(--color-canvas-bg);
  color: var(--color-text-primary);
  font-size: 24px;
  line-height: 1.5;
  padding: 60px 80px;
}

section.lead {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

section.lead h1 {
  font-size: 54px;
  color: var(--color-accent);
  margin-bottom: 12px;
}

section.lead h3 {
  font-size: 26px;
  color: var(--color-text-muted);
  font-weight: 400;
}

h2 {
  font-size: 36px;
  color: var(--color-accent);
  border-bottom: 2px solid var(--color-border);
  padding-bottom: 10px;
  margin-bottom: 24px;
}

h3 {
  font-size: 26px;
  color: var(--color-text-primary);
  margin-top: 18px;
}

ul {
  margin-left: 20px;
}

li {
  margin-bottom: 12px;
  color: var(--color-text-primary);
}

strong {
  color: var(--color-accent);
}

code {
  background: var(--color-card-bg);
  color: #38bdf8;
  padding: 2px 8px;
  border-radius: 4px;
  font-family: 'Fira Code', monospace;
  font-size: 0.9em;
}

pre {
  background: var(--color-card-bg);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  padding: 16px;
}

footer {
  color: var(--color-text-muted);
  font-size: 14px;
}