Source: c125 × c123 — the tour layer's panel, dialled in · 2026-10-29 · notes cycles/c125.operations-wizard/tour-layer.md § 6
The same tour, the same steps, five panels. v1 is the first build, kept as it was. v2 and v3 answer Mark's review of it: the dark panel may not survive a theme change, and the panel is information overload, colliding with its own controls. Each iteration opens on the same step (Source health · Watch); switch between them at any step from the iteration switch in the mock bar's tour row.
The tours
Five tours, in the order a customer meets them (c123 tours-plan.md). Each opens from its first step in v5 · Panel, the design going forward (Mark, 2026-10-29). Demo opens it with the lab's chrome hidden and an empty Policy Config draft, for recording (Shift+D toggles it on any lab page). Earlier iterations stay a click away. Every stop and step: Tours.
Tour | Steps | Open |
|---|---|---|
Start here Install on one machine and watch it report. | 6 | |
Common AI risks What could go wrong with AI here, and what Qpoint does about each. | 11 | |
Observe, then enforce Turn protection on without breaking anyone's work. | 8 | |
AI spend Who's spending what on AI, and where to save. | 6 | |
OWASP® Agentic Top 10 Your agents against the paper, and your evidence. | 22 | |
Simulation · Phishing for financial records A story of AI going wrong, played as a simulation on synthetic data. | 8 | |
Simulation · The server that phones home A story of AI going wrong, played as a simulation on synthetic data. | 7 | |
Simulation · The secrets stealer A story of AI going wrong, played as a simulation on synthetic data. | 8 | |
Simulation · The public link A story of AI going wrong, played as a simulation on synthetic data. | 7 | |
Simulation · Card numbers to a stranger A story of AI going wrong, played as a simulation on synthetic data. | 6 | |
Simulation · The runaway loop A story of AI going wrong, played as a simulation on synthetic data. | 8 | |
The iterations
v1 · Grape
2026-10-27The first build: a dark grape panel, the whole step in it, the switches in its header.
- Stop bar, beats and risk IDs in the header
- Lede, numbers, mitigations, lists and settings in the body
- Panel (Float · Split) and Focus (Ring · Dim · Fade) in the header
Opens with Float · Ring.
v2 · Cyan
2026-10-29v1's panel, light, with every word in cyan, so the narrator reads as meta text in light and dark mode alike.
- The page's own surface for the panel; cyan 600 to 800 type (cyan 100 to 400 in dark mode)
- Content and controls as v1, plus Ring + Dim
- Rings, callouts, Examples and the pill in cyan
Opens with Split · Ring + Dim.
v3 · Brief
2026-10-29v2's material, cut to a title and a description. The controls move to the mock bar.
- Panel: the stop's name, the question, the step's lede (a drill: its "what if" and what happens today)
- The step's one action, then Back and Next
- Mock bar: stop and its bar, beats, risk IDs, Panel, Focus, minimize, end
Opens with Split · Ring + Dim.
v4 · Tuned
2026-10-29v3 as Mark redrew it in Illustrator: one blue-cyan, a tinted overlay, no ring, a bigger callout.
- #0099ff for every word and fill, white type on fills, on white (black in dark mode)
- Overlay #73858f at 60%, laid over the sticky band and the tray too; the highlighted section is the cut-out, with no ring and 12 px more room
- Callout: 13 px semibold, a big numbered disc, a pointer toward the section
Opens with Split · Dim.
v5 · Panel
2026-10-29v4 with an Example's controls in the panel: numbered like its card, with Simulate and the scenario to simulate.
- The card on the page keeps only its number
- In the panel: the number, the card's name, a Simulate box and a scenario (the lab's five drills)
- Ticking, or picking a scenario, shows the example on the card
Opens with Split · Dim.
The callout: TourMarker
One piece for every callout the tour draws (v4 and v5), from Mark's 2026-10-29 sheet: a number, an optional title and description, a size (lg, sm) and a pointer (left, center, none; on the bottom edge, or the top when it sits below what it marks). With neither title nor description it's a pin. Extra content (v4's Simulate box) goes in its slot.
Across v2 and v3
- Cyan is the tour's material, not grape: the panel, ring, callouts, Example frames, top edge and pill. Grape is the product's primary, so a grape narrator reads as product. v3 and the marks use pure cyan (#00FFFF) on a white ground, black in dark mode; light-mode type is a deep cyan, since pure cyan can't be read on white. v2's panel keeps the Tailwind cyan it was built with. No token yet.
- Ring + Dim, a fourth Focus: the scrim with the ring at full strength (Dim alone keeps the ring quiet). The default for v2 and v3.
- A slow scroll to each step's region: an eased glide (0.7 to 1.6 s by distance) that centres it under the sticky band, and stays put when it's already in view. A wheel or touch stops it. v1 keeps its quick jump.
- The tour's in-page marks sit under the sticky band (z 15 to 18; the band is 20 to 40), in every iteration.