Deinen ersten Prompt schreiben
Deinen Prompt zu schreiben ist der allererste Schritt zum Bauen der App, die du immer wolltest. Tippe einfach ein, was deine App tun soll, und die KI baut sie für dich. Du musst kein Entwickler sein oder Code verstehen. Das ist Vibe Coding — deine Ideen in echte Apps zu verwandeln, indem du sie einfach in deinen eigenen Worten beschreibst.
Baue einen Workout-Generator. Er soll personalisierte Trainingspläne basierend auf meinen Fitnesszielen, der Verfügbarkeit von Equipment und meiner verfügbaren Zeit pro Woche erstellen.
Baue ein CRM für Fotografen. Inkludiere Funktionen für Kundengalerien, Fotoshooting-Buchungen und Preispakete.
Bereit anzufangen?
Bringe mich zu Base44, um meine App zu bauen
Die Prompt-Formel
„Erstelle eine [Function]-Website. Verwende eine [Layout]-Struktur. Wende eine [Visual Style]-Ästhetik an.”Schritt 1 | Definiere die Funktion
Sage der KI genau, welche „Aufgabe” die Website hat. Ein Portfolio muss kräftig sein, während eine Bank sicher aussehen muss.- SaaS Landing Page: Fokussiert auf Konvertierung, Funktionen und Vertrauen.
- Creative Portfolio: Fokussiert auf Persönlichkeit, Visuals und den „Wow”-Faktor.
- E-Commerce Store: Fokussiert auf Produktraster, Klarheit und Geschwindigkeit.
- Editorial or Blog: Fokussiert auf Lesbarkeit und Typografie.
Schritt 2 | Wähle den visuellen Stil
Beschreibe die spezifische Stimmung, die du möchtest. Das geht über „sauber” oder „modern” hinaus.- Tech and trust: Glassmorphism (Milchglas) oder Aurora Gradients (weiches Licht).
- Luxury and story: Dark Academia (stimmungsvoll, Serif-Schriften), Eco-Minimalism (Erdtöne) oder Monochrome (schwarz und weiß).
- Creative and bold: Neo-Brutalism (rohe Konturen, kontrastierende Farben), Y2K oder Vaporwave (Retro-Ästhetik).
Schritt 3 | Wähle das Layout
Sage der KI, wie sie den Inhalt auf dem Bildschirm organisieren soll, damit sie nicht raten muss.- The Bento Grid: Alles ist in unterschiedlichen Boxen oder Zellen organisiert. Am besten für funktionsreiche Sites.
- Scrollytelling: Die Site ist eine lange Leinwand. Während du scrollst, setzen sich Elemente zusammen oder blenden ein. Am besten für storyreiche Sites.
- Split-Screen: Der Bildschirm ist halbiert. Eine Seite ist sticky (Text), während die andere Seite sich bewegt (Bilder). Am besten für produktreiche Sites.
Was zu vermeiden ist
Um sicherzustellen, dass die KI deine Vision klar versteht, vermeide diese gängigen Prompting-Fehler:- Vage Anfragen: Kommentare wie „Mach es besser” oder „Behebe es” ohne Kontext lassen die KI raten. Sei spezifisch darüber, was sich ändern muss.
- Zu viel auf einmal: „Baue eine komplette E-Commerce-Site mit Zahlungen, Inventar, Bewertungen und Analytics” in einer Nachricht kann Verwirrung verursachen. Beginne mit der Kernstruktur und füge Funktionen Schritt für Schritt hinzu.
- Annehmen, dass sich die KI an alles erinnert: Wenn du vor Tagen oder in einem anderen Chat mit der KI gesprochen hast, erinnere sie an den Kontext.
- Erwarten, dass die KI deine Gedanken liest: Wenn du einen bestimmten Design-Flow oder Layout im Kopf hast, beschreibe es so genau wie möglich.
Tipps für großartige Prompts
Diese 4 einfachen Strategien helfen dir, Prompts zu schreiben, die dir die stärksten Ergebnisse mit Base44 liefern.Sei klar und spezifisch
Je mehr Details du teilst, desto besser die Ergebnisse. Du kannst später zusätzliche Funktionen definieren, aber beginne mit den wichtigsten. Um dir zu helfen, die Function (Schritt 1 der obigen Formel) klar zu definieren, versuche das einfache Who-, What-, Why-Framework:
- WHO: Für wen ist diese App? (z.B. unabhängige Berater)
- WHAT: Wobei hilft sie ihnen? (z.B. Kundenprojekte und Fristen zu verwalten)
- WHY: Warum würde jemand sie verwenden? (z.B. Zeit sparen und organisiert bleiben)
Denke darüber nach, wer deine App verwenden wird
Stelle dir vor, wie du oder jemand anderes deine App verwenden wird. Beschreibe die Hauptschritte oder die Reise, die deine Nutzer unternehmen werden, wie das Anmelden, Hinzufügen von Informationen oder Verfolgen des Fortschritts. Dies hilft der KI, eine Erfahrung zu gestalten, die sich natürlich und hilfreich anfühlt.Du kannst der KI zum Beispiel sagen: „Nutzer melden sich an, erstellen ein neues Projekt, setzen Meilensteine und verfolgen täglich ihren Fortschritt.”
Konzentriere dich auf das Ergebnis, nicht den Prozess
Du musst keine technischen Schritte erklären oder beschreiben, wie Dinge hinter den Kulissen funktionieren sollen.Teile einfach das Endergebnis, das du möchtest, wie „Lass Lehrer Aufgaben hochladen und Feedback an Schüler senden.” Die KI handhabt alle komplexen Details für dich.
Entwickle deine App weiter
Dein erster Prompt ist nur der Anfang. Du kannst jederzeit um Änderungen, Updates oder neue Funktionen bitten.Für größere oder komplexere Apps versuche, in Schritten zu bauen. Beginne einfach, füge dann nacheinander Funktionen oder Designdetails hinzu. Experimentiere, bis deine App zu deiner Vision passt. Jedes Mal, wenn du Feedback gibst, wird Base44 deine App weiter verbessern.
Techniken für bessere Ergebnisse
Wenn du deine App verfeinerst, gibt es einige Wege, mit Base44 zu sprechen, die ihr helfen, deine Vision umzusetzen.| Technik | Wann verwenden | Beispiele | Pro-Tipp |
|---|---|---|---|
| „Mach es mehr…” / „Mach es weniger…” | Ton, Layout oder Betonung anpassen | - „Mach den Header weniger fett.” - „Mach die CTA überzeugender.” | Füge warum hinzu: „Mach die CTA überzeugender, weil es der letzte Schritt in der Nutzerreise ist.” |
| „Füge eine… hinzu” / „Entferne die…” | Spezifische Funktionen oder UI-Blöcke hinzufügen/entfernen | - „Füge einen Kommentarbereich zu jeder Aufgabe hinzu.” - „Entferne die Preisseite vorerst.” | Gruppiere Aktionen für größere Effizienz: „Füge einen Kommentarbereich hinzu und verschiebe ihn unter die Aufgabenliste.” |
| „Ändere [dies] zu [das]“ | Text, Visuals, Layout oder Komponentenlogik anpassen | - „Ändere die Sidebar-Farbe zu Anthrazit.” - „Ändere den ‚Submit’-Button auf ‚Send Request’.” | Schichte Kontext: „Ändere den Button-Text, damit er zum freundlichen Ton passt, der in der restlichen App verwendet wird.” |
| „Es sollte sich anfühlen wie…” | Bekannte App-Stile übernehmen, um Layout oder Verhalten zu leiten | - „Es sollte sich anfühlen wie eine Mischung aus Duolingo und Habitica.” - „Wie eine leichtere Version von Airtable.” | Kläre welche Teile: „Verwende Duolingos verspielten Ton und Habiticas gamifiziertes Fortschrittssystem.” |
| „Füge Logik für… hinzu”(optional) | Funktionale Regeln oder Abläufe ohne Code hinzufügen | - „Füge Logik hinzu, um abgeschlossene Elemente aus der Standardansicht auszublenden.” - „Sende eine Erinnerung, wenn 3 Tage keine Aktion.” | Beschreibe das gewünschte Ergebnis, sobald die Logik hinzugefügt ist: „Füge Logik hinzu, damit Nutzer angestupst werden, wenn sie sich seit einer Woche nicht eingeloggt haben.” |
| „Gruppiere oder organisiere…” | Inhalt für Klarheit oder Workflow strukturieren | - „Gruppiere Aufgaben nach Kategorie” - „Organisiere Einstellungen in einklappbare Bereiche” | Erwähne Nutzerbedürfnisse: „Organisiere Aufgaben nach Kategorie, damit Nutzer schnell finden, was sie brauchen.” |
| „Füge bedingtes Verhalten hinzu…” | Smarte Verzweigungen oder zustandsbasierte Funktionalität einführen | - „Zeige den Download-Button nur, nachdem die Zahlung bestätigt ist.” | Beginne einfach, erweitere später: „Füge die Bedingung zuerst hinzu, dann füge ich Variationen pro Nutzertyp hinzu.” |
| „Lass Nutzer…”-Aussagen | Funktionalität aus Sicht des Endnutzers formulieren | - „Lass Nutzer Dokumente hochladen und taggen.” - „Lass Nutzer Ressourcen für später bookmarken.” | Formuliere die Funktionalität so, dass sie dem Nutzer Wert erschließt: „Lass Nutzer Dokumente hochladen und taggen, damit sie sie später leicht finden können.” |
Mit der KI chatten
Deine App zu bauen ist eine Konversation, kein einmaliger Befehl. Sobald du die obigen Techniken verwendet hast, um deine Vision zu verfeinern, kannst du die Chat-Oberfläche verwenden, um deine App Schritt für Schritt zu gestalten. Du kannst Fragen stellen, neue Funktionen hinzufügen, Details aktualisieren oder deine Meinung jederzeit ändern. Es gibt keine Begrenzung, wie viele Änderungen du vornehmen kannst. Wenn du ein neues Layout ausprobieren, eine Seite hinzufügen oder etwas entfernen möchtest, tippe einfach deine neue Anfrage ein, und die KI aktualisiert deine App in Sekunden.
- Discuss-Modus: Verwende den Discuss-Modus, wann immer du brainstormen oder Ideen mit der KI besprechen möchtest, bevor du Änderungen vornimmst. Es ist eine großartige Möglichkeit, Optionen zu erkunden und Feedback zu erhalten, ohne deine Live-App zu beeinflussen, bis du bereit bist. Erfahre mehr über die Chat-Modi
- Revert-Historie: Wenn du deine Meinung änderst oder zurückgehen möchtest, kannst du jede vorherige Version deiner App leicht wiederherstellen. Experimentiere so viel du möchtest, wissend, dass du bei Bedarf jederzeit rückgängig machen oder vergangene Versionen erneut besuchen kannst. Erfahre mehr über das Rückgängigmachen von Änderungen
FAQs
Klicke unten auf eine Frage, um mehr über die Verwendung von Prompts im KI-Chat zu erfahren.Warum kann ich die gewünschte Funktion nicht umsetzen?
Warum kann ich die gewünschte Funktion nicht umsetzen?
Einige Funktionen werden möglicherweise nicht unterstützt. Wenn du unsicher bist, kannst du in unserem Discord-Hilfekanal fragen.
Warum ändert die KI Teile meiner App, die ich nicht erwähnt habe, und wie kann ich das kontrollieren?
Warum ändert die KI Teile meiner App, die ich nicht erwähnt habe, und wie kann ich das kontrollieren?
Du kannst die KI-Steuerungen verwenden, um die Änderungen der KI nur auf die Bereiche zu beschränken, die du aktualisiert haben möchtest. Dies ist besonders hilfreich, wenn andere Teile der App absichtlich verändert werden. Erfahre mehr über das Anpassen des KI-Chats
Wie kann ich Ideen mit der KI überprüfen, bevor ich Credits für Änderungen verbrauche?
Wie kann ich Ideen mit der KI überprüfen, bevor ich Credits für Änderungen verbrauche?
Verwende den Discuss-Modus unten im KI-Chat. So kannst du Ideen besprechen, Logik überprüfen oder Schritte mit der KI planen, bevor du Änderungen vornimmst oder Credits verbrauchst. Es ist ideal, um sicherzustellen, dass deine Ziele klar sind, und Alternativen zu erkunden, bevor du Updates auf deine App anwendest. Erfahre mehr über die Chat-Modi
Warum folgt die KI meinen Anweisungen nicht korrekt?
Warum folgt die KI meinen Anweisungen nicht korrekt?
Es kann die KI einige Versuche kosten, die perfekte Lösung zu finden. Die Absicht ist nicht immer vollständig klar, und kleine Bugs können auftauchen. Um bessere Ergebnisse aus dem Chat zu erhalten, ist es wirklich hilfreich, so spezifisch wie möglich über das Element zu sein, auf das du dich beziehst.Hier sind einige Tipps, die wir empfehlen:
- Verwende Visual Edits, um das Element direkt hervorzuheben und die gewünschte Änderung zu beschreiben
- Erkläre, was passieren soll (statt was falsch ist)
- Wenn du Prompts wiederholst, versuche, mit Schlüsselwörtern wie redesign oder rebuild umzuformulieren
- Schreibe in deiner eigenen natürlichen Sprache, je einfacher und klarer die Anfrage, desto genauer die Antwort.
Was soll ich tun, wenn KI-Antworten langsam sind oder hängen bleiben?
Was soll ich tun, wenn KI-Antworten langsam sind oder hängen bleiben?
Wenn die KI zu lange braucht oder hängen zu bleiben scheint, versuche, die Seite zu aktualisieren oder deinen Prompt erneut zu senden. Das behebt das Problem normalerweise und bringt die Dinge wieder in Bewegung.
Wie kann ich besser prompten, um den Verlust von Code-Änderungen mit KI-generiertem Code zu vermeiden?
Wie kann ich besser prompten, um den Verlust von Code-Änderungen mit KI-generiertem Code zu vermeiden?
Beim Arbeiten mit KI-generiertem Code sind die Ergebnisse möglicherweise nicht immer wie erwartet. Um das Risiko zu reduzieren, deine Änderungen zu verlieren:
- Verwende KI-Steuerungen, um benutzerdefinierte Anweisungen oder wichtige Notizen hinzuzufügen, die die KI für jeden Prompt im Gedächtnis behalten soll.
- Wiederhole kritische Details oder Anforderungen in deinen Prompts, besonders wenn der Kontext wichtig ist.
- Speichere deine Arbeit regelmäßig und behalte Backup-Kopien wichtiger Versionen deines Codes.
- Denke daran, dass effektives Prompting eine Fähigkeit ist. Mit Erfahrung und Verbesserung der KI-Tools werden deine Ergebnisse besser.
- Überprüfe sorgfältig sowohl deine Prompts als auch die Ausgabe der KI, um sicherzustellen, dass dein Kontext und deine Anforderungen wie beabsichtigt behandelt werden.
Diese Seite wurde mit KI übersetzt. Für die genauesten und aktuellsten Informationen siehe die englische Version.