# Doop

> An open-source multiplayer design canvas where humans and AI agents collaborate side by side in real time, connected via MCP with OAuth.

Doop is an open-source multiplayer design canvas that lets people and AI agents work on the same artboard simultaneously, with every keystroke streaming live. Built by kgoedecke and licensed under AGPL-3.0, it positions itself as an open-source alternative to Paper.design. The hosted version at doop.design is free while in beta, and the full stack can be self-hosted with a single Docker command.

## What It Is

Doop is a browser-based infinite canvas where frames are live HTML artboards rendered in sandboxed iframes. Humans edit frames directly in the browser; AI agents connect through a built-in MCP (Model Context Protocol) server over streamable HTTP with OAuth, so every agent action is attributed to the human who approved the connection. The result is a shared studio where presence, tasks, and feedback flow between people and agents in real time — not a prompt-and-refresh loop, but a live collaborative session.

## How the Agent Workflow Operates

Connecting an agent takes one terminal command and a browser approval step. Once connected, the agent:

- Calls `set_status` to broadcast what it's working on — shown in a live "working-now" strip and the Tasks panel
- Creates and streams HTML into frames using `append_frame_html` in ~300–500 character chunks, producing a typewriter-style reveal for viewers
- Calls `get_frame_screenshot` to review its own output via a headless Chromium renderer, then iterates before handing off
- Picks up human feedback left on any task via `get_feedback`, claiming it exactly once so notes aren't double-processed

The MCP tool set covers the full design lifecycle: listing and creating canvases, adding and editing frames, streaming or replacing HTML, taking screenshots, and managing agent status.

## Multiplayer Architecture

The realtime layer runs over a per-canvas WebSocket room. Human edits and agent mutations go through the same shared actions layer, so both appear identically in the activity feed and presence stack. Key architectural details from the README:

- **In-memory store with write-through to Postgres** (or embedded PGlite for zero-config local dev)
- **DOM morphing** instead of iframe reloads — streaming ticks update the live document in place without white-flashing
- **Server-side typewriter smoothing** — HTML is broadcast at ~500 chars/s with backlog acceleration, so even one-shot agent designs play back as a smooth stream
- **Agent presence expires** after ~20s of inactivity (~60s while a status is posted), keeping the presence stack clean

## Self-Hosting and Deployment

The repo ships a production Dockerfile that includes Chromium for frame screenshots. The README documents three deployment paths:

- `npm run dev` — zero-config local dev with embedded PGlite, no external services required
- `docker compose up` — production build with a managed Postgres
- Railway or Fly.io — container hosts that auto-detect the Dockerfile

Required production environment variables are `BETTER_AUTH_SECRET` and `BETTER_AUTH_URL`. SMTP is optional; without it, signup stays open and reset links print to the server log.

## Update: v0.1.0 — Initial Open-Source Release

The project's first public release, v0.1.0, was published on August 22, 2026, the same day the repository was created. The GitHub metadata confirms the AGPL-3.0 license, TypeScript as the primary language, and topics including `ai-agents`, `canvas`, `claude-code`, `mcp`, and `multiplayer`. The project is described as actively accepting PRs, with an integration test suite (`npm test`) that boots the real server against a throwaway database.

## Features
- Multiplayer design canvas with live cursors and presence
- AI agents connect via MCP over streamable HTTP with OAuth
- Live HTML frame streaming with typewriter reveal effect
- Agent task narration and Tasks panel with per-agent history
- Human feedback on tasks picked up by next available agent
- Built-in headless Chromium renderer for agent self-review via screenshots
- Infinite canvas with zoom, pan, and dot grid
- Frames are sandboxed HTML artboards with DOM morphing (no white-flash)
- Design memory: pin exemplar frames and capture style decisions
- Private canvases by default with email invite and link sharing
- Activity feed logging all human and agent actions
- Self-host with Docker Compose or npm run dev (zero config)
- Embedded PGlite for local dev, real Postgres for production
- MCP OAuth: agent actions attributed to the approving human
- WebSocket-based real-time sync for all mutations

## Integrations
Claude Code, OpenAI Codex, Any MCP client (streamable HTTP + OAuth), Postgres, PGlite (embedded), Puppeteer / Chromium (headless screenshots), SMTP (optional, for email verification), Railway, Fly.io, Docker

## Platforms
LINUX, WEB, API, CLI

## Pricing
Open Source

## Version
v0.1.0

## Links
- Website: https://doop.design
- Documentation: https://github.com/kgoedecke/doop
- Repository: https://github.com/kgoedecke/doop
- EveryDev.ai: https://www.everydev.ai/tools/doop
