Unity WebXR Exporterで自前ゲームをWebに乗っけてみた話

Transcript

1. jsが分からないのでUnity WebXR Exporterで 自前ゲームをWebにアップしてみた話 株式会社リクティー 永山大志

2. 自己紹介 永山大志：twitter→@busido90 早稲田大学ラグビー蹴球部→本田技研→ギークス(ゲーム)→心と身体の健康を考える 会社、リクティーCTO→なぜかCEOに Unity歴5年(の割に実力不足）、UE歴皆無 リクティー：https://rikuty.com/ 2018年6月起業。2019年1月Tokyo XR Startup第5期に採択。 腰痛や肩こりの方向けのVRアプリ開発

   あまり売れずにチーム解散←イマココ！！

3. 今日話すこと Unity(フロント側）しか触ったことない人(私)が WebXRよくね？って思って挑戦しようと思ったけど、 JavaScriptできないと無理ゲーじゃね？って気づいて 悩んだ挙句、Asset(Unity WebXR Exporter）で AWS(なにそれおいしいの）にファイルを上げて 苦しみながらも自前プロジェクトを動かせた話。同感してくれたら役に経つかも ※技術力の高い方にはなにを今更、みたいな話になるかもですが、

   暖かく見ていただけると幸いです。技術的間違いの指摘もお願いします。

4. 今作っているもの OnePunch https://sidequestvr.com/app/1081 今回のやつ https://one-punch.s3-ap-northeast-1.amazonaws.com/OnePunch/index.html

5. 参考にしたもの Unity WebXR ExporterでVR刺身タンポポを動かしてみた / Challenge to use Unity WebXR

   Exporter for VR Sashimi Tanpopo できる方はこの資料だけで大丈夫です。これでもわからない、それぞれどんなところに落 とし穴あるのー、っていうのを話していきます。

6. Unity WebXR Exporter WebXRというとA-FrameやらBabylon.jsやらJavaScriptの知識が必要だが、そこに現 れた救世主。

7. Webブラウザで見れるようになるまで ①新規プロジェクトに自前のゲームをインポートする。 ②WebXR Exporterを入れる ③Editor上で動作確認する。 ④ビルドして、ブラウザ(ローカル）で動くか確認する ⑤Web上に上げる(今回はAWS）

8. 詰まったところ① Universal Render Pipeline(URP)で開きましょう Unity2018 のLTSを使ってる自分からすると、URPなにそれ状態でした。 URPのShader以外のほとんどはリンク切れを起こします。（Graphicsに登録すれば大 丈夫？）→今回はURPのShaderにして、Texture貼りなおして対応。 ※ちなみに新規プロジェクトで立ち上げるとなぜか自分はブラウザに両眼が映ってしま い、VRデバイス側に映らず。Gitのサンプルプロジェクトに自分のゲームを入れる方法で

   対処しました。（何か知ってる人いたら教えてください。URPの問題じゃないかも。。。

9. 詰まったところ② Chromeのバージョンに注意が必要です。 私は最新のChrome84だとchrome://flagsで設定しなければいけないWebXRの設定が 出てきませんでした。→ダウンデートしてChrome81にしたら出てきた。 いっこうさんの記事などにお世話になりました。 https://dev.to/ikkou/chrome-79-webxr-device-api-oculus-hmd-8b https://qiita.com/arika_nashika/items/e194ede7ed89a7e591a7

10. 詰まったところ③ Oculusのライブラリはなるべく削除しましょう。 Oculusで開発している勢の人は必ず使っているライブラリですが、スクリプト上で Oculusのライブラリ使ってるとビルドエラーになります。(私は振動に使うOVRHapticsを 使っててエラーになりました。）

11. 詰まったところ④ Microphoneをそのまま使おうとするとエラーになってビルドできません。 今回は結局マイクロフォン使っていなかったのでスクリプトを削除しました。 WebGL用のライブラリアセットがあります(未検証） https://assetstore.unity.com/packages/tools/input-management/microphone-webgl-library-79989?_ga=2.63193255.926528929.159825 9270-523860060.1578279586 https://forum.unity.com/threads/webgl-and-microphone.308197/

12. 詰まったところ⑤ AWSとは仲良くしましょう。 今回はS3に上げるだけだったので初心者の自分でもできました。 下はまだやってません。 https://recipe.kc-cloud.jp/archives/11067 https://recipe.kc-cloud.jp/archives/11489 https://recipe.kc-cloud.jp/archives/11256

13. 細かいTips Unity2018は使わず、2019.4以降を使いましょう →URPが2019から本格導入されているから VRモードでブラウザのページ閉じちゃダメ！ →ブラウザのアプリごと落ちます。（下書きメモが何回も消えた、、、 WebGLTemplateをWebXRにしないとVRモードになりません →Unityroomとかでよく見るやつになります

14. WebXRの使用用途 色々と細かい制約はあるものの、やはりURLで友達にVR体験をしてもらえることは正 義！ WebXRで自分のVRアプリをデモ体験してもらって、 ハマってもらったら、ローカルにアプリを落としてもらってやってもらう。 的な呼び水的な使い方にもってこいだと思います。

15. 参考文献 こりんさんの記事 Unity WebXR ExporterでVR刺身タンポポを動かしてみた / Challenge to use Unity

    WebXR Exporter for VR Sashimi Tanpopo 自分の作業実況 https://note.com/busido90/n/nc8256f775f4d