A-Frameをさわり始めました。

この1年くらいのマイブームなのか、急に触れる機会が増えたことにVirtual Realityがあります。ことの発端は、ドワンゴの方から文理学部のVRオープンキャンパスを作りませんかと誘われたことと、学内の英語教育のグループでImmerseアプリを使ったrole play英語学習を試み始めたことがきっかけです。

Oculus Quest 2

(株)ドワンゴは、通信制の高校であるN高とS高の運営をしており、N高生やS高生が自宅からOculus Quest 2 で大学のキャンパスを疑似体験するために様々な大学のVRオープンキャンパスの作成を行っています。文理学部を受験するN高生の数も比較的多く、日本大学として生物資源科学部と文理学部のコンテンツを作ることになったのです。コンテンツ作成に文理学部の担当者の一人としてドワンゴのスタッフと携わったのでした。Oculus Quest 2を通したVRの世界は、Virtual Realityそのもので、あたかも文理学部のキャンパスに居るような没入感を味わうことができます。日本大学には、北海道から九州まで日本各地に付属校が点在し、文理のキャンパスを実際に訪問するのが良いのだけど、VRで体験できるだけでも、キャンパスの雰囲気をかなり感じ取ることができると思います。
N高とS高用に作成したVRオープンキャンパスですが、N予備校のアカウントでも閲覧することができ、キャンパスをVRで体験することができます。作成を行った特典としてN予備校のアカウントをお借りしており、そのアカウントで日本大学の進学説明会などで高校生に体験して貰いました。今後、全国各地の付属校を訪問して、文理学部の良さをVRで体験して貰いたいのですが、その際にN予備校のアカウントを紐づけたOculus Quest 2を持参する必要があります。円安の影響で値上げされたOculus Quest 2ですが、それでも6万円弱とVRを試すにはお手頃な価格設定です。Oculusを持っている人なら誰でも簡単に文理学部を体験してもらう方法はないかなぁ~と思うようになってきました。

そんな思いからVRの技術情報を検索していたところA-FrameというWebフレームワークにたどり着きました。これを使えば無料で簡単にVRを作成し、Webベースなので多くの実行環境で試すことができそうです。360度写真をINSTA 360RICOH THETAなどで撮影すれば、次のようなコードで簡単にVRが完成します。

<html>
  <head>
    <script src="https://aframe.io/releases/1.4.0/aframe.min.js"></script>
  </head>
  <body>
    <a-scene>
        <a-sky src="./assets/IMG_Lab001.jpg"></a-sky>
    </a-scene>
  </body>
</html>

A-Frameを読み込めば、これだけのコードで実験室を体験するページができてしまいました。
試しに作ったVRページへのリンクはここ
VRオープンキャンパスに似たようなコンテンツをA-Frameを利用して作成している例も見つけたので、それを目指して使い方を目下勉強しています。Oculus Quest 2での動作には、こちらのページが参考になるかなぁとかイロイロとブラウズしています。