Prompt-Leitfaden

Starte im Projekt-Chat. Öffne den Chat für das Projekt, das du ändern möchtest, und wähle dann den Agent aus oder sprich den Agent an, dessen Rolle zur Aufgabe passt. Wenn du dir nicht sicher bist, welcher Agent geeignet ist, bitte das Team vor dem Erstellen um Klärung.

Dieser Leitfaden sammelt Techniken, die von deinem Agent-Team beständig bessere Ergebnisse liefern. Keine davon erfordert besondere Fähigkeiten. Es geht darum, was du sagst, nicht darum, wie du es formatierst. Egal, ob du deine allererste Anfrage schreibst oder ein ausgereiftes Projekt verfeinerst, dieselben Prinzipien gelten: klares Denken hinein, klare Ergebnisse heraus.

Lass das Team fragen, bevor es erstellt

Eine der effektivsten Möglichkeiten, ein besseres Ergebnis zu erhalten: Wenn eine Anfrage groß oder unklar ist, lade zu Rückfragen ein, anstatt zu hoffen, dass das Team richtig rät. Sage, was du möchtest, und füge dann am Ende eine Zeile hinzu:

Frag mich alles, was du brauchst, um vollständig zu verstehen, was ich möchte, bevor du beginnst.

Du wirst oft Fragen erhalten, von denen du selbst nicht gedacht hättest, dass du sie beantworten musst, sei es zu Randfällen, Zielgruppen oder Abwägungen. Diese Punkte im Voraus zu klären, kostet eine Minute; sie erst nach dem Erstellen zu entdecken, kostet Nacharbeit. Das Ergebnis liegt schon im ersten Durchgang viel näher an deiner Absicht.

Schritt 1: Entscheide, bevor du tippst

Wisse, was du erstellst

Ein paar Minuten Nachdenken im Voraus können später viel erneutes Prompten sparen. Bevor du beginnst, solltest du sicherstellen, dass du vier einfache Fragen beantworten kannst: Was erstellst du, für wen ist es, warum würden sie es nutzen, und welche Hauptaktion sollen sie ausführen.

Diese Hauptaktion wird oft CTA genannt, kurz für Call to Action. Das ist die Schaltfläche, der Link oder der nächste Schritt, den Nutzer am ehesten wählen sollen, zum Beispiel Sign Up, Book a Demo, Start Free oder Buy Now.

Du musst keine vollständige Spezifikation schreiben. Das Ziel ist einfach, dem Projekt eine klare Richtung zu geben. Je spezifischer dein Ausgangspunkt ist, desto leichter ist es, ein Ergebnis zu erzeugen, das dem entspricht, was du dir vorstellst.

Erstelle eine einseitige Website für eine Budgeting-App für Freelancer. Die wichtigste CTA ist „Start Saving Smarter.“ Verwende einen mutigen, ausdrucksstarken Look mit großer Typografie und kräftigen Farben.

Skizziere die Journey, nicht nur die Screens

Gutes Design lebt ebenso sehr zwischen den Screens wie auf ihnen. Gehe den Weg deiner Nutzer durch: Was sehen sie zuerst, was schafft Vertrauen, was gibt ihnen Sicherheit zu handeln, und wohin führt diese Handlung? Selbst eine Skizze mit drei Schritten – Hero, Nachweis, Call to Action – macht deine Anfragen deutlich effektiver, weil jeder Abschnitt nun einen Grund hat zu existieren und zum nächsten zu führen.

Lege die visuelle Richtung früh fest

Stil lässt sich viel leichter festlegen als nachträglich anpassen. Wähle eine Richtung: ruhig und elegant, mutig und disruptiv, hochwertig und sleek, und nenne sie in deiner ersten Anfrage mit Tonalitätswörtern, mit denen das Team arbeiten kann: minimal, verspielt, cineastisch, entwicklerfokussiert. Diese Wörter sind mehr als Dekoration: Sie prägen Typografie, Abstände, Farbe, Schatten und Eckradius schon ab der allerersten Komponente. Verwende dieselbe Stilzeile in späteren Anfragen erneut, damit alles stimmig bleibt.

Verwende ein ruhiges, von Wellness inspiriertes Design: weiche Farbverläufe, gedämpfte Erdtöne, abgerundete Ecken, großzügiges Padding. Gesamteindruck sanft und beruhigend.

Schritt 2: Schreibe Anfragen, die ankommen

Beschreibe Ergebnisse, nicht Implementierungen

Beschreibe das Ergebnis, das du möchtest, nicht die Schritte zum Erstellen. Zum Beispiel ist „Füge einen Preisbereich mit drei Optionen hinzu und lasse die mittlere hervorstechen“ hilfreicher, als genau zu erklären, wie die Seite aufgebaut werden soll. Konzentriere dich darauf, was erscheinen soll und warum es wichtig ist; das Team kann entscheiden, wie es erstellt wird.

Arbeite in Teilen, nicht in Seiten

