Code via Real World

We stole visual languages from Transit, Chemistry, Music, and Logistics to explain Python.

Industry: Urban Transit

The Decision Metro

Code executes like a subway train. if statements are switch tracks. You can only take one line at a time.

ticket_type = "VIP"

if ticket_type == "VIP":
  enter_lounge()
elif ticket_type == "Regular":
  wait_in_line()
else:
  go_home()
%%{init: {'theme': 'base', 'themeVariables': { 'primaryColor': '#ffffff', 'edgeLabelBackground':'#fff', 'tertiaryColor': '#fff'}}}%% graph LR Start((START)) ==>|Main Line| Check{Check Ticket} Check ==>|Line A: VIP| Lounge(VIP Lounge) Check ==>|Line B: Regular| Platform(Public Platform) Check -.->|Line C: Invalid| Exit(Street Exit) Lounge ==> End((End)) Platform ==> End Exit ==> End classDef station fill:#fff,stroke:#0f172a,stroke-width:4px,font-family:'Outfit',font-weight:bold,color:#0f172a; classDef junction fill:#0f172a,stroke:#fff,stroke-width:4px,color:#fff; class Start,Lounge,Platform,Exit,End station; class Check junction; linkStyle 0 stroke:#0f172a,stroke-width:6px; linkStyle 1 stroke:#10b981,stroke-width:6px; linkStyle 2 stroke:#3b82f6,stroke-width:6px; linkStyle 3 stroke:#ef4444,stroke-width:4px,stroke-dasharray: 5 5; linkStyle 4 stroke:#10b981,stroke-width:6px; linkStyle 5 stroke:#3b82f6,stroke-width:6px; linkStyle 6 stroke:#ef4444,stroke-width:4px,stroke-dasharray: 5 5;
Industry: Chemistry

Molecular Lists

A List is a molecule. The atoms (items) are bonded together in a specific order. Breaking the bond (removing an item) changes the structure.

molecule = ["H", "O", "H"]

# Atoms are connected by index
print(molecule[1])
%%{init: {'theme': 'dark', 'look': 'hand'}}%% graph LR Atom0((H)) --- Bond1[Bond 0] --- Atom1((O)) --- Bond2[Bond 1] --- Atom2((H)) subgraph Nucleus [List Structure] direction LR Atom0 Atom1 Atom2 end classDef hydrogen fill:#e2e8f0,stroke:#94a3b8,stroke-width:2px,color:#0f172a,font-size:24px; classDef oxygen fill:#ef4444,stroke:#f87171,stroke-width:4px,color:#fff,font-size:32px; classDef bond fill:none,stroke:none,color:#94a3b8,font-size:10px; class Atom0,Atom2 hydrogen; class Atom1 oxygen; class Bond1,Bond2 bond; linkStyle default stroke:#94a3b8,stroke-width:3px;
Industry: Audio Engineering

The Function Patch Bay

Functions are like effects pedals or audio processors. You patch a signal (Input) in, it gets processed inside, and a modified signal (Output) comes out.

def distortion_pedal(sound):
  return sound + " BZZZT!"

clean_guitar = "Strum"
rock_n_roll = distortion_pedal(clean_guitar)
%%{init: {'theme': 'dark'}}%% graph LR Input[Guitar Signal] -- Cable --> JackIn((In)) subgraph Pedal [Distortion Function] direction LR JackIn --> Circuit[Processing Circuit] Circuit --> JackOut((Out)) end JackOut -- Cable --> Amp[Amplifier Output] classDef plug fill:#333,stroke:#fbbf24,stroke-width:4px,color:#fff; classDef box fill:#e11d48,stroke:#9f1239,stroke-width:2px,color:#fff,rx:10,ry:10; classDef wire stroke:#fbbf24,stroke-width:4px; classDef ext fill:#222,stroke:#555,color:#fff; class JackIn,JackOut plug; class Circuit box; class Input,Amp ext; linkStyle default stroke:#fbbf24,stroke-width:4px,curve:basis;
Industry: Logistics

Dictionary Warehouse

A Dictionary is a warehouse. You don't ask for "Item #1" (Index). You ask for a specific label (Key), and the forklift brings you the box (Value).

warehouse = {
  "A1": "Tires",
  "B2": "Windows"
}

print(warehouse["A1"])
%%{init: {'theme': 'base', 'themeVariables': { 'primaryColor': '#ffffff', 'edgeLabelBackground':'#fff', 'tertiaryColor': '#fff'}}}%% graph TD Order[📋 Manifest: Fetch 'A1'] --> Forklift Forklift{🚜 Forklift} -- Key: 'A1' --> ShelfA[Rack A] Forklift -- Key: 'B2' --> ShelfB[Rack B] ShelfA --> Box1[📦 Box: 'Tires'] ShelfB --> Box2[📦 Box: 'Windows'] classDef machine fill:#facc15,stroke:#a16207,stroke-width:2px,color:#000; classDef paper fill:#fff,stroke:#cbd5e1,color:#000; classDef rack fill:#475569,stroke:#1e293b,color:#fff; classDef box fill:#d97706,stroke:#92400e,color:#fff; class Forklift machine; class Order paper; class ShelfA,ShelfB rack; class Box1,Box2 box; linkStyle default stroke:#64748b,stroke-width:2px,stroke-dasharray: 5 5;