v0.3 — Visual Edition
|
V2 Heat A
|
Field Guide
V2 Heat A: Revised Diagram Field Guide
Four AI models revised their first-pass diagrams after critique, constraint, and more context. V2 is not first instinct — V2 is adaptation. Review each one, then vote.
Poll question: After revision, which diagram shows the clearest improvement in communicating the ROY argument?
The poll runs on LinkedIn. Follow OverKill Hill P³™ on LinkedIn to participate when each heat goes live.
ChatGPT V2
Denser reasoning. Explicit loop logic with brand and mechanics. More deliberate, less merely clever.
---
config:
theme: neutral
layout: elk
look: neo
handDrawnSeed: 19
flowchart:
curve: basis
htmlLabels: true
nodeSpacing: 30
rankSpacing: 42
themeVariables:
fontFamily: Trebuchet MS, Segoe UI, Arial
fontSize: 16px
background: '#FFFFFF'
lineColor: '#5B6676'
primaryColor: '#EAF2FF'
primaryTextColor: '#13213C'
primaryBorderColor: '#3563D9'
secondaryColor: '#FFF8E7'
secondaryBorderColor: '#D7A322'
tertiaryColor: '#EEFDF3'
tertiaryBorderColor: '#2F855A'
clusterBkg: '#FAFBFD'
clusterBorder: '#CBD5E1'
edgeLabelBackground: '#FFFFFF'
---
flowchart LR
subgraph A1["Act I — Friction ⚡"]
direction TB
S["Spark
a picture is worth 1000 words"] P["Text-only explanation
starts feeling like polite confusion"] Q{"Keep this in prose?"} T0["Stay in text
accept slower comprehension"] M{"Define the real metric
ambiguity removed ÷ effort spent"} end subgraph A2["Act II — Forge 🛠️"] direction TB B["Brain-dump hooks
angles, metaphors, examples"] D["Draft post v0"] L["Ask LLM for Mermaid v1"] H{"Honest process
or fake happy path?"} F1["Add forks, doubt
dead ends, loopbacks"] F2["Kill clutter
keep signal ✂️"] E["Diagram earns its space"] end subgraph A3["Act III — Finish 🚀"] direction TB ST["Tune labels, shapes
color, hierarchy, swagger"] R{"Clear faster than
text alone?"} RW["Revise again"] PK["Package proof
diagram image + code image + hosted link"] SH["Publish to LinkedIn"] BR["OverKill Hill P³™
Words → Structure → Systems → Leverage"] end subgraph A4["Act IV — Learn 🔁"] direction TB C[("Comments, questions
confusion signals")] N["Feed insight into
the next diagram"] end S --> P P --> Q Q -- Yes --> T0 Q -- No --> M M --> B B --> D D --> L L --> H H -- Too tidy --> F1 F1 --> L H -- Too noisy --> F2 F2 --> L H -- Credible --> E E --> ST ST --> R R -- No --> RW RW --> ST R -- Yes --> PK PK --> SH SH --> BR & C C --> N N --> B S:::spark P:::risk Q:::gate T0:::muted M:::core B:::core D:::core L:::core H:::gate F1:::risk F2:::risk E:::win ST:::core R:::gate RW:::risk PK:::publish SH:::publish BR:::brand C:::feedback N:::feedback classDef spark fill:#FFF4CC,stroke:#D6A700,color:#4A3B00,stroke-width:2.6px classDef core fill:#EAF2FF,stroke:#3563D9,color:#13213C,stroke-width:1.6px classDef gate fill:#F4ECFF,stroke:#7C3AED,color:#31135E,stroke-width:2px classDef risk fill:#FFF1F2,stroke:#DC2626,color:#7F1D1D,stroke-width:1.8px classDef win fill:#EEFDF3,stroke:#2F855A,color:#12331D,stroke-width:2px classDef publish fill:#ECFDF5,stroke:#059669,color:#064E3B,stroke-width:2.2px classDef brand fill:#F3F4F6,stroke:#4B5563,color:#111827,stroke-width:2.1px classDef feedback fill:#FFF7ED,stroke:#DD6B20,color:#5B3415,stroke-width:1.8px classDef muted fill:#FAFAFA,stroke:#94A3B8,color:#64748B,stroke-width:1.2px,stroke-dasharray: 4 3 style A1 fill:#F8FBFF,stroke:#3563D9,stroke-width:1.5px,color:#13213C style A2 fill:#FFFCF2,stroke:#D7A322,stroke-width:1.5px,color:#4C3510 style A3 fill:#F3FFF6,stroke:#2F855A,stroke-width:1.5px,color:#12331D style A4 fill:#FFF7ED,stroke:#DD6B20,stroke-width:1.5px,color:#5B3415 linkStyle 2 stroke:#94A3B8,stroke-width:1.8px,stroke-dasharray: 5 4,fill:none linkStyle 8 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 9 stroke:#DC2626,stroke-width:2px,stroke-dasharray: 6 4,fill:none linkStyle 10 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 11 stroke:#DC2626,stroke-width:2px,stroke-dasharray: 6 4,fill:none linkStyle 15 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 16 stroke:#DC2626,stroke-width:2px,stroke-dasharray: 6 4,fill:none linkStyle 20 stroke:#DD6B20,stroke-width:2px,stroke-dasharray: 3 4,fill:none linkStyle 22 stroke:#DD6B20,stroke-width:2px,stroke-dasharray: 3 4,fill:none
a picture is worth 1000 words"] P["Text-only explanation
starts feeling like polite confusion"] Q{"Keep this in prose?"} T0["Stay in text
accept slower comprehension"] M{"Define the real metric
ambiguity removed ÷ effort spent"} end subgraph A2["Act II — Forge 🛠️"] direction TB B["Brain-dump hooks
angles, metaphors, examples"] D["Draft post v0"] L["Ask LLM for Mermaid v1"] H{"Honest process
or fake happy path?"} F1["Add forks, doubt
dead ends, loopbacks"] F2["Kill clutter
keep signal ✂️"] E["Diagram earns its space"] end subgraph A3["Act III — Finish 🚀"] direction TB ST["Tune labels, shapes
color, hierarchy, swagger"] R{"Clear faster than
text alone?"} RW["Revise again"] PK["Package proof
diagram image + code image + hosted link"] SH["Publish to LinkedIn"] BR["OverKill Hill P³™
Words → Structure → Systems → Leverage"] end subgraph A4["Act IV — Learn 🔁"] direction TB C[("Comments, questions
confusion signals")] N["Feed insight into
the next diagram"] end S --> P P --> Q Q -- Yes --> T0 Q -- No --> M M --> B B --> D D --> L L --> H H -- Too tidy --> F1 F1 --> L H -- Too noisy --> F2 F2 --> L H -- Credible --> E E --> ST ST --> R R -- No --> RW RW --> ST R -- Yes --> PK PK --> SH SH --> BR & C C --> N N --> B S:::spark P:::risk Q:::gate T0:::muted M:::core B:::core D:::core L:::core H:::gate F1:::risk F2:::risk E:::win ST:::core R:::gate RW:::risk PK:::publish SH:::publish BR:::brand C:::feedback N:::feedback classDef spark fill:#FFF4CC,stroke:#D6A700,color:#4A3B00,stroke-width:2.6px classDef core fill:#EAF2FF,stroke:#3563D9,color:#13213C,stroke-width:1.6px classDef gate fill:#F4ECFF,stroke:#7C3AED,color:#31135E,stroke-width:2px classDef risk fill:#FFF1F2,stroke:#DC2626,color:#7F1D1D,stroke-width:1.8px classDef win fill:#EEFDF3,stroke:#2F855A,color:#12331D,stroke-width:2px classDef publish fill:#ECFDF5,stroke:#059669,color:#064E3B,stroke-width:2.2px classDef brand fill:#F3F4F6,stroke:#4B5563,color:#111827,stroke-width:2.1px classDef feedback fill:#FFF7ED,stroke:#DD6B20,color:#5B3415,stroke-width:1.8px classDef muted fill:#FAFAFA,stroke:#94A3B8,color:#64748B,stroke-width:1.2px,stroke-dasharray: 4 3 style A1 fill:#F8FBFF,stroke:#3563D9,stroke-width:1.5px,color:#13213C style A2 fill:#FFFCF2,stroke:#D7A322,stroke-width:1.5px,color:#4C3510 style A3 fill:#F3FFF6,stroke:#2F855A,stroke-width:1.5px,color:#12331D style A4 fill:#FFF7ED,stroke:#DD6B20,stroke-width:1.5px,color:#5B3415 linkStyle 2 stroke:#94A3B8,stroke-width:1.8px,stroke-dasharray: 5 4,fill:none linkStyle 8 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 9 stroke:#DC2626,stroke-width:2px,stroke-dasharray: 6 4,fill:none linkStyle 10 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 11 stroke:#DC2626,stroke-width:2px,stroke-dasharray: 6 4,fill:none linkStyle 15 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 16 stroke:#DC2626,stroke-width:2px,stroke-dasharray: 6 4,fill:none linkStyle 20 stroke:#DD6B20,stroke-width:2px,stroke-dasharray: 3 4,fill:none linkStyle 22 stroke:#DD6B20,stroke-width:2px,stroke-dasharray: 3 4,fill:none
Copilot V2
Architecture preserved. Emotion and discipline. Boardroom-ready if flair does not damage structure.
---
config:
theme: neutral
fontFamily: Aptos, Segoe UI, Inter, Arial, sans-serif
themeVariables:
primaryColor: '#EAF2FF'
primaryTextColor: '#132238'
primaryBorderColor: '#2B6CB0'
lineColor: '#64748B'
secondaryColor: '#FFF8E8'
tertiaryColor: '#EEFDF3'
fontFamily: Aptos, Segoe UI, Inter, Arial, sans-serif
look: neo
---
flowchart LR
subgraph A1["⚡ Ignition"]
direction TB
A["💥 Spark
A picture is worth 1,000 words?"] B["Question the proverb"] C{"Is the visual
actually earning its space?"} D["Decorative wallpaper
with a superiority complex"] E["Potential clarity multiplier"] F["Define the real metric:
ambiguity removed ÷ effort spent"] end subgraph A2["✍️ Prose / Framing"] direction TB G["Notice the real problem:
most documentation is polite confusion"] H["Draft ugly first post"] I{"Does the hook land?"} J["Rewrite the open
kill the clever, keep the honest"] K["Find the thesis:
prose sets up, visuals compress"] end subgraph A3["🧭 Modeling / Mermaid"] direction TB L["Ask LLM for Mermaid skeleton"] M["Render V1 🧪"] N{"Honest... or fake happy path?"} O["Add forks, loops,
dead ends, doubt"] P["Too noisy?
Kill clutter, keep signal ✂️"] Q["Tune labels, order,
hierarchy, styling"] R["Diagram starts earning trust"] end subgraph A4["📈 ROY Check"] direction TB S["ROY = Return on Your Words"] T{"Clear faster than
text alone?"} U["Revise again"] V["Trim words around the visual"] W["✅ The picture earned its words"] end subgraph A5["🚀 Ship / Learn"] direction TB X["Export diagram image"] Y["Export code screenshot"] Z["Write post around proof:
words → structure → systems → leverage"] AA["Publish to LinkedIn"] AB["Drive readers to
OverKill Hill P³™"] AC["Comments reveal confusion,
questions, stronger examples"] AD["Feed signals into V2"] end A --> B B --> C C -- No --> D D --> F C -- Yes --> E E --> F G --> H H --> I I -- No --> J J --> H I -- Yes --> K L --> M M --> N N -- Too tidy --> O O --> M N -- Too busy --> P P --> Q Q --> M N -- Credible --> R S --> T T -- No --> U U --> Q T -- Mostly --> V V --> T T -- Yes --> W X --> Y Y --> Z Z --> AA AA --> AB & AC AC --> AD F --> G K --> L R --> S W --> X AD -. iterate .-> H AD -. refine .-> L A:::spark B:::core C:::gate D:::risk E:::win F:::insight G:::core H:::draft I:::gate J:::risk K:::insight L:::core M:::draft N:::gate O:::risk P:::risk Q:::core R:::win S:::insight T:::gate U:::risk V:::core W:::publish X:::publish Y:::publish Z:::publish AA:::publish AB:::brand AC:::feedback AD:::feedback classDef spark fill:#FFF4CC,stroke:#D6A700,color:#4A3B00,stroke-width:2.5px classDef core fill:#EAF2FF,stroke:#2B6CB0,color:#102A43,stroke-width:1.6px classDef draft fill:#F3F4F6,stroke:#6B7280,color:#334155,stroke-width:1.4px,stroke-dasharray: 5 3 classDef gate fill:#F3E8FF,stroke:#7C3AED,color:#3B0764,stroke-width:2px classDef risk fill:#FFF1F2,stroke:#DC2626,color:#7F1D1D,stroke-width:1.8px classDef win fill:#ECFDF5,stroke:#16A34A,color:#14532D,stroke-width:1.8px classDef insight fill:#FFF7E8,stroke:#D97706,color:#78350F,stroke-width:1.8px classDef publish fill:#EAF7F1,stroke:#059669,color:#064E3B,stroke-width:2.2px classDef brand fill:#F3F4F6,stroke:#374151,color:#111827,stroke-width:2.2px classDef feedback fill:#EFF6FF,stroke:#2563EB,color:#1E3A8A,stroke-width:1.8px,stroke-dasharray: 4 3 style A1 fill:#FFFCF2,stroke:#D6A700,stroke-width:1.5px,color:#4A3B00 style A2 fill:#F8FBFF,stroke:#2B6CB0,stroke-width:1.5px,color:#102A43 style A3 fill:#FFF8FB,stroke:#C05666,stroke-width:1.5px,color:#4A1020 style A4 fill:#F9FFF9,stroke:#16A34A,stroke-width:1.5px,color:#14532D style A5 fill:#F5F3FF,stroke:#6D28D9,stroke-width:1.5px,color:#312E81 linkStyle 2 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 3 stroke:#16A34A,stroke-width:2.2px,fill:none linkStyle 10 stroke:#DC2626,stroke-width:2px,stroke-dasharray: 6 4,fill:none linkStyle 15 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 16 stroke:#DC2626,stroke-width:2px,fill:none linkStyle 17 stroke:#16A34A,stroke-width:2.6px,fill:none linkStyle 20 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 21 stroke:#D97706,stroke-width:2px,stroke-dasharray: 4 4,fill:none linkStyle 22 stroke:#16A34A,stroke-width:2.8px,fill:none linkStyle 30 stroke:#2563EB,stroke-width:2px,stroke-dasharray: 3 5,fill:none linkStyle 31 stroke:#2563EB,stroke-width:2px,stroke-dasharray: 3 5,fill:none
A picture is worth 1,000 words?"] B["Question the proverb"] C{"Is the visual
actually earning its space?"} D["Decorative wallpaper
with a superiority complex"] E["Potential clarity multiplier"] F["Define the real metric:
ambiguity removed ÷ effort spent"] end subgraph A2["✍️ Prose / Framing"] direction TB G["Notice the real problem:
most documentation is polite confusion"] H["Draft ugly first post"] I{"Does the hook land?"} J["Rewrite the open
kill the clever, keep the honest"] K["Find the thesis:
prose sets up, visuals compress"] end subgraph A3["🧭 Modeling / Mermaid"] direction TB L["Ask LLM for Mermaid skeleton"] M["Render V1 🧪"] N{"Honest... or fake happy path?"} O["Add forks, loops,
dead ends, doubt"] P["Too noisy?
Kill clutter, keep signal ✂️"] Q["Tune labels, order,
hierarchy, styling"] R["Diagram starts earning trust"] end subgraph A4["📈 ROY Check"] direction TB S["ROY = Return on Your Words"] T{"Clear faster than
text alone?"} U["Revise again"] V["Trim words around the visual"] W["✅ The picture earned its words"] end subgraph A5["🚀 Ship / Learn"] direction TB X["Export diagram image"] Y["Export code screenshot"] Z["Write post around proof:
words → structure → systems → leverage"] AA["Publish to LinkedIn"] AB["Drive readers to
OverKill Hill P³™"] AC["Comments reveal confusion,
questions, stronger examples"] AD["Feed signals into V2"] end A --> B B --> C C -- No --> D D --> F C -- Yes --> E E --> F G --> H H --> I I -- No --> J J --> H I -- Yes --> K L --> M M --> N N -- Too tidy --> O O --> M N -- Too busy --> P P --> Q Q --> M N -- Credible --> R S --> T T -- No --> U U --> Q T -- Mostly --> V V --> T T -- Yes --> W X --> Y Y --> Z Z --> AA AA --> AB & AC AC --> AD F --> G K --> L R --> S W --> X AD -. iterate .-> H AD -. refine .-> L A:::spark B:::core C:::gate D:::risk E:::win F:::insight G:::core H:::draft I:::gate J:::risk K:::insight L:::core M:::draft N:::gate O:::risk P:::risk Q:::core R:::win S:::insight T:::gate U:::risk V:::core W:::publish X:::publish Y:::publish Z:::publish AA:::publish AB:::brand AC:::feedback AD:::feedback classDef spark fill:#FFF4CC,stroke:#D6A700,color:#4A3B00,stroke-width:2.5px classDef core fill:#EAF2FF,stroke:#2B6CB0,color:#102A43,stroke-width:1.6px classDef draft fill:#F3F4F6,stroke:#6B7280,color:#334155,stroke-width:1.4px,stroke-dasharray: 5 3 classDef gate fill:#F3E8FF,stroke:#7C3AED,color:#3B0764,stroke-width:2px classDef risk fill:#FFF1F2,stroke:#DC2626,color:#7F1D1D,stroke-width:1.8px classDef win fill:#ECFDF5,stroke:#16A34A,color:#14532D,stroke-width:1.8px classDef insight fill:#FFF7E8,stroke:#D97706,color:#78350F,stroke-width:1.8px classDef publish fill:#EAF7F1,stroke:#059669,color:#064E3B,stroke-width:2.2px classDef brand fill:#F3F4F6,stroke:#374151,color:#111827,stroke-width:2.2px classDef feedback fill:#EFF6FF,stroke:#2563EB,color:#1E3A8A,stroke-width:1.8px,stroke-dasharray: 4 3 style A1 fill:#FFFCF2,stroke:#D6A700,stroke-width:1.5px,color:#4A3B00 style A2 fill:#F8FBFF,stroke:#2B6CB0,stroke-width:1.5px,color:#102A43 style A3 fill:#FFF8FB,stroke:#C05666,stroke-width:1.5px,color:#4A1020 style A4 fill:#F9FFF9,stroke:#16A34A,stroke-width:1.5px,color:#14532D style A5 fill:#F5F3FF,stroke:#6D28D9,stroke-width:1.5px,color:#312E81 linkStyle 2 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 3 stroke:#16A34A,stroke-width:2.2px,fill:none linkStyle 10 stroke:#DC2626,stroke-width:2px,stroke-dasharray: 6 4,fill:none linkStyle 15 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 16 stroke:#DC2626,stroke-width:2px,fill:none linkStyle 17 stroke:#16A34A,stroke-width:2.6px,fill:none linkStyle 20 stroke:#DC2626,stroke-width:2.2px,stroke-dasharray: 6 4,fill:none linkStyle 21 stroke:#D97706,stroke-width:2px,stroke-dasharray: 4 4,fill:none linkStyle 22 stroke:#16A34A,stroke-width:2.8px,fill:none linkStyle 30 stroke:#2563EB,stroke-width:2px,stroke-dasharray: 3 5,fill:none linkStyle 31 stroke:#2563EB,stroke-width:2px,stroke-dasharray: 3 5,fill:none
Gemini V2
Needs stronger conviction. Synthesis cannot become generic.
---
config:
theme: neutral
look: neo
---
flowchart TB
subgraph FORGE["⚒️ THE CONCEPTUAL FOUNDRY"]
direction TB
A(("💥 THE SPARK
Messy Idea")) B["⚖️ ROI CALCULUS
Clarity vs. Friction"] C{"🔍 LOGIC AUDIT
Wallpaper or Weapon?"} end subgraph ARCHITECTURE["🌀 THE NON-LINEAR PATH"] direction LR D["🏗️ DRAFT V1
Initial Mermaid Syntax"] E@{ label: "🧪 STRESS TEST
Too 'Happy-Path'?" } F["🛠️ REFACTOR
Add Forks & Loops"] G["✂️ TRIM SIGNAL
Kill the Clutter"] end subgraph PAYOUT["🚀 THE SEMANTIC MULTIPLIER"] direction TB H["💎 VIBE CODE READY
Structural Excellence"] I["📢 POST ASSET
Words + Model + Link"] J(("✅ ROI ACHIEVED
Instant Synthesis")) end A --> B B --> C D --> E E -- Too Tidy --> F F --> D E -- Too Noisy --> G G --> D H --> I I --> J C -- Structural Weapon --> D C -- Decorative Junk --> A E -- Earns Its Space --> H J -. User Confusion .-> F E@{ shape: hexagon} A:::spark B:::core C:::gate D:::core E:::gate F:::risk G:::risk H:::win I:::publish J:::spark classDef spark fill:#FFF4CC,stroke:#D6A700,color:#4A3B00,stroke-width:3px,font-weight:bold classDef core fill:#E8F3FF,stroke:#2B6CB0,color:#0B2A4A,stroke-width:1.5px classDef gate fill:#EFE9FF,stroke:#6B46C1,color:#2A124D,stroke-width:2.5px classDef risk fill:#FFF1F2,stroke:#C53030,color:#5A1010,stroke-width:1.5px,stroke-dasharray:5 5 classDef win fill:#E9FBEF,stroke:#2F855A,color:#0F3D25,stroke-width:2.5px,font-weight:bold classDef publish fill:#F3F4F6,stroke:#374151,color:#111827,stroke-width:2px
Messy Idea")) B["⚖️ ROI CALCULUS
Clarity vs. Friction"] C{"🔍 LOGIC AUDIT
Wallpaper or Weapon?"} end subgraph ARCHITECTURE["🌀 THE NON-LINEAR PATH"] direction LR D["🏗️ DRAFT V1
Initial Mermaid Syntax"] E@{ label: "🧪 STRESS TEST
Too 'Happy-Path'?" } F["🛠️ REFACTOR
Add Forks & Loops"] G["✂️ TRIM SIGNAL
Kill the Clutter"] end subgraph PAYOUT["🚀 THE SEMANTIC MULTIPLIER"] direction TB H["💎 VIBE CODE READY
Structural Excellence"] I["📢 POST ASSET
Words + Model + Link"] J(("✅ ROI ACHIEVED
Instant Synthesis")) end A --> B B --> C D --> E E -- Too Tidy --> F F --> D E -- Too Noisy --> G G --> D H --> I I --> J C -- Structural Weapon --> D C -- Decorative Junk --> A E -- Earns Its Space --> H J -. User Confusion .-> F E@{ shape: hexagon} A:::spark B:::core C:::gate D:::core E:::gate F:::risk G:::risk H:::win I:::publish J:::spark classDef spark fill:#FFF4CC,stroke:#D6A700,color:#4A3B00,stroke-width:3px,font-weight:bold classDef core fill:#E8F3FF,stroke:#2B6CB0,color:#0B2A4A,stroke-width:1.5px classDef gate fill:#EFE9FF,stroke:#6B46C1,color:#2A124D,stroke-width:2.5px classDef risk fill:#FFF1F2,stroke:#C53030,color:#5A1010,stroke-width:1.5px,stroke-dasharray:5 5 classDef win fill:#E9FBEF,stroke:#2F855A,color:#0F3D25,stroke-width:2.5px,font-weight:bold classDef publish fill:#F3F4F6,stroke:#374151,color:#111827,stroke-width:2px
Notion V2
Restraint under revision. Calm depth without overbuilding.
---
config:
theme: neutral
fontFamily: Aptos, Segoe UI, Inter, Arial, sans-serif
themeVariables:
primaryColor: '#EAF2FF'
primaryTextColor: '#0B2A4A'
primaryBorderColor: '#2B6CB0'
lineColor: '#64748B'
secondaryColor: '#FFF7E8'
tertiaryColor: '#ECFDF5'
fontFamily: Aptos, Segoe UI, Inter, Arial, sans-serif
look: neo
---
flowchart LR
subgraph L1["⚡ Ignition"]
direction TB
A2["Name the claim\nROY = Return on Your Words"]
A1["Define the decision\nand the audience"]
A3{"Is the visual worth its words?"}
A4["Cut scope\nor change the medium"]
B1["Draft the hook\nsnark + signal"]
end
subgraph L2["✏️ Craft - write + model"]
direction TB
B2{"Hook lands\nin 3 lines?"}
B3["Rewrite the open\nkill clever, keep honest"]
C1["Ask LLM for Mermaid skeleton\nugly + fast"]
C2["Render V1"]
C3{"First diagram test\nis it a liar?"}
C4["Add forks + doubt\nmake it honest"]
C5["Kill clutter\nkeep signal ✂️"]
D1["Light styling\nhierarchy + emphasis"]
end
subgraph L3["📐 Proof - compression layer"]
direction TB
D2{"Obvious in 5 seconds?"}
D3["Refactor labels\norder scope"]
E1["Write around diagram\nclaim -> proof -> takeaway"]
end
subgraph L4["🚀 Ship - package + loop"]
direction TB
E2{"Too long\nor too dense?"}
E3["Trim words\nnot meaning"]
F1["Export images\n1 diagram, 1 code"]
F2["Post + pin Mermaid link\nand raw code in comments"]
F3["Comments reveal confusion\nand new edge cases"]
end
S0(("Spark 💥")) --> S1["Text alone is polite confusion"]
S1 --> S2{"Does this need structure\nmore than more words?"}
S2 -- No --> Z1["Stay in prose\nShip the paragraph"]
S2 -- Yes --> A1
A1 --> A2
A2 --> A3
A3 -- Low ROY --> A4
A3 -- High ROY --> B1
B1 --> B2
B2 -- No --> B3
B3 -.-> B1
B2 -- Yes --> C1
C1 --> C2
C2 --> C3
C3 -- Too tidy --> C4
C3 -- Too noisy --> C5
C4 -.-> C2
C5 -.-> C2
C3 -- Earned --> D1
D1 --> D2
D2 -- No --> D3
D3 -.-> C2
D2 -- Yes --> E1
E1 --> E2
E2 -- Yes --> E3
E3 -.-> E1
E2 -- No --> F1
F1 --> F2
F2 --> F3
F3 -.-> D3
A2:::core
A1:::core
A3:::gate
A4:::risk
B1:::draft
B2:::gate
B3:::risk
C1:::draft
C2:::draft
C3:::gate
C4:::risk
C5:::risk
D1:::core
D2:::gate
D3:::risk
E1:::core
E2:::gate
E3:::risk
F1:::publish
F2:::publish
F3:::feedback
S0:::spark
S1:::core
S2:::gate
Z1:::low
classDef spark fill:#FFF4CC,stroke:#D6A700,color:#4A3B00,stroke-width:2.8px
classDef core fill:#EAF2FF,stroke:#2B6CB0,color:#0B2A4A,stroke-width:1.8px
classDef draft fill:#F3F4F6,stroke:#6B7280,color:#334155,stroke-width:1.4px,stroke-dasharray: 6 4
classDef gate fill:#F3E8FF,stroke:#7C3AED,color:#3B0764,stroke-width:2.2px
classDef risk fill:#FFF1F2,stroke:#DC2626,color:#7F1D1D,stroke-width:1.8px
classDef publish fill:#ECFDF5,stroke:#059669,color:#064E3B,stroke-width:2.6px
classDef low fill:#F8FAFC,stroke:#94A3B8,color:#64748B,stroke-width:1.2px,stroke-dasharray: 3 3
classDef feedback fill:#FFF7ED,stroke:#DD6B20,color:#5B3415,stroke-width:1.6px
style L1 fill:#EBF4FF,stroke:#2B6CB0,stroke-width:1.2px,color:#0B2A4A
style L2 fill:#F8FAFC,stroke:#64748B,stroke-width:1.2px,color:#0B2A4A
style L3 fill:#F0FFF4,stroke:#059669,stroke-width:1.2px,color:#064E3B
style L4 fill:#F3F0FF,stroke:#7C3AED,stroke-width:1.2px,color:#3B0764
linkStyle 2 stroke:#7C3AED,stroke-width:2.2px,fill:none
linkStyle 9 stroke:#DC2626,stroke-width:2px,stroke-dasharray:6 4,fill:none
linkStyle 10 stroke:#DC2626,stroke-width:2px,stroke-dasharray:6 4,fill:none
linkStyle 21 stroke:#059669,stroke-width:2.6px,fill:none
← Back to the full article: The First Diagram Is Usually a Liar — V2 Diagrams →
Download the deck: Etch-AI-Sketch deck (square + wide) →
Want to explore Mermaid diagrams yourself?
The diagrams above were built with Mermaid.js and rendered live on this page. To explore the syntax or build your own, Mermaid Chart is the place to start. That is a separate referral path from the diagram links above.