ブラキオカップ

VRタワーディフェンスゲーム

Unity

JavaScript

EC2

Flutter

Dart

VRの勇者がスマホの魔王から白を守る!

Keiichiro

なっちゃん

推しアイデア

VRという閉鎖的な空間となり、そこだけで完結してしまうところを、VRが勇者でスマホを魔王にすることによって、複数人で干渉可能なプロダクトにした。

作った背景

チームメンバーの一人がMeta Quest3を買って後悔していたので、成仏させたかったから。

推し技術

VR Websocket EC2

プロジェクト詳細

チーム 妥協の連続

概要: VRが勇者でスマホが魔王のタワーディフェンスゲーム

技術の無駄遣い

コマンド入力は男のロマン!!!!ということで、pythonのmediapipeを用いて、手の画像認識を行っています。Open, Close, Pointerの3種類があり、それによって武器が変わるようにしています。 image

Front 1 VR

  • デバイス:Meta Quest 3 (Oculus)
  • 技術:unity

大変だったところ

  • VRの開発経験が少なく、記事も多くないので接続に戸惑った
  • デフォルトがlay interactor でものを掴むことができなかったので、direct interactorに変更して、調整してものをつかめるようにした
  • タワーディフェンスゲームなので敵が城に向かうように調整するのが難しかった

Flont 2 スマホアプリ

  • デバイス:スマートフォン
  • 技術:Flutter

大変だったところ

  • 一般的なデータベースのデータ管理ではなく、WebSocketによるデータ管理であったため、状態管理ツールであるRiverpodの構成を工夫した

BackEnd WebSocket

工夫したところ

ローカル環境で実行する場合、接続しているWI-FiにIPアドレスが依存したり、Androidの参照IPアドレスが変更されたりなど不便なことが多かった。 そこで、デプロイを行った。 普段はhttpリクエストしか扱ったことがないため、Firebase Functionsなどしか使ったことがなかったが、今回はWebSocketであり常時接続する必要が生まれたので、VMを用いた。

全体的に詰まったところ

  • WebSocketの実装 今回はunityとflutterの連携というあまり行われない試みを行った。この連携ができない限りこのプロダクトは成り立たないので、前泊期間にWebSocketを見つけ気合で実装した。
  • unityのgit管理 unityにはメタデータが存在し、人間が直接的に読むことができないのでコンフリクトを解消するのが難しかった。コミュニケーションを増やすというゴリ押しで乗り切った。
  • VRの実行 VRの開発経験が少なくはじめの方は実行環境が不安定であった。特に途中で開発アプリが起動しなくなったのが致命的であった。Flutterの開発経験を活かして、bundleIdを変更すれば良いことに気づいてビルド時間の短縮にもつながった。
  • 非同期処理によるラグ WebSocketは常時処理をしているため、VRの方で1秒でも非同期処理が混ざるとラグになってカクカク動いてしまう。このラグが処理負荷によるものではなく、非同期処理によるものであると気づくのに時間がかかった。

Keiichiro

@45rzhnzvrxnw3dz