PM & KI 19. Mai 2026 · 7 Min Lesezeit

Story-Map als Eigenbau. Wie zwei Stunden mit Claude und ein Vercel-Deploy mein Team aufs MVP eingeschworen haben.

TL;DR

In zwei Stunden mit Claude einen MVP-Story-Map-Builder geplant, auf Vercel deployt, mit Supabase als Realtime-Backend. In der Team-Session hat das Tool ohne Methodendiskussion getragen: Hypothesen explizit, Swim-Lanes klar, Decision-Log automatisch. Alle waren danach aufs MVP eingeschworen.

Vor zwei Wochen hätte ich für eine MVP-Scoping-Session einen Miro-Board aufgesetzt. Eine Woche vorher Templates suchen, Sticky Notes vorbereiten, Workshop-Skript schreiben. Diese Woche habe ich stattdessen zwei Stunden mit Claude einen eigenen Story-Map-Builder konzipiert, ihn auf Vercel deployt, ein Supabase-Backend angeschlossen und die Live-URL ans Team geschickt. Alle waren am Ende aufs MVP eingeschworen, nicht trotz, sondern wegen des Tools.

Wie der Eigenbau entstanden ist

Story-Mapping nach Jeff Patton ist eine bekannte Methode: Journey-Steps horizontal, Stories vertikal, MVP-Linie quer durch die Karten. In der Praxis scheitert das Format oft an drei Dingen:

  1. Karten haben keinen Bezug zu Hypothesen.
  2. Entscheidungen werden in der Session getroffen, aber nirgendwo dokumentiert.
  3. Die Übergabe vom Workshop in das Backlog ist manuelle Arbeit, die niemand macht.

Genau diese drei Lücken wollte ich schließen.

Die ersten zwei Stunden waren reines Konzept: Welche Spalten? Welche Swim-Lanes? Wie sind Hypothesen mit Karten verknüpft? Brauchen wir Drag-and-Drop oder reicht ein Klick-Toggle? Wer darf editieren, wer nur lesen? Wie kommen die MVP-Karten in Linear? Diese Fragen habe ich mit Claude durchgegangen, eine Skizze gemacht, eine Datenstruktur festgelegt. Der Plan stand, bevor eine Zeile Code geschrieben war. Danach hat Claude den Build übernommen, ich habe iteriert.

Die Features

Das Tool ist eine einzelne Web-App mit zwei Seiten: Story-Map und DACI-Matrix. Auf der Story-Map sehen alle Beteiligten dieselben Daten in Echtzeit, dank Supabase. Die linke Sidebar listet neun Hypothesen (H1 bis H9). Klick auf eine Hypothese filtert die Map: nur Karten, die diese Hypothese adressieren, bleiben sichtbar. Die Karten sitzen in einem Grid aus Journey-Steps, in vier Swim-Lanes: MVP, Next, Nie, Undecided. Ein Modal erlaubt das Anlegen neuer Karten in der Session selbst, mit Titel, Begründung in einem Satz, Hypothesen-Chips und Swim-Lane. Der Coverage-Panel oben zeigt, welche Hypothesen bereits abgedeckt sind und welche im MVP fehlen. Die rechte Sidebar ist ein Decision-Log: jede Lane-Änderung wird automatisch festgehalten, mit Zeitstempel.

Drei Aktionen lösen den Übergang aus der Session in die echte Arbeit aus. Snapshot für Claude kopiert eine Markdown-Zusammenfassung des aktuellen Stands ins Clipboard und lädt JSON herunter. Damit kann ich nach der Session mit Claude an einer detaillierten Spec weiterarbeiten. MVP-Cards in Linear ist ein Bulk-Sync: alle Karten in der MVP-Lane werden als neue Linear-Issues angelegt. Vom Whiteboard ins Backlog mit einem Klick. Drucken / PDF ist die Print-View für Stakeholder, die nichts mit Linear oder Vercel zu tun haben.

Die DACI-Matrix daneben hat eigene Features: Zeilen für Entscheidungs-Typen, Spalten für Rollen, Zellen mit zyklischem Klick durch D, A, C, I, leer. Header sind direkt editierbar, Zeilen und Spalten lassen sich live hinzufügen. Auch hier: Snapshot für Claude und JSON-Export.

