Gemini in Android Studio は、Jetpack Compose を使用し、Android のベスト プラクティスに沿って、Android アプリの UI ビジョンを現実にするための独自の機能を備えています。このページでは、Gemini を使用してアプリ UI を作成する一般的な手順について説明します。画像添付や、この機能のその他の活用方法については、クエリに画像を添付するをご覧ください。
Gemini を使用して UI を生成する一般的な手順は次のとおりです。
目的のアプリ UI のモックアップを作成します。ワイヤーフレームや基本的なデザインが最適です。デザイン ツールから PNG をエクスポートすることも、手描きの画像を使用することもできます。
図 1: アプリのユーザー インターフェースのワイヤーフレームの手描き図。 [Attach image file]（画像ファイルを添付）ボタン
をクリックして、画像をクエリに添付します。チャット フィールドで、Gemini に UI コードの生成を依頼します（例: 「提供された画像の Jetpack Compose コードを生成してください」）。クエリと画像を送信すると、Gemini が提案された UI を作成するためのコードを提案します。通常、Gemini は Compose プレビューのコードも提供するため、プロジェクトにインポートすると UI をすばやく可視化できます。提供されない場合は、Compose プレビューを生成するように依頼してください。
図 2: 添付画像から Jetpack Compose コードを生成する Gemini。 コードをインポートしてプレビュー パネルに Compose プレビューが表示されたら、プレビューを直接クリックして Gemini に変換をリクエストすることで、UI を反復処理できます。
図 3: Gemini を使用して、Compose プレビューから UI 要素を直接変換する。