Grimoire.js is friendly for holoLens

1. HoloLensでも使える
Grimoire.js
Grimoire.js勉強会 #1 2017/06/11
えむにわ @m2wasabi

2. 自己紹介
• 山本 允葵
(Masaki Yamamoto)
えむにわ
@m2wasabi新しいものに何でも食いつく
雑食系野良エンジニア
Milkcocoa WebGL(jThree) KinectV2で
本を書いたこともある(共著)
時が経つのは早いものでもはや黒歴史です

3. 自己紹介
http://qiita.com/m2wasabi/items/bc18a7d0710ea31d43d5
VisualStudioCode用のGrimoire.jsプラグイン作りました
⇒VSCodeのプラグインから 「Grimoire」 で検索
主な機能：GOML , Sort ファイルのシンタックスハイライト
ずぼらが捗るGOMLスニペット

4. アジェンダ
今回はGrimoire.jsをHoloLensで
使ってみた世界を
ちょっとだけご紹介します。

5. 目次
• Chapter0 HoloLensとは
• Chapter1 HoloLensのアプリケーション
• Chapter2 WebGLとHoloLens
• Chapter3 Demo

6. HoloLensとは何か
• Thing
 半透過ディスプレイを持つ
ヘッドマウント型ARデバイス
 CPUを持ち独立で稼働可能な
小型コンピューター
• Activity
 現実と重ねて映像を映し出すことが出来る
 視覚情報を拡張できるデバイス
https://docs.com/mstechsummit16/9434/spl006-mixed-reality-microsoft-hololens
詳しくはMSの人の資料見てください

7. Chapter1
HoloLensのアプリケーション

8. HoloLensのアプリケーション
• Unity
 フルスクリーンのアプリのみ作成可能
 他のアプリとの併用ができない
 現状一番事例が多い
 Windowsストアアプリとして提供
• UWP
 ウィンドウアプリのみ作成可能
 Windows10アプリと同じ開発手法
 Windowsストアアプリとして提供

9. アプリって
• インストールする必要がある。
• 特定の状況に紐づいたちょっとした情報
を取得するのに不便
→手軽にHoloLensの世界観にマッチした
アプリケーションを提供したい
Webで作ってみたらどうでしょう？

10. Chapter2
WebGLとHoloLens

11. WebGLとHoloLens
• 従来のWebサイトのままだと、HoloLensからは使いづらい
 文字を凝視しなければいけない
 平面前提のインタラクション
 上からFの字に視ることを前提としたデザイン
• Webページはサッと読み込んでポイっと捨てれる。
• WebGLとHoloLensは相性はいい
• そうだWebGLを使おう！
• Grimoire.jsはEdgeで動くので、HoloLensでも動くはず
 ※Three.jsとか他のライブラリも動きます

12. Grimoire.jsは成長中
• Grimoire.jsは日々成長しています。
• もしかしたら不具合なのか、自分の知らない機能があるの
か分からないこともあるでしょう
• そんな時はコミュニティに参加してみよう！
 バグ修正のフットワークが軽い
 OSSだけど日本語で質問して大丈夫
https://grimoire-slackin.herokuapp.com/
Slackあります

13. Chapter3
Demo