Das Tool ist nicht das Ergebnis. Das Tool ist das Format, in dem die Entscheidungen so passen, dass sie sich am Ende selbst exportieren.

Was ich dabei gelernt habe

Es war mein erster Vercel-Deploy. Ich kannte die Plattform aus dem Hörensagen, hatte aber nie eine eigene App dort gehosted. Der Schritt von "lokaler Prototyp" zu "Live-URL, die mein Team aufrufen kann" hat fünf Minuten gedauert, nicht eine halbe Stunde, wie ich erwartet hatte. Was länger gedauert hat: die Supabase-Konfiguration. Realtime-Sync zwischen mehreren Browsern in derselben Session ist nicht trivial, weil Identitäten, Auth und Konfliktlösung dazukommen. Claude hat das Setup übernommen, aber ich musste die Konzepte verstehen, weil Bugs erklärt werden wollen. Postgres Row-Level-Security war ein Begriff, den ich nicht kannte. Jetzt schon.

Die größte methodische Lehre: Anpassungen unterwegs sind keine Schwäche, sondern Teil des Builds. Während der zwei Stunden haben wir gemeinsam Sachen verworfen, neu eingebaut, anders strukturiert. Drag-and-Drop kam später dazu, weil sich in der Konzept-Phase gezeigt hat, dass Klick-Toggle für Lane-Wechsel nicht reicht. Die Hypothesen-Chips wurden eingeführt, weil ich beim Skizzieren gemerkt habe, dass Karten ohne Hypothese-Bezug das Anti-Pattern sind, das ich vermeiden will. Diese Iterationen wären in einem klassischen Build mit ausgelagertem Engineering nicht möglich gewesen.

Was die Session gemacht hat

In der Session saß das Team vor dem Tool. Der erste Stand war vorbereitet: alle 9 Hypothesen drin, Karten als Vorschläge in Undecided. In der ersten halben Stunde wanderten Karten in MVP, Next oder Nie, jede Verschiebung kurz begründet, der Decision-Log schrieb alles mit. War ein Punkt strittig, zeigte das Coverage-Panel die Antwort: ist diese Hypothese sonst nirgends abgedeckt? Wenn nicht, musste etwas in die MVP-Lane.

Die zweite Stunde war intensiver, und hier zeigte sich der Wert der DACI-Matrix. Die Rollen waren vorab geklärt: Wer die UX verantwortet, war als Approver markiert. Als eine Karte zum Onboarding-Flow ins MVP-Tier rutschte, kam von dort das Veto, die Lane funktioniere ohne diese Karte nicht. Die Diskussion war in zwei Minuten durch, weil DACI klargemacht hatte, wer hier den letzten Anstoß gibt. Parallel sorgte die moderierende Rolle dafür, dass keine Hypothese verwaiste, während der Driver Karten umhängte und Begründungen festhielt. Nicht die Personen entschieden den Streit, sondern die vorher verteilten Verantwortlichkeiten.

Am Ende stand: ein dokumentiertes MVP, Hypothesen explizit zugeordnet, ein Decision-Log mit Begründungen, und durch den Linear-Bulk-Sync war der ganze MVP-Scope fünf Minuten später als Issues im Repo. Was vorher zwei Wochen gedauert hätte, war an einem Nachmittag geklärt.

Was ich mir vornehme

Ich möchte das Pattern wiederholen, aber bewusster mit dem zeitlichen Trade-off umgehen. Zwei Stunden Konzeptarbeit vor einer wichtigen Session lohnen sich, wenn die Session selbst sonst zwei Tage gekostet hätte und das Ergebnis halb-strukturiert in einem Miro-Export verschwunden wäre. Das ist nicht jede Session. Für Routine-Standups oder kurze Abstimmungen ist der Eigenbau Overkill. Ich brauche ein Gespür dafür, wann der Aufwand passt.

Außerdem will ich die Tool-Sammlung als modulare Bausteine begreifen. Story-Map und DACI sind wiederverwendbar. Beim nächsten Projekt werde ich vermutlich nicht von Null anfangen, sondern aus der bestehenden Codebase forken. Das ist eine zusätzliche Lernkurve: Wie behalte ich diese Bausteine sortiert und wartbar, ohne dass die Sammlung selbst zur neuen Last wird.

Kritische Einordnung