Anfragen, die auf eine einzelne Komponente begrenzt sind — ein Hero, ein Feature-Raster, eine Testimonial-Zeile, eine Preistabelle — geben dir Klarheit und Kontrolle. Wenn ein Teil das Ziel verfehlt, passt du diesen Teil an, statt alles darum herum neu zu generieren. Erstelle einen Block, prüfe ihn, verfeinere ihn und gehe dann zum nächsten über. Eine Anfrage für eine ganze Seite erzeugt Rauschen; eine Anfrage für eine Komponente erzeugt Signal.

Erstelle einen Feature-Bereich: zentrierte Überschrift, dann drei Karten nebeneinander, jeweils mit einem Symbol, einem Titel und einer einzeiligen Beschreibung. Weiche Schatten, leichte Anhebung bei Hover.

Verwende echte Worte

Platzhaltertext verbirgt Probleme; echter Text macht sie sichtbar. Eine echte Überschrift braucht vielleicht zwei Zeilen; eine echte CTA funktioniert vielleicht besser als Verb. Schreibe, was ein Nutzer tatsächlich lesen würde, selbst wenn es nur ein Entwurf ist — Layouts, Abstände und Designentscheidungen werden alle besser, wenn der Inhalt echt ist.

Hero-Überschrift: „Design Calmly.“ Untertext: „Turn stress into structure.“ CTA: „Start Building Free.“ Inhaltszentriertes Layout mit großzügigen vertikalen Abständen.

Benenne reale Elemente

Verwende klare, spezifische Wörter, um zu beschreiben, was du auf der Seite haben möchtest. Du musst keine Designterminologie kennen — benenne einfach die Dinge, die Nutzer sehen oder mit denen sie interagieren sollen, wie eine Profilkarte, eine Schaltfläche oder ein Formular.

Spezifische Anfragen lassen sich leichter umsetzen als allgemeine. Beginne mit dem grundlegenden Element, das du brauchst, und füge dann nach und nach Details hinzu.

Erstelle eine Profilkarte mit Foto, Name und Follow-Button. Füge neben dem Namen ein kleines Label „Verified“ hinzu und zeige eine kurze Erklärung an, wenn jemand mit der Maus darüber fährt.

Schritt 3: Ändere mit Präzision

Begrenze jede Änderung: was sich bewegt, was bleibt

Wenn du bestehende Arbeit anpasst, sei auf beiden Seiten ausdrücklich: was sich ändern soll und was nicht. Verwende Richtungswörter wie „ersetzen“, „aktualisieren“ und „anpassen“ statt „mach das besser“ und grenze die Teile ab, die dir gefallen. Präzision an dieser Stelle verhindert, dass Iteration zu Regression wird.

Ändere den CTA-Text in „Get Started“ und erhöhe das horizontale Padding. Behalte die aktuellen Farben, die Schriftart und alles andere in diesem Abschnitt unverändert bei.

Eine sinnvolle Änderung nach der anderen

Aktualisiere zuerst den Text, dann das Layout, dann die Interaktionen und prüfe jedes Ergebnis vor der nächsten Anfrage. Kleine, bewusste Schritte summieren sich zu einem ausgereiften Produkt; zehn Änderungen in einer Nachricht summieren sich zu Mehrdeutigkeit, und wenn etwas schiefläuft, wirst du nicht wissen, welche Änderung die Ursache war.

Korrekturen während der Aufgabe erfolgen im Chat. Wenn Prompt Queue in deinem Chat verfügbar ist und Agent-Arbeit aktiv ist, werden Folge-Nachrichten hinter der laufenden Arbeit in die Warteschlange gestellt. Vergewissere dich, dass deine Nachricht in der Warteschlange erscheint, bevor du eine weitere Kopie sendest. Wenn keine Warteschlangen-Steuerung sichtbar ist, sende nicht erneut: Warte, bis die aktuelle Arbeit abgeschlossen ist, oder verwende eine Unterbrechen-Steuerung, falls dein Chat eine anbietet, und bestätige dann den Aufgabenstatus, bevor du eine Folgeanfrage sendest. Siehe Projekt-Chat für Details.

Denke der UI einen Schritt voraus

Wenn dein Projekt mehr können soll, als nur gut auszusehen, definiere Verhalten zusammen mit dem Erscheinungsbild. Gib an, was Nutzer sehen, wenn sie angemeldet oder abgemeldet sind, woher dynamische Inhalte kommen und wie die Oberfläche mit leeren, ladenden und Fehlerzuständen umgeht. Du brauchst kein funktionierendes Backend, um diese Szenarien mitzudenken — sie frühzeitig zu planen hilft, spätere größere UI-Überarbeitungen zu vermeiden.

Wenn der Nutzer angemeldet ist, zeige oben rechts seinen Avatar und Namen an. Wenn nicht, zeige eine Schaltfläche „Log In“, die zum Auth-Bildschirm weiterleitet.

FAQ

Wie schreibe ich einen effektiven Prompt für den KI-Agent?

Strukturiere deinen Prompt mit diesen Schlüsselelementen:

1. Kontext — Setze den Rahmen. Erkläre, was du erstellst und wo die Dinge aktuell stehen.

2. Ziel — Sei konkret in Bezug auf das genaue Ergebnis oder Feature, das du möchtest.

