Launchpad

Launchpad turns a single keyword into a mind map. You give it a word and pick a category like Marketing or Storytelling. It lays out a constellation of related ideas on a canvas you can pan and zoom. The look runs with the launch metaphor, a pale starfield and a rocket that lifts off while it thinks.

It was my entry at the 2026 ElementX Hackathon, a weekend event at work.

How it works

Choosing a category swaps the three fields underneath it. Marketing asks for a product, an industry and an audience, while Storytelling wants a genre, a setting and characters. Those answers go to the agent as context, so what comes back is specific to what you are working on.

Then there is the wait, which is where a good part of the design went. The rocket climbs on a loop, and the label under it reads out the topics the first agent has already come up with while the second is still laying them out. Once the map lands, selecting a node lights the line of thought back to the root, and any node can be expanded, edited or deleted.

How it's built

• React, Vite and TypeScript, with React Flow for the canvas.
• MUI for the controls and Zustand for state.
• The OpenAI Agents SDK drives two agents in sequence.

Two agents, one map

A brainstormer writes a three level hierarchy in Mermaid mind map syntax, and a translator converts that text into typed nodes and edges, with tree layout coordinates so nothing overlaps. A Zod schema validates the shape before it reaches the canvas. Expanding a branch runs the same pair again, rooted on that one node.