- 更新日: 2017年04月27日
- 公開日: 2017年04月19日
Web上で軽快に動作するオープンソースのARツール「AR.js」とは何か?
#TBT to publishing our post for @UploadVR AR.js: Efficient #AugmentedReality for the web https://t.co/nrapSptb2Y Cheers! @jerome_etienne #AR pic.twitter.com/uAEzaOR9CQ
— Alexandra Etienne (@AndraConnect) 2017年3月16日
Learning Three.jsの創業者である@AndraConnect(アレクサンドラ氏)とJavascript開発者の@jerome_etienne(ジェローム・エティエンヌ氏)は2017年3月に、米国VRメディアのUPLoadVRにて、ARツール「AR.js」を開発したと公表しました。
オープンソースである「AR.js」はWeb上で拡張現実(AR)ツールを利用でき、かつ軽量・高速で動作するJavascript。GitHubで入手することができます。
ARツール、「AR.js」とは?
「AR.js」の特徴は、4つあります。
AR.js 1.0 is ready! Efficient #AR for the web - 60fps on 2y old phones - Full #opensource https://t.co/eRU3rmG7rX So proud the baby is out 😉 pic.twitter.com/iaKss8CJRk
— Jerome Etienne (@jerome_etienne) 2017年2月21日
- 2年落ちのスマホ(Xperia Z2やNexus 5)は60fps(1秒間の動画に60枚の静止画が使われているという意味)で動作
- Three.js + jsartoolkit5に基づいているため、インストールは不要
- 無料(オープンソース)
- iOSデバイス以外のスマホで、WebGLとWebRTCで動作可能
「万人にとってARの使用を簡単なものにすることが最終目標です。ARをスマホで容易に体験することができ、Web上の技術を使って簡単に設計できるようにすることが私たちのゴールです。ARツールの『AR.js』プロジェクトはARを簡単に経験してもらう人々のためにこそあるべきものです」と、アレクサンドラ氏はコメントしています。
型落ちしているスマホでもオープンソースのARツール、「AR.js」で様々なプラットフォーム上でインストールすることなく、楽しむことができるそうです。
「AR.js」は軽量で高速
スマホ上で60fpsの速さで作動する、オープンソースのARツールは『AR.js』が初めてです」と、アレクサンドラ氏はコメント。「AR.js」は軽量で高速です。
「AR.js」はパソコンにインストールをする必要はなく、スマホの画面上でARを使用することができるようになります。「AR.js」を使用することで、中古スマホでも動作できるようになりました。
Three.jsやARToolKitなどを使用
ARツールである「AR.js」は、1秒間に60フレームという速さのARを実現しました。
- Three.js:Web上で3Dグラフィックを作成するためのライブラリ
- ARToolKit:ARのために数年間にわたり開発したライブラリ
- emscripte、asm.js:ARToolkitをJavaScriptにコンパイルすることが可能
- Chromium:高速化を促進
Three.jsやARToolKit、emscripteとasm.js、Chromiumの4つの技術が合わさり、高性能スマホではわずか5fpsだったものを、2年落ちのスマホで60fpsを実現しました。
「AR.js」の使い方
「AR.js」は、WebGLやWebRTCをブラウザに搭載したスマホで動作します。アンドロイドとウィンドウズスマホでの使用が可能です。
2017年3月現在では、iOSデバイス上で使用することができません。iOSがWebRTCに対応していませんが、アップルは対応中とのことです。
Invisibility Cloak for #ar markers! Harry potter magic with ar.js 🕵️ pic.twitter.com/s61sz4OJ58
— Jerome Etienne (@jerome_etienne) 2017年3月20日
以下2つのステップはARツール、「AR.js」の使い方です。試してみましょう!
AR.js: Efficient augmented reality for the web. via @AndraConnect @jerome_etienne #AR #WebAR https://t.co/Wi1fgmklp8 pic.twitter.com/vjF6Inx7Yp
— Upload (@UploadVR) 2017年3月13日
これで実装完了です。スマホのカメラにアクセスしたページが開き、マーカー画像をローカライズし、3D画像が画面上に表示されます。
型落ち・中古スマホでも動作可能
ARツール「AR.js」において、以下の5つのことが確認されています。
- Nexus 6上で安定して60fpsの動作が可能
- 2年半の型落ちスマホ、ソニーのXperia Z2上では50fpsで動作
- Nexus 5で50fps、Nexus9で60fpsで動くというレポートもあります。Nexus 5は2013年11月に発売のスマホ
- マイクロソフトが提供しているブラウザ、Edgeでも動作が確認済み
- Windows 10 Mobileを搭載するスマホ「Lumia 950」では13fpsという報告もあり、Lumia 930では40fpsから45fpsで動作
ARツールにおける「AR.js」は、ウィンドウズモバイル上で動作することに驚きです。新しいスマホを買わずに、安価の中古スマホを購入してアプリやコンテンツ開発専用にできますね。
「AR.js」の次の目標
アレクサンドラ氏は、「私たちは素晴らしい実績を残しました。しかしまだまだ向上の余地があります。ARツールの『AR.js』はWebworkersを使用することでCPUの使用量がアップ。asm.jsの代わりにWebAssembleにコンパイルすることで、読み込み時間が短くなりCPUパフォーマンスの向上も期待できます。色々なパラメーターにも調整の余地があることは明らかです」と、コメント。
i think WebAR landed. I got a sustainable 60fps using artoolkit+three.js. All in javascript. on a 2years old phone :) pic.twitter.com/xXVrvmUM3Z
— Jerome Etienne (@jerome_etienne) 2017年2月14日
PS Vitaのパズルゲーム「pulzAR」や、ARデモの「AR Gameplay footage」は、PS Vitaを購入せずとも自分が所持しているスマホで「AR.js」を用いてゲームをプレイできるかもしれません。新たにハイスペックなデバイスを購入することもなく、ゲームができます。
他にARツールである「AR.js」を活用してできることといえば、「Solar System」の宇宙を題材としたアプリや、スマートグラスのEPSON MOVERIO「BT-200」と組み合わせた教育科学アプリ、「chemistry app」が挙げられます。
まとめ
従来はARアプリやゲームを開発するにあたって、ライブラリやツールのインストールから環境構築を設定するまでに時間がかかりました。さぁ、プログラミングを始めよう!と思って、プログラミング初級者が最初につまづくとすれば開発環境の構築でしょう。その環境設定をせずに、実装できるのがARツール「AR.js」の特徴でもあります。
オープンソースで企業や個人開発者問わず、無料で手軽に利用できて容易に開発ができる「AR.js」。今後どのような展開をするのか楽しみです。
記事寄稿:GETAR
- この記事を書いた人
- GET AR