【誰でも簡単】Google AI Studio「Vibe Coding」の使い方や活用事例を徹底解説

2025年10月21日（日本時間）、Googleは「Google AI Studio」のBuildモードにAIを活用したアプリの構築を可能にする「Vibe Coding」を追加しました。

「Vibe Coding」の登場により「こんな雰囲気のアプリが作りたい」といった抽象的なアイデアを記述するだけで、Geminiが内容を汲み取り、モデルや機能を選択し、自動でアプリを構築してくれます。

とはいえ、「どうやって使えばいいのかわからない」「どんなことができるのかわからない」と不安に感じていませんか。

本記事では、「Vibe Coding」の概要や使い方、注意点などを解説します。さらに、筆者が実際にGoogle AI Studioでアプリを作成した事例も紹介します。

誰でも直感的に、オリジナルのAIアプリを作れる「Vibe Coding」の魅力を、ぜひ試してみてください。

SHIFT AIでは、ChatGPTやGeminiなどの生成AIを活用して、AIを使った副業の始め方や、収入を得るまでのロードマップを解説するセミナーを開催しています。

また、参加者限定で、「初心者が使うべきAIツール20選」や「AI副業案件集」「ChatGPTの教科書」など全12個の資料を無料で配布しています。

「AIを使って最速で副業収入を得る方法を知りたい」という方は、ぜひセミナーに参加してみてください。

Google AI Studioに「Vibe Coding」が登場

Google AI StudioのBuildモードに、直感的にAIアプリを作れる「Vibe Coding」が追加されました。

今回のアップデートにより、用途別のカードを選んでプロンプトを記載するだけでAIアプリを簡単に作成できます。

選択するカードに応じて、以下のようなアプリを簡単に作成可能です。

カード名	機能概要
Nano banana powered app	画像編集機能を備えたAIアプリを構築
Generate images with a prompt	テキストから高品質な画像を生成
Gemini intelligence in your app	文章分析・要約機能を組み込んだアプリを作成
Animate images with Veo	キャラクター画像や製品写真をアニメーション化
AI powered chatbot	会話文脈を理解するチャットボットを簡単に導入
Prompt based video generation	テキストから短い動画を自動生成
Use Google Maps	Googleマップを活用したエージェント開発に対応
Use Google Search data	Web検索を活用したエージェント開発に対応

入力したプロンプトは「Build」でコードに変換され、ReactまたはAngular※をベースとしたWebアプリが自動生成されます。
※Webアプリを構築するためフレームワーク（開発の土台）

「Vibe Coding」を使えば、アイデアの段階からアプリ完成までの流れが圧倒的にスムーズです。プロンプトの書き方に悩むこともなく、非エンジニアでもAIアプリを作成できます。

以下の記事では、Google AI Studioの使い方やできることなどを紹介しています。Google AI Studioの使い方に不安がある方はぜひ参考にしてみてください。

Google AI StudioのVibe Codingを使うための料金プラン

Google AI Studioは制限にかかるまで無料で使えます。そのため、Google AI Studioでは料金を気にする必要はありません。

ただし、制限を超えた場合や外部APIを統合して大規模なアプリを構築する場合には、Google Cloud経由でのAPI利用料金が発生する仕組みです。

個人利用や小規模な開発であれば、無料枠の範囲で十分にVibe Codingを体験できます。

まずは無料の範囲で実際に試してみてください。

SHIFT AIでは、ChatGPTやGeminiなどの生成AIを活用して、AIを使った副業の始め方や、収入を得るまでのロードマップを解説するセミナーを開催しています。

また、参加者限定で、「初心者が使うべきAIツール20選」や「AI副業案件集」「ChatGPTの教科書」など全12個の資料を無料で配布しています。

「AIを使って最速で副業収入を得る方法を知りたい」という方は、ぜひセミナーに参加してみてください。

Google AI StudioでVibe Codingを使う方法

Google AI StudioのBuildモードを使えば、プロンプトとカード選択だけでAIアプリを構築できます。Vibe Codingを実際に使う6つの手順を紹介します。

1. Google AI Studioにアクセスする
2. 作成したいアプリの設定を行う
3. 使用するカードとプロンプトを入力する
4. 作成したアプリを修正する
5. 作成したアプリを保存する

実際にGoogle AI StudioのVibe Codingでアプリを作ってみた

ここでは、筆者がGoogle AI StudioのVibe Codingで作成したアプリを3つ紹介します。

• フィギュア画像生成アプリ
• ニュース読み上げアプリ
• 飲食店巡りマップアプリ

それぞれのアプリで使用したカードも紹介しているので、Vibe Codingでアプリを作成するときの参考にしてみてください。

フィギュア画像生成アプリ

今回は、「Nano banana powered app」を活用して話題のAIフィギュア化を行うアプリを作成しました。

アプリでは「画像をアップロードして生成ボタンを押す」だけのシンプルな構成で、ボタンを押すと入力画像がNano Banana経由でトイフィギュア風に変換されます。

実際に作成されたアプリを試している様子です。

画像を入力して数秒後にフィギュア化された画像が生成されました。

今回は「画像のフィギュア化アプリ」を紹介しましたが、Nano Bananaを活用すれば、背景の除去・スタイル変換・オブジェクト追加などを行うアプリも簡単に作成できます。

ニュース読み上げアプリ

今回は、最新ニュースを自動で要約し、その内容を音声で読み上げるアプリを作成しました。

