ai-ecosystem-visualizations

The AI monitoring dataset Qpoint captures — sessions, users, agents, endpoints, models, API keys, tools, files, secondary network calls — is visually rich but currently expressed only as tables and list views. qflow and qmap offer spatial, animated, relational idioms that could make this data immediately legible to security teams. This cycle explores what those idioms look like in practice, without committing to production-bound designs.

Build 2–3 visual experiments using the AI session/inventory data as a test fixture. Each experiment asks a distinct security question and answers it spatially:

• Session Graph: "What did this agent touch?"
• Infrastructure Map: "Who is connected to what, org-wide?"
• (future) Capability Surface: "What tools are exposed across the org?"

Not constrained to PixiJS — medium chosen per experiment.

• qflow/dev/experiments/c11.ai-ecosystem/ — PixiJS canvas experiments
• design/app/pages/ai-viz/ — Vue/SVG experiments (if applicable)
• design/cycles/c33.ai-ecosystem-visualizations/ — this cycle

• design/CLAUDE.md — Added qmap and qflow to Sister Projects with when-to-use guidance, visual output description, data contracts, and known limitations
• qmap/CLAUDE.md — Added Visual Output (mesh types/shapes/colors), Data Model (actor, dataflow, groupBy shapes), and Capabilities & Limitations sections; updated Actors glossary to include user and agent types (c14)
• qflow/CLAUDE.md — Added Visual Output (2D canvas layout description), Data Model (audit log required/optional fields, full clientConfig shape), and Capabilities & Limitations sections

All experiments live in qflow/dev/experiments/c11.ai-ecosystem/. Versioned as Exp{Name}.r{N}.vue — non-destructive, all iterations preserved and switchable from the nav shell.

ExpSessionGraph.r1.vue — Zone layout. Linear left-to-right: Actors → Infrastructure → Files → External Hosts. Directed edges with arrowheads, edge weight by access count. Risk signals: sensitive files red, unexpected hosts orange, animated pulse rings.

ExpSessionGraph.r2.vue — Radial layout. Agent at center. Four arc sectors radiate outward: User (top), Infrastructure (right arc: endpoint/model/key), Files (left arc), External Hosts (bottom arc). Donut-slice sector backgrounds group like entities. Spoke weight by access count. Files sized by access frequency.

ExpInfraMap.r1.vue — Org-wide infrastructure map. Endpoints (left, grouped by type: dev/CI/cloud) connect to models (right, hexagons sized by session volume) via animated traveling dots. Edge color = API key used (blue=shared org, green=CI pipeline, amber=unknown). Concentration risk and credential outliers emerge spatially.

ExpCapSurface.r1.vue — Capability surface. Four MCP server clusters (Built-in, GitHub, Figma, DB MCP) with tool nodes sized by call volume, colored by error rate. query_db flagged red (50% error rate). backup_table dimmed (never called — latent capability).

Data: data/ai-session.js (single rich session), data/org-wide.js (6 endpoints, 3 keys, 3 models), data/capabilities.js (4 MCP servers, 17 tools).

Produced four PixiJS experiments in qflow/dev/experiments/c11.ai-ecosystem/ — two session-graph layouts (zone and radial), an org-wide infrastructure map, and a capability surface — each answering a distinct security question spatially. Documented qmap/qflow visual output, data model, and limitations in all three CLAUDE.md files so the visualization tools became usable from sibling projects. Its threads were carried forward by c41 (signal column flow) and c43 (inventory map); closed in the c69 sweep.