stitch-design-taste
Premium-UI-Designsysteme für Google Stitch generieren
Claude-Agenten erzeugen häufig generische, KI-optisch wirkende Interfaces. Dieses Skill erzwingt strenge Designstandards, um Premium, Anti-Generische UI-Spezifikationen zu generieren, die häufige Fallstricke wie Inter-Schriftart, Neon-Glühen und zentrierte Hero-Bereiche vermeiden.
Die Skill-ZIP herunterladen
In Claude hochladen
Gehe zu Einstellungen → Fähigkeiten → Skills → Skill hochladen
Einschalten und loslegen
Teste es
Verwendung von "stitch-design-taste". Generiere eine Designspezifikation für ein Fintech-Dashboard
Erwartetes Ergebnis:
Eine DESIGN.md-Datei mit: Canvas White (#F9FAFB) Hintergrund, Charcoal Ink (#18181B) Text, Emerald Signal (#10B981) Akzent für Wachstumsmetriken, Geist-Schriftart in Gewichtung 700-900 für Überschriften, Monospace für alle Zahlen, Federphysik-Animationsspezifikationen (Steifheit: 100, Dämpfung: 20) und explizite Verbote für Inter-Schriftart, Neon-Glühen und generische Platzhalterdaten.
Verwendung von "stitch-design-taste". Erstelle eine Designspezifikation für eine redaktionelle Magazin-Site
Erwartetes Ergebnis:
Eine DESIGN.md-Datei mit: Hoher Kreativität (9), hoher Varianz (8), asymmetrischen Hero-Layouts mit Inline-Bild-Typografie, markanten modernen Serif-Schriften (Fraunces, Instrument Serif) für Display, strikter 65ch Maximalbreite für Fließtext und Bewegungsinszenierung mit gestaffelten Enthüllungen.
Sicherheitsaudit
SicherStatic analysis flagged 205 potential issues, all evaluated as false positives. The skill contains only markdown documentation files describing design system specifications. No executable code, shell commands, or cryptographic operations exist. All detected patterns are design terminology being misinterpreted by the scanner (e.g., CSS hash notation, font weight values, design system references). Safe for publication.
Qualitätsbewertung
Was du bauen kannst
Premium-Landingpages erstellen
Generiert Designspezifikationen für hochwertige Landingpages, die generische KI-Ästhetik vermeiden. Perfekt für Startups, die eine professionelle, unverwechselbare Webpräsenz wünschen.
Konsistente Designsysteme aufbauen
Eine konsistente visuelle Sprache über eine Produktpalette hinweg etablieren, indem Typografie, Farbe, Abstände und Komponentenverhalten in einer einzigen Informationsquelle dokumentiert werden.
Mit Design-Einschränkungen prototypisieren
Die Anti-Patterns-Liste als Leitplanken beim schnellen Prototypisieren verwenden. Die expliziten Verbote verhindern häufige Designfehler, bevor sie auftreten.
Probiere diese Prompts
Nutze den stitch-design-taste Skill, um eine DESIGN.md für ein [beschreibe deinen Projekttyp, z.B. 'SaaS-Dashboard'] mit einem [Kreativitätslevel 1-10] Kreativitäts-Setting und [Dichtelevel 1-10] Dichte zu generieren.
Nutze den stitch-design-taste Skill, um eine DESIGN.md für [beschreibe dein Projekt] zu erstellen. Die Stimmung ist [beschreibe Stimmung, z.B. 'redaktionelles Magazin mit markanter Typografie']. Setze Varianz auf 8 und Motion auf 6.
Nutze den stitch-design-taste Skill, um eine DESIGN.md für ein datenintensives Dashboard zu generieren. Setze Dichte auf 9, Varianz auf 7 und aktiviere Monospace für alle numerischen Werte. Inkludiere permanente Animationen für Statusindikatoren.
Nutze den stitch-design-taste Skill, um eine DESIGN.md für ein minimalistisches Portfolio zu erstellen. Setze Kreativität auf 3, Dichte auf 2, Varianz auf 2. Verwende Electric Blue als einzelnen Akzent. Keine Serif-Schriften.
Bewährte Verfahren
- Starte mit der Atmosphärenbeschreibung — verstehe die Stimmung, bevor du Tokens detaillierst, um eine kohärente Designsprache zu gewährleisten
- Wähle genau eine Akzentfarbe und bleibe konsequent dabei — mehrere Akzente verwässern das Premium-Gefühl
- Inkludiere explizite Anti-Patterns — die Verbotsliste ist das, was die Ausgabe nicht-generisch und unverwechselbar macht
Vermeiden
- Inter-Schriftart verwenden — sie erzeugt generische, KI-optisch wirkende Interfaces; verwende stattdessen Geist, Satoshi, Cabinet Grotesk oder Outfit
- Lila oder Neon-Verlaufseffekte hinzufügen — das schreit 'KI-generiert' und ist in Premium-Kontexten strikt verboten
- Zentrierte Hero-Layouts — diese sind generisch und verboten; verwende stattdessen asymmetrische Split-Screen- oder linksbündige Strukturen