/ Verzeichnis / Playground / Taste Skill
← Alle Server ↗ GitHub
● Community Leonxlnx ⚡ Sofort

Taste Skill

von Leonxlnx · Leonxlnx/taste-skill

Design-Geschmack kodieren — Typografie, Abstände, Farben, Kompositionsregeln — damit Claude aufhört, generisch aussehendes UI zu liefern, und stattdessen Arbeit produziert, die nach einem Senior wirkt.

Taste Skill ist ein kleines, meinungsstarkes Regelwerk, das die häufigsten AI-Design-Fehler präventiv verhindert: zu viele Schriftarten, Fließtext bei 14px auf einer Marketing-Website, drei konkurrierende Akzentfarben, ein Hero-Stack, der nach Bootstrap 4 von 2018 aussieht. Es läuft als Review-und-Rewrite-Schritt über generiertem UI, wendet seine Regeln an und erklärt, warum. In jedem Agenten nutzbar, der Skills unterstützt.

▶ Demo ansehen 📦 Installieren 💡 Anwendungsfälle

Warum nutzen

Hauptfunktionen

Live-Demo

In der Praxis

bereit

Installation

Repository des Autors · Offizielle Dokumentation zu Claude Skills

Anwendungsfälle

Praxisnahe Nutzung: Taste Skill

Eine von Claude generierte Landingpage durch den Geschmacksfilter prüfen

👤 Jeder Entwickler, der eine von Claude erstellte Marketing-Seite ausliefert ⏱ ~30 min intermediate

Wann einsetzen: Die erste Ausgabe sieht in Ordnung aus, aber wirkt unvergesslich.

Ablauf
  1. Kritisieren
    Use taste-skill on /pages/landing.tsx. List every taste violation with severity and the rule it broke.✓ Kopiert
    → 10–20 Verstöße, jeder mit Tag
  2. Tier-1-Fixes anwenden
    Apply only severity-high fixes. Don't change copy — only visual/structural.✓ Kopiert
    → Diff angewendet; Seite sieht nicht mehr generisch aus
  3. Iterieren
    Re-run critique on the result. Stop when only tier-3 nitpicks remain.✓ Kopiert
    → Konvergiert in 2 Durchläufen

Ergebnis: Eine Seite, die handgefertigt wirkt, nicht generiert.

Fallstricke
  • Skill erzwingt einen Stil, der gegen die Marke kämpft — --brand /design/brand.md übergeben, damit er Marken-Leitlinien respektiert
Kombinieren mit: filesystem

Eine einzelne Komponente auf Geschmacksprobleme prüfen

👤 Entwickler, die am Design-System arbeiten ⏱ ~15 min beginner

Wann einsetzen: Vor der Auslieferung einer neuen Komponente ins System.

Ablauf
  1. Kritisieren
    Run taste-skill on /components/Card.tsx. Any taste issues at the component level?✓ Kopiert
    → Probleme mit zitierten Zeilen
  2. Varianten prüfen
    Compare hover, focus, and disabled states for visual coherence.✓ Kopiert
    → Drift erkannt, falls vorhanden

Ergebnis: Komponente wird mit weniger ‚warum sieht das komisch aus'-Tickets ausgeliefert.

Fallstricke
  • Kritik ignoriert beabsichtigte Design-Entscheidungen (z. B. Brutalist-Stil) — --style brutalist oder ähnlich übergeben, um bestimmte Regeln zu lockern

Taste-Skill nutzen, um eine Baseline für ein neues Design-System zu setzen

👤 Teams, die gerade ein neues Produkt starten ⏱ ~60 min intermediate

Wann einsetzen: Du wählst eine Token-Skala, Schriftart und Palette und möchtest eine vernünftige Ausgangsbasis.

Ablauf
  1. Baseline generieren
    Generate a baseline taste-aligned token set — type, spacing, color — for a SaaS dashboard.✓ Kopiert
    → tokens.json mit Begründung pro Wahl
  2. Stress-Test
    Generate sample pages (login, dashboard, settings) using the baseline. Critique your own output.✓ Kopiert
    → Seiten + Selbstkritik mit möglichen Verfeinerungen

Ergebnis: Ein vertretbarer Ausgangspunkt, über den nicht mit Stakeholdern verhandelt werden muss.

Fallstricke
  • Generierte Baseline ist zu ‚sicher' — Marken-Inputs (Stimmung, Referenzen) bereitstellen, damit die Ausgabe nicht bland wird
Kombinieren mit: design-extract-mcp

Kombinationen

Mit anderen MCPs für 10-fache Wirkung

taste-skill-leon + design-extract-mcp

Token von einer Referenzsite extrahieren, dann mit Taste-Skill verfeinern

taste-skill-leon + filesystem

Kritiken als Design-Review-Aufzeichnungen persistieren

Werkzeuge

Was dieses MCP bereitstellt

WerkzeugEingabenWann aufrufenKosten
critique path_or_url, brand? Pre-Ship-Review 0
fix path, severity_threshold Nach der Kritik, Tier-1/2 anvisieren 0
baseline context: {product, audience} Ein Design-System von Grund auf starten 0

Kosten & Limits

Was der Betrieb kostet

API-Kontingent
Nicht zutreffend
Tokens pro Aufruf
Mittel — vollständige Seitenkritik sind 5–10k Token
Kosten in €
Kostenlos
Tipp
Kritik auf Komponentenebene ist günstiger als auf Seitenebene; so iterieren

Sicherheit

Rechte, Secrets, Reichweite

Minimale Scopes: filesystem-read filesystem-write
Credential-Speicherung: Keine
Datenabfluss: Lokal

Fehlerbehebung

Häufige Fehler und Lösungen

Kritik findet keine Verstöße bei offensichtlich generischem UI

Skill befindet sich möglicherweise im ‚lenient'-Modus — --strict übergeben

Fix bricht das Layout

--diff-preview zuerst ausführen, selektiv anwenden

Konflikte mit Marken-Leitlinien

Marken-Markdown per --brand übergeben, damit Skill Ausnahmen respektiert

Alternativen

Taste Skill vs. andere

AlternativeWann stattdessenKompromiss
stevembarclay/pencilplaybookDu möchtest UI-Design-Geschmack, der in Pencils Produkt verwurzelt istSpezifisch für Pencil; Taste-Skill ist allgemein
Nur ein brand.md-PromptDu lieferst nur ein einzelnes ProduktErkennt die AI-generischen Muster nicht, gegen die dieser Skill ausgelegt ist

Mehr

Ressourcen

📖 Offizielle README auf GitHub lesen

🐙 Offene Issues ansehen

🔍 Alle 400+ MCP-Server und Skills durchsuchen