Atrium
One canvas for everything a company knows: chats, documents, issue boards, pull requests, charts, and web pages sit side by side as cards on a Trellis canvas, linked to each other, with people and AI agents working on the same surface.
- Year
- 2026
- Role
- Solo: product, design, and engineering
- Built with
- Links
- Source code
Overview
Atrium puts a company's information in one place and shows how the pieces relate. The hierarchy is Workspace, Space, Surface, and Card: each surface is a canvas, and its cards are chats, documents, issue boards, pull requests, charts, videos, web pages, images, sticky notes, sketches, and small live dashboards. Cards link to each other, hang under the chat or document that produced them, and open full size in place, so a document becomes a rich text editor and a board becomes a Linear-style issue view. The canvas is Trellis, my own React Flow-style library, and every card is a Trellis node type. A Claude agent built on Mastra works on the surface alongside people, and an MCP endpoint gives any outside agent the same tools. Pull requests and boards are mocks today, with no repository or Linear behind them, and the workspace lives in an in-memory store designed to be swapped for a real one.
What I learned
Atrium was the first real consumer of Trellis, and building a dense, interactive app on it showed me which parts of a canvas library matter: controlled nodes, a typed change stream, and stable coordinates under zoom. I learned to keep layout pure and testable, so Arrange (grouping linked cards into clusters and packing them into rows) is a plain function the store, the client, and agents all share. Multiplayer taught me Server-Sent Events end to end: one stream per open surface, versions hashed per surface so unrelated changes don't reload anyone, presence, and draining streams cleanly on shutdown. Documents are stored as Portable Text but agents read and write Markdown, which meant writing converters both ways, including tables and references to other cards. Running the same tools through Mastra for the in-app agent and through MCP for outside agents made me design the store's functions as the single API everyone goes through.
People and agents should read and write the same cards, through the same functions, and see each other's changes as they happen.
Why it matters
Atrium shows I can design a product model and the interaction work that makes it feel fast: drag, resize, link, lock, arrange, focus, search with ⌘K, and keyboard paths for each. It is a real test of Trellis, since every card type, link, and layout runs on the library I published. The agent work is practical rather than a chat bolted on: the agent creates documents, boards, charts, and UI cards on the canvas, and every viewer watches them appear. The app is covered by 44 Vitest files and 15 Playwright specs, including one that drives two signed-in people on the same surface.
Screens
07 images, select to enlargeHiring a senior frontend engineer?
I'm looking for my next role on a product team, building design systems and AI tooling. The resume has the details, and my inbox is open.