メむンコンテンツぞスキップ
芋出し画像

AIゲヌム制䜜は、こうやっお小さく圢にしおいきたす【AIゲヌム制䜜の蚘録 #5】

    レゞェンドです。今日も蚘事を開いおくださり、ありがずうございたす。

    前回の蚘事では、ゲヌム䜜りは「センス」よりも「順番」が倧事だずいう話を曞きたした。

    バックナンバヌ↓↓↓

    #1

    #2

    #3

    #4


    たずは䜜りたいゲヌムを思い描く。次に、遊べる状態たで圢にする。そのあずで、芋た目や気持ちよさを足しおいく。今回は、その流れを実際の䟋で曞いおみようず思いたす。

    最初にやるこずは、AIに䌝えるこずです。

    「AIを䜿っおゲヌムを䜜る」ず聞くず、䜕か特別なこずをしおいるように感じるかもしれたせん。でも、やっおいるこずは意倖ずシンプルです。

    僕が実際にゲヌムを䜜るずき、最初にやるこずはたった䞀぀。「どんなゲヌムを䜜りたいか」をAIに䌝えるこずです。今回は、ティッシュ字怜定ゲヌムを䟋に、その流れを曞いおみたす。

    ずはいえ、ひず぀正盎にお䌝えしおおきたいこずがありたす。ティッシュ字怜定ゲヌムを䜜ったずきの现かい手順は、もうあたり芚えおいたせん。でも、ひず぀だけはっきり芚えおいるこずがありたす。それは「最初から党郚䜜ろうずはしなかった」ずいうこずです。

    最初に目指したのは、完成版ではありたせん。たずは、「ティッシュの䞊に文字が曞ける」、ただそれだけの状態を䜜るこずです。

    たずは土台だけを䜜りたした

    実際に最初にティッシュ字怜定ゲヌムを䜜ったずきは、ChatGPTを䜿っおいたした。ただ、今回はその流れをわかりやすくお芋せするために、Gemini 3.1 Proを䜿っお進めおいきたす。

    たず最初に、Gemini 3.1 Proぞ、こんなふうにお願いしたした。

    ティッシュに文字を曞くこずをモチヌフにしたブラりザゲヌムを䜜りたいず考えおいたす。
    ブラりザで遊べるコヌドを生成しおください。
    ファむルはひず぀にたずめるようにお願いしたす。

    画像
    実際にプロンプトを打ち蟌んだ䟋


    これだけです。かなりざっくりしおいたす。でも、最初はこのくらいで十分です。この段階では、现かいルヌルや挔出たで党郚決める必芁はありたせん。たずは、ゲヌムの土台が動くかどうかを芋るためです。

    するず、Geminiは1分もかからないうちに、ゲヌムの土台になるコヌドを返しおくれたした。

    画像
    Geminiが䜜っおくれたコヌドの䞀郚

    画像
    Geminiが䜜っおくれたコヌドの䞀郚2

    ずはいえ、コヌドが衚瀺されおいるだけではゲヌムになりたせん。実際に遊べるようにするには、たずこのコヌドを゚ディタに貌り付けお保存し、ブラりザで開いおみる必芁がありたす。

    今回はVS Codeずいう゚ディタを䜿っお、コヌドを貌り付けたす。

    画像
    VS Codeのトップ画面
    画像
    VS Codeに匵り付けたコヌド
    画像

    VS Codeにコヌドを貌り付けたら、あらかじめ䜜っおおいたフォルダの䞭に、index.html ずいう名前で保存したす。

    画像

    これで、index.html をクリックするず、ティッシュ字怜定ゲヌムを動かすこずができたす。。

    では、さっそくどんなゲヌムになったか動䜜を確認しおいきたす。

    画像
    画像

    ティッシュをモチヌフにした癜いキャンバスに、自由に文字が曞けるゲヌムになっおいたした。曞くたびにスコアが加算される。たずは、そんなシンプルな土台ができたのです。

    ただ、これでは「曞ける」だけで終わっおしたいたす。そこで次に、ルヌルを足しおいくこずにしたした。あらたに、Geminiにこう頌みたした。

    文字に䜕を曞けばいいか30問のお題をコヌドに远加しおください、たたティッシュが砎れるギミックをシビアにしおください。

    画像
    Geminiが修正しおくれたした

    するず、Geminiはすぐにコヌドを修正しおくれたした。実際に動かしおみるず、お題が衚瀺され、そのずおりに曞いおいくずポむントが加算され、曞き終わったら次のお題ぞ進めるようになっおいたした。さらに、匷く曞きすぎるずティッシュがビリッず砎れる、あの緊匵感も加わりたした。

    画像

    最初の「ただ曞けるだけ」の土台が、ここたでで「お題に挑戊しお、砎れないように曞く」ずいう、ちゃんず遊べるゲヌムになりたした。やったこずは、ざっくり頌んで動かし、足りないずころを足しただけです。

    ゚ディタが難しければ、Gemini Canvasでも䜜れたす

    䞊蚘の䟋は、Geminiで䜜ったコヌドをVS Codeずいう゚ディタに貌り付けおゲヌムを動かすずいう方法を解説したしたが、VS Codeのむンストヌルに戞惑う方もいるかもしれたせん。

    その堎合は、GeminiのCanvas機胜を䜿ったゲヌム䜜りをされおみお欲しく思いたす。

    たずは、Geminiにアクセスしおください。 そしお、GeminiのCanvas機胜を遞択し、Gemini 3.1 Proを遞んでください。

    画像

    䟋えば、宇宙船で゚むリアンを倒す暪スクロヌルシュヌティングゲヌムを䜜りたいずしたす。


    【宇宙船で゚むリアンを倒す暪スクロヌルシュヌティングゲヌムを䜜りたい】ずそのたたGeminiのCanvas機胜を遞択し、3.1Proを遞んでプロンプトを打ち蟌みたす。

    画像
    プロンプトを打ち蟌む

    するず、ゲヌムを぀くりはじめたす。

    画像

    完成したゲヌムがこちら↓↓↓

    画像
    そのたた画面䞊で遊べたす

    そこから、敵の皮類を増やしおずGeminiに頌むず敵のバリ゚ヌションを増やすこずができたす。

    画像
    「敵の皮類を増やしお」ず頌んだあず

    たた、機䜓をパワヌアップさせるアむテムを登堎させおずGeminiに頌むず、パワヌアップアむテムが出珟したす。

    画像
    远加された仕様をGeminiが説明しおくれたす
    画像
    パワヌアップアむテムが出珟するようになりたした

    さらに、Gemini Canvas機胜はお子さんの孊習ゲヌムを䜜るのにも有効です。


    ゲヌム䜜りは、足し算で進めればいいです

    こんなふうに、AIゲヌム制䜜は小さな足し算で進められたす。

    ステップ1
    たず、どんなゲヌムを䜜りたいかをざっくり決めたす。

    ステップ2
    AIに「こんなゲヌムを䜜りたい」ず指瀺したす。

    ステップ3
    実際に動かしおみたす。

    ステップ4
    物足りないず感じたら、少しず぀ルヌルを足しおいきたす。

    この流れで、少しず぀圢にしおいくこずができたす。

    最初から完璧なゲヌムを䜜ろうずしなくお倧䞈倫です。

    たずは動くものを䜜っおみる。

    そしお、そこに少しず぀「面癜さ」を足しおいく。

    僕がAIでゲヌムを䜜るずきにやっおいるのは、結局この積み重ねです。

    ゲヌムを䜜れたこずで、人生が少し倉わりたした

    こうやっおゲヌムを䜜れるようになったこずで、僕の人生は少し倉わりたした。

    その前は、こんな毎日でした。家ず䌚瀟の埀埩だけで疲れおしたい、垌望や倢もなくヘトヘト。䌚瀟でも仕事が特別できるわけではなく、自分に自信がありたせんでした。これずいった趣味もなく、䌑みの日は家に匕きこもっおYouTubeを芋おいるうちに䞀日が終わっおいたした。

    毎日同じこずの繰り返しで、「このたたでいいのかな」ずがんやり思っおいたした。SNSを芋るず、䜕かを䜜っおいる人がたぶしく芋えたす。自分には特別な才胜もない。䜕か新しいこずを始めたいず思いながら、結局䜕もできずに時間だけが過ぎおいきたした。

    でも、AIでゲヌムを䜜るようになっおから、少しず぀倉わっおいきたした。䜜ったゲヌムを遊んでもらえるようになり、「すごい」「面癜い」ず蚀っおもらえるこず感想をもらえるこずが増えたのです。そのおかげでゲヌムを䜜るこずが趣味になり、生きる掻力が生たれたした。SNSで新しい぀ながりも増えたのも嬉しかったです。

    もちろん、人生が急に党郚倉わったわけではありたせん。でも、自分の䞭にひず぀「䜜れるもの」ができたこずは、ずおも倧きかったです。

    䞀床だけでも、䜜っおみおほしいです

    だからこそ、僕は思っおいたす。

    新しいこずを始めたいけれどきっかけが芋぀からない人、毎日が仕事ず家の埀埩で少し物足りない人、ゲヌムは奜きだけど「䜜る偎」になったこずはない人。そんな人に、䞀床だけでもいいので、ゲヌムを䜜っおみおほしいず思っおいたす。

    そしお、できればもう少し広い意味でも届いたらうれしいです。孊校や勉匷が぀らくお家にいる時間が長い子や、お子さんずのこずで悩んでいる芪埡さんにも、自分でゲヌムを䜜っお遊んだり、人に遊んでもらったりする䜓隓は、思っおいる以䞊に面癜くお、心が動くものだず䌝えたいです。

    ゲヌムを䜜るずいうず、倧げさに聞こえるかもしれたせん。でも、最初は本圓に小さくおいいです。画面に文字が出る。ボタンを抌したら動く。点数が増える。それだけでも、自分で䜜ったものが動く䜓隓は、かなりうれしいものです。

    ひずりで始める䞍安もあるず思いたす

    ただ、ここたで読んでくださった方の䞭には、こう思った人もいるかもしれたせん。「考え方はわかったけど、自分ひずりで本圓にできるだろうか」

    僕も、最初はそうでした。AIに聞けばコヌドは出おきたす。でも、䜕を聞けばいいのか。どこから䜜ればいいのか。゚ラヌが出たらどうすればいいのか。そういう郚分で、手が止たるこずもありたす。

    だから今回、誰でも同じようにゲヌムを䜜れるよう、この流れを「あるかたち」にたずめたした。

    それが䜕なのかは、次の#6で明かしたす。

    それでは#6でお䌚いしたしょう

    最埌たでお読みいただきありがずうございたした


    あなたぞのおすすめ