Session 2
1
12:30~13:30
FirstVR
SDKのUnityへの導入
技術インターン
細野哲史
0. FirstVR(FVR) SDK
ダウンロード
2
0. 開発をはじめる前に
3
STEP 1. 開発者サイトにアクセスする
https://dev.first-vr.com
こちらをクリック
4
STEP 2. FirstVRのディベロッパー登録をしましょう
フォーム入力だけで完了
0. 開発をはじめる前に
5
STEP 3. FirstVRのディベロッパー登録をしましょう
“Downloads”タブをクリック
“Downloads”ボタンをクリック
0. 開発をはじめる前に
6
STEP 4. ダウンロードしたSDKが,
Unityのプロジェクトファイル形式
“fvrSDK”であることを確認
0. 開発をはじめる前に
7
0. FirstVR(FVR) SDKダウンロード
動画で内容を振り返ってみましょう
8
下の3つの機能を抑えておけばOK!
1.リセンター
2. 腕の回転の同期
3. ジェスチャー認識
腕の位置をリセットする機能
腕の回転をQuaternionで同期
機械学習でジェスチャー登録と認識
VRを使うアプリを作成する上で必要にな
9
SDKで用意されているクラスは7種類.
今回は2種類を主に使っていきます
クラス名 説明
FVRConnCheck Bluetooth接続チェックのためのクラス
FVRConnection
リセンター,腕の回転やジェスチャ認識のための 筋変位(フォトリフレク
タ)のデータを読み込むクラス
FVRContainer シーンの切り替えに使えるクラス
FVRGesture ジェスチャ認識のためのクラス
FVRGestureManager ジェスチャ認識のためのクラス
FVROrientationPanel デバッグ用にFirstVRの使うクラス
FVRReference シーンの切り替えに使えるクラス
0. FirstVR(FVR) SDKダウンロード
質疑
10
ここまでで,
わからないことはありますか?
?
1. FirstVRを使ったアプリケ
ーション作成
11
1. Unityプロジェクト作成
12
STEP 1. Unityでダウンロードした“fvrSDK”を開く
“Open”をクリックし,
“fvrSDK”を開く
1. Unityプロジェクト作成
13
STEP 2. 整理整頓のためのフォルダを作成.
Projectウィンドウ>Assets の中に2つのフォルダを作ります
整理整頓のための
フォルダ
“Scenes”と“Script”
を作成
1. Unityプロジェクト作成
14
STEP 3. 新しくシーン“testScene”を作成
新しいシーン作成
Projectウィンドウ>Create>Scene
※ 開発時はこまめに
シーン保存しましょう
メニューバー>ファイル>シーン保存
1. Unityプロジェクト作成
15
STEP 3. プレファブ“FVRContainer”と“ConnetionCheck”
をシーンのHierarchyにドラックアンドドロップ
ドラッグアンドドロップ
1. Unityプロジェクト作成
16
STEP 4. ユーザの手の動きを表現するオブジェクト作成
Hierarchyウィンドウ
>Create
>3D Object
>Cube
Cubeオブジェクト作成
1. Unityプロジェクト作成
17
STEP 5. ユーザの操作画面となるScreen Space上に
ボタンを配置するための設定
②Canvas>Render Modeで
“Screen Space - Overlay”を選択
①“ConnetionCheck”
を選択する
1. Unityプロジェクト作成
18
STEP 6. ユーザの操作画面となるScreen Space上に
ボタンを配置するための設定
Visual(丸いやつ)の位置をゲームタブ
に出てくるように調整する
1. Unityプロジェクト作成
19
STEP 7. 4つボタンを作成し,
ボタンとボタンのテキストに名前をつける.
①ボタン作成 Hierarchyウィンドウ>Create>UI>Button
ボタンの名前は“Reset”, “Recenter”,
“TargetBtn”, “NonTargetBtn”
1. Unityプロジェクト作成
20
STEP 8. ボタンのクリックイベント検出のイベントを作成
イベントシステムを作成
Hierarchyウィンドウ>Create>UI>Event System
1. Unityプロジェクト作成
21
STEP 9. FirstVR用のC# Script “TestFVR”を作成しておく
C# Script “TestFVR”を作成する
Projectウィンドウを右クリック>Create>C# Script
22
動画で内容を振り返ってみましょう
1. Unityプロジェクト作成
質疑
23
ここまでで,
わからないことはありますか?
?
2. FirstVR(FVR)を使うための
スクリプトを書く
24
2. FirstVR(FVR)とオブジェクト(Cube)を接続
25
手のオブジェクト(Cube)
C# Script “TestFVR”
hand: 手の動きをバーチャルで
表現するゲームオブジェクト
fvr : FVRConnectionのインスタンスFVRConnection
(FVRゲームオブジ
ェクトにアタッチさ
れている)
FIRST
VR gesture : FVRGestureのインスタンス
STEP 1. FirstVR(FVR)とバーチャルなオブジェクト(Cube)を
どのように接続するか理解しましょう
プレファブ(FVR)とデー
タをやりとして,
FirstVRとオブジェクト
(Cube)を接続します
データのやりとり
2. FirstVR(FVR)とオブジェクト(Cube)を接続
26
STEP 2. オブジェクト(Cube)のコンポーネントとして
C# Script “TestFVR”を追加
オブジェクト(Cube)を選択
“Add Component”を
クリックして,
C#“TestFVR”を追加
2. FirstVR(FVR)とオブジェクト(Cube)を接続
27
STEP 3. C# Script “TestFVR”をエディタで開き,
プログラムを記述
※下記URLより配付.もしくは,
FirstVR Slackチーム #勉強会 よりダウンロード
http://?????
2. FirstVR(FVR)とオブジェクト(Cube)を接続
28
STEP 4. リセンターと回転の同期のスクリプト
FVRDeviceが持つFVRConnectionとやり取りするためのインスタンス
手と動きを対応させるためのGameObjectインスタンス
リセンターを行うための関数(
publicにするのを忘れずに)
2. FirstVR(FVR)とオブジェクト(Cube)を接続
29
STEP 5. バーチャルな手(ここではCube)に作った
スクリプトをアタッチ
2. FirstVR(FVR)とオブジェクト(Cube)を接続
30
STEP 6. スクリプトの中のFVRConnection変数とFVRゲ
ームオブジェクトのFVRConnection変数との紐付け
2. FirstVR(FVR)とオブジェクト(Cube)を接続
31
STEP 7. スクリプトの手の変数と動きを同期させたい手のゲ
ームオブジェクト(ここではCube)との紐付け
2. FirstVR(FVR)とオブジェクト(Cube)を接続
32
STEP 8.クリックした際にRecenterの関数が呼ばれるよ
うにする
2. FirstVR(FVR)とオブジェクト(Cube)を接続
33
STEP 8.クリックした際にRecenterの関数が呼ばれるよ
うにする
2. FirstVR(FVR)とオブジェクト(Cube)を接続
34
STEP 8.クリックした際にRecenterの関数が呼ばれるよ
うにする
35
動画で内容を振り返ってみましょう
2. FirstVR(FVR)とオブジェクト(Cube)を接続
質疑
36
ここまでで,
わからないことはありますか?
?
3. ジェスチャー認識
37
2. FirstVR(FVR)とオブジェクト(Cube)を接続
38
STEP 1. ジェスチャ認識のスクリプト
ジェスチャのキャリブレーション時に使う
秒数を扱う変数たち
ジェスチャを登録する際に使うボタンを扱
う変数たち
ジェスチャをチェックするためのテキスト
ボタンやテキストなどのUIを使うので忘れずに
ターゲットジェスチャを登録す
る関数
ノンターゲットジェスチャを
登録する関数
ジェスチャの学習器
をリセットする関数
ジェスチャを登録す
るときに呼ばれるコ
ルーチン
39
動画で内容を振り返ってみましょう
3. ジェスチャ認識
質疑
40
ここまでで,
わからないことはありますか?
?
注意点
41
スワイプ:FVRGestureManagerのクラスのswipe
変数では方向はわからない
https://qiita.com/popopi/items/a20f32cdf61a1c191
0bc
コライダー:手の周りにスワイプ等を認識するた
めのコライダーがたくさん
42
4. Androidでのビルド
4. Androidでのビルド
43
STEP 1.ビルドに必要なもののダウンロード
Androidビルドに必要なもののダウンロード
• Android Studio https://developer.android.com/studio/
• Android File Transfer https://www.android.com/filetransfer/
• JDK
https://www.oracle.com/technetwork/java/javase/downloads/jdk8-
downloads-2133151.html
4. Androidでのビルド
44
STEP 2. PreferencesからSDKとJDKのパスを通す
4. Androidでのビルド
45
通ったらこんな感じ
4. Androidでのビルド
46
STEP 3. ビルド
質疑
47
ここまでで,
わからないことはありますか?
?
48
5. iOSでのビルド
5. iOSでのビルド
49
STEP 1. ビルド
5. iOSでのビルド
50
STEP 2. ビルドしたプロジェクトの実行
4. Androidでのビルド
51
STEP 3. 実行
質疑
52
ここまでで,
わからないことはありますか?
?
53
7. 今後
7. 今後
54
今後新SDKに追加される機能
PC SDK
両手対応
タップ入力機能
PCとFirstVRをBluetoothで接続
マルチコネクション機能
FirstVRへのタップ入力機能
55
Oculus GoやMirage Soloとも接続できるようになりました.
詳しくは,Youtube H2Lチャンネルを参照してください
7.今後
https://www.youtube.com/watch?v=7_RoCAET_Ks&t=2s
Session 2
56
12:30~13:30
FirstVR
SDKのUnityへの導入
技術インターン
細野哲史
ご静聴ありがとうございました

