Google CardbordとLeapMotion

〜お手軽VR〜

2015 MVP Community Camp～福岡編～

2015/01/31＠麻生情報ビジネス専門学校

JAWS-UG北九州代表 藤崎 優

自己紹介

藤崎 優@youukkari・AWS 認定ソリューションアーキテクト –アソシエイト・JAWS−UG北九州支部長・AWSにこだわらず北九州で勉強会開催（ARとか）・いろいろやってますインフラ構築(DR構築とかクラウドとか）訪問介護事業者向けサービス開発(JAVA)

小規模Webサービス開発(おもにCakePHP)

小倉・秘密基地：親善大使

北九州でのコミュニティ活動でASCIIに掲載されました！！！

本日の内容

・VRについて・CardBordについて・CardBordでみるコンテンツについて・CardBordのコンテンツの作り方について・LeapMotionについて

【最初に】

体感しないとわからない話が続くので、終わったあとにぜひ声をかけてください。

お見せします！！

VRってなんだろう？

バーチャルリアリティ(英: Virtual Reality, 英語発音:

[ˈvəːrʧuəl riˈæləti] ヴァーチュァル・リアラティ)とは、実際の形はしていないか、形は異なるかも知れないが、機能としての本質は同じであるような環境を、ユーザの感覚を刺激することにより理工学的に作り出す技術およびその体系。略語としてVRとも。仮想現実。

「バーチャルリアリティ」『フリー百科事典ウィキペディア日本語版』より。最終更新 2015年1月17日 (土) 23:44 UTC

URL: http://ja.wikipedia.org/wiki/%E3%83%90%E3%83%BC%E3%83%81%E3%83%A

3%E3%83%AB%E3%83%AA%E3%82%A2%E3%83%AA%E3%83%86%E3%82%A3

VRって何に使わてるんだろう？

航空機のシミュレーション訓練用

「フライトシミュレーション市場リポート、販売開始 英調査会社」『AviationWire』より。最終更新 2015年1月9日 08:30 JST

URL:http://www.aviationwire.jp/archives/53142

手術のシミュレーション訓練

「ムーグが開発する最先端バーチャルリアリティ眼科手術シミュレータで、慈善団体「ヘルプ・ミー・シー」が世界中の白内障による失明の根絶を目指す」『日本ムーグ』より。最終更新 2013年7月10日URL:http://info.moog.com/press_release/2013710--117YM-2414ID.html

高くて一般人には遠い存在だった・・・

うん千万・・・

そこにOculus登場

Oculus VR

・米Oculus VR社が開発したバーチャルリアリティ用ヘッドマウントディスプレイ（HMD、頭部搭載型ディスプレイ）

・バーチャルリアリティに使用するのを第一目的として開発されている

・頭の動きに高速で追随するセンサーを内蔵している

・３５０ドルで買える

Oculus VRでなにが変わった？

VRの技術を個人が実際に触ってみることできるようになった！

その結果・・・日本では

初音ミクと

握手してみたり添い寝してみたりキスしてみたり・・・・

DMM.co.jp

が、エロいかんじのものがはじめたり・・・

楽しそうでしょう？！

でも、また開発者用で手に入りづらい。

でも・・・

使えるかわからないものに約４万円は高い・・・

かな？

そんなあなたにGoogle CardBord

・2014年のGoogle I/O開幕キーノートの最後で突然配布された、Androidスマートフォンを挿入して使う即席バーチャルリアリティ・ヘッドセット

・『Cardboard』の製作に必要な素材リストや型紙ファイル、アプリなどを無償で公開https://www.google.com/get/cardboard/manufacturers.html

・カメラ機能、センサー機能をスマホでやることで、段ボールでヘッドマウントのVR体験を実現した！

・初代Oculusくらいの性能あるっぽい（スマホのスペックによります）

・ケーブルレスなので、Oculusと違って歩きながら使えるなど行動の自由度が高い→鑑賞以外の使い方もできそう

CardBordとは？

①段ボール（Amazonからいっぱい届くアレ）

CardBordの素材

CardBordの素材②レンズ（100円ショップのルーペ））

CardBordの素材③磁石（１００円ショップの20個入り)

CardBordの素材

総額２１６円

これでOculusで見たかったあれこれを見ることができる！！

見たい人！！！

作り方・根性でカッターで切る（８時間位かかった）

作り方・レーザーカッターで切る（博多図工室とかヨカラボ）

作らずに買う・お金で解決（Amazonで売ってる）

iPhoneでも見れます

CardBordが用意できたら体感してみましょう！！

GoogleCardBord対応アプリ (Android)