3. Anforderungen & Einschränkungen — Liste klar auf, was sich ändern soll und was unberührt bleiben muss.

4. Erwartetes Ergebnis — Definiere, wie Erfolg aussieht (z. B. UI-Verhalten, Fehlerbehandlung, Statuspersistenz).

5. Referenzen — Hänge nach Möglichkeit Screenshots, Links, Workflow-Schritte oder Codebeispiele an. Entferne Passwörter, Verifizierungscodes, API-Schlüssel, Cookies, personenbezogene Daten und Zahlungsdetails, bevor du sie teilst.

Beispiel: "Ich erstelle ein Dashboard mit einer Seitenleiste. Füge unten in der Seitenleiste eine Logout-Schaltfläche hinzu. Sie soll die Sitzung löschen und zu /login weiterleiten. Ändere nicht das Layout der Seitenleiste oder die Navigationslinks. Nach dem Klicken soll der Nutzer innerhalb von 1 Sekunde die Login-Seite sehen."

Wie sollte ich komplexe Anfragen behandeln, die mehrere Features umfassen?

Bei komplexen Anfragen solltest du sie in kleinere Aufgaben aufteilen:

1. Beschreibe das aktuelle Problem und das Endziel.

2. Liste jede Teilaufgabe separat auf (Aufgabe 1, Aufgabe 2, Aufgabe 3).

3. Überprüfe jede Aufgabe, bevor du zur nächsten übergehst.

4. Teste am Ende den vollständigen Ablauf.

Dieser Ansatz reduziert unerwartete Änderungen, die entstehen, wenn der Agent zu viel auf einmal erledigen soll. Jeder Prompt sollte sich auf ein einzelnes, überprüfbares Ergebnis konzentrieren.

Wie schreibe ich einen Prompt, um einen Fehler zu beheben?

Ein nützlicher Prompt zur Fehlerbehebung sollte Folgendes enthalten:

• Die Seite, das Feature, die Umgebung und die betroffenen Nutzer
• Genaue Schritte, um das Problem zu reproduzieren
• Tatsächliches Verhalten und erwartetes Verhalten
• Den vollständigen Fehlertext und wann er aufgetreten ist
• Relevante Screenshots oder Logs, aus denen Passwörter, Token, Cookies, personenbezogene Daten und Zahlungsdetails entfernt wurden
• Was unverändert bleiben muss
• Wie die Behebung überprüft werden soll und welche Regressionstests auszuführen sind

Beispiel: „Auf der Checkout-Seite in Preview führt die Auswahl von Submit zu einem 500-Fehler. Erwartet: Die Bestellung wird bestätigt und der Nutzer gelangt zur Dankeseite. Reproduktion: [Schritte]. Behebe die Ursache, ohne Warenkorb-Summen oder den Zahlungsablauf zu ändern, und überprüfe dann einen erfolgreichen und einen abgelehnten Zahlungsfall. Ich habe alle geheimen Werte aus dem angehängten Log entfernt.“

Wie schreibe ich einen Prompt, um Seitenlayout oder Styling zu ändern?

Wenn du Änderungen an Seiten anforderst, gib Folgendes an:

1. Die konkrete Seite, das Modul und das Element, das geändert werden soll.

2. Aktueller Zustand und Zielergebnis.

3. Referenzlinks oder Screenshots.

4. Features, die unverändert bleiben müssen.

5. Akzeptanzkriterien (z. B. muss sowohl auf Desktop als auch auf Mobilgeräten funktionieren).

Beispiel: "Ändere auf der Seite /pricing das Raster der Tarifkarten auf dem Desktop von 2 Spalten auf 3 Spalten. Behalte das mobile Layout als einzelne Spalte bei. Referenz: dieser Screenshot [anhängen]. Ändere nicht den Karteninhalt oder die Button-Stile."

Was sollte ich tun, wenn der Agent trotz Korrekturen immer wieder die falschen Änderungen vornimmt?

Wenn der Agent wiederholt am Ziel vorbeigeht, können zusätzliche Anweisungen manchmal noch mehr Verwirrung stiften. Stattdessen:

1. Den aktuellen Zustand bewahren — Höre auf, sich überschneidende Korrekturen zu senden. Wenn dein Chat eine Revert-Steuerung anzeigt, lies deren Bestätigungstext, bevor du sie verwendest, notiere alle späteren Änderungen, die du behalten musst, und überprüfe das Projekt anschließend. Wenn der Umfang unklar ist, fahre nicht fort; nutze die Anleitung im Projekt-Chat oder kontaktiere den Support mit einem bereinigten Chat-Link und Screenshot.

2. Das Rauschen beseitigen — Statt zusätzliche Anweisungen obendrauf zu legen, formuliere das Kernproblem sauber von Grund auf neu.

3. Eine Aufgabe nach der anderen — Konzentriere dich darauf, ein einzelnes Problem zu beheben, bevor du weitermachst.

Einen Schritt zurückzutreten und Änderungen schrittweise anzugehen, löst Probleme in der Regel viel schneller, als zu versuchen, mehrere sich überschneidende Probleme in einem Prompt zu beheben.