Claude Code macht an einem Nachmittag aus einer Idee einen klickbaren Prototyp: echte Screens, echte Links, Buttons, die irgendwohin führen. Beim Teilen hakt es, denn ein Ordner auf deinem Laptop ist kein Link, den du an einen Kunden, eine PM oder Testpersonen schicken kannst. Bitte Claude Code: „Stell diesen Prototyp online“, und es führt einen Befehl aus, der eine Live-HTTPS-Adresse und einen Link zum Behalten liefert. Kein Konto, kein Git und keine Build-Pipeline, die du vorher einrichten musst.
So funktioniert es
- Bau den Prototyp mit Claude Code. Schlichte HTML-Seiten oder eine kleine React- oder Vite-App. Bitte um eine echte Seite pro Screen, damit jeder Screen eine eigene Adresse hat, die man öffnen und als Lesezeichen speichern kann.
- Bitte Claude Code, ihn zu teilen. Es führt
npx -y lobsite --yesim Ordner aus. Nur die gebauten Dateien werden hochgeladen, und unterwegs fragt nichts nach. - Schick den Link. Claude gibt die Adresse und den Übernahme-Link weiter. Öffne den Übernahme-Link und melde dich an, um den Prototyp länger als 6 Stunden zu behalten; die Adresse ändert sich nicht.
Prompte einen Prototyp, kein Mockup
Ein paar Zeilen zu Beginn der Sitzung ersparen eine Korrekturrunde vor dem Teilen. Füg das mit deinem Briefing in Claude Code ein:
Build this as a static, clickable prototype:
- One HTML page per screen, linked with relative paths (about.html, not /about.html).
- Fake data in the page itself; no backend, no API keys, no login.
- Every button and link goes somewhere, even if it's a "not built yet" screen.
- Works on a phone as well as a laptop.
When it's done, share it with `npx -y lobsite --yes` and give me the link.
Relative Pfade sind am wichtigsten: Mit ihnen öffnen sich dieselben Dateien von deinem Laptop, unter einer Vorschau-Adresse und später unter deiner eigenen Domain.
Ein Link pro Iteration
Prototypen ändern sich nach jedem Review. Lass den Link, den du schon verschickt hast, funktionieren und stell die neue Version daneben:
npx -y lobsite --yes --preview
Ein Vorschau-Deploy bekommt eine eigene Adresse, während der Hauptlink weiter die Version zeigt, die gerade geprüft wird. Schick die Vorschau an die Person, die um die Änderung gebeten hat. Ist sie abgestimmt, macht npx lobsite promote <id> sie zur Hauptversion, und ein Rollback nimmt sie in einem Schritt zurück, wenn das Feedback anders ausfällt. In einem kostenlosen Konto behalten Deploys der letzten 7 Tage ihre Vorschau-Adressen (30 Tage mit Standard), sodass „v2“ und „v3“ beim nächsten Review noch zum Vergleichen da sind.
Wer ihn sehen kann
- Ohne Konto wird der Prototyp nicht von Suchmaschinen indexiert und nach 6 Stunden entfernt, wenn du ihn nicht übernimmst.
- Vorschau-Adressen werden nie indexiert, in keinem Tarif.
- Mit Standard setzt du ein Passwort in den Einstellungen der Website. Jede Adresse der Website fragt danach, Vorschauen und eigene Domain eingeschlossen. Prüfende geben es einmal pro Browser ein, und eine Änderung meldet alle ab. Das Passwort liegt im Dashboard, nicht im Projekt, landet also nie in einem Repository.
Das ist meist gemeint mit „Können wir das zwischen uns und dem Kunden halten?“. Wirklich Vertrauliches gehört gar nicht erst in einen Prototyp.
Mit Nutzern testen
Ein gehosteter Prototyp ist eine URL, und mehr brauchen die meisten Testtools nicht. Füg die Adresse in Maze, Lyssna oder UserTesting als Website-Aufgabe ein, oder schick sie direkt an die Teilnehmenden. Jeder Screen hat einen eigenen Pfad, also kann eine Aufgabe auf /checkout.html beginnen, und Erfolg kann „/thanks.html erreicht“ heißen.
Brauchst du Antworten aus dem Prototyp selbst, etwa von einem Anmelde- oder Umfrage-Screen? Lass das Formular an /_lobsite/forms/feedback senden; sobald der Prototyp in einem Konto ist, kommen Einsendungen mit Spamfilter per E-Mail an. Siehe Formulare.
Ein Deploy ohne Konto ist 6 Stunden live. Mit dem Übernahme-Link behältst du es, kostenlos.
Vorschau ansehen, bevor es live geht. Mit einem Klick zurückrollen, samt Weiterleitungen.
Mit Standard fragt jede Adresse der Website nach einem Passwort. Prüfer geben es einmal pro Browser ein.
Keine Rückfragen unter einem Agent, und eine Tell the user:-Zeile mit der URL und dem Übernahme-Link.
Lass ein Formular auf /_lobsite/forms/contact zeigen. Spamfilter inklusive.
Auch für kostenlose Konten: Füge einen DNS-Eintrag hinzu, und die Website zieht auf deine Domain um. Jede Website hat HTTPS, in jedem Tarif.
Prototypen aus Claude Code: Lobsite und die üblichen Wege zum Teilen
| Lobsite | Claude-Artifact-Link | Netlify Drop | GitHub Pages | |
|---|---|---|---|---|
| Wer hochlädt | Claude Code, mit einem Befehl | Du, auf claude.ai | Du, durch Hineinziehen eines Ordners | Claude Code, mit Commit und Push |
| Konto zum Start | Keins für 6 Stunden | Claude-Konto | Keins für etwa eine Stunde | GitHub-Konto und Repository |
| Mehrseitige und React-Builds | Ja, der ganze Ordner | Eine Seite pro Artifact | Ja | Ja, mit einem Workflow für den Build |
| Ein Link pro Iteration | --preview, mit Promote und Rollback |
Jedes Mal ein neues Artifact | Jedes Mal eine neue Website oder ein neues Deploy | Nicht eingebaut |
| Passwort | Ja, mit Standard | Nur Team-Freigaberegeln | In kostenpflichtigen Netlify-Tarifen | Nein |
Ein Claude-Artifact-Link reicht für einen Screen. Sobald der Prototyp ein Ordner voller Seiten ist, die Claude Code in deinem Projekt geschrieben hat, spart ein Hoster, der den Ordner so nimmt, wie er ist, das Kopieren und Einfügen.
Häufige Fragen
Kann ich einen Prototyp aus Claude Code kostenlos hosten?
Ja. Ohne Konto ist er 6 Stunden live. Übernimm ihn mit dem Link, den Claude dir gibt, und er bleibt in einem kostenlosen Konto unter derselben Adresse online.
Die Links meines Prototyps funktionieren lokal, aber online nicht mehr. Warum?
Meist absolute Pfade: /about.html zeigt auf die Wurzel der Domain, und die unterscheidet sich zwischen deinem Laptop und einer gehosteten Adresse. Bitte Claude Code um relative Links (about.html, ./img/logo.png) und deploye erneut. Nur die geänderten Dateien werden hochgeladen.
Funktioniert ein React-Prototyp mit Routen?
Ja. Schalte den Single-Page-Modus ein, mit spa = true in lobsite.toml oder Single-Page-App in den Einstellungen der Website, damit Links auf /settings oder /orders/42 die App öffnen statt einer 404.
Kann ich den Prototyp eines Kunden auf dessen eigene Domain legen?
Ja. Kostenlose Konten enthalten eine eigene Domain: Füg einen DNS-Eintrag hinzu, und der Prototyp zieht dorthin um, mit HTTPS.
Kann Claude Code den Prototyp nach einem Review aktualisieren?
Ja. lobsite.toml merkt sich die Website, also aktualisiert derselbe Befehl aus jeder Sitzung dieselbe Adresse. Füg der CLAUDE.md eine Zeile hinzu, damit jede Sitzung es gleich macht; siehe Eine Website aus Claude Code deployen.