Composer

Composer came to life when I joined DXOS, a tiny startup with the noble goal of bringing decentralized computing to the masses. I coined the name ‘Composer’ based on the app’s stated goals of openness and extensibility – it composes the peer-to-peer reactive ontology with a first-party system UI and third-party plugins.

A deeply extensible stack

In order to get the app going, it needed a design system. Before shadcn even existed, I’d decided to pair Radix UI with Tailwind — this would give the app a highly extensible foundation of accessible headless primitives and a system for styling elements that would be familiar to a growing audience of developers. I connected Radix primitives with Tailwind in an indirect way, mediated by a tx function supplied in a React context, which would allow developers to supply their own theme as needed.

After a while building verticals straight-up from the design system, we decided it was time for better extensibility. I guided the app’s framework ontology, a system which registers plugins that can provide logic and content for different aspects of the app, from translations to schemas to React components. The latter would be resolved through a Surface component, whereby plugins can both put out a request for another plugin to render something by rendering <Surface role={…} data={…}/> and another plugin (or the same one) can volunteer to fulfill it with a way to render that data. Eventually plugins became asynchronously loadable, so the user could go to the registry’s UI and enable/disable them as they liked.

Multitasking on two axes

We continued to encounter situations I would imagine any super-app would encounter – as a user doing something complex, I would often need multiple documents open at the same time. Of course any web app facilitates this out of the box by virtue of being hosted by a browser window, but browsers’ affordances for multitasking are very generic and mean loading a heavy web app like Composer from scratch in each new tab.

To ameliorate this, I took a page from my design playbook at AMBOSS and built Deck, a layout plugin for Composer which arranges open objects horizontally. One (or more) of those objects could be a Stack, which could arrange a collection of arbitrary objects vertically. Together, these design patterns would facilitate highly end-user configurable multitasking for experiences we knew would benefit from that, and also for an experience which was on the horizon at the time: collaborating with an LLM.

More soon

Archiving is tough! I’ll write more about all the love that’s gone into Composer, check back again soon.