2021/05/14に開催したハンズオン資料。 事前準備資料はこちら！ http://arfukuoka.lolipop.jp/HoloSDK/preparation.pdf

1. Holo-SDKハンズオン
始めようヘッドトラッキングで3D表現

2. 自己紹介
氏名：吉永崇(Takashi Yoshinaga)
専門：ARを用いた医療支援や運動計測
Volumetric Video (3Dビデオ)
コミュニティ：ARコンテンツ作成勉強会 主催

3. ARコンテンツ作成勉強会の紹介
 2013年5月に勉強会をスタート。
 ARコンテンツの作り方をハンズオン形式で学ぶ
 人数は5~10名程度の少人数で実施
 参加条件はAR/VRに興味がある人(知識不要)
 各地で開催 (福岡、熊本、宮崎、長崎、大分、 鹿児島、山口、広島、札幌、関東)

4. Twitterと勉強会ページで情報を発信しています
@AR_Fukuoka Googleで「AR勉強会」で検索

5. #AR_Fukuoka
ハッシュタグ

6. ヘッドトラッキングを使った3D表現
ヘッドトラッキングを使った3D表現は昔からあったが、2007年Johnny Leeの投稿で有名に
https://youtu.be/Jd3-eiid-Uw

7. ヘッドトラッキングに用いる機器の例
最近はKinectやVivトラッカーを使ったものが主流
でも、みんながトラッキング用の機器を持ってるわけじゃないよね？

8. Holo-SDK
特別な機器を使うことなく、Webカメラがあれば3D表現が可能
https://youtu.be/NOGNq2uYs4o

9. 今日のゴール
画面から飛び出す表現と、奥に空間があるような表現を実現
https://youtu.be/86Vave1n4IA

10. 演習用素材のダウンロード
http://arfukuoka.lolipop.jp/HoloSDK/Sample.zip

11. Unity Hub起動
Unity Hub

12. プロジェクトの作成 (1/6)
①プロジェクト
②新規作成の横の▼

13. プロジェクトの作成 (2/6)
2019.4.13以降
この資料は2019.4.xを前提に解説をしています

14. プロジェクトの作成 (3/6)
①3D
②プロジェクト名

15. プロジェクトの作成 (4/6)
保存先を選択

16. プロジェクトの作成 (5/6)
作成

17. プロジェクトの作成 (6/6)
Unity Editorが起動すればOK

18. Unity Editorの概要
Sceneタブ
オブジェクトの配置を行う
オブジェクトの一覧
プロジェクト内のフォルダやファイルの一覧

19. Holo-SDKの導入 (1/6)
Cドライブ内のHoloSDKフォルダを開く
C:HoloSDK

20. Holo-SDKの導入 (2/6)
HoloUnitySDKがあることを確認

21. Holo-SDKの導入 (3/6)
Assetsフォルダをクリック

22. Holo-SDKの導入 (4/6)
HoloUnitySDK

23. Holo-SDKの導入 (5/6)
Assetsの中に
ドラッグ&ドロップ

24. Holo-SDKの導入 (6/6)
HoloUnitySDKフォルダ
が追加されればOK

25. 表示するオブジェクトを取得 (1/7)
Windowをクリック

26. 表示するオブジェクトを取得 (2/7)
Asset Store

27. 表示するオブジェクトを取得 (3/7)
Free Aircraftで検索

28. 表示するオブジェクトを取得 (4/7)
これをクリック

29. 表示するオブジェクトを追加 (5/7)
DownloadのあとImport

30. 表示するオブジェクトを取得 (6/7)
Import

31. 表示するオブジェクトを取得 (7/7)
Understoneフォルダが
追加されればOK

32. HoloSDKを使った開発 (1/5)
Sceneをクリック

33. HoloSDKを使った開発 (2/5)
Main Cameraを削除

34. HoloSDKを使った開発 (3/5)
Assets
→ HoloUnitySDK
→ HoloPrefabs

35. HoloSDKを使った開発 (4/5)
HoloUnitySDK

36. HoloSDKを使った開発 (5/5)
HoloUnitySDKを
Hierarchyに
ドラッグ&ドロップ

37. Sceneの視点調整 (1/4)
何か表示される

38. Sceneの視点調整 (2/4)
HoloUnitySDKを開く

39. Sceneの視点調整 (3/4)
HoloStageをダブルクリック

40. 補足：追加された板の正体
 画面に表示されている背景の領域
 設定によっては真っ黒だが、このあと
実際の色で表示できるようになる
 仮想のカメラとこの板の間にCGを
配置してコンテンツを作る

41. Sceneの視点調整 (4/4)
Alt + ドラッグで回転
板の中心の軸の
向きはこんな感じ
実行時の視点
(仮想カメラ)の位置

42. 表示オブジェクトをSceneに追加 (1/6)
Assets
→ Understone
→ Free Aircraft Pack
→ Prefabs

43. 表示オブジェクトをSceneに追加 (2/6)
HoloStageを開く

44. 表示オブジェクトをSceneに追加 (3/6)
HoloObjectsを見つけておく

45. 表示オブジェクトをSceneに追加 (4/6)
aircraft-A-A

