Speculative concept · 2026
A visual grammar
for agent workflows
Using Mistral’s modular cube and pixel language to show an AI agent writing, delegating and working
Mistral’s identity is built from modular cubes, pixel-like blocks and a compact orange-red palette. I wanted to visualise the process of a complex agent flow in a dynamic, adaptable live animation: writing a response, delegating work, using tools, asking for approval and recombining the result.
The orange typing cursor and the mother agent represent the main AI at work. As it streams a response, it appears as a cursor. When work begins, the cursor moves down and expands into the mother-agent cube giving birth to a visible hierarchy. Once the delegated worker agents have finished and returned, the square collapses back into the cursor and continues writing.
Scale, direction and layers
The mother’s direct subagents share her scale. Every generation after that is half the width and height of its own mother. Direct subagents are born beneath the mother and then move into their own row. Deeper agents emerge from the right side of their mother and remain attached edge-to-edge. Down means direct delegation, right deeper delegation.
Tools being used enter from above and click directly onto the agent using them. Their size follows their host: modules used by the mother and her direct subagents include the logo, while smaller modules use the monochrome block alone. Children emerge from behind their parent agents, and completed ones integrate back by returning behind them.
State belongs to the agent
Colour identifies an agent while appearance identifies what it is doing. Full colour means active, the same colour at 40% opacity means waiting. Yellow-orange is the temporary appearance of a child emerging over its mother before it settles into its own assigned colour. Movement is reserved for changes in structure, while processing changes appearance.
Approval comes from outside the system. When an agent needs a person, it hollows from solid to outline and adds an exclamation mark in its own colour. The square’s centre expands outwards, leaving the perimeter behind, and approval reverses the same transformation. The outlined agent supports two levels of interaction. It can be clicked directly for quick approval, or hovered to reveal the full question and controls. A branch waiting on an answer dims behind the one square that is asking.
Consultation happens inside it. The mother can leave her position and slide sideways into the slot directly above an agent — the same slot a tool occupies — and hold there while they confer. Using a resource and reporting to the orchestrator are the same kind of act, so they share the same geometry. Colour is what separates them: a tool leaves its host unchanged, while an agent the mother has docked with shifts along the palette away from her for as long as she is there. An agent she reaches this way goes back to work.
Two kinds of time
Birth, return, tool attachment and recentering use fixed durations because those movements are part of the visual language. Thinking, tool use and approval can last for different amounts of time because they belong to the work being represented.
A structural movement is allowed to finish before the same agent changes again, while states that need to be understood receive a minimum hold.
Speculative work not affiliated with or commissioned by Mistral AI. Designed in August 2026. The deterministic JavaScript prototype was coded with Codex, Grok Build and Claude Code.
