Skip to content

Demo Journey: 90 Seconds to Value

The pitch in one line

Event fires → AI recommends → Operator approves → KPIs update -- all in 5 seconds.

Live demo flow

%%{init: {'theme': 'base', 'themeVariables': {'primaryColor': '#1e3a5f', 'primaryTextColor': '#ffffff', 'primaryBorderColor': '#0d253f', 'lineColor': '#4a90d9', 'secondaryColor': '#e8f4fd', 'tertiaryColor': '#f0fdf4', 'fontFamily': 'Inter, system-ui, sans-serif'}}}%%
graph LR
    classDef trigger fill:#ef4444,stroke:#b91c1c,color:#fff,stroke-width:2px,font-weight:bold
    classDef process fill:#3b82f6,stroke:#1d4ed8,color:#fff,stroke-width:2px
    classDef ai fill:#8b5cf6,stroke:#6d28d9,color:#fff,stroke-width:2px
    classDef action fill:#10b981,stroke:#059669,color:#fff,stroke-width:2px,font-weight:bold
    classDef outcome fill:#f59e0b,stroke:#d97706,color:#fff,stroke-width:2px,font-weight:bold

    E["fa:fa-bolt Event fires<br/>damage_detected"]:::trigger
    C["fa:fa-layer-group Context fused<br/>customer + device + ops"]:::process
    AI["fa:fa-brain AI recommends<br/>Approve repair"]:::ai
    OP["fa:fa-user-check Operator approves<br/>one click"]:::action
    KPI["fa:fa-chart-line KPIs update<br/>Cost Avoided +$210"]:::outcome

    E --> C --> AI --> OP --> KPI

Arc 1 -- The core loop

Duration: 90 seconds | Audience: Everyone

KPI strip appears with live numbers:

Active Issues Claims NBA Score Cost Avoided MTD
1,286 642 87% $1.41M

Simulator sends device.damage_detected. Within 5 seconds:

  • Active Issues ticks 1,286 → 1,287 (WebSocket, real-time)
  • Timeline shows new rows: damage &rarr; claim &rarr; payment

Card appears: "Approve repair -- Screen damage"

  • High Impact badge
  • Right panel: iPhone 14 Pro, John Doe, 4 reason codes, uBreakiFix Dallas

One click. Within 5 seconds, the dashboard updates:

KPI Change
Cost Avoided +$210
Active Issues -1
NBA Score +0.1%

Timeline: "Repair center assigned". Alert: "Repair scheduled."

The value prop lands when the KPI ticks.

Arc 2 -- Widget builder

Duration: 30 seconds | Audience: Everyone

%%{init: {'theme': 'base', 'themeVariables': {'primaryColor': '#8b5cf6', 'primaryTextColor': '#ffffff', 'primaryBorderColor': '#6d28d9', 'lineColor': '#a78bfa', 'fontFamily': 'Inter, system-ui, sans-serif'}}}%%
graph LR
    classDef user fill:#3b82f6,stroke:#1d4ed8,color:#fff,stroke-width:2px
    classDef clarifier fill:#8b5cf6,stroke:#6d28d9,color:#fff,stroke-width:2px
    classDef result fill:#10b981,stroke:#059669,color:#fff,stroke-width:2px,font-weight:bold

    A["fa:fa-plus Click Add Widget"]:::user
    B["fa:fa-comment Type prompt<br/>'Cost avoided by region'"]:::user
    C["fa:fa-cogs Clarifier streams<br/>intent &rarr; match &rarr; gaps"]:::clarifier
    D["fa:fa-question-circle Answer 1 question<br/>'Cost avoided in USD'"]:::user
    E["fa:fa-wand-magic-sparkles Spec synthesized<br/>live chart preview"]:::clarifier
    F["fa:fa-check Add to dashboard"]:::result

    A --> B --> C --> D --> E --> F
Time Action What the audience sees
1:20 Click + Add Widget Full-screen modal: chat left, preview right
1:25 Type prompt Clarifier streams through contextLoader → intentExtractor → gapDetector
1:35 Answer 1 question "What measure?" → "Cost avoided in USD" → Submit
1:40 Clarifier resumes specSynthesizer → critic → live chart preview appears
1:50 Click Add to dashboard Widget appears in My Widgets rail

Arc 3 -- Data binding

Duration: 3 minutes | Audience: Engineering reviewers only -- skip for exec audiences

%%{init: {'theme': 'base', 'themeVariables': {'primaryColor': '#1e3a5f', 'primaryTextColor': '#ffffff', 'lineColor': '#64748b', 'fontFamily': 'Inter, system-ui, sans-serif'}}}%%
graph LR
    classDef postgres fill:#10b981,stroke:#059669,color:#fff,stroke-width:2px
    classDef databricks fill:#8b5cf6,stroke:#6d28d9,color:#fff,stroke-width:2px
    classDef failover fill:#f59e0b,stroke:#d97706,color:#fff,stroke-width:2px
    classDef yaml fill:#ec4899,stroke:#be185d,color:#fff,stroke-width:2px

    PG["fa:fa-database Postgres<br/>green badge"]:::postgres
    DB["fa:fa-warehouse Databricks<br/>purple badge"]:::databricks
    FAIL["fa:fa-exclamation-triangle Fail-loud<br/>amber badge"]:::failover
    YAML["fa:fa-file-code YAML reroute<br/>green &rarr; purple"]:::yaml

    PG --> DB --> FAIL --> YAML
Time Demo step Badge state
0:00 Hover KPI tile Postgres -- Xs ago
0:20 Add Databricks-routed widget Databricks -- real claim count
0:50 Kill Databricks token Mock -- fail-loud (ADR-008)
1:20 Reroute cost_avoided_mtd in YAML Same tile, new backend
2:30 Close "Same dashboard. One YAML edit. Different backend."
Speaker notes

Arc 1 (the money shot):

  • Rehearse until you can do it in exactly 90 seconds. The value prop lands when the KPI ticks live on screen.
  • If the WebSocket update takes more than 5s, say "real-time means real latency" and move on.

Arc 2 (widget builder):

  • Use the sample prompt -- do not improvise. The Clarifier's metric matcher is tuned for catalog-seeded terms.
  • If Bedrock is slow, narrate the SSE stages as they stream.

Arc 3 (data binding):

  • Engineering audiences only. Skip entirely for exec presentations.
  • The YAML reroute is the "mic drop" -- same tile, different warehouse, one config edit.

Fallback: Refer to demo-runbook.md for full timing, fallback lines, and reset procedures. Run make demo-reset before every demo.