VR 点 検 シュミレーションをA-Frameで作った話川尻 貴之
View Slide
©Project PLATEAU / MLIT Japan川尻 貴之自己紹介Kawajiri Takayuki・MIERUNE入って1年ちょっと・前職は、JR北海道のグループ会社・趣味は、車でドリフト。去年からオフロードバイクにもハマってます。GISエンジニア
©OpenStreetMap contributors01 WebVR(A-Frame)の紹介02 作ったシステムの紹介03 終わりに目次
©OpenStreetMap contributors01WebVR(A-Frame)の紹介
©Project PLATEAU / MLIT Japan01 WebVR(A-Frame)の紹介● WebVR(Web Virtual Reality)は、ウェブブラウザで仮想現実(VR)体験を可能にするためのJavaScript APIです。● 主流のウェブブラウザと多くのVRヘッドセット、Oculus Rift、HTC Vive、Windows Mixed Realityヘッドセットなどと互換性● HTML、CSS、JavaScriptといったウェブ標準のテクノロジーを使用してVR体験を作成できるWeb-VRとは
©Project PLATEAU / MLIT Japan01 WebVR(A-Frame)の紹介●A-Frame(HTMLライクな記述で作成)●Babylon.js(TypeScriptで書かれた高機能な3Dエンジン)●React 360(Facebookが開発、Reactベース)等々色々あります。(ほとんどがThree.jsがベースになってます。)主なフレームワークとしては
©Project PLATEAU / MLIT Japan01 WebVR(A-Frame)の紹介● HTMLのようなシンプルなマークアップを使用して、3Dのバーチャルリアルティ (VR) シーンを簡単に作成・表示することができます。● 1ソースで、ブラウザ、スマホ、VRゴーグル等に対応できるのが特徴です。A-Frameの説明https://aframe.io/
©Project PLATEAU / MLIT Japan02 作ったシステムの紹介●多くが2眼カメラ(表裏に魚眼レンズ)●ワンシャッターで360度撮影できる。●死角が無いので、一脚等で撮影。●入門機だと5万円以下で購入可360度写真の説明
©Project PLATEAU / MLIT Japan02 作ったシステムの紹介360度写真の説明https://jp.cyberlink.com/learning/powerdirector-video-editing-software/694/360°動画を編集するには(撮影から編集の準備までの流れ)
©Project PLATEAU / MLIT Japan01 WebVR(A-Frame)の紹介360度写真を表示する場合のソース360° Imagewidth="6" position="-2.5 0.25 -1.5"rotation="0 15 0">簡単に書けます。
©OpenStreetMap contributors02作ったシステムの紹介
©Project PLATEAU / MLIT Japan02 作ったシステムの紹介●行ったことがない所を説明するための教材●点検等、定形作業の反復練習●実物が近くにない、入出制限等で行けない場所の把握目的・用途
©Project PLATEAU / MLIT Japan02 作ったシステムの紹介●完全3D空間をVRで再現したものではない。(モデリングコストを考慮)●360度写真の点間移動(GoogleStreetViewをイメージ)○ 自由に移動できるVRではない。●一部文字等は、3D空間でモデリング●ユーザーがコンテンツの作成ができる様にするシステムのコンセプト
©Project PLATEAU / MLIT Japan02 作ったシステムの紹介シーン(地点)<ターゲット(点検項目)移動経路は、点検と単純性を考慮して一筆書き経路のみとしているシステムのコンセプト
©Project PLATEAU / MLIT Japan02 作ったシステムの紹介システムの構成
©Project PLATEAU / MLIT Japan02 作ったシステムの紹介デモ
©Project PLATEAU / MLIT Japan03 副産物、発展形青い足跡:次のシーンへ緑の足跡:前のシーンへシーン間移動
©Project PLATEAU / MLIT Japan03 副産物、発展形文字、画像を配置可能ターゲットマークが点検箇所チェックすると次のターゲットへ(これを繰り返していく)ターゲット選択
©Project PLATEAU / MLIT Japan03 副産物、発展形VRコンテンツ登録画面複数のシーンを設定シーンの中に複数ターゲットを設定ターゲットには、音、文字等のアクションを設定
©Project PLATEAU / MLIT Japan03 副産物、発展形シーン内で、点検するポイントを表示して、クリックすると音がなったりして、事前練習できる。VRゴーグルでやると非常にリアル。ターゲットの登録画面
©OpenStreetMap contributors03副産物、発展形
©Project PLATEAU / MLIT Japan04 まとめ● 普段行けない所を、行ったことがない人に説明するには十分。● VRゴーグルで見ると非常にリアル● 点検訓練よりゲーム感覚になってしまう。● 完全オフラインを目指したが、○ VRゴーグルが定期的にネット接続が必要○ VRゴーグルのスクリーンミラーリングにネット接続が必要使って見た結果
©Project PLATEAU / MLIT Japan04 まとめこの後、VRゴーグルで体験できる環境用意しますので気軽にどうぞ