Visuelles Feedback Tool für KI-Apps

Du baust Apps mit KI — mit Lovable, v0, Claude Code oder Cursor. Der Bau dauert nur noch Minuten. Der Flaschenhals ist das Review: jemand muss sich die Preview ansehen und dem Agent präzise sagen, was falsch ist.

Patchrooms ist dafür die visuelle Feedback-Schicht. Ein einziges Script auf der Live-Preview, und jeder mit dem Link klickt das kaputte Element an und schreibt (oder spricht) einen Kommentar. Aus dem Klick wird ein strukturierter Report — kein "der Button links, nein der andere" mehr im Slack-Thread.

<script src="https://room.patchrooms.com/v1/patchrooms.js"
        data-project-key="pr_xxx"
        data-mode="artifact-review"></script>

Kein Build-Step, kein separates Review-Tool zum Öffnen. Die Preview deiner App ist die Oberfläche, auf die geklickt wird.

Damit der Agent nicht raten muss, packt jeder Report den vollen Kontext des Moments ein:

• den DOM-Selector des angeklickten Elements
• einen Screenshot genau dieser Stelle
• die Page-URL, den Viewport und den Browser
• eventuelle Konsolen-Fehler auf der Seite
• den Kommentar — getippt oder als Voice-Note, die automatisch transkribiert wird

Mehr wird nicht erfasst. Kein Session-Recording, kein Tracking über deine App hinaus. Es geht nur um das eine Element und den einen Kommentar.

Wer reviewt, braucht keinen Account und keinen Login — nur den Preview-Link. Kommentieren ist frei und unbegrenzt. Nur die Person, die die Reports triagiert, meldet sich im Dashboard an.

Zum Einbetten nutzt du den public project key (pr_...) — der darf im HTML stehen. Der geheime Secret Key (pr_sk_*) für den MCP-Zugriff bleibt serverseitig und gehört nie in den Browser.

Jeder Report hat einen "Copy agent feedback"-Button. Ein Klick macht daraus einen Markdown-Block, den du direkt in Claude Code, Cursor, Lovable, v0 oder Bolt einfügst. Der Markdown-Text selbst bleibt bewusst auf Englisch — das ist die Sprache, in der der Coding Agent am zuverlässigsten arbeitet:

## Patchrooms report: onboarding preview
**Selector:** `header > nav > button.cta`
**Goal:** Fix the layout collision at mobile widths.
**Constraints:** Keep desktop unchanged. Keep the button inside the header.

- **Viewport:** 375x812 (mobile)
- **Console:** none
- **Screenshot:** https://app.patchrooms.com/blob/6f2a91
- **Comment (transcribed):** "On mobile the Upgrade button sits on top of the nav bar."

Oder du überspringst das Einfügen: über den MCP-Server liest der Agent die Queue direkt (list_reports / get_report, Screenshots inline) und schließt erledigte Reports mit set_status. Lesen und Schließen sind heute live.

Das gleiche Script tag läuft auf jeder Live-Preview. Es gibt Anleitungen pro Tool:

• Patchrooms für Lovable und für v0 — Preview-Review für Builder-Chats
• Patchrooms für Claude Code und für Cursor — Feedback-Workflow für Coding Agents
• Agent-ready Feedback — wie strukturierter Kontext den Agent trifft

Die vollständige Doku bleibt auf Englisch unter docs.patchrooms.com. Preise und Workflows zeigen den Rest.