First vr sdk_introduction

Editor's Notes

  • #2 これからFirstVRのSDKの導入について説明させていただくインターンの細野です。 よろしくお願いします。
  • #3 まずはSDKのダウンロードからお願いします。
  • #4 上のリンクにいってもらってまずSDKをダウンロードしてください。
  • #5 開発者登録をしていない方はまず登録フォームを埋めていただいて登録をお願いします。
  • #6 そしたら左側のタブからダウンロードをお願いします。 ちなみにみなさんダウンロードできていますか?
  • #7 次にダウンロードしてきたフォルダを開いて中に以下のフォルダが入っているかどうかチェックをお願いします。
  • #8 一応ここまでをとりあえず動画で振り返ってみます。 ここまではダウンロードだけなのでもしどこからダウンロードするかわからなかったら教えてください。
  • #9 SDKをダウンロードしたらまずFirstVRを使うアプリを作成する上で必要になる機能について説明していきます。 FirstVRでコンテンツを作成する際にはリセンターと腕の回転の同期、ジェスチャー認識の以上の3つの機能が重要になってきます。 1つ目としてはまずリセンターの機能が必要になってきます。リセンターはOculusGoとかでも正面を直したりコントローラーの向きをちょこちょこ設定し直したりするやつと同じでFirstVRも使っているうちに向きが若干ずれるのでセンタリングをやり直してあげる必要があります。 2つ目のとしては腕の回転の同期です。手を直接表示するVRコンテンツの様なものを作る際には特にこの機能は重要になってきます。 3つ目はジェスチャー認識です。ジェスチャー認識に関してはこのデバイスのキモであり、実装がちょっと難しいのでこのあとで出来るだけ丁寧に説明します。
  • #10 そしたら具体的に開発する際につかっていくクラスの説明をします。 今回はこのマークのついているクラスをメインに使っていくのでこれからの話をするなかでそれを意識して話を聞いてもらえるとありがたいです。 このマークがついているクラスを使って腕や手のジェスチャや回転を取得します。
  • #11 とりあえずここまででわからないことはありますか?
  • #12 ここから実際にFirstVRを使ったアプリケーション作成の話に入っていきます。 ここでは実際に手のジェスチャと腕とFirstVRの回転の同期を埋め込んだサンプルを作っていきます。
  • #13 ではまず初めにFVRSDKのプロジェクトを開いてください。
  • #14 そしたら自分で作ったシーンやスクリプトを入れおくためのフォルダを作成してください。 ここではAssetsフォルダの下にScenesフォルダとScriptsフォルダを作成しています。
  • #15 フォルダの作成が終わったら、Scenesフォルダの中に適当な名前でシーンを作成してください。
  • #16 そしたらFVRフォルダの中にあるPrefabフォルダの中のConnnectionCheckPrefabとFVRContairnerプレファブをシーンに配置してください。 ConnnectionCheckPrefabは繋がっているかどうかを確認する用でFVRContainerはFirstVRと直接データをやり取りする部分になっています。
  • #17 プレファブの配置が終わったら、手の回転の動きを同期させるオブジェクトを配置します。 手のモデルの代わりにここではCubeを使います。 なのでヒエラルキータブのCreateからCubeを作成してください。
  • #18 そしたら次にこれからジェスチャを登録したり、リセンターしたりするためのボタンを配置するために配置したコネクションチェックというプレファブのCanvasという部分のRenderModeをScreen-Space-Overlayに変えてください。 これをしないとあとあとボタンを配置したときにボタンが押せなくなってしまいます。
  • #19 変えたらもう一手間必要で申し訳ないのですが、繋がっているかどうかをみて確かめるためのオブジェクトであるVisualの位置を調整してゲームタブにしっかり表示できているか確認してください。 とりあえずインスペクタからz軸の位置を0にしてもらってから調整するとやりやすいと思います。
  • #20 次にリセンターとジェスチャ登録に使うためのボタンが必要なので計4個のボタンを配置してください。 Cubeの時と同様にヒエラルキータブから作成できます。 で配置が終わったらゲームビューのところを見ながらボタンが被らないように位置を整えてください。 ちなみにこのボタンの役割としてはリセンターを行うためのボタンとターゲットジェスチャーを登録するボタン、ノンターゲットジェスチャを登録するボタン、ジェスチャのデータをリセットするボタンになっています。
  • #21 そしたら先ほど配置したボタンがしっかり機能するために必要なEventSystemをヒエラルキータブに追加してください。 これがないとビルドしてもボタンを押すことができません。
  • #22 次にコードを書いていくための準備をします。 なので初めに作ったScriptsフォルダの中にC#ファイルを作ってください。
  • #23 ここまでを動画で一度振り返ってみます。
  • #25 ここからはFirstVRを扱うためのスクリプトを書いていきます。
  • #26 まずスクリプトを書きはじめる前にどうやってFirstVRのデータを受け渡すかについて軽く説明をします。 仕組みとしては先ほど配置したFVRContainerの子オブジェクトであるFVRDeviceオブジェクトのさらに子オブジェクトのFVRゲームオブジェクトにあタッチされているFVRConnectionというクラスの持っている変数や関数を利用してデータを受け取ります。
  • #27 ではとりあえずさっき作成しておいたスクリプトを腕を同期させるゲームオブジェクトにアタッチします。 やり方としてはヒエラルキータブのCubeをクリックしてインスペクターのアドコンポーネントをクリックすることで行けると思います。
  • #28 ようやくですがここからスクリプトを書いていくので作成したC#のファイルを開いてください。
  • #29 ここからは書き終わったコードを見ながら話していきたいと思います。 まずは手の動きと手のゲームオブジェクトとFirstVRの動きを同期させるためのプログラムとリセンターの関数についてみていこうと思います。 まずはFVRConnectionと手のゲームオブジェクト(ここではCube)を扱うためのインスタンスを作成してください。 作成が終わったら次はリセンターの関数を作ってください。 ここの赤い枠線の中です。 あとでUnityEditorから紐付けを行うのでpublicにするのを忘れずにお願いします。
  • #30 そしたらUnityに戻ってもらってCubeのインスペクタからAdd Componentをしてもらって先ほど作ったスクリプトをアタッチしてください。
  • #31 アタッチが終わったら次はアタッチされたスクリプトの変数の紐付けを行なっていきます。 まずはFVRConnectionの紐付けを行います。
  • #32 次にFirstVRと回転を同期させるゲームオブジェクトを紐付けます。
  • #33 今度はリセンター用に作成したボタンにリセンターの関数を紐付けます。
  • #34 この時点で書き出せばリセンターと回転の同期ができる状態ができました。
  • #35 この時点で書き出せばリセンターと回転の同期ができる状態ができました。
  • #39 ジェスチャの認識の際はまずボタンとチェック用のテキストを使うためにUnityEngine.UIをインポートしてください。 そしたら次にジェスチャを登録する際に使うFVRGestureの変数を用意してあげて、ボタンやチェック用のテキストも用意します。