Personal R&D · Generative AI · Vibe coding

I built the design-thinking facilitator I wanted in the room.

Catalyst guides a hackathon or discovery team from a blank start to a shared problem, chosen idea, prototype plan and ready-to-share brief in one live session.

ProductReal-time workshop for teams of up to six
My roleConcept, product direction, UX flow, prompting and iterative review
Build approachCompletely vibe-coded with generative AI
StackExpress, Socket.IO, vanilla JavaScript, OpenAI, PptxGenJS

Catalyst · Start or join

Catalyst screen for starting a workshop or joining with a four-letter room code
01

Opportunity

Digital whiteboards provide the canvas. Teams still have to run the workshop.

Mural and FigJam are powerful, flexible spaces for collaborative work. That flexibility also leaves the facilitator responsible for choosing a template, explaining each activity, setting the pace, moving the group forward, synthesising the wall and packaging the result. For a small hackathon team without a dedicated facilitator, that is a lot of invisible work.

Blank-canvas cost

Setup comes before thinking

The team must understand the board and the method before it can focus on the problem.

Facilitation load

Someone has to conduct the room

Prompts, timers, transitions and decisions compete with participating in the session.

Broken thread

Outputs need manual synthesis

Notes and votes do not automatically become a clear problem statement, plan or hand-off.

How might a product conduct the workshop so every person can take part in it?
Starting point

This was a personal product hypothesis shaped by my experience with collaborative workshops, not a commissioned project or completed research study. The prototype now creates something concrete to test with real teams.

02

Product idea

Replace a template with a guided, stateful workshop.

Catalyst gives the room one shared path. Each phase carries its decisions into the next, so the winning problem becomes the statement the team frames, the ideas it explores and the plan it takes away.

1Gather

Contribute independently on a timer.

2Cluster

Turn notes into shared themes.

3Vote

Spend stars on what matters.

4Frame

Write the problem and HMWs.

5Ideate

Run guided rounds and choose.

6Prototype

Scope the MVP and assign work.

Catalyst lobby showing participant check-in and facilitator controls
A four-letter code gets the team into one room. The facilitator sets the prompt and pace without preparing a separate board.
03

Design principles

Enough structure to keep momentum, enough control to keep the team in charge.

01

Guide the next action

Each phase explains the activity, shows the relevant controls and makes the next transition clear.

02

Protect independent input

The first brain-dump stays blind until reveal, reducing anchoring on the first or loudest contribution.

03

AI proposes; people decide

AI can cluster, draft and role-play. The team can move notes, edit language and cast every deciding vote.

04

Keep the thread intact

Problems, themes, votes, HMWs, ideas and scope remain connected through the final export.

The workshop in practice

The interface changes with the work the team needs to do.

Catalyst does more than place activities beside each other. It changes the rules, visibility and controls at every stage to support the behaviour that stage needs.

Gather · Empathise

Start privately so every voice enters the room

People add one problem per note against a shared prompt. During the timer, they see participation energy rather than other people’s content. The full wall appears together when time ends.

Blind brain-dump screen with a timer and private notes
Only per-person contribution counts stay visible before the reveal.
Cluster · Make sense

Let AI accelerate synthesis without owning it

The team can drag notes into themes and rename or remove groups. An optional AI action proposes clusters with reasons, while a local keyword fallback keeps the session moving without an API key.

Affinity mapping screen with notes organised into clusters
AI clustering creates a first pass that the team can override directly.
Vote · Converge

Make prioritisation visible and shared

Each participant gets a fixed star budget. Tally changes appear live, and the highest-voted problems carry into framing rather than disappearing on the board.

Dot-voting screen with star controls and live totals
A constrained vote turns a crowded wall into a collective priority.
Frame · Define

Turn the winning concern into language the team can build from

The team edits a point-of-view statement and How Might We questions together. Optional AI personas make stakeholder assumptions discussable and can be interviewed in character during the session.

