Stitch Skills: Oberflächenentwürfe erzeugen und ändern, sobald MCP bereit ist

Für wen

Wenn Sie Google Stitch schon für Oberflächen nutzen und ein Programmier-Agent nach dem offenen Agent Skills-Standard neue Bildschirme erzeugen, vorhandene ändern oder Designvarianten ausgeben soll, passt dieses Set. Es ist eine Fähigkeits- und Plugin-Sammlung für Google Stitch. Die Erklärseite ist

https://github.com/google-labs-code/stitch-skills

Das Produkt selbst ist

https://stitch.withgoogle.com/

Besser geeignet ist, wer Stitch MCP schon registriert hat, Umgebungsvariablen und Zugangsdaten laut offizieller Installation bereit hat und nur den einen Fähigkeits-Installationsbefehl unten akzeptiert. Diese Fähigkeiten verlangen, dass Stitch MCP in der Agent-Umgebung konfiguriert ist und läuft; ohne MCP gibt es kein aufrufbares Design-Backend. Installationshinweise:

https://stitch.withgoogle.com/docs/mcp/setup/

Der erste Lauf soll eine kleine, prüfbare Erzeugung oder Variante sein, nicht gleich ein ganzes Produktions-Designsystem ändern. Offiziell werden mehrere Programmierumgebungen genannt; bei einer steht manuelle Installation, aber ohne Schritte. Die genannte Liste nicht als einzige nutzbare Umgebungen lesen und keine nicht geschriebenen Installer erfinden. Die Sammlung folgt dem offenen Agent Skills-Standard. Fähigkeitsnamen erscheinen als stitch::generate-design; andere nicht geschriebene stitch::-Namen nicht ergänzen. Fehlen noch Stitch-Konto oder MCP-Zugangsdaten, zuerst zu den Setup-Dokumenten, nicht zuerst npx ausführen.

Erster Versuch in 3 Minuten

Fähigkeiten nur über diesen offiziellen optionalen Installationsbefehl:

npx skills add google-labs-code/stitch-skills

Keinen anderen Markt, kein Plugin und keinen zweiten Fähigkeits-Installer suchen. Nach der Installation den Agent neu starten und prüfen, dass die Fähigkeit erscheint.

Voraussetzung: Stitch MCP ist laut Setup-Dokumenten oben registriert, Umgebungsvariablen und Zugangsdaten sind gesetzt, der Prozess läuft. Ist MCP nicht bereit, bei der Konfigurationsprüfung bleiben, nicht erzeugen aufrufen. Lokal muss npx laufen.

In einem Agent mit installierter Fähigkeit und laufendem MCP eine risikoarme Aufgabe: stitch::generate-design aufrufen, einen Sandbox-Bildschirm in kurzem Text beschreiben (zum Beispiel „eine Leerzustandsseite nur mit Titel und Hauptbutton“), zuerst Prompt an Stitch, ob ein vorhandener Bildschirm geändert wird und ob lokale Dateien geschrieben werden, wiederholen lassen. Erst wenn bestätigt ist, dass nur ein neuer Entwurf entsteht und kein formeller überschrieben wird, weitermachen lassen.

Erfolgssignal: In Stitch erscheint ein passender neuer Bildschirm oder ein öffenbares Design, kein zu Stitch fremdes Schein-HTML. Sagt die Fähigkeit, das Backend sei nicht verfügbar, zurück zu: läuft MCP, folgen die Zugangsdaten den offiziellen Dokumenten. Den Installationsbefehl nicht ändern, um undokumentierte Quellen zu testen. Verlangt sie Geheimnis-Platzhalter, die nicht in den Dokumenten stehen, anhalten. Nur die auf der Setup-Seite genannten Umgebungsvariablennamen verwenden.

Anwendungsfälle

Fall 1: Neuen Bildschirm aus Text oder Bild erzeugen. Die Notiz zu stitch::generate-design lautet: neue Bildschirme aus Text oder Bildern erzeugen. Eine Oberflächenbeschreibung oder ein Referenzbild, das Sie nutzen dürfen, vorbereiten und die Fähigkeit in Stitch einen Erstentwurf machen lassen. Fehlt Bildpfad oder Text, zuerst anhalten. Die Erzeugung landet auf der Stitch-Seite und ist ein Ausgangsaufruf; Prompt zuerst bestätigen. Offiziell gibt es keine Promptvorlagen und keine Bildgrößengrenzen. Fehlen diese Details, Beschreibung kurz halten und keine Parameter erfinden.

Fall 2: Vorhandenen Bildschirm ändern oder Varianten ausgeben. Dieselbe Fähigkeit kann vorhandene Bildschirme bearbeiten und Designvarianten anlegen. Einen vorhandenen Entwurf in Stitch benennen und nur ein oder zwei Varianten verlangen; nicht in Masse überschreiben. Offiziell gibt es keine Variantenobergrenze und keinen Rollback-Knopf, also zuerst sagen lassen, welcher Bildschirm geändert und ob eine Variante extra gespeichert wird; erst nach Bestätigung laufen. Das ist eine andere Operation derselben Fähigkeit wie Fall 1, keine zweite Installation. Schlägt der Agent einen undokumentierten Plugin-Befehl für dieselbe Sache vor, ablehnen und nur den installierten Fähigkeitsnamen weiter nutzen.

Nutzungsgrenzen

Ohne laufendes Stitch MCP ist dieses Set keine gewöhnliche Zeichenfähigkeit. Zuerst Serverregistrierung sowie Umgebungsvariablen und Zugangsdaten abschließen; für fehlende Teile gibt es offiziell keinen Umweg. Den Fähigkeits-Installationsbefehl nicht als MCP-Installationsbefehl behandeln.

Offizielle Fähigkeitsinstallation ist nur npx skills add google-labs-code/stitch-skills. Auf der Seite gibt es auch ein npx plugins add mit --target für einen bestimmten Host; das ist ein Plugin-Ziel, nicht der hier genutzte Fähigkeits-Einstieg. Umgebungen, deren Liste „manuelle Installation“ sagt, haben offiziell keine kopierbaren Schritte; keine Verzeichnis-Kopier- oder Marktbefehle erfinden.

generate-design erzeugt oder ändert Bildschirme in Stitch und ist ein externer Aufruf mit Nebenwirkungen. Prompt, Zielbildschirm und Extra-Speichern zuerst prüfen, dann ausführen. Offiziell ist nicht erlaubt, erzeugte Ergebnisse direkt in eine Produktions-App zu geben, und Fähigkeitsnamen außerhalb der Tabelle werden nicht aufgeführt; ungeschriebene Fähigkeiten nicht raten. Bei Erzeugung aus Bildern nur Referenzen nutzen, die Sie nutzen dürfen. Vor dem Bearbeiten eines vorhandenen Bildschirms in Stitch prüfen, dass er noch Entwurf ist, damit keine ausgelieferte Oberfläche überschrieben wird.