Verbesserung des App-Designs

Sofern keine Design-Datei vorliegt, ist der schnellste Weg zur Neugestaltung deiner App, ein ansprechendes Beispiel zu finden und es Claude Code zu zeigen. Dieses Kapitel erläutert Schritt für Schritt, wie das funktioniert.

So übergibst du das Design an Claude Code

Sobald ein passendes Design gefunden wurde:

1. Bild kopieren oder Screenshot erstellen
2. Direkt in den Claude Code-Chat einfügen
3. Einen präzisen Prompt hinzufügen

Ein bewährter Prompt:

"Take the styling and colours of this UI design and implement it into my app. Keep the structure and functionalities exactly the same. Only change the design style."

Es ist ebenso wichtig, genau anzugeben, was unverändert bleiben soll, wie zu beschreiben, was geändert werden soll. Wird nicht erwähnt, dass die Struktur gleich bleiben soll, kann es passieren, dass Claude Code mehr umgestaltet als beabsichtigt.

Welches Modell für Design verwenden

Für Designanpassungen sollte im Claude Code-Dropdown das Modell Opus ausgewählt werden. Opus interpretiert visuelle Inspirationen besser und setzt sie effektiver in Code um. Für die meisten anderen Aufgaben ist Sonnet die richtige Wahl, aber für Design lohnt sich der Einsatz von Opus.

Iterativer Ansatz erwartet

Der erste Durchgang bringt dich meist weit voran, ist aber nicht immer perfekt. Das ist in Ordnung. Schau dir das Ergebnis an, identifiziere genau eine Sache, die du anpassen möchtest, und sende eine gezielte Folgeanweisung, die sich nur auf diesen Punkt bezieht.