Der Eigenbau funktioniert, weil ich mit Claude einen Co-Pilot habe, der Code schreibt. Ohne diese Hebelwirkung wäre der Aufwand für das Tool höher als der Nutzen. Es bleibt also ein Privileg, an das andere Teams ohne KI-Zugang nicht so leicht herankommen. Ich überschätze auch nicht, was eine einzelne Session ändert: Team-Alignment in zwei Stunden hält nur, wenn die Folge-Arbeit darauf aufbaut. Wenn das Tool nach der Session in der Schublade verschwindet, war der Aufwand umsonst. Und schließlich: die ganze Methode steht und fällt mit der Qualität der Hypothesen, die ich vorher formuliert habe. Schlechte Hypothesen führen zu schlechtem Scope, egal wie schön die Story-Map aussieht.

Was bleibt für jeden Tag

Eigene Tools sind nicht mehr Overkill.

Wenn der Aufwand zwei Stunden ist und die Session sonst zwei Tage kostet, lohnt sich der Bau.

Hypothesen gehören aufs Board.

Karten ohne Hypothese-Bezug sind das Anti-Pattern. Sichtbar machen, nicht weg-moderieren.

Format trägt das Ergebnis.

Wenn die Struktur stimmt, exportiert sich das Resultat fast von selbst. Decision-Log und Linear-Sync ersetzen das Workshop-Protokoll.

Glossar

Story-Map — Visualisierung von Journey-Steps und Stories nach Jeff Patton

Swim-Lane — Horizontale Spur, hier MVP, Next, Nie oder Undecided

Hypothese — Falsifizierbare Annahme, die mit dem Produkt getestet wird

Decision-Log — Automatische Liste aller Entscheidungen mit Zeitstempel

Realtime-Sync — Mehrere Browser sehen dieselben Daten in Echtzeit (Supabase)

Bulk-Sync — Mehrere Karten gleichzeitig als Issues in Linear anlegen

PM & AI May 19, 2026 · 7 min read

Story map, built it myself. How two hours with Claude and a Vercel deploy got my team aligned on the MVP.

TL;DR

Two hours with Claude to plan an MVP story map builder, deployed on Vercel, with Supabase as the realtime backend. In the team session, the tool carried the room without a method debate: hypotheses explicit, swim-lanes clear, decision log automatic. Everyone was aligned on the MVP by the end.

Two weeks ago, I would have set up a Miro board for an MVP scoping session. A week of preparation: find templates, prepare sticky notes, write a workshop script. This week I spent two hours with Claude designing my own story map builder, deployed it on Vercel, connected a Supabase backend, and sent the live URL to the team. Everyone was aligned on the MVP by the end, not in spite of the tool but because of it.

How the build came about

Story mapping in Jeff Patton's tradition is a known method: journey steps horizontal, stories vertical, MVP line cutting across. In practice the format often fails on three points:

  1. Cards have no link to hypotheses.
  2. Decisions made in the session are not documented anywhere.
  3. The handover from workshop to backlog is manual work nobody does.

Closing those three gaps was the goal.

The first two hours were pure concept: which columns? which swim-lanes? how are hypotheses linked to cards? do we need drag-and-drop or is a click toggle enough? who can edit, who can read? how do MVP cards get into Linear? I went through these questions with Claude, sketched the layout, defined the data structure. The plan was set before a line of code was written. Then Claude took over the build and I iterated.

The features

The tool is a single web app with two pages: story map and DACI matrix. On the story map, everyone in the room sees the same data in real time, thanks to Supabase. The left sidebar lists nine hypotheses (H1 to H9). Click a hypothesis and the map filters: only cards that address that hypothesis stay visible. Cards sit in a grid of journey steps, in four swim-lanes: MVP, Next, Never, Undecided. A modal allows creating new cards during the session itself, with title, one-sentence rationale, hypothesis chips, and swim-lane. The coverage panel at the top shows which hypotheses are already covered and which are missing in the MVP. The right sidebar is a decision log: every lane change is recorded automatically with a timestamp.

Three actions trigger the handover from session to actual work. Snapshot for Claude copies a markdown summary of the current state to the clipboard and downloads a JSON. With that, I can keep working with Claude on a detailed spec after the session. MVP cards into Linear is a bulk sync: every card in the MVP lane is created as a new Linear issue. From whiteboard to backlog with one click. Print / PDF is the print view for stakeholders who don't deal with Linear or Vercel.