「Generate speech」と「Use Google Search data」を使用して、テキストを自然な音声に変換しています。

アプリでは、ニュースを取得して要約した文章を「再生ボタン」で読み上げるだけのシンプルな構成です。

実際に作成されたアプリを試している様子です。

実際に使ってみると、Geminiによる要約は非常に自然で、ニュースの重要ポイントを短くわかりやすく伝えてくれました。

ニュース以外にも「天気情報の読み上げ」や「トレンド要約」など、音声やWebデータを活用したアプリもカードを選択するだけで簡単に作成できます。

飲食店巡りマップアプリ

今回は、入力した場所と条件から、周辺のおすすめ飲食店を検索し、複数のルートを提案してくれるアプリを作成しました。

「Use Google Maps」カードを活用して、地図データをもとにルート候補を複数生成し、その中から最適なルートを自動で選択します。

アプリでは、検索欄に「渋谷 カフェ」などと入力し、「ルートを提案」ボタンを押すだけで、周辺の人気スポットを含むおすすめコースが地図上に表示されます。

実際に作成されたアプリを試している様子です。

実際に試してみると、移動ルートの提案がスムーズで、効率的に食べ歩きルートを作成できました。

食べ物巡りマップ以外にも、「観光ルート作成」や「旅行プラン提案」など、Googleマップを活かしたアプリをカードを選択するだけで簡単に作成できます。

Google AI StudioのVibe Codingを使うときの注意点

ここでは、Google AI StudioのVibe Codingを使うときの注意点を3つ紹介します。

• 個人情報や機密情報に注意する
• 意図通りに動作しない場合がある
• 対応しているフレームワークが限られている

注意点を理解せずに使い始めると、想定外のリスクにつながります。それぞれ詳しく見ていきましょう。

個人情報や機密情報に注意する

Google AI Studioでアプリを作成するときは、個人情報や社内の機密情報を入力しないように注意が必要です。

Vibe Codingで利用するGeminiモデルは、入力内容をもとにアプリを生成するため、個人情報や社内資料を含めると情報漏えいのリスクがあります。

Google AI Studioの公式サイトでは以下のように記載されています。

品質の向上とサービスの改善を目的として、使用者が行った API 入出力に対して、人間のレビュアーが確認、 注記、処理を行う場合があります。このプロセスの一環として、Google は プライバシーを保護するための措置を講じます。

措置には、 Google アカウント、API キー、およびクラウド プロジェクトからのデータの切り離しが含まれます。これらは人間のレビュアーによる読み取りや注記の前に 行われます。本無料サービスには、プライベート情報、機密情報、または個人情報を送信 しないでください。

引用：Google AI Studio（利用規約）

プロンプトを入力するときは、送信前に必ず個人情報や機密事項が記載されていないか確認しましょう。

意図通りに動作しない場合がある

Google AI StudioのVibe Codingでは、生成されたアプリが必ずしも意図したとおりに動作するとは限りません。

Geminiモデルは入力プロンプトをもとにコードを自動生成しますが、複雑な仕様や曖昧な指示が含まれていると、期待とは異なる挙動を示す場合があります。

とくに外部API連携や入力処理などを含む場合は、エラーや動作不良が発生する可能性が高いです。

筆者もVibe Codingを利用したとき、アプリを作成中に何度もエラーが発生しました。

生成結果はあくまで「たたき台」として扱い、必要に応じてコードや設定を手動で調整するのがおすすめです。

対応しているフレームワークが限られている

Google AI StudioのVibe Codingでは、利用できるフレームワークが限られているため、アプリ開発を始める前に確認が必要です。

2025年10月時点で自動生成に対応しているのはReactとAngularのみです。

そのため、以下の主要フレームワークは、Vibe Codingでは現時点で利用できません。

• Python
• Java
• Flutter
• Vue.js

とくに、開発者の方や本格的なアプリ開発を検討している方は、生成されたコードを手動で修正する必要があります。

今後、対応フレームワークの拡張が予定されている可能性もあるため、最新のアップデート情報を定期的に確認しておきましょう。

Google AI StudioのVibe Codingを活用してアプリ作成を試してみよう！

Google AI StudioのBuildモードに「Vibe Coding」が追加されました。Vibe Codingを活用すれば、モデルの利用がより直感的になり、AIアプリを簡単に作成できます。

利用回数には制限がありますが、個人利用や小規模なアプリ作成であれば無料範囲内で十分試せます。

本記事で紹介した手順を参考に、ぜひ一度アプリ作成を試してみてください。

SHIFT AIでは、ChatGPTやGeminiなどの生成AIを活用して、副業で収入を得たり、キャリアアップで年収を高めたりするノウハウをお伝えする無料セミナーを開催しています。

セミナーでは、主に以下の内容を学習できます。

• AIを使った副業の始め方・収入を得るまでのロードマップ
• おすすめの副業案件と獲得方法
• AIスキルを高めて昇進・転職などに役立てる方法
• 実際に成果を出しているロールモデルの紹介
• これから使うべきおすすめのAIツール

無料セミナーは、AI初心者〜中級者の方を対象としています。

「これからAIを学習したいけど、何から始めていいのか分からない」「AIの独学に限界を感じてきた」という方にとくにおすすめです。

また、参加者限定で、「初心者が使うべきAIツール20選」や「AI副業案件集」「ChatGPTの教科書」など全12個の資料を無料で配布しています。

完全無料で参加できるため、ご興味のある方は、ぜひセミナーに申し込んでみてください。