Define screen with top-voted problems, a problem statement and personas
The define phase connects evidence, framing and empathy in one shared view.
Ideate · Explore

Use rounds to separate generation from selection

A Note & Vote sequence moves through silent storming, building on ideas and deciding. Ideas land under the HMW question they answer, then stars select the strongest direction.

Guided ideation screen with HMW buckets, ideas and round controls
Structure replaces the facilitator’s repeated verbal instructions.
Prototype · Plan

End with the thinnest buildable version

The final planning step captures what belongs in the MVP, what stays out, key assumptions, risks, success measures and task ownership. AI can draft the plan, but every field remains editable.

Prototype planning screen with MVP scope, assumptions, risks, metrics and tasks
The chosen idea becomes a practical hand-off rather than another isolated sticky note.
Brief · Package

Carry the whole workshop into the next conversation

The final brief preserves the problem, HMW, chosen idea, affinity map, personas, top ideas, MVP scope and assigned tasks. The team can export to PowerPoint, Markdown or print-ready PDF.

Catalyst final brief with the workshop thread and export options
The result stays shareable and traceable after the live room ends.
04

Vibe-coded build

I treated generative AI as the implementation partner and kept product judgement with me.

The application is completely vibe-coded. I worked from the experience I wanted, described behaviours and constraints in prompts, reviewed the output in the browser and kept refining the flow until the parts operated as one workshop.

I directed

The product logic

The workshop sequence, participant rules, facilitation model, AI boundaries and definition of a useful final brief.

AI generated

The implementation

The Express and Socket.IO server, single-page client, AI helpers, export logic and much of the interface code.

I reviewed

The working experience

Language, phase transitions, multi-participant behaviour, fallbacks and whether each step prepared the next one.

Why this project matters to my practice

Vibe coding let me test a systems-level UX idea that would otherwise have stayed as a diagram. The work shifted from drawing screens to specifying behaviour: what each person can see, when the group advances, where AI helps, how humans override it and what survives at the end.

05

System design

A small real-time architecture supports the facilitation model.

The technical choices follow the experience: one always-on server keeps every participant in sync, while per-person filtering makes private contribution possible before reveal.

Participants

Facilitator browser
+
Team browsers
Four-letter room

Live session

Socket.IO events
In-memory room state
Filtered updates by phase

Optional AI

Session-only API key
Cluster / define / personas / plan
Local fallbacks

Deliberate constraints

  • No account or install for participants
  • API key held in server memory for that session
  • One server instance for live room state
  • Vanilla client with no build step

Current trade-offs

  • Rooms disappear when the server restarts
  • Horizontal scale needs a shared session store
  • Bring-your-own-key adds facilitator friction
  • Long-term storage is outside the prototype scope
06

Outcome

The prototype proves the full workshop can live in one coherent product.

Catalyst now supports a complete real-time path from room creation to export. The source describes multi-client testing for the blind phase, reveal, clustering, voting, synchronisation and final brief.

For participants

Join from any device, contribute independently and see decisions carry forward.

For facilitators

Run a repeatable workshop without constructing and narrating a whiteboard from scratch.

For the team

Leave with a chosen problem, idea, MVP plan and a shareable record of how it got there.

What remains unproven

This is a working personal R&D prototype, not a validated commercial product. I have not claimed time savings or workshop-quality improvements. A live pilot should measure completion rate, facilitator interventions, decision confidence, export usefulness and where teams still need human support.

Next experiment

  • Run the same challenge with one team in Catalyst and one team using a prepared whiteboard.
  • Observe where participants pause, ask for explanation or work around the intended flow.
  • Compare time to a usable brief, contribution balance and confidence in the chosen direction.
  • Use the evidence to decide whether persistence, stronger moderation or different AI assistance should come next.

Reflection

Vibe coding expanded what I could prototype. UX judgement still determined whether it became a product.

Catalyst taught me to specify a service through states, permissions, timing and hand-offs, then use generative AI to make those decisions executable. The code was AI-generated. The product point of view was mine.

Try Catalyst yourself