Geminiで私服をコーディネートしてみた！
Google CloudのGeminiを使って、自分の私服をコーディネートしてくれるアプリ「OUTFIT AI」の作成方法と機能を紹介します。
1. はじめに
突然ですが皆さん、コーディネートについて、以下のようなお悩みはありませんか？
- どのようにコーディネートを組めば良いのか分からない…
- 在宅勤務が多いから外の気温感が分からない。今日はどのくらい着込めば良いの？
上記のお悩みを、全てGeminiが解決してくれるアプリを作成しました！ その名も…「OUTFIT AI」です！
本記事では、このアプリはどのように作成したのか、簡単に構成やその中身についてお話したいと思います。
2. Firebaseとは
アプリでは、Firebaseを使用しています。Firebaseとは一体どのようなものなのでしょうか？
概要
Firebaseを一言で言うと、「アプリ開発に必要な裏側の機能をまとめて提供してくれる、Googleのクラウドプラットフォーム」です。したがって、Google Cloudを使っているエンジニアには特におススメのアプリバックエンドサービスと言えるでしょう。
通常、スマホアプリやWebサイトを作るには、ユーザー情報を保存する「データベース」や、画像を保存する「ストレージ」、ログイン機能などの「サーバー側の仕組み」を自前で構築する必要があります。Firebaseを使えば、これらを自分で作ることなく、部品を組み合わせるような感覚で素早く開発できます。
使うメリット
- サーバー管理がいらない（サーバーレス）：自分でサーバーを立てて設定したり、メンテナンスしたりする必要がありません。Googleが裏側をすべて管理してくれます。
- 自動でスケールする：ユーザーが10人から100万人に急増しても、Googleのインフラが自動で対応してくれます。
- 無料枠が大きい：個人の開発や小さなプロジェクトであれば、無料の範囲内で十分に運用できます。
使用時の注意点
非常に便利なFirebaseですが、苦手なこともあります。
- 複雑なデータ分析：複雑な条件でデータを検索したり、大量のデータを集計したりするのは、一般的なSQLデータベース（MySQLなど）に比べると少し苦手です。
- Googleプラットフォームへの依存：Googleのサービスなので、将来的に別のクラウド（AWSなど）へ移行しようとすると、作り直しの手間が大きくなります。
3. アプリ作成方法
作成期間
「OUTFIT AI」は、およそ半月ほどで作成しました。このアプリは、どこかにリリースしたいから作成したのではなく、単純に私自身が欲しいアプリだったので、UIなどはそんなにこだわりませんでした。したがって、必要最低限使えるようなアプリであれば良かったので、半月という短い期間で作成できました。
作成方法：はじまり
私はGoogle Cloudを基盤とした、Geminiを使ったアプリを作成したかったので、Google Cloudと親和性の高いAndroidのアプリを作成しようと思いました。ただ、私はAndroidのアプリはおろか、スマホアプリなど全く作ったことがありません。そんな私が頼ったのは、やはりGeminiでした。当時はGemini 3.0はまだリリースされていませんでした。私は、Gemini 2.5 proに相談しながらアプリを作成することにしたのです。
Geminiに、「Geminiを使って自分の私服をコーディネートしてくれるようなAndroidのアプリを作りたいんだけど、まず何から始めたら良い？」と聞きました。するとGeminiに、「Android StudioとFirebaseを使うのが良いでしょう。」と言われました。スマホアプリを作成したことも無い私は、「Android Studio？Firebase？」となっていましたが、とりあえずAndroid Studioをインストールし、課金しているGoogle CloudプロジェクトをFirebaseに紐づけ、それぞれを使える状態にしました。
作成方法：Firebaseの設定
前述したように、Firebaseはスマホアプリに使用できるバックエンドサービスです。そんなFirebaseでは、「Firestore Database」と、「AI Logic」のみ設定し、使用しています。それぞれの役割は以下の通りです。
- Firestore Database：私服の画像の保存場所
- AI Logic：Gemini（今回はGemini-2.5-Flash-image）を安全に使用するための仕組み
作成方法：Android Studioの設定
Firebaseでアプリのバックエンドを構成しているのに対し、Android Studioは、Firebaseとアプリの連携やアプリのUI設定など、アプリのフロントエンドの構成に使用しています。私はアプリ作成未経験ですので、コード等は全てGeminiに書いてもらい、微調整は自分で行う、という進め方をしていました。
詰まったところを1つ紹介します。アプリでGemini-2.5-Flash-imageを使用するにあたって、Geminiからの返答がアプリに届かず、上手くアプリ上に表示させることができなかったことがありました。その時の問題点は、「Geminiから渡される引数」を上手く設定していなかったところにありました。
Gemini-3.0など、文章のみ返す言語モデルは、「テキスト（text）」のみこちらに渡します。しかし、Gemini-2.5-Flash-imageなどのマルチモーダルな言語モデルは、「テキスト（text）」の他に「イメージ（image）」の2つを返してくるのです。このことを知っていなかったがために、ここでめちゃくちゃ詰まりました…。皆さんは、同じところで躓きませんように…！
4. 「OUTFIT AI」の紹介
このように作成した「OUTFIT AI」は、どのような見た目で、一体どのようなことができるのでしょうか？実際の画面を見せながら紹介します！
コーディネート提案までの流れ
Geminiから自分の私服を使ったコーディネートを提案してもらうまでの流れを以下に示します。
図 1コーディネート提案までの流れ
まずは自分の私服をアプリに格納しておきます。その後、アプリのプロンプトで自分の欲しいコーディネートを要求し、それらを元にGeminiがコーディネートを提案してくれる、という流れです。
ホーム画面の様子
上記の流れと共に、ホーム画面を紹介します。
図 2アプリのホーム画面
実際の様子
実際の様子を見てみましょう。私のお気に入りのコートを添付し、「今日の天気に合ったコーディネートを提案して！」とGeminiにお願いしてみます。
図 3プロンプト入力（実際の画面）
すると、以下のような私の登録してある私服を使って、コーディネートを提案してくれました。
図 4コーディネート提案（実際の画面）
とっても素敵なコーディネートですよね！天気情報もきちんと取得して、それに合ったコーディネートを提案してくれています！
5. 最後に
私はスマホアプリも何も作成したことのないエンジニアでしたが、Geminiと会話しながら、ほとんど1人でスマホアプリを作成することができました！この「OUTFIT AI」では、Geminiが自分の私服から、ユーザーの望むコーディネートを提案してくれます。作成してみて私が驚いたのは、Geminiの性能の高さです。登録してある服をそのまま、画像生成に使用してくれるなんて、画期的すぎますね！
最後に、このブログを読んでくださった皆さんが、「自分も未経験だけど、スマホアプリを作ってみようかな」、「Geminiってこんなこともできるんだ！ならこれもできるんじゃないかな？」など、思い立っていただけましたら嬉しいです！