46. 表示オブジェクトをSceneに追加 (5/6)
aircraft-A-Aを
HoloObjectsに
ドラッグ&ドロップ

47. 表示オブジェクトをSceneに追加 (6/6)
HoloObjectsの子要素
として登録される

48. 表示オブジェクトの位置・向き・サイズ設定
オブジェクトが小さいので見やすくする
(次のページで解説)

49. 表示オブジェクトの位置・向き・サイズ設定
aircraft-A-A
Poisition: 0 0 -20
Rotation:0 220 0
Scale: 5 5 5

50. 他のオブジェクトの追加 (1/6)
Cloud-A

51. 他のオブジェクトの追加 (2/6)
Cloud-Aを
HoloObjectsに
ドラッグ&ドロップ

52. 他のオブジェクトの追加 (3/6)
Cloud-A
Poisition: -20 15 0
Rotation:0 0 0
Scale: 1.5 1.5 1.5

53. 他のオブジェクトの追加 (4/6)
Cloud-Aをクリック

54. 他のオブジェクトの追加 (5/6)
Ctrl + Dで複製

55. 他のオブジェクトの追加 (6/6)
Cloud-A (1)
Poisition: 28 -9 0
Rotation:0 0 0
Scale: 1 1 1

56. オブジェクトの色を明るくする (1/4)
Window

57. オブジェクトの色を明るくする (2/4)
Rendering
Lighting
Setting

58. オブジェクトの色を明るくする (3/4)
Auto Generate

59. オブジェクトの色を明るくする (4/4)
明るくなる

60. Ctrl + Sで保存

61. 動作確認
実行

62. 動作確認
カメラがないよと表示

63. 動作確認
再度実行ボタンを
クリックして停止

64. カメラの確認
HoloCamera

65. カメラの確認
Key IDがからっぽ

66. カメラの利用にはライセンスを作成
してIDを取得する必要がある

67. ライセンスに関する情報をメモる
ためにテキストエディタを起動

68. 公式サイトにアクセス
https://www.holo-sdk.com/
または
Holo SDKでgoogle検索

69. Key IDの取得 (1/9)
Manage License

70. Key IDの取得 (2/9)
既にライセンスがある場合の表示

71. Key IDの取得 (3/9)
まだライセンスが無い場合の表示

72. Key IDの取得 (4/9)
Buy more license

73. Key IDの取得 (5/9)
GENERATE FREE

74. Key IDの取得 (6/9)
Edit

75. Key IDの取得 (7/9)
会社名(半角英数)
プロダクト名(半角英数)

76. 会社名とプロダクト名を
テキストエディタにメモしておく

77. Key IDの取得 (8/9)
Add

78. Key IDの取得 (9/9)
Key ID

79. Key IDもテキストエディタに
コピペしておく

80. Key IDの適用 (1/5)
HoloCamera
Key IDを貼りつけ

81. Key IDの適用 (2/5)
Edit

82. Key IDの適用 (3/5)
Project Settings

83. Key IDの適用 (4/5)
会社名を貼りつけ
プロダクト名を
貼りつけ

84. Key IDの適用 (5/5)
閉じる

85. 動作確認

86. 現在のシーンを名前を付けて保存 (1/3)
File
Save As...

87. 現在のシーンを名前を付けて保存 (2/3)
名前を付ける(Sample1)
保存

88. 現在のシーンを名前を付けて保存 (3/3)
Assets
現在のシーンのアイコンができる

89. Next Step
画面の奥に空間があるような表現を実現する

90. 現在のシーンを複製 (1/3)
シーンを選択して
Ctrl + D

91. 現在のシーンを複製 (2/3)
新しい方のシーンを
ダブルクリック

92. 現在のシーンを複製 (3/3)
新しい方のシーン名に
なっていればOK

93. 部屋オブジェクトをインポート
VirtualBox.unitypackage
をダブルクリック

94. 部屋オブジェクトをインポート
Import

95. 部屋オブジェクトを利用 (1/8)
Virtual Box

96. 部屋オブジェクトを利用 (2/8)
Virtual Box

97. 部屋オブジェクトを利用 (3/8)
HoloUnitySDKを開く
HoloStageを開く

98. 部屋オブジェクトを利用 (4/8)
VirtualBoxを
HoloObjectsに
ドラッグ&ドロップ

99. 部屋オブジェクトを利用 (5/8)
Virtual Box
Poisition: 0 0 0
Rotation:0 0 0
Scale: 120 80 50
※スケールのzの値(=部屋の奥行)は任意

100. 部屋オブジェクトを利用 (6/8)
HoloScreen
Mesh Rendererの
チェックをオフに切り替え

101. 部屋オブジェクトを利用 (7/8)
前面の板が消える

102. 部屋オブジェクトを利用 (8/8)
飛行機と雲の位置
を自由に変更

103. 動作確認

104. ビルド
File

105. ビルド
Build Settings

106. ビルド
Architectureを
x86_64に変更

107. ビルド
Build

108. ビルド
新しいフォルダー

109. ビルド
フォルダ名をつける

110. ビルド
フォルダーの選択

111. ビルド
ARFukuoka.exe

112. 完成