Atoms
Project chat

Prompt-Leitfaden

Entscheide, bevor du tippst, baue in Teilen, verwende echte Inhalte und richte jede Anfrage an den richtigen Agent. Diese Gewohnheiten verwandeln einzeilige Ideen in fertige Ergebnisse.

Entscheide, bevor du tippst, baue in Teilen, verwende echte Inhalte und richte jede Anfrage an den richtigen Agent. Diese Gewohnheiten verwandeln einzeilige Ideen in fertige Ergebnisse.

Beginne 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: klare Gedanken hinein, klare Ergebnisse heraus.

Lass das Team fragen, bevor es erstellt

Eine der effektivsten Methoden, um ein besseres Ergebnis zu erhalten: Wenn eine Anfrage groß oder unklar ist, lade zu Fragen ein, statt 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. Sie 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, stelle sicher, 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. Es 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 lässt sich ein Ergebnis erzeugen, das zu dem passt, was du im Kopf hast.

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

Skizziere die Journey, nicht nur die Bildschirme

Gutes Design lebt zwischen den Bildschirmen genauso sehr 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 in drei Schritten — Hero, Nachweis, Call to Action — macht deine Anfragen deutlich effektiver, weil jeder Abschnitt nun einen Grund hat zu existieren und einen Grund hat, 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 Tonbegriffen, 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 Eckenradius schon ab der allerersten Komponente. Verwende dieselbe Stilzeile in späteren Anfragen wieder, damit alles stimmig bleibt.

Verwende ein ruhiges, von Wellness inspiriertes Design: sanfte Verlä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 zu seiner Erstellung. 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 Ganzseiten-Anfrage erzeugt Rauschen; eine Komponenten-Anfrage erzeugt Signal.

Erstelle einen Feature-Bereich: zentrierte Überschrift, dann drei Karten nebeneinander, jeweils mit einem Symbol, einem Titel und einer Zeile Beschreibung. Sanfte Schatten, leichtes Anheben 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 echte Elemente

Verwende klare, spezifische Wörter, um zu beschreiben, was du auf der Seite 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 die Details nacheinander hinzu.

Erstelle eine Profilkarte mit Foto, Name und Folgen-Schaltfläche. Füge neben dem Namen ein kleines Label „Verified“ hinzu und zeige eine kurze Erklärung an, wenn jemand darüber hovert.

Schritt 3: Ändere mit Präzision

Begrenze jede Änderung: was sich bewegt, was bleibt

Wenn du bestehende Arbeit anpasst, sei auf beiden Seiten explizit: 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 zur Regression wird.

Ändere den CTA-Text zu „Get Started“ und erhöhe sein horizontales 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 schiefgeht, wirst du nicht wissen, welche Änderung es verursacht hat.

Korrekturen während einer 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 Unterbrechungssteuerung, falls dein Chat eine bietet, und bestätige dann den Aufgabenstatus, bevor du eine Folge-Nachricht 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. Lege fest, was Nutzer sehen, wenn sie angemeldet oder abgemeldet sind, woher dynamische Inhalte kommen und wie die Oberfläche mit leeren, Lade- und Fehlerzuständen umgeht. Du brauchst kein funktionierendes Backend, um diese Szenarien zu gestalten — sie frühzeitig zu planen hilft, später große UI-Nacharbeit zu vermeiden.

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

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 spezifisch 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 — Füge nach Möglichkeit Screenshots, Links, Workflow-Schritte oder Codebeispiele an. Entferne Passwörter, Verifizierungscodes, API-Schlüssel, Cookies, personenbezogene Daten und Zahlungsdetails, bevor du etwas 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?

Teile komplexe Anfragen in kleinere Aufgaben auf:

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 tun soll. Jeder Prompt sollte sich auf ein einzelnes, überprüfbares Ergebnis konzentrieren.

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

Ein nützlicher Prompt zur Fehlerbehebung sollte Folgendes enthalten:

  • Die Seite, das Feature, die Umgebung und die betroffenen Nutzer
  • Genaue Schritte zur Reproduktion des Problems
  • Tatsächliches Verhalten und erwartetes Verhalten
  • Der vollständige 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, die geändert werden sollen.

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 Plan-Karten 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 Schaltflächenstile."

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 — Sende keine sich überschneidenden Korrekturen mehr. Wenn dein Chat eine Revert-Steuerung zeigt, lies vor der Verwendung ihren Bestätigungstext, notiere alle späteren Änderungen, die du behalten musst, und überprüfe das Projekt danach. Wenn der Umfang unklar ist, fahre nicht fort; nutze die Anleitung zum Projekt-Chat oder kontaktiere den Support mit einem bereinigten Chat-Link und Screenshot.

2. Das Rauschen beseitigen — Statt zusätzliche Anweisungen oben draufzusetzen, 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.

War diese Seite hilfreich?

Verwandte Artikel