Webdesign, das man nicht sofort als KI erkennt.

Der erste holt den Skill. Der zweite gibt ihm eine Bildgenerierung über kie.ai, ohne die er dir die Design-Welten nicht zeigen kann. Bei kie.ai zahlst du pro Bild statt Abo.

npx impeccable install

claude mcp add kie-ai --env KIE_AI_API_KEY=<dein-key> \
  -- npx -y @felores/kie-ai-mcp-server

Danach Claude Code einmal neu starten. Welten gehen als Bilder im Browser auf? Dann sitzt beides.

Ein installierter Skill wird nicht automatisch benutzt, das entscheidet der Agent im Moment. Wer die Arbeitsweise einmal schriftlich vorgibt, muss sie nicht in jedem Projekt neu durchsetzen.

Ab jetzt gilt für jede Frontend- und Webdesign-Arbeit in diesem Projekt:
1. Du baust Oberflächen nicht mehr aus dem Stand, sondern über Impeccable.
   Ist der Skill nicht installiert, installierst du ihn zuerst.
2. Bevor du Code schreibst, zeigst du mir Design-Richtungen zur Auswahl.
   Ich entscheide visuell, nicht anhand einer Beschreibung.
3. Du legst PRODUCT.md und DESIGN.md an und liest sie bei jedem weiteren
   Auftrag, statt jedes Mal neu anzufangen.
4. Für Feinarbeit an einzelnen Sektionen nutzt du den Live-Modus,
   für Umbauten und Richtungswechsel das Terminal.
5. Am Ende läuft der Finish-Reviewer, bevor du mir sagst, dass du fertig bist.
Bestätige mir kurz, was davon in diesem Projekt schon eingerichtet ist und
was noch fehlt.

Aus deinen Antworten schreibt er PRODUCT.md und DESIGN.md, die liest ab da jeder weitere Befehl. Je bekannter dein Thema, desto braver die Vorschläge.

• Was baust du, für wen, mit welchem Ziel? Eigene Worte plus ein Gefühl, keine Layoutliste. „Soll sich anfühlen wie eine Werkstatt, nicht wie eine Kursplattform“ funktioniert, „eine schöne moderne Landingpage“ nicht.
• Welcher Stack? Weißt du es, sag es. Sonst lass ihn entscheiden. Nenn keinen Stack, den du danach nicht anfassen kannst.
• Was hast du an echtem Material? Screenshots, echte Zahlen, echte Kundenstimmen. Gibst du nichts an, denkt er sich Platzhalter aus.

Er zeigt dir die Design-Welten als Skizzen im Browser, bevor Code entsteht. Nimm bewusst nicht die sicherste. Danach kommen Varianten innerhalb deines Stils.

• Großes Bild (Umbau, anderes Layout, andere Richtung) läuft über das Terminal.
• Feinarbeit an einer Sektion läuft im Live-Modus mit /impeccable live.
• Pick: Element auswählen. Varianten 1–4: stell auf drei, wenn du unsicher bist.
• Bolder, Quieter: Richtung per Knopf. Tune: Variante feinjustieren.
• Detect: Slop auf älteren Seiten finden. Accept: Auswahl zurück ins Terminal.

Die Seite ist jetzt stark und könnte trotzdem jedem gehören. Füg zwei, drei echte Referenzen ein (Thumbnail, Screenshot, deine Farbwelt) und schick das im Terminal:

Das ist die visuelle Welt meiner Marke.
Übernimm NICHT das Layout dieser Bilder. Zieh dir Typografie, Farbgefühl,
Bildsprache und Charakter heraus und bring die bestehende Seite in diese Welt.

Ohne „Übernimm NICHT das Layout“ bekommst du dein Referenzbild zurück statt deiner Seite.