Mikkel Manniche

Claude-Code-Skill

design-bake-off

Drei Agenten bauen je eine vollständige Landingpage oder Startseite, jeder aus seiner eigenen klaren Idee. Du siehst sie nebeneinander, wählst eine, und ein vierter Agent baut sie in deine App ein.

  • Claude-Code-Skill
  • MIT-Lizenz
  • Braucht Node.js

macOS und Linux

git clone https://github.com/manniche-labs/ui.git ~/manniche-labs-ui
ln -s ~/manniche-labs-ui/skills/design-bake-off ~/.claude/skills/design-bake-off

Windows (PowerShell)

git clone https://github.com/manniche-labs/ui.git "$env:USERPROFILE\manniche-labs-ui"
New-Item -ItemType Junction -Path "$env:USERPROFILE\.claude\skills\design-bake-off" -Target "$env:USERPROFILE\manniche-labs-ui\skills\design-bake-off"

Bitte Claude Code um „einen Design-Bake-off für die Startseite“, oder tippe /design-bake-off.

So läuft eine Runde

  1. Briefing

    Der Skill liest deine App und schreibt ein kurzes Briefing: für wen die Seite ist, wozu sie bewegen soll und was nicht dastehen darf.

  2. Drei Entwürfe

    Drei Agenten arbeiten gleichzeitig, jeder mit seiner eigenen Metapher. Jeder Entwurf ist eine fertige Seite mit echten Effekten, keine Skizze.

  3. Du wählst

    Du siehst die drei Entwürfe und wählst einen, oder bittest um eine neue Runde.

  4. Der Einbau

    Ein Agent baut den gewählten Entwurf mit deinen eigenen Farben und Komponenten in deine App ein. Bei React und shadcn nutzt er Manniche UI.

Die Regeln

  • Keine erfundenen Zahlen oder Kundenstimmen.
  • Kein generischer KI-Look.
  • Ein tragender Effekt pro Abschnitt.
  • Effekte in reinem JS und CSS, damit sie in jedem Stack laufen.