AIツールを使ってどこまでWebアプリの開発ができるのか?
そんな疑問から、今回はGemini Canvasを使ってWebアプリゲームを作ってみました。

オセロ

img_othello.png

AIと対戦できるオセロゲームを作成しました。
オセロを置いたときのアニメーションもスムーズで、デザイン性の高いものができました。

ぜひ実際にAIと対戦してみてください。

オセロゲームはこちら

チャリ走

img_cycling.png

次に、ちょっと懐かしいチャリ走ゲームを作成しました。

具体的には以下の指示を順番に入力していき、ゲームをカスタマイズしていきました。

  • チャリ走のアプリをつくって
  • 2段階ジャンプができるように設定して
  • 障害物を設置して
  • 徐々に難易度を上げて(障害物を増やす、スピードを上げる)
  • 移動する敵を設置して
  • 地面の高さに変化をつけて
  • 空中にも障害物を設置して
  • 空中の障害物はギザギザの形にして
  • 空中の障害物は星形ではなく、10個以上頂点があるギザギザの形にして
  • 全体的に障害物の数を増やして
  • 最初の地面の横幅を長くして(スタートした後すぐ落下してしまうのを防ぐため)

チャリ走ゲームはこちら

シンプルですが案外難しく、私の最高スコアは3200程度でした。

歴史クイズ

img_history-quiz.png

最後に、最近私が受験以来勉強している歴史のクイズアプリを作成しました。
条件は以下です。

  • ジャンルは日本史、世界史
  • 選択肢は4つ
  • 毎回選択肢の順番を入れ替える。
  • 計10問
  • 問題の表示順をランダムにする。
  • 前後の問題に移動するボタンがある。
  • 最後の問題を解き終え、結果を見るボタンを押すと、10問中何問正解したか表示される。
  • 7問以上正解で合格、6問以下は不合格
  • 最後に、間違えた問題と自分の答え、正答が表示される。

ぜひトライしてみてください。

歴史クイズはこちら

ちなみに私は全問正解だったので、最後に合格と表示されました。

img_history-quiz02.png

まとめ

今回、Gemini Canvasを使って3つのWebアプリゲームを作ってみて、AIの力を借りれば自分のアイデアをすぐに表現できることに驚かされました。
ゲーム機能の実装だけでなくデザイン性の高いものを作成してくれるので、非常に作りがいがあります。

今後ゲーム以外の開発も、Gemini Canvasを使って試してみたいと思います。

(tamura)