ゲームをつくりたいけど難しそう
AIでゲームをつくれるらしいが、どうやればいいのかわからない
AI生成をはじめたいけど、どうすればいいのかわからない
と悩んでいませんか？
この記事ではGoogle AI Studioを使って無料でゲームをつくる方法について紹介します
すぐに、できる方法で紹介しているので、ぜひチャレンジしてください
紹介の流れとなる目次です
このブログの内容はYoutubeでさらにくわしく紹介しています
>> イラスト55 @ クリエイティブ情報を紹介
AIゲーム生成でつかうサイトの紹介
Google AI Studio：無料でつかえるGoogleが運営する開発用のAI生成サイト
今回ゲーム生成でつかうサイトです
>> 「Google AI Studio」のサイト
このサイトは開発者向けのAIサイトです
GoogleのGeminiをベースにさらに細かくプログラムや画像、動画をつくることができます
メニューは英語ですが、命令は日本語OKなので、ブラウザの翻訳をつかえば問題なく使うことができます
Google Gemini：無料でつかえる万能AIツール
無料でつかえるGoogle公式のAIツールです
「Gemini」のサイト
Googleトップページからもつかえるので、多くの方がつかっているAIツールです
とても使い方がわかりやすく中央のボックスに命令を入れるだけで、AIが命令を理解して動いてくれます
Google AI Studioの爆速ゲーム制作の方法
Google AI Studioでつくったゲームの紹介
今回つくるシューティングゲームです
プログラムをAIにつくってもらうバイブコーディングという方法でつくります
今回つくるシューティングゲームです
プログラム、イラスト、ゲームにつかう物をすべてAIでつくることができます
もちろんプログラムが未経験の方でもつくることができます
AIでゲームのイメージイラストをつくる
Geminiに生成するイメージを命令する
はじめに、Geminiでゲームのイメージ画像を生成します
次の点を伝えて画像を生成します
・「横スクロールシューティングゲームの画面」、「魔法使いでほうきにのった魔法使い猫が主役」
・「ファンタジーの世界」、「ピクセル画像」
Geminiが生成したイラストをダウンロードする
Geminiがつくったゲームイメージの例です
このイラストをもとにゲームのプログラムを生成します
画像の生成は1～2分でおわります
生成がおわったら、バイブコーディングでつかうためにダウンロードします
AIで横スクロールシューティングのプロトタイプをつくる
「Google AI Studio」のサイトでプログラムをつくります
「Google AI Studio」は本格的にAIのプログラムの生成をおこなうことができます
１．Geminiがつくったイメージから１枚を選び、アップロードします
２．「HTML５でつくること」、「横スクロールシューティング」であることをAIに伝えます
生成したプログラムをダウンロードする
プログラムの生成は１～3分でおわります
・プログラムの生成がおわったら「HTML」ファイルをダウンロードできます
生成したゲームをためしてみよう
キーボードで動く横スクロールシューティングをつくれました
しかし、ゲーム画像がブロックなので次は画像をつくります
まだブロックの絵が動くだけですが、しっかりシューティングゲームとして動くプログラムができました
・「HTML」はダブルクリックで実行できます
・しっかりシューティングゲームが動きます
主役キャラクターの画像をつくる
ゲーム画像がブロックなので、ゲーム画像をつくります
Geminiでキャラクター用の画像を生成します
・もとの画像を「Gemini」にアップロードして、キャラクターを生成します
キャラクター画像を生成できました
しかし、背景が白色で透明ではないようです
・もとの画像から背景が白色になったキャラクターが生成されました
背景切り抜きができる「My Edit」のサイトに移動します
１．背景を切り抜きできるサイトに移動します
２．「背景」ボタンをクリックします
３．キャラクターの白背景がなくなり、透明になります
つづいて、画像の大きさを小さくします
１．「編集」ボタンをクリックします
２．キャラクターの周りをドラッグして画像を小さくできます
３．画像の大きさを決めたら、「ダウンロード」ボタンをクリックします
Geminiで敵キャラクターを生成する
主役キャラにつづいて敵キャラの画像もつくります
・つづいて、「Gemini」で敵キャラを生成します
・「メルヘン」、「ピクセル」、という２つのキーワードを伝えます
少しかわいい敵キャラをつくることができました
つづけて何体か敵キャラをつくります
ちょっとかわいいキャラがあらわれました
つくったキャラの背景を透明にして、画像のムダな部分をカットします
１．「背景」ボタンから背景を透明した後、「編集」ボタンから画像の大きさを調整します
２．「ダウンロード」ボタンをクリックして、画像をダウンロードします
ChatGPTで背景の画像をつくる
背景はくり返しのループ画像がとくいなChatGPTでつくります
１．「ChatGPT」のサイトに移動します
２．「メルヘン」、「魔法」「ピクセル画像」、「風景」、「ループ画像」を伝えて生成します
３．ループ背景が生成できました
つくった全ての画像をゲームに登場させる
はじめに、主役キャラをゲームに登場させます
１．「＋」ボタンをクリック
２．「Upload File」ボタンをクリック、主役の画像ファイルをアップロードします
主役キャラの画像をアップロードできました
この画像をゲームに登場させるようにAIに伝えてプログラム生成します
１．アップロードした画像とプログラムの画像を変えるように伝えます
２．「Run」ボタンをクリックして、プログラムを生成します
主役のキャラ画像が登場しました
次は敵キャラをゲームに登場させます
登場させる敵キャラの画像をアップロードします
命令も組み合わせて、AIでプログラムを生成します
１．敵キャラの画像をアップロードします
２．「敵キャラ」、「編隊を組んで動く」、「やられた時のエフェクトを花火のように」、
「弾をうつこと」をAIに伝えます
３．「Run」をクリックして、プログラムを生成します
生成したプログラムを実行すると敵キャラがあらわれました
次は背景を登場させます
作成した背景をアップロードします
画像、命令と組み合わせてプログラムを生成します
１．「敵キャラを小さくする」ことを伝えます
２．背景画像をアップロードして、「横にくりかえす」ことを伝えます
敵キャラが小さくなり、背景画像がゲームに登場しました
しかし、まだプレイヤーの玉がゲームっぽくありません
プレイヤーの玉、敵キャラの大きさをもっとゲームに合うように変えます
・「敵キャラを小さくすること」、「主役の弾を炎のように」することを伝えます
全体的にメルヘンな感じで、ゲームが完成しました
まとめ & ブログで紹介したゲームの動画
ゲームがうごいている雰囲気、くわしいつくり方は下の動画から確認できます
AIのプログラミング（バイブコーディング）は他のページでも紹介しています
合わせてごらんいただくと、さらに多くのゲーム作成にいかせます
コメント