SP/CTRL

1. Brief

Bubbles is a local, single-user studio system for augmented design work. It is not a chatbot, not a linear wizard, not an autonomous AI designer, and not a SaaS with delusions of grandeur. It is a UI/UX experiment in making agentic workflows feel playful, legible, and human: a personal automation tool, a live demo system for workshops, and a framework that teaches how to think with agents without outsourcing judgment to them.

The core metaphor is water-cooler talk in a design studio: structured work happens in departments, ideas and opinions happen in conversation, and nothing moves unless the human explicitly decides it should.

2. Mental Model

Bubbles is organized around tabs, not steps. Each tab is a mode of work, not a checkpoint in a wizard. The user can move between modes freely, revisit earlier choices, branch ideas, or restart entirely without the system pretending it is making clever assumptions in the background.

The workflow is linear in intention, non-linear in execution. There is no “finalize” button. There is no hidden state mutation. That is the point: the user should always know what the system is waiting for, what has been created, and what still requires a decision.

3. Modes of Work

Prompting is the strategy surface. The large text field holds the actual design brief, not a chat. Change the brief and you redefine the project. A style must be chosen before anything serious happens, and once selected it becomes globally binding until the user explicitly requests a new direction. This is the hard gate that keeps the GPTs from flip-flopping into visual nonsense.

Departments are production tasks, not personalities: Copy, Wireframe, HTML/CSS, File Creation, Archive & Analyse, Case Studies. Create buttons are one-shot triggers. Click them again and nothing regenerates. Upload buttons are the manual override. The DNA Mutate control is the only sanctioned route for variation, and even then the style stays locked. Create = instantiate. Mutate = explore. New style = new direction.

Discussion is the water-cooler tab. The user chooses which personas are in the room, only selected personas answer, and every response is constrained by the style already chosen. Save is deliberate: it copies selected responses into a Scratch Pad the human curates by hand. The system may read from that memory later, but it never writes into it automatically.

Files is the artifact shelf. Only successful Create or Mutate actions put anything there. The shelf is read-only, download-only, and free of hidden “helpful” behavior. It exists to keep a single source of truth for what the system has actually produced.

Ghost converts HTML/CSS into Ghost templates. It sits in the product, but it is outside the current backend planning pass.

4. Process Proof

The easiest way to lie about AI is to hide the mechanism. Bubbles does the opposite. The interface makes the system’s contract obvious: a brief goes in, a style is locked, explicit triggers fire, and artifacts appear later in a separate shelf. The user never has to guess whether something is “still thinking” or whether a file exists.

The same familiars already haunting the rest of the Order show up here as functional participants rather than decorative mascots. The user decides who is in the room, who gets to answer, and which responses are worth keeping. That turns “multi-agent” from abstract hype into an observable, teachable behavior.

5. Control Rules

The speech and thought bubble system exists for one reason: state should be visible. Waiting, success, and conversational intent are surfaced directly beside the avatars rather than hidden behind logs, spinners, or false certainty. “Thinking...” means a real action was triggered and the system is waiting. “Done!” means the action completed and the resulting file is now on the shelf.

The implementation is intentionally low-hassle: pure HTML and CSS overlays positioned relative to avatars, with minimal JavaScript toggles. The bubbles are ephemeral, stateless, and UI-only. They do not persist across reloads and they do not store data.

Underneath that, the project obeys a few non-negotiable laws: no automatic regeneration, no silent state changes, no system-written memory, human judgment first, and AI treated as collaborator rather than authority. Bubbles is designed to teach those rules through interface behavior, not through a scolding help document nobody reads.

6. Next Step

The current system runs locally. The next layer is n8n, but the backend is expected to mirror the UX exactly: no hidden logic, explicit triggers, observable states. The first workflow to formalize is the simplest useful loop: Discussion tab -> selected personas -> one user prompt -> multiple constrained responses returned.

7. Tools

HTML + CSS — interface structure, visual state, and the bubble overlays
Minimal JavaScript — explicit triggers, class toggles, and local UI logic without framework bloat
OpenAI personas — constrained responses from selected agents, always inside the chosen style
Local file system — the artifact shelf and the single source of truth for generated outputs
n8n (planned) — backend orchestration that mirrors the same explicit, human-readable contract

Arthur — system architecture, interaction design, workflow logic, and the refusal to let the machine pretend it is in charge