GoogleCardBord対応アプリ (iOS)

※Durovis Dive対応アプリ

Youtube・ニコニコ動画(3D

サイドバイサイド動画)

https://www.youtube.com/watch?v=Ya5eQ_QfAog

【攻殻機動隊の公式3D動画】

見るものがなくなってきたらコンテンツを作ってみよう！！

Google CardBord

コンテンツの作り方(コードをあまりかかずに）

RICOH THETA

・１回のシャッターで360°の写真が撮れる・最大3分間の360°の動画撮影（音声付）・youtubeなどにアップできる・￥34,700くらい

タオ360でTHETAで撮ったコンテンツをCardBordでみることができます

http://taovisor.com/tao360/

もうちょっと凝ったことをしてみたい人にはMetaio CreatorでAR!

ARとは？

拡張現実（かくちょうげんじつ、英: Augmented

Reality、AR）とは、人が知覚する現実環境をコンピュータにより拡張する技術、およびコンピュータにより拡張された現実環境そのものを指す言葉

ARとはこんなもの

【使い方】Scanしたモノの上にARコンテンツを表示する

０）JunaioブラウザをDLする１）JunaioブラウザでQRコード読み込み２）ARコンテンツを表示させたいものをスキャン

metaio Creatorでできること

・プログラミング不要でCG・映像をAR技術で配信することができる

・マーカーにARブラウザをかざすことで画像認識を行い、３DのCGや動画を表示することができる

・Junaio（ARブラウザでみる）またはAndroid．iPhoneアプリに書き出すことができる※最近ARアプリ多すぎてAppStoreの審査は通らない！

・無料だとマーカー、モデルに制限あり

・無料だとアプリにロゴが必ずはいる

・配信サーバを100Mまでは無料で使える

metaio Creator＋CardBordでできること

・Oculusだと別途カメラをつけないといけないが、スマホのカメラが使えるのでCardBord単体でARが実現できる

・VR＋ARでMR=Mixed Reality=複合現実を作ることができる

・MRとは？CGなどで作った仮想現実を現実世界に反映(拡張)し、それを体験する

・Websocketでつながり、javascriptで使えるハードならVR・ARコンテンツと繋げられる

metaio creatorでのARの作り方は

吉永さん(九州先端科学技術研究所)

のブログへ！！

http://vizyoshinaga.sblo.jp/article/67725578.html

metaio CreatorをCardBord対応するには？

・AREL Sript-Global scriptに下記一行追加するだけ

arel.Scene.setStereoRendering(true);

metaio(AR)はHTML5Javascriptで作ったアプリ・サイトを表示できる

今までのWeb技術でのコンテンツを作成できる！

VR、ARという仮想現実の没入感を更に高めたい

そんなときはLeapMotion!!

LeapMotionとは？

・手のジェスチャーでパソコンを操作できるデバイス

・本体をPCかMacにUSB接続することで動作する。

・９８００円くらい

・各言語のSDKが用意おり、Javascriptを利用してブラウザで利用することも可能

https://developer.leapmotion.com/gallery/chrome-draw

CardBordでARの仮想現実世界をのぞき、その中のコンテンツをLeapMotionで操作することができる

複合現実のなかのものに触ることができる

CardBord+LeapMotion+metaio(AR)

自分で3Dモデルを動かしてみたい！！

そんなときはUnity

Unityとは？・Windows、MacOSXで利用できるゲーム開発環境

・Win、OSX、Linux、iOS、Androidへのアプリの出力が無料で行える

・３Dだけでなく２Dも強化されてきている

・Asset Storeで自分がつくれないものは買って追加（プログラム、３Dモデル、BGM、サウンド）自分のできるものだけやり、他はAssetを組み合わせて一つのアプリを作成

Unityとは？

自分のできるものだけやり、他はAssetを組み合わせて一つのアプリを作成！！

Unityで無料で３Dモデル配布してます

UnityちゃんコンテンツをGoogleCardBorｄで動かそう

準備するところまでは下記に藤崎がまとめてます！

http://qiita.com/youukkari/items/c12a34cb7238de813080

http://qiita.com/youukkari/items/bd348b939d33f2260300

MMDも使えます(MikuMikuDance)

GoogleCardBord対応はカメラを追加するのみ

サンプルを改造しながらいろいろ弄ってみよう！

本日の振り返り

・CardBord楽しもう・CardBordでコンテンツ作る方法について

RICOH THETA

metaio creator

Unity

・LeapMotionについて

好きなモノを動かしてみると、楽しみながら色々覚えられるよ！！

触ってみよう！