Guide zum Short · Prototype-Skill · Okt 2026
Ein Design, drei Versionen zur Auswahl.
Mit einem Trick bekommst du von Claude Code jedes Design in drei verschiedenen Versionen. Dahinter steckt die Liste „Skills for Designers and Engineers“. Hier sind der Link, der Prompt zum Installieren und wie du den Prototype-Skill benutzt.
Der Guide · zum Umsetzen
Alles aus dem Video, kurz zum Nachmachen.
- 01
Skills for Designers and Engineers
Die Liste
Die Liste stammt von Emil Kowalski, einem Design Engineer, der laut eigener Beschreibung bei Vercel und Linear gearbeitet hat. Darin sind Skills für Animationen, Design-Reviews, mobile Webseiten und eben den Prototype-Skill.
Repo: github.com/emilkowalski/skills
- 02
Prompt zum Kopieren
Installieren
Kopier den Link in deinen Claude-Code-Chat und sag Claude, dass er die Skills installieren soll:
Installier mir die Skills aus dieser Liste: https://github.com/emilkowalski/skills Nimm den Befehl aus der README des Repos. # Oder selbst im Terminal, Befehl aus der README: npx skills@latest add emilkowalski/skills - 03
Drei Versionen statt einer
Der Prototype-Skill
Du beschreibst ein Stück Oberfläche, zum Beispiel eine Preiskarte oder einen Button, und der Skill baut dir mehrere wirklich unterschiedliche Versionen davon. Standard sind drei, auf Wunsch bis zu fünf. Du schaltest live zwischen ihnen um und nimmst die, die sich richtig anfühlt.
/prototype eine Preiskarte mit drei Paketen für meine Coaching-SeiteDer Skill startet nur, wenn du ihn mit /prototype aufrufst. Von allein springt er nicht an.
- 04
Tipps
So holst du am meisten raus
Damit die Versionen wirklich verschieden werden:
- Beschreib, was das Element können soll, nicht wie es aussehen soll.
- Sag, für wen die Seite ist und welcher Eindruck entstehen soll.
- Wenn dir eine Version gefällt, sag Claude, dass er genau die übernehmen soll.
Das Video dazu
Im Video zeige ich dir alles einmal live. Schau es dir an, wenn du einen Schritt genauer sehen willst.
KI Agenten Club
Gute Designs sind kein Zufall. Im KI Agenten Club zeige ich dir, wie ich mit Claude Code und Skills Webseiten baue, die nicht nach KI aussehen.
KI Agenten Club
Vom Guide zum kompletten Setup.
Richtig Zeit sparst du, wenn Skills, Agenten, MCP-Server und deine CLAUDE.md zusammenspielen. Im KI Agenten Club zeigen wir dir das an unserem eigenen Setup, damit du es für deine Arbeit nachbauen kannst.
Vishal Punia · KI Agenten Club
Setup zum Übernehmen
Die Skills, MCP-Server und Vorlagen aus unserem Alltag, bald auch Orbit. Monatlich oder jährlich, direkt in Skool.