Turning the Hindsight Loop into a Demo People Can Actually Follow

A technically correct system isn't enough if the person watching can't tell what's happening.

I handled the frontend and demo orchestration for our GEO agent. That meant taking outputs from the Scan Agent, Hindsight, and Recommendation Agent and turning them into a clear experience. The hard part: showing the effect of memory without making anyone watch ten real scan cycles.

The dashboard

The founder enters a brand name and expects insights, not backend records. The UI has to make three things easy to grasp:

• the current scan
• the recommendation
• the change across scans

The third is the one that matters here. If the UI only shows the latest recommendation, the audience can't see why Hindsight matters.

Building on fixed data shapes

Because the structures were agreed in advance, I could build against fake JSON before the backend existed:

json
{
"brand": "Acme",
"recommendation": "...",
"past_action_reference": "...",
"confidence_note": "...",
"scan_number": 5
}

The UI never had to wait on the AI pipeline or the memory module. Later, the fake sources were swapped for real API calls without redesigning the UI, as long as the shapes held.

Showing progress across scans

The UI shows how visibility changes over time, for example whether mentions go up or down. Instead of "Current mentions: X", the user sees scan 1 → scan 2 → ... → scan 10 and connects it to the actions in the system. That's where the memory layer becomes visible.

The synthetic ten-scan history

Repeated cycles take time, so the demo uses a believable synthetic history of ten scans for one brand, with visibility shifting in response to specific actions. It shows the intended behavior without pretending ten real cycles happened during the presentation.

The 60 to 90 second story

1. Scan 1: no action history, so a baseline recommendation sets the starting point.
2. Scan 5: previous actions and outcomes are in Hindsight, so the recommendation is more pattern-aware.
3. Scan 10: more experience is available, so the recommendation is more specific and evidence-based.

This is much easier to follow than explaining the memory architecture with diagrams alone.

Keeping the UI independent

The frontend doesn't need to know how the Scan Agent generates queries, how Hindsight stores history, or how the Recommendation Agent writes its text. It needs the agreed data structures. That's also why the frontend has a special role in final integration: it touches every component's output, so stable contracts keep it from being redesigned around every backend change.

What the viewer should take away

Not just "the system generated a recommendation," but why the recommendation changed. The first scan represents limited context, later scans represent accumulated experience, and Hindsight connects them. The frontend makes that progression visible, turning a multi-component architecture into a story a founder can follow.