Simulator」をつくったWebVRやってみたつくったものWebVRでフライトシュミレーター作りました。PCとスマホがあれば遊べます。個人的にスマホブラウザVRに興味があって、表現の幅をずっと模索していたんだけれど、ブラウザの制約×スマホインタフェースの制約の二重苦で、結局「WebVR!!!」と大見栄を切って出しているコンテンツも「これ360空間にプリミティブメッシュ配置しただけじゃないですか?」「画面が近くなっただけじゃないですか?」と言われるとぐぬう...となるだけだったので悔しかった。それを打開する一つのヒントになるかもしれない自分なりのコンテンツを作ってみた。動作環境PCとスマホだけで動作。ハイスペックPCは不要。スマホも現行モデルならだいたい問題なし。WebVRなのでネット環境必須。普及の面を考えると、ハイエンドHMDやハイスペックPCは使いたくなかった。いうか自分持ってないし。インタフェースPCで操作、スマホを簡易HMDにして装着。入力はPCブラウザで扱えるものなら何でも使えるためゲームパッドとかも利用可能。スマホVRにコントローラーを足せるのは大きい。開発フレームワークはいつも通りPlayCanvasを利用。自分はゲーム開発から入ったので、マークアップで3D空間を構築するイメージがどうしてもつかめない。ビジュアルエディタがしっかりあるPlayCanvasはその辺ありがたい。PlayCanvasにはWebVRスターターキットがあるので、VRビューの実装はノンプログラミングでできるので大変便利。他のリアルタイム通信エンジンと比べてJavaScriptSDKがしっかりあるので選択。Cloudを採用PhotonとPlayCanvasのつなぎこみには以前作ったプラグインを利用。仕組みつなぎこみまでの流れはこんな感じ。GGJの時はここまで実装する余裕がなかったので、ゲームプレイヤーもVRビューワーも同roomに詰め込みまくる実装にしていたが、ゲームプレイヤーが複数存在する場合、VRビューワーはすべてのゲームプレイヤーの座標を同期しようとするため、複数プレイヤーが存在する場合VRカメラがパタパタする。その時はVR版ゲームプレイヤーのURLは公開しないという方法でやっていた。今回はルームの接続手順を変更、ゲームプレイヤーは必ず新規ルーム作成、VRビューワーはパラメーターで受け取ったroomのみに入室する流れにした。これでプレイヤー間で競合してしまう問題は解決。QRコードの作成はjQery.qrcode.jsを使用。パラメータからの受取なんかも調べたら簡単に実装できた。F...上昇ある程度速度が出ると上昇しやすくなると思う。空港(?)はマップ内に4箇所あるのでぜひすべてに着陸してみてほしい。このQRをスマホで読み込むことでスマホがHMDに早変わりする。大画面でゲームをプレイしたい方はこちらプロジェクトPlayCanvasでpublicプロジェクトなのでシーン,ソースコード,アセット等はすべて見ることができるのでぜひ見ていただきたい。接続方法がネットなので遅延は怖い。環境によっては同期が遅くなって酔う。Chromeの調子がいい感じ。スマホブラウザVRにインタフェースを拡張する意味では結構アリ。PlayCanvasの描画性能すごい、これシーン全体で74万ポリ。水面シェーダーはサンプル使いまわしだけどUVスクロールで結構きれい。WebVRとしては、今までにないコンテンツができた気がするので満足。QRコードを複数台のスマホで読み取ればVR体験のシェアなんかもできてしまうし、この手法はいろんな方向に拡張できるのかも。いうことでWebVRアプリを作ってみた。コメントをキャンセルメールアドレスが公開されることはありません。*ウェブサイト上に表示された文字を入力してください。WordPress.com.。