効果的なプロンプト

アプリ ブループリントの有効性と生成されたコードの品質は、プロンプトの明確さと詳細さに依存します。App Prototyping agent を使用する場合は、アプリの生成とデバッグ時に効果的なプロンプトを表示するための次のガイドラインを検討してください。

  • 具体的にする: アプリの機能、ユーザー インタラクション、データ要件を明確に定義します。可能であれば、具体的なテクノロジーを依頼します。たとえば、3D 要素を含むウェブアプリを作成する場合は、Gemini に three.js を使用するよう指示できます。
  • サービスを設定するための追加のタスクについて尋ねる: Gemini はアプリのコードを書くことはできますが、実際にサービスを設定すること、API を有効にすること、リソース（Cloud Storage バケットや Stripe アカウントなど）をプロビジョニングすることはできません。特定のサービスのコードを記述する場合は、そのサービスの設定方法も示すように Gemini に指示してください。
  • Firebase プロジェクトをリクエストする: App Prototyping agent に Firebase サービスをセットアップするようリクエストすると、ユーザーに代わって Firebase プロジェクトがプロビジョニングされます。たとえば、「Firestore を追加して」や「アプリを Firebase に接続して」とリクエストできます。
  • Gemini を使用してプロンプトを絞り込む: Google の Gemini、Code ビューの Gemini in Firebase でチャット、または他の Gemini サーフェスを使用して、プロンプトを絞り込み、最適化します。
  • コンテキストを提供する: アプリの目的、対象ユーザー、希望するユーザー エクスペリエンスに関する背景情報を含めます。
  • 例を使用: 可能であれば、ユーザーがアプリを操作する方法や表示されるデータの例を示します。
  • 反復して改善する: 開発を反復的に行います。まず基本的なリクエストから開始し、機能を追加してテストし、改良してから、別の機能を追加することを検討してください。

これらのガイドラインに沿うことで、Firebase Studio によって生成されるアプリのブループリントの品質と関連性を大幅に向上させ、アプリのデバッグ時の成功率を高めることができます。

追加のプロンプトを使用して回答の質を高める

最初の結果が期待どおりでない場合は、詳細を追加することや、具体的な指示を提供することで、プロンプトを調整できます。

  • 制約を追加する: UI、データモデル、または機能に関する制約を規定します。
  • 例を示す: ユーザーがアプリを操作する方法と表示されるデータの例を示します。
  • キーワードを使用する: LLM が必要な出力のクラスに関連付けることができる機能を記述するには、キーワードを使用します。たとえば、アプリが Google のデザイン基準に準拠していることを示すプロンプトでマテリアル デザインを使用できます。
  • 特定の変更を依頼する: 生成されたコードまたはブループリントの特定の変更を依頼します。各機能リクエストは別々のリクエストで追加してください。
  • モデルに推論を依頼する: 目的の結果が得られないトラブルがある場合は、プロンプトを使用して推論するようにモデルに依頼してみてください。たとえば、こう依頼します。「順を追って考えてください。タスクアプリの入力ボックスを作成したい。[タスクを追加] ボタンと [キャンセル] ボタンを含める必要があります。

これらの手法を使用すると、プロンプトを繰り返し改良して、目的の結果を得ることができます。

アプリのブループリントに関する効果的なプロンプトの例

以下は、さまざまな種類のアプリ向けの効果的なプロンプトの例です。

シンプルなタスク トラッカー:

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.

予算管理アプリ:

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.

Gemini のサポート付きのゲームアプリのプロンプト（マークダウン）:

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.

デバッグのヒント

Gemini in Firebase を使用すると、Code ワークスペースまたは App Prototyping agent のチャットでコードをデバッグできます。

Gemini はコードを自動生成できますが、エラーが発生することもあります。エラーを検出すると、修正を試みます。エラー メッセージに記載されている問題を解決できない場合は、次の方法をお試しください。

  • 問題を説明する: チャット インターフェースで、発生している問題をできるだけ明確かつ簡潔に説明してください。Gemini はエラー メッセージやログなどのコンテキストにアクセスできる場合がありますが、コンテキスト全体を理解できない場合があります。エラー メッセージとともに動作を説明すると、Gemini がエラーを速やかに修正しやすくなります。

  • 具体的な質問をする: コードについて気兼ねなく Gemini に直接質問してください。たとえば、「この関数で null ポインタ例外が発生する原因は何ですか？」や「この競合状態を防ぐにはどうすればよいですか？」などです。

  • 複雑な問題を分割する: 複雑な問題に対処する場合は、より管理しやすい小さな部分に分割します。各部分を個別にデバッグして、問題を段階的に検討できるように、Gemini に支援を依頼します。

  • コードフェンスを使用: コード スニペットを共有する際は、コードフェンスを使用することで、コードが適切にフォーマットされるようにします。これにより、Gemini ではコードを読みやすく、理解しやすくなります。

  • イテレーションと改良: Gemini は、最初の試行で必ずしも完璧なソリューションを提供するとは限りません。回答を確認して、不明な点について質問し、必要に応じて追加情報を提供します。

  • プロンプトのループを回避する: Gemini がループに陥る場合や、質問に回答できない場合は、プロンプトを言い換えるか、追加のコンテキストを提供してみてください。質問を言い換えるだけで、Gemini が質問内容を理解できることもあります。

    プロンプトを言い換えてもループが解消されない場合は、次の方法をお試しください。

    • 新しいチャットを開始する: Code ワークスペースで Gemini in Firebase のチャットを使用している場合は、新しいチャット セッションを開始して Gemini のコンテキストをリセットします。これにより、Gemini が前の会話で抱いた誤解や前提を解消できます。

    • 反例を提供する: Gemini が誤った前提を立てている場合は、正しい動作を理解できるように反例を提供します。

次のステップ