Die Effektivität Ihres App-Blueprints und die Qualität des generierten Codes hängen von der Klarheit und dem Detailgrad Ihrer Prompts ab. Beachten Sie bei der Verwendung von App Prototyping agent die folgenden Richtlinien für effektive Prompts beim Generieren und Debuggen von Anwendungen:
- Seien Sie konkret: Definieren Sie die Funktionen, Nutzerinteraktionen und Datenanforderungen Ihrer App klar. Fragen Sie nach Möglichkeit nach bestimmten Technologien. Wenn Sie beispielsweise eine Webanwendung mit 3D-Elementen erstellen möchten, können Sie Gemini bitten,
three.jszu verwenden. - Fragen Sie nach zusätzlichen Aufgaben zum Einrichten von Diensten: Gemini kann Code für Ihre Anwendung schreiben, aber keine Dienste einrichten, APIs aktivieren oder Ressourcen bereitstellen (z. B. einen Cloud Storage-Bucket oder ein Stripe-Konto). Weisen Sie Gemini darauf hin, dass es Ihnen auch mitteilen soll, wie diese Dienste eingerichtet werden, wenn es Code für bestimmte Dienste schreibt.
- Firebase-Projekt anfordern: Wenn Sie den App Prototyping agent bitten, Ihnen bei der Einrichtung von Firebase-Diensten zu helfen, wird in Ihrem Namen ein Firebase-Projekt bereitgestellt. Sie können beispielsweise fragen: „Hilf mir, Firestore hinzuzufügen“ oder „Verbinde meine App mit Firebase“.
- Gemini verwenden, um Ihren Prompt zu optimieren: Verwenden Sie Gemini for Google, Chat with Gemini in der Ansicht Code oder andere Gemini-Oberflächen, um Ihren Prompt zu optimieren.
- Kontext angeben: Geben Sie Hintergrundinformationen zum Zweck Ihrer App, zur Zielgruppe und zur gewünschten Nutzererfahrung an.
- Beispiele verwenden: Geben Sie nach Möglichkeit Beispiele dafür an, wie Nutzer mit der App interagieren sollten oder welche Daten angezeigt werden sollen.
- Iterieren und optimieren: Gehen Sie bei der Entwicklung iterativ vor. Beginnen Sie am besten mit einer einfachen Anfrage, fügen Sie dann ein Feature hinzu, testen Sie es, verfeinern Sie es und fügen Sie dann ein weiteres Feature hinzu.
Wenn Sie diese Richtlinien befolgen, können Sie die Qualität und Relevanz der von Firebase Studio generierten App-Blueprints und den Erfolg beim Debuggen Ihrer App erheblich verbessern.
Antworten mithilfe zusätzlicher Prompts optimieren
Wenn die ersten Ergebnisse nicht Ihren Erwartungen entsprechen, können Sie Ihre Prompts verfeinern, indem Sie weitere Details hinzufügen oder spezifische Anweisungen geben:
- Einschränkungen hinzufügen: Geben Sie Einschränkungen für die Benutzeroberfläche, das Datenmodell oder die Funktionen an.
- Beispiele angeben: Geben Sie Beispiele dafür an, wie Nutzer mit der App interagieren sollen und welche Daten angezeigt werden sollen.
- Keywords verwenden: Verwenden Sie Keywords, um die gewünschten Funktionen oder Fähigkeiten zu beschreiben, die das LLM mit der gewünschten Ausgabeklasse verknüpfen könnte. Beispielsweise können Sie Material Design in einem Prompt verwenden, um anzugeben, dass Ihre App den Designstandards von Google entsprechen soll.
- Bestimmte Änderungen anfordern: Sie können bestimmte Änderungen am generierten Code oder Blueprint anfordern. Fügen Sie jeden Feature Request in einer separaten Anfrage hinzu.
- Modell zum Nachdenken auffordern: Wenn Sie nicht die gewünschten Ergebnisse erhalten, bitten Sie das Modell, die Eingabeaufforderung zu durchdenken. Sie könnten zum Beispiel sagen: „Denke Schritt für Schritt nach. Ich möchte ein Eingabefeld für meine Aufgaben-App erstellen. Es soll einen Button „Aufgabe hinzufügen“ und einen Button „Abbrechen“ enthalten.“
Mit diesen Techniken können Sie Ihre Prompts iterativ verfeinern, um die gewünschten Ergebnisse zu erzielen.
Beispiele für effektive Prompts für App-Blueprints
Hier sind einige Beispiele für effektive Prompts für verschiedene Arten von Apps:
Einfacher Aufgaben-Tracker:
Create a simple web app that displays a list of to-do items.
Users should be able to add new items to the list and mark items as complete.
Provide a way to delete items and export the list as a text file.
Use a clean and modern UI using Google Material Design principles.
Budget-App:
A budgeting and expense tracking app with spending categories, charts, and
budget goals. Include a clean dashboard with key insights. It should include
spending categories, charts, and budget goals. The app should allow users to
manually add expenses or upload csv files. The app should also allow users to
upload receipts, then use AI to convert the receipt into an expense entry that
users can edit. Data should be stored in browser cache, with download and
delete options.
Prompt für Gaming-App mit Unterstützung von Gemini (Markdown):
Generate a delightful sliding number puzzle game (15-puzzle) with Javascript,
HTML, and CSS.
- **Setup:** Create a 4x4 grid with numbers 1-15 and one empty space. Use a
**solvable shuffling algorithm** to randomize the start.
- **Gameplay:** Allow clicking tiles **adjacent to the empty space** to slide
them. Count and display the number of moves.
- **Timer:** Include a **countdown timer** starting at **120 seconds**
(2 minutes).
- **End Conditions:**
- If solved (numbers 1-15 in order): Alert with an encouraging winning
statement generated by AI.
- If timer reaches 0: Alert with a funny retort generated by AI.
Tipps zur Fehlerbehebung
Sie können Gemini verwenden, um Ihren Code mit dem Chat in Ihrem Code-Arbeitsbereich oder der App Prototyping agent zu debuggen.
Gemini kann zwar Code für Sie schreiben, aber manchmal auch Fehler produzieren. Wenn ein Fehler erkannt wird, versucht das System, ihn zu beheben. Wenn Sie feststellen, dass das Problem anhand der Fehlermeldung nicht behoben werden kann, können Sie einige der folgenden Techniken ausprobieren:
Problem beschreiben: Beschreiben Sie das Problem in der Chat-Oberfläche so klar und prägnant wie möglich. Gemini hat zwar möglicherweise Zugriff auf Kontext wie Fehlermeldungen und Logs, versteht aber möglicherweise nicht den gesamten Kontext. Wenn Sie das Verhalten zusammen mit der Fehlermeldung beschreiben, kann Gemini Fehler schneller beheben.
Konkrete Fragen stellen: Scheuen Sie sich nicht, Gemini direkte Fragen zu Ihrem Code zu stellen. Beispiel: „Was könnte in dieser Funktion eine NullPointerException verursachen?“ oder „Wie kann ich diese Race-Bedingung verhindern?“
Komplexe Probleme aufschlüsseln: Wenn Sie es mit einem komplexen Problem zu tun haben, unterteilen Sie es in kleinere, überschaubare Teile. Bitten Sie Gemini, Ihnen bei der Fehlerbehebung für jeden Teil einzeln zu helfen und Probleme Schritt für Schritt durchzugehen.
Codeblöcke verwenden: Verwenden Sie beim Teilen von Code-Snippets Codeblöcke, damit der Code richtig formatiert ist. So kann Gemini Ihren Code leichter lesen und verstehen.
Wiederholen und verfeinern: Gemini liefert möglicherweise nicht immer beim ersten Versuch die perfekte Lösung. Prüfen Sie die Antworten, stellen Sie klärende Fragen und geben Sie bei Bedarf zusätzliche Informationen an.
Prompt-Schleifen vermeiden: Wenn Gemini in einer Schleife hängen bleibt oder Ihre Frage nicht beantworten kann, versuchen Sie, Ihren Prompt umzuformulieren oder zusätzlichen Kontext anzugeben. Manchmal hilft es, die Frage einfach umzuformulieren, damit Gemini versteht, was Sie wissen möchten.
Wenn das Problem durch Umformulieren des Prompts nicht behoben wird, versuchen Sie es mit den folgenden Techniken:
Neuen Chat starten: Wenn Sie den Gemini-Chat in Ihrem Code-Arbeitsbereich verwenden, starten Sie eine neue Chatsitzung, um den Kontext von Gemini zurückzusetzen. So können Sie sich von Missverständnissen oder Annahmen befreien, die Gemini in der vorherigen Unterhaltung möglicherweise getroffen hat.
Gegenbeispiele angeben: Wenn Gemini falsche Annahmen trifft, geben Sie Gegenbeispiele an, damit das richtige Verhalten verstanden wird.
Nächste Schritte
- Erste Schritte mit dem App Prototyping agent
- Entwickeln, veröffentlichen und überwachen Sie eine App anhand einer Demo der App Prototyping agent.
- Anwendungen in einem Firebase Studio-Arbeitsbereich entwickeln