The DACI matrix next to it has its own features: rows for decision types, columns for roles, cells with cyclic clicks through D, A, C, I, empty. Headers are directly editable, rows and columns can be added live. Same handover here: snapshot for Claude and JSON export.

The tool is not the result. The tool is the format that fits decisions in such a way that they export themselves at the end.

What I learned

It was my first Vercel deploy. I knew the platform by reputation but had never hosted my own app there. Going from "local prototype" to "live URL my team can open" took five minutes, not the half hour I had expected. What took longer: the Supabase configuration. Real-time sync between several browsers in the same session is not trivial, because identity, auth, and conflict resolution come in. Claude handled the setup, but I had to understand the concepts because bugs need explaining. Postgres row-level security was a term I did not know. Now I do.

The biggest methodological lesson: adjustments along the way are not weakness, they are part of the build. During the two hours we threw things out, added new ones, restructured. Drag-and-drop came later because the click toggle was not enough for lane changes. Hypothesis chips were introduced because while sketching I noticed that cards without a hypothesis link are exactly the anti-pattern I want to avoid. These iterations would not have been possible in a classical build with engineering outsourced.

What the session did

In the session the team sat down in front of the tool. A first state was prepared: all nine hypotheses in, cards as suggestions in Undecided. In the first half hour cards moved into MVP, Next, or Never, each move briefly justified, and the decision log captured everything. When a point was contested, the coverage panel gave the answer: is this hypothesis covered anywhere else? If not, something had to go into the MVP lane.

The second hour was more intense, and here the value of the DACI matrix showed. The roles were clarified in advance: whoever owns UX was marked as approver. When a card on the onboarding flow slipped into the MVP tier, the veto came from there: the lane does not work without that card. The discussion was over in two minutes because DACI had made it clear who calls the final shot. In parallel, the moderating role made sure no hypothesis was orphaned, while the driver moved cards and kept the rationales in the log. It was not the people who settled the dispute, but the responsibilities assigned beforehand.

By the end we had: a documented MVP, hypotheses explicitly mapped, a decision log with rationales, and through the Linear bulk sync the entire MVP scope was in the repo as issues five minutes later. What used to take two weeks was settled in one afternoon.

What I commit to

I want to repeat this pattern, but with more deliberate awareness of the time trade-off. Two hours of concept work before an important session pays off when the session would otherwise have cost two days and the result would have disappeared half-structured in a Miro export. That is not every session. For routine standups or short alignments, the build-it-yourself approach is overkill. I need a sense of when the effort fits.

I also want to treat the toolkit as modular building blocks. Story map and DACI are reusable. On the next project I will probably not start from zero but fork from the existing codebase. That is an additional learning curve: how to keep these blocks sorted and maintainable so the collection itself does not become the new burden.

A critical look

The build-it-yourself approach works because I have Claude as a copilot writing code. Without that leverage, the effort for the tool would be higher than the benefit. So it remains a privilege that other teams without AI access cannot easily reach. I am also not overestimating what a single session changes: team alignment in two hours only holds if the follow-up work builds on it. If the tool disappears in a drawer after the session, the effort was wasted. And finally: the whole method stands or falls with the quality of the hypotheses I formulated up front. Bad hypotheses lead to bad scope, no matter how nice the story map looks.

What stays with you every day

Custom tools are no longer overkill.

When the build takes two hours and the session would otherwise cost two days, the build pays off.

Hypotheses belong on the board.

Cards without a hypothesis link are the anti-pattern. Make them visible, do not moderate them away.

Format carries the result.

When the structure is right, the result almost exports itself. Decision log and Linear sync replace the workshop minutes.

Sources

  1. Jeff Patton (2014). User Story Mapping. O'Reilly.
  2. Own story map tool (self-built), built with Claude Opus 4.7.
  3. Supabase Realtime Documentation.
  4. Vercel Deployment Documentation.

Glossary

Story Map — Visualization of journey steps and stories after Jeff Patton

Swim-Lane — Horizontal lane, here MVP, Next, Never, or Undecided

Hypothesis — Falsifiable assumption tested through the product

Decision Log — Automatic list of all decisions with timestamps

Realtime Sync — Several browsers see the same data in real time (Supabase)

Bulk Sync — Create multiple cards as Linear issues at once