MC Open Lab. #1 社内の勉強会が楽しすぎてオープン化しちゃいました！ Web上で軽快に動作するオープンソースのARツール「AR.js」で遊んでみた！

1. 1
MC Open Lab. #1
2018 年 06 月 27 日（水）
Memberscareer t-kurita

2. 2
Web上で軽快に動作する
オープンソースARツール
「AR.js」で遊んでみた！

3. 3
AR

4. 4
VR AR MR ？

5. 5
VR と AR の違い
Virtual Reality
仮想 現実
Augmented Reality
拡張 現実
Mixed Reality
複合現実

6. 6
2017年 8月29日 GoogleがAndroid向けの
ARフレームワーク「ARCore」を発表

7. 7
2018年 6月5日 Apple、ARアプリをさらに
ダイナミックにプラットフォーム、「ARKit 2」を発表

8. 8Introducing ARCore
https://youtu.be/ttdPqly4OF8

9. 9ARCore: Augmented Images
https://youtu.be/uDs9rd7yD0I

10. 10
どころじゃない！

11. 11
AR の 戦い
2017年8月29日
ARフレームワーク「ARCore」発表
Pixel、Android OS 7.0以降 Galaxy S8
2014年 Tango 発表（2018年 終了）
2017年9月20日
iOS11標準搭載のAR機能「ARKit」発表
2017年12月20日
ポケモンGO「AR+」機能ついに「ARKit」対応
HoloLens
2015.01
2018年 Tango サポート終了 2018年6月5日
さらにダイナミックなiOS12対応「ARKit2」発表

12. 12
Apps だけじゃない
Javascript でも出来る！？

13. 13
「AR.js」で遊んでみた！

14. 14
AR.js って何？

15. 15
「AR.js」って何？
Learning Three.js の創業者であるアレクサ
ンドラが、2017年3月に、米国VRメディアの
「UPLoadVR」にて、「AR.js」の詳細を公表
「AR.js」 とは、ARアプリケーションを容易に製作するための
ARライブラリ（フレームワーク）です！

16. 16
「AR.js」の特徴
「AR.js」はGitHub（ギット・ハブ）上に公開されており、
オープンソースでインストール不要、軽量かつ高速に動作して面
倒な環境構築の手間が省けられることが特徴。
誰でも気軽にAR体験ができたり、
javascript の基礎や応用を知ってい
る人は、オリジナルアプリを開発する
ことができます。

17. 17
デモ

18. 18
レシピ
AR.js（Web上で軽量・高速に動作するARツール）
Three.js （WebGLの高度な技術を使えるライブラリ）
ARToolKit （ARアプリを実現するC言語ライブラリ）

19. 19
JSが映像を解析する
解析（デバッグ表示）動画・カメラ映像を解析

20. 20
barcode をリアルタイムに Tracking
いくつあっても、斜めでも解析できる

21. 21
カメラに写った barcode に AR

22. 22
複数の 3Dモデル を barcode に

23. 23
複数の 3Dモデル を barcode に
複雑な3Dモデルでも！

24. 24
人の顔 も JS で Tracking できる
Debug画面

25. 25
つまり「Face ID」「アニメ文字」的なことが

26. 26
カメラアプリで面白いもの作れそう！

27. 27
ご静聴ありがとうございました