
1
00:00:07,040 --> 00:00:16,550
（音楽）

2
00:00:17,251 --> 00:00:19,853
（拍手）

3
00:00:20,487 --> 00:00:21,688
ようこそ

4
00:00:23,390 --> 00:00:27,794
Core Imageチームの
エマニュエルです

5
00:00:28,462 --> 00:00:32,766
深度データを使った
エフェクトの話をします

6
00:00:34,935 --> 00:00:36,170
始めます

7
00:00:36,870 --> 00:00:42,543
iOS 11から顔の画像に
深度データが加わりました

8
00:00:43,410 --> 00:00:48,515
昨年のWWDCで このデータを
応用した例を紹介しました

9
00:00:48,615 --> 00:00:52,386
被写界深度で
遠近感を出したり

10
00:00:52,486 --> 00:00:55,522
前景と背景を
別々に変化させた例です

11
00:00:56,523 --> 00:01:00,794
今年は新しい魅力的な技術を
紹介します

12
00:00:56,523 --> 00:01:00,794
今年は新しい魅力的な技術を
紹介します

13
00:01:01,595 --> 00:01:03,363
Portrait Matteです

14
00:01:05,833 --> 00:01:08,402
このセッションの前半では

15
00:01:08,502 --> 00:01:12,172
顔画像に施す
エフェクトについて

16
00:01:12,873 --> 00:01:16,743
後半では
動画加工について説明します

17
00:01:16,844 --> 00:01:20,180
TrueDepthカメラの応用です

18
00:01:22,916 --> 00:01:26,019
まず Portrait Segmentation
APIからです

19
00:01:27,054 --> 00:01:29,423
Portrait Matteとは何か？

20
00:01:29,523 --> 00:01:32,826
これは前景と背景を分割し

21
00:01:32,926 --> 00:01:36,196
マスクを使って効果を出す
手法です

22
00:01:36,296 --> 00:01:40,868
前景は白（1.0）
背景は黒（0.0）で表され

23
00:01:40,968 --> 00:01:43,804
境界近くは
グレイに近い色です

24
00:01:46,440 --> 00:01:50,377
優れた細部描写も
実現しました

25
00:01:50,477 --> 00:01:55,816
髪のカールの輪郭まで
はっきり表現されています

26
00:01:58,085 --> 00:02:00,954
Portrait Matteを使うと

27
00:01:58,085 --> 00:02:00,954
Portrait Matteを使うと

28
00:02:01,054 --> 00:02:06,994
背景を暗くして 前景を
浮き立たせることもできます

29
00:02:07,394 --> 00:02:11,431
これで魅力的な
アプリケーションを作り

30
00:02:11,532 --> 00:02:14,301
ユーザを
引き付けてください

31
00:02:16,737 --> 00:02:21,808
Portrait Matteは
iOS 12に搭載されます

32
00:02:24,077 --> 00:02:27,848
前面と背面の
両方のカメラで利用でき

33
00:02:29,983 --> 00:02:36,023
人物の顔画像が写っている
場合にのみ使えます

34
00:02:37,124 --> 00:02:40,460
ガンマではなく
リニアエンコードのため

35
00:02:40,561 --> 00:02:43,764
グレイスケールの
バッファがあります

36
00:02:45,532 --> 00:02:49,770
必ず使えるという
保証はないため

37
00:02:49,870 --> 00:02:54,575
まず深度データの
テストをしてください

38
00:02:56,143 --> 00:02:59,613
APIでデータを
ロードしてみます

39
00:03:00,414 --> 00:03:05,686
Image I/OはPortrait Matteに
適したAPIです

40
00:03:06,153 --> 00:03:10,490
CGImageSourceCopyを
呼び出すと

41
00:03:10,591 --> 00:03:14,294
kCGImageAuxiliaryDataType
PortraitEffectsMatteキーが出ます

42
00:03:15,062 --> 00:03:18,565
これで情報を３つ含む
ディクショナリが返されます

43
00:03:19,132 --> 00:03:21,702
画像データCFDataRefと

44
00:03:23,103 --> 00:03:26,673
バッファのあるメタデータ
CFDictionary

45
00:03:27,040 --> 00:03:31,478
もう１つはキャプチャを含む
メタデータです

46
00:03:33,180 --> 00:03:38,485
AVFoundationは
Image I/OのあるAPIです

47
00:03:38,852 --> 00:03:41,655
画像をCGImageSouceCopyから

48
00:03:41,755 --> 00:03:44,758
AVPortraitEffectsMatteに
フィードし

49
00:03:47,928 --> 00:03:53,934
ピクセルのフォーマットタイプと
CVピクセルバッファを得たら

50
00:03:54,034 --> 00:03:58,972
このバッファを使って
加工が行えます

51
00:04:00,941 --> 00:04:05,345
AVFoundationは
キャプチャタイムも含みます

52
00:04:05,445 --> 00:04:08,382
AVFoundationの
セットアップ時には

53
00:04:08,482 --> 00:04:12,452
CaptureInput CaputrueDevice
CaptureSessionを入れます

54
00:04:13,453 --> 00:04:18,058
まず環境確認のため
以下のコードを使います

55
00:04:18,158 --> 00:04:22,095
isDepthDataDeliverySupportedと

56
00:04:22,196 --> 00:04:24,965
isPortraitEffectsMatte
DeliverySupportedです

57
00:04:25,065 --> 00:04:29,336
DepthとPortrait Matteの
２つが必要な理由は

58
00:04:29,436 --> 00:04:32,472
Portrait Matteを利用するには

59
00:04:32,573 --> 00:04:37,477
深度データも引き渡す必要が
あるからです

60
00:04:38,011 --> 00:04:43,717
利用するためには
AVCapturePhotoSettingsを修正し

61
00:04:43,817 --> 00:04:49,256
Portrait Matteと
深度データを引き渡します

62
00:04:50,724 --> 00:04:56,196
キャプチャタイムは
didFinishProcessingPhoto callback

63
00:04:56,997 --> 00:04:58,365
簡単ですね

64
00:05:00,033 --> 00:05:05,005
Core ImageではPortrait Matteを
保存できます

65
00:05:05,405 --> 00:05:11,345
auxiliaryPortrait EffectsMatteで
URLのコンテンツに引き渡され

66
00:05:11,445 --> 00:05:14,982
CIImageがPortrait Matteに
反映されます

67
00:05:18,519 --> 00:05:24,191
Portrait Matteが
直接ファイルに保存され

68
00:05:24,291 --> 00:05:29,196
portraitEffectsMatteImageと
いうオプションができます

69
00:05:29,296 --> 00:05:32,199
CIImageに
Portrait Matteが加わるのです

70
00:05:32,566 --> 00:05:34,968
writeHEIFRepresntationOfImageを
使い

71
00:05:35,068 --> 00:05:36,970
ディスクに保存もできます

72
00:05:37,070 --> 00:05:42,075
３つのイメージに対する
注意点があります

73
00:05:42,176 --> 00:05:48,115
RGBとDepthとMatteには
解像度の違いがあるのです

74
00:05:49,082 --> 00:05:54,988
リアカメラでMatteはRGBの半分
Depthはそれ以下です

75
00:05:55,355 --> 00:05:58,859
リアカメラの画像を
比べてみましょう

76
00:05:59,660 --> 00:06:03,664
アプリケーションで
低解像度処理し

77
00:05:59,660 --> 00:06:03,664
アプリケーションで
低解像度処理し

78
00:06:03,764 --> 00:06:09,069
RGBをDepthとMatte
まで縮小するか

79
00:06:09,303 --> 00:06:12,739
反対にDepthとMatteを
RGBに合わせます

80
00:06:14,107 --> 00:06:18,145
Portrait Segmentation APIの

81
00:06:18,245 --> 00:06:21,748
すばらしいデモを
お見せしよう

82
00:06:23,584 --> 00:06:28,155
ブラウザベースの
Jupiter Notebookで

83
00:06:28,255 --> 00:06:31,191
Pythonを使います

84
00:06:33,193 --> 00:06:36,396
Pythonバインディングを

85
00:06:36,496 --> 00:06:40,000
Core Imageに使うセッションも
別にあります

86
00:06:44,571 --> 00:06:49,810
まずDepthとMatteの画像を
ロードします

87
00:06:49,910 --> 00:06:51,912
この画像を使います

88
00:06:54,114 --> 00:06:59,052
まずDepthとMatteのイメージを
お見せします

89
00:06:59,152 --> 00:07:02,723
左がDepthで 右がMatteです

90
00:06:59,152 --> 00:07:02,723
左がDepthで 右がMatteです

91
00:07:02,823 --> 00:07:05,125
細部までよく見えますね

92
00:07:05,225 --> 00:07:09,029
あとで
ズームしてお見せします

93
00:07:09,129 --> 00:07:12,699
より精度の高さが
分かるはずです

94
00:07:14,768 --> 00:07:16,970
次に大きさを変えます

95
00:07:17,271 --> 00:07:21,041
RGBデータは
サイズが大きいため

96
00:07:21,842 --> 00:07:27,748
Depthのサイズを変え RGBを右に
Depthを左に並べます

97
00:07:28,048 --> 00:07:31,018
Depthデータから説明しますが

98
00:07:31,118 --> 00:07:35,222
Portrait Matteの方が簡単です

99
00:07:36,323 --> 00:07:40,794
Depthと比較して
効果を実感してください

100
00:07:40,894 --> 00:07:45,632
Depthではグレイレベル値の
ヒストグラムを計算します

101
00:07:45,899 --> 00:07:49,002
ヒストグラムで
しきい値を測ることで

102
00:07:49,102 --> 00:07:53,774
それ以下か以上になった時に
ゼロか１かが分かります

103
00:07:54,174 --> 00:07:58,679
モフォロジーで
クロージング処理をしたあと

104
00:07:58,779 --> 00:08:03,350
マスクをぼかし
柔らかい表現にしていきます

105
00:07:58,779 --> 00:08:03,350
マスクをぼかし
柔らかい表現にしていきます

106
00:08:03,650 --> 00:08:05,752
では やってみます

107
00:08:06,386 --> 00:08:11,658
Core Imageを使って
作業を行います

108
00:08:12,459 --> 00:08:17,297
最初にマスクの割合を
変えてみます

109
00:08:17,865 --> 00:08:20,968
割合を高めると
前景が切り取られます

110
00:08:21,068 --> 00:08:24,872
これくらいが適当でしょうか

111
00:08:25,072 --> 00:08:30,744
前景に消えている部分が
あるのが分かりますね

112
00:08:30,844 --> 00:08:33,380
被写体の一部を削除する―

113
00:08:33,547 --> 00:08:36,683
モフォロジークロージングを
しています

114
00:08:36,783 --> 00:08:38,818
このようになりました

115
00:08:38,919 --> 00:08:42,556
消しすぎると
何も見えなくなります

116
00:08:43,023 --> 00:08:44,491
このくらいにして

117
00:08:44,791 --> 00:08:49,029
今度は マスクの上に
ぼかしを入れます

118
00:08:49,129 --> 00:08:51,565
RGBを合成してみましょう

119
00:08:51,865 --> 00:08:56,770
マスクの働きは
これだけではありません

120
00:08:58,005 --> 00:09:01,141
しきい値の
パラメータを選び

121
00:08:58,005 --> 00:09:01,141
しきい値の
パラメータを選び

122
00:09:01,241 --> 00:09:03,810
これを前景に使います

123
00:09:07,080 --> 00:09:10,317
次は前景だけに
エフェクトを施します

124
00:09:10,417 --> 00:09:15,823
Core Imageのグレイスケールで
コントラストを付けます

125
00:09:16,056 --> 00:09:18,158
露出を調整して―

126
00:09:18,859 --> 00:09:23,497
彩度を減らし
コントラストを強くします

127
00:09:23,797 --> 00:09:27,201
これは前景を使った効果です

128
00:09:27,301 --> 00:09:32,806
次に深度データの
マスクを使い

129
00:09:32,906 --> 00:09:35,709
前景を背景と合成します

130
00:09:36,243 --> 00:09:40,614
最初の画像より暗い背景に
してみましょう

131
00:09:42,649 --> 00:09:46,720
Core ImageのblendWithMaskで
合成させます

132
00:09:48,655 --> 00:09:51,191
これが結果です

133
00:09:52,392 --> 00:09:53,293
いいですね

134
00:09:55,028 --> 00:09:55,963
ありがとう

135
00:09:56,096 --> 00:09:58,999
（拍手）

136
00:09:59,099 --> 00:10:03,704
今は切り抜き部分の
パラメータを変えました

137
00:09:59,099 --> 00:10:03,704
今は切り抜き部分の
パラメータを変えました

138
00:10:03,804 --> 00:10:06,106
柔らかいイメージに
するためです

139
00:10:06,206 --> 00:10:11,512
Portrait Matteは
もっと簡単です

140
00:10:11,612 --> 00:10:13,747
こちらを見てください

141
00:10:14,715 --> 00:10:16,450
違う画像を使います

142
00:10:18,118 --> 00:10:23,857
DepthとMatteの情報が
入っています

143
00:10:24,858 --> 00:10:29,563
非常に優れた
前景のマスクですよ

144
00:10:29,663 --> 00:10:33,066
髪の一部を見てみましょう

145
00:10:35,235 --> 00:10:37,404
細部まできれいですね

146
00:10:37,504 --> 00:10:43,477
右のDepthデータは
Matteより粗いです

147
00:10:44,811 --> 00:10:47,381
結果の違いを見てみましょう

148
00:10:47,481 --> 00:10:51,051
同じことをMatteを
使って行います

149
00:10:51,718 --> 00:10:55,789
先ほどと似た前景を
使っていますが

150
00:10:55,889 --> 00:11:00,727
前景の彩度を少し下げ
自然な感じに仕上げます

151
00:10:55,889 --> 00:11:00,727
前景の彩度を少し下げ
自然な感じに仕上げます

152
00:11:03,297 --> 00:11:07,768
Core Imageで
背景にぼかしを入れ

153
00:11:07,868 --> 00:11:10,637
露出を抑え暗くします

154
00:11:10,737 --> 00:11:14,842
かなりぼやけていますが
何となく見えます

155
00:11:16,009 --> 00:11:20,981
マスクにCI blendを使い
合成させると

156
00:11:21,181 --> 00:11:22,583
右のようになります

157
00:11:23,016 --> 00:11:24,351
美しいですね

158
00:11:24,852 --> 00:11:27,754
（拍手）

159
00:11:27,855 --> 00:11:28,789
ありがとう

160
00:11:29,323 --> 00:11:34,228
次はBig Headのデモを
お見せします

161
00:11:34,995 --> 00:11:40,234
Portrait Matteでは
背景に対して

162
00:11:40,334 --> 00:11:42,369
被写体サイズを変えられます

163
00:11:42,569 --> 00:11:45,272
では やってみましょう

164
00:11:46,640 --> 00:11:51,612
左に人物画像
右にMatteデータがあります

165
00:11:52,880 --> 00:11:58,819
これから被写体のサイズを
変えてみますよ

166
00:11:59,119 --> 00:12:02,689
大きくなったり
小さくなったりします

167
00:11:59,119 --> 00:12:02,689
大きくなったり
小さくなったりします

168
00:12:03,056 --> 00:12:08,061
もう少し被写体を
強調したいと思ったら

169
00:12:08,161 --> 00:12:11,698
他にも面白いことができます

170
00:12:11,798 --> 00:12:15,235
まず被写体のサイズを決め

171
00:12:15,569 --> 00:12:21,141
深度データを変えることで
背景をぼかします

172
00:12:21,375 --> 00:12:24,478
それにより
被写体が引き立ちます

173
00:12:26,413 --> 00:12:29,883
次も簡単にできます

174
00:12:29,983 --> 00:12:34,788
同じように
Portrait Matteを使い

175
00:12:34,888 --> 00:12:37,157
前景と背景をぼかします

176
00:12:38,392 --> 00:12:43,564
次に画像のサイズを変え
被写体を大きくしたら

177
00:12:43,764 --> 00:12:48,001
焦点が当たるように
コントラストを付けます

178
00:12:48,635 --> 00:12:50,571
非常に簡単ですね

179
00:12:51,138 --> 00:12:55,475
（拍手）

180
00:12:55,576 --> 00:13:00,447
次はMarchingのデモです

181
00:12:55,576 --> 00:13:00,447
次はMarchingのデモです

182
00:13:00,547 --> 00:13:05,185
説明より見てもらった方が
よさそうです

183
00:13:09,723 --> 00:13:12,059
楽しいですよね

184
00:13:12,192 --> 00:13:16,063
いくつでも
増やすことができます

185
00:13:16,263 --> 00:13:20,868
どこまでも続けられるのです

186
00:13:21,802 --> 00:13:23,370
面白いですよね

187
00:13:25,038 --> 00:13:26,139
どうでしょう

188
00:13:28,742 --> 00:13:32,880
デモを楽しんで
いただけたでしょうか

189
00:13:33,814 --> 00:13:39,586
午後にはCore Imageで
Pythonを使うセッション

190
00:13:39,686 --> 00:13:42,489
Core Image Performance
Prototyping in Pythonもあります

191
00:13:44,825 --> 00:13:47,995
次はビデオエンジニアの
ロンによる

192
00:13:48,095 --> 00:13:51,532
TrueDepthカメラを使った
映像です

193
00:13:51,632 --> 00:13:52,733
さようなら

194
00:13:52,833 --> 00:13:57,805
（拍手）

195
00:13:59,106 --> 00:14:00,474
交替しよう

196
00:13:59,106 --> 00:14:00,474
交替しよう

197
00:14:01,008 --> 00:14:04,044
映像でできることは
何でしょう？

198
00:14:04,745 --> 00:14:08,382
ビデオエンジニアの
ロンです

199
00:14:10,517 --> 00:14:13,220
TrueDepthカメラを
使った―

200
00:14:13,320 --> 00:14:16,857
リアルタイム映像効果の
説明をします

201
00:14:17,124 --> 00:14:20,060
例えば 背景映像を変える
アプリケーション

202
00:14:22,930 --> 00:14:28,802
我々はTrueDepthカメラを
探究しています

203
00:14:29,069 --> 00:14:32,439
特徴や手法を探る
挑戦の日々です

204
00:14:34,208 --> 00:14:37,945
ポイントクラウドを
使うことで

205
00:14:38,045 --> 00:14:40,948
深度データを
より豊かに利用できます

206
00:14:41,448 --> 00:14:44,351
アプリケーションの名前は
Backdropです

207
00:14:44,451 --> 00:14:47,321
順を追って説明します

208
00:14:47,988 --> 00:14:49,790
まず 確認です

209
00:14:50,290 --> 00:14:54,695
TrueDepthカメラの
各フレームは深度マップです

210
00:14:54,795 --> 00:14:58,999
各ピクセルに
深度情報が入っています

211
00:14:59,099 --> 00:15:01,969
距離情報を持っているのです

212
00:14:59,099 --> 00:15:01,969
距離情報を持っているのです

213
00:15:04,471 --> 00:15:06,940
それは色彩で表されます

214
00:15:07,040 --> 00:15:12,679
近くのピクセルは赤
最も遠くのピクセルは青です

215
00:15:12,779 --> 00:15:15,349
その間はスペクトルです

216
00:15:15,449 --> 00:15:18,385
これが深度マップ

217
00:15:20,320 --> 00:15:24,057
黒いピクセルは
深度マップの穴です

218
00:15:24,158 --> 00:15:28,128
穴の部分の
深度は分かりません

219
00:15:28,695 --> 00:15:32,399
今日紹介する
アプリケーションは

220
00:15:32,499 --> 00:15:37,004
TrueDepth Streamerです

221
00:15:38,572 --> 00:15:44,077
映像とTrueDepthストリームを
スライドできます

222
00:15:46,713 --> 00:15:50,951
TrueDepthカメラの
色彩は動きと連動し

223
00:15:51,385 --> 00:15:56,223
まったくの暗闇で
映像が真っ黒であっても

224
00:15:56,590 --> 00:15:59,359
カメラは作動します

225
00:16:01,962 --> 00:16:05,232
私が見えたり
消えたりしますよ

226
00:16:05,332 --> 00:16:09,236
（拍手）

227
00:16:09,970 --> 00:16:14,441
アプリケーションに
これを組み込むには？

228
00:16:14,842 --> 00:16:19,780
まずは内蔵の
TrueDepthカメラを見つけ

229
00:16:21,148 --> 00:16:24,751
キャプチャ入力を初期化し

230
00:16:26,220 --> 00:16:29,189
深度データを加えます

231
00:16:30,023 --> 00:16:35,662
これでTrueDepthストリームが
使えます

232
00:16:37,531 --> 00:16:42,669
ストリームには　ばらつきと
深度データがあります

233
00:16:42,936 --> 00:16:45,772
横の広がりと深度は
相反するものです

234
00:16:45,873 --> 00:16:47,708
どちらを選ぶべきか？

235
00:16:48,542 --> 00:16:52,179
横の広がりの方が
機械学習などでは

236
00:16:52,279 --> 00:16:54,848
よい結果を出します

237
00:16:55,048 --> 00:16:59,319
しかし深度データは
現実世界では重要です

238
00:16:59,920 --> 00:17:02,122
深度を使うと

239
00:16:59,920 --> 00:17:02,122
深度を使うと

240
00:17:03,223 --> 00:17:07,060
深度のエラーは
深度の２乗で進みます

241
00:17:07,161 --> 00:17:12,598
１メートル先の物体の精度は
２メートル先の物体より４倍高い

242
00:17:16,103 --> 00:17:21,407
映像と深度は必ずしも
合っている必要はないのです

243
00:17:21,942 --> 00:17:26,713
TrueDepthカメラの解像度は
640X480ドット

244
00:17:26,813 --> 00:17:32,653
ビデオ設定だとアスペクト比は
４対３になります

245
00:17:33,086 --> 00:17:36,790
アスペクト比16対９を選べば

246
00:17:36,890 --> 00:17:40,761
深度マップの解像度は
640X360ドット

247
00:17:40,861 --> 00:17:46,567
どちらでも深度マップは
RGBの全視野をカバーできます

248
00:17:48,268 --> 00:17:53,707
映像では大量のデータを
迅速に処理する必要があり

249
00:17:53,807 --> 00:17:57,077
システムに負荷がかかります

250
00:17:58,111 --> 00:18:02,015
アプリケーションがかける負荷を
テストでき―

251
00:17:58,111 --> 00:18:02,015
アプリケーションがかける負荷を
テストでき―

252
00:18:02,115 --> 00:18:07,287
レベルは微少から重大 さらに
シャットダウンまであります

253
00:18:07,421 --> 00:18:09,923
責任を持って行わないと

254
00:18:10,023 --> 00:18:13,260
シャットダウンを
招きかねません

255
00:18:13,360 --> 00:18:17,664
キャプチャデバイスが
停止してしまいます

256
00:18:20,000 --> 00:18:23,604
グレードを下げて
負荷を減らす方法もあります

257
00:18:23,737 --> 00:18:29,009
負荷が高すぎる時は
レートを15fpsにできます

258
00:18:29,142 --> 00:18:33,380
負荷がそれほどでも
ない場合には

259
00:18:33,480 --> 00:18:37,951
30fps 24fps 20fps 15fpsと
負荷レベルに応じて

260
00:18:38,051 --> 00:18:40,754
段階的に変更できます

261
00:18:43,690 --> 00:18:46,693
深度マップの
データの穴の問題は？

262
00:18:47,528 --> 00:18:51,932
フィルタがかけられた
ストリームを得たら

263
00:18:52,032 --> 00:18:56,737
isFilteringEnabledの
デフォルトはtrueです

264
00:18:57,171 --> 00:19:01,542
フィルタされた深度マップを
自由に使え

265
00:18:57,171 --> 00:19:01,542
フィルタされた深度マップを
自由に使え

266
00:19:01,642 --> 00:19:04,878
穴をRGBの画像が
埋めてくれます

267
00:19:05,379 --> 00:19:09,249
特に写真や
セグメンテーションに有効です

268
00:19:09,349 --> 00:19:13,654
ピクセルをクエリすると
深度値を得るからです

269
00:19:15,322 --> 00:19:19,860
TrueDepth Streamerで
フィルタを変えると

270
00:19:19,960 --> 00:19:23,030
よりスムーズに
穴が埋められます

271
00:19:25,232 --> 00:19:29,970
効果的ですが
使えない場合もあります

272
00:19:30,070 --> 00:19:35,275
ポイントクラウドや
現実的な測定なら

273
00:19:35,375 --> 00:19:40,080
ハイファイのローデータの方が
使えます

274
00:19:40,681 --> 00:19:45,119
穴の部分の
ピクセルはゼロになります

275
00:19:45,219 --> 00:19:49,122
カメラから
ゼロメートルではなく

276
00:19:49,223 --> 00:19:52,092
情報が何もない状態です

277
00:19:53,527 --> 00:19:56,997
ダウンサンプルなどには
不適切です

278
00:19:57,097 --> 00:20:01,502
本当の値とゼロが
混ざってしまうからです

279
00:19:57,097 --> 00:20:01,502
本当の値とゼロが
混ざってしまうからです

280
00:20:03,604 --> 00:20:05,339
穴の存在とは？

281
00:20:07,541 --> 00:20:13,046
TrueDepthカメラは
５メートル以内の物を感知しますが

282
00:20:13,480 --> 00:20:15,482
物の素材は様々です

283
00:20:15,582 --> 00:20:19,853
反射性が低く
光を吸収する素材もあります

284
00:20:21,622 --> 00:20:27,294
非常に反射性の低い
素材の場合は こうなります

285
00:20:27,394 --> 00:20:32,132
深度マップに切り替え
カメラから離れると―

286
00:20:33,567 --> 00:20:37,571
遠くにある物でも
色が付いていますが

287
00:20:37,671 --> 00:20:43,377
ある素材は光を吸収し
穴を作ってしまうのです

288
00:20:43,877 --> 00:20:49,683
フィルタストリームにすると
穴はなくなります

289
00:20:51,685 --> 00:20:55,289
また 原因は光の反射量
だけではなく

290
00:20:55,389 --> 00:20:58,425
反射する方角にもよります

291
00:20:58,992 --> 00:21:02,496
はっきりと明るく
見える素材でも

292
00:20:58,992 --> 00:21:02,496
はっきりと明るく
見える素材でも

293
00:21:02,596 --> 00:21:05,165
反射方向では穴が開きます

294
00:21:06,767 --> 00:21:10,204
映像の中のディスプレイを
見てください

295
00:21:10,604 --> 00:21:13,740
画面に何かが反射しています

296
00:21:14,474 --> 00:21:20,447
深度マップにすると
ディスプレイは穴だらけです

297
00:21:21,448 --> 00:21:27,421
フィルタストリームでも
この程度です

298
00:21:30,591 --> 00:21:33,827
屋外での撮影も難題です

299
00:21:34,194 --> 00:21:40,167
背景は非常に遠くまで続き
深度を測り切れず

300
00:21:40,434 --> 00:21:44,838
太陽はアクティブ照明に
なってしまいます

301
00:21:46,306 --> 00:21:50,510
デモのために
天気のよい日に外で撮影し

302
00:21:50,611 --> 00:21:52,846
太陽光を浴びました

303
00:21:53,113 --> 00:21:57,651
深度マップでは
背景に深度がありません

304
00:21:57,751 --> 00:22:02,789
穴も多く この場合は
髪の毛に集中しています

305
00:21:57,751 --> 00:22:02,789
穴も多く この場合は
髪の毛に集中しています

306
00:22:03,323 --> 00:22:08,195
それでも 深度データは
非常に役に立つものです

307
00:22:10,330 --> 00:22:13,934
最後に穴についてもう１つ

308
00:22:14,034 --> 00:22:16,803
TrueDepthカメラを使う場合

309
00:22:16,904 --> 00:22:20,674
光の投影により
物体が後ろになることがあり

310
00:22:20,774 --> 00:22:24,745
プロジェクターとカメラの
視差で影ができるのです

311
00:22:25,846 --> 00:22:28,982
このコップの右側を
見てください

312
00:22:30,384 --> 00:22:35,556
深度マップではないのに
穴がありますね

313
00:22:36,957 --> 00:22:41,995
このストリーマでは
2Dから3Dへの変換が可能で

314
00:22:42,095 --> 00:22:44,131
ポイントクラウドで
見られます

315
00:22:44,231 --> 00:22:49,303
ポイントクラウドでは
遠近感を変えることができ

316
00:22:50,737 --> 00:22:53,941
それにより穴が
大きくなります

317
00:22:56,376 --> 00:23:00,480
コップの中味の量は
分かりますか？

318
00:22:56,376 --> 00:23:00,480
コップの中味の量は
分かりますか？

319
00:23:01,415 --> 00:23:04,351
分かりませんよね

320
00:23:05,185 --> 00:23:10,057
多機能なTrueDepthカメラは
バーチャルで視点を変えられても

321
00:23:10,290 --> 00:23:12,859
新情報は加えられません

322
00:23:12,960 --> 00:23:16,463
コップに当たる
光は曲げられないのです

323
00:23:17,998 --> 00:23:19,266
デモをしましょう

324
00:23:21,301 --> 00:23:25,305
（拍手）

325
00:23:31,278 --> 00:23:35,415
まず映像の
この角を見てください

326
00:23:35,516 --> 00:23:38,919
カメラに額を近づけます

327
00:23:39,019 --> 00:23:41,588
深度データが確認できます

328
00:23:41,688 --> 00:23:45,592
iPhoneを動かすと
変わりますね

329
00:23:45,692 --> 00:23:48,262
こうする理由は

330
00:23:48,362 --> 00:23:51,932
TrueDepthカメラからも
見られ

331
00:23:52,032 --> 00:23:55,769
映像でも見えることを
見せるためです

332
00:23:57,137 --> 00:24:00,174
このライブ映像は30fpsです

333
00:23:57,137 --> 00:24:00,174
このライブ映像は30fpsです

334
00:24:00,274 --> 00:24:04,745
フィルタストリームにすると
穴は消えます

335
00:24:06,079 --> 00:24:10,417
ポインドクラウドで見ると
視点を自由に―

336
00:24:11,752 --> 00:24:13,821
変えることができます

337
00:24:14,121 --> 00:24:16,957
画面をまっすぐに見ていても

338
00:24:17,224 --> 00:24:20,260
上から見られているようです

339
00:24:21,195 --> 00:24:24,731
ポイントクラウドと呼ぶ理由は

340
00:24:24,832 --> 00:24:28,469
3Dでポイントが
見られるからです

341
00:24:29,636 --> 00:24:34,308
WWDCで皆さんに会えるのは
夢だったので

342
00:24:34,408 --> 00:24:36,777
普通の視野に戻します

343
00:24:38,245 --> 00:24:43,884
（拍手）

344
00:24:44,651 --> 00:24:47,187
以上が
ポイントクラウドでした

345
00:24:48,222 --> 00:24:51,592
我々は深度マップから
始めました

346
00:24:51,692 --> 00:24:57,464
深度マップの2D画像は
ピクセル座標のUVで表され

347
00:24:58,365 --> 00:25:03,771
それを新たにXYZという
座標系に変えたいのです

348
00:24:58,365 --> 00:25:03,771
それを新たにXYZという
座標系に変えたいのです

349
00:25:04,204 --> 00:25:09,943
深度マップのZはあるので
あとはXとYです

350
00:25:10,043 --> 00:25:15,315
そのためには
内部パラメータ行列が必要です

351
00:25:15,415 --> 00:25:18,719
焦点と主点情報を
得るためです

352
00:25:19,219 --> 00:25:23,690
Xが欲しい場合
ピクセル座標のUから始め

353
00:25:23,791 --> 00:25:29,029
主点を抽出し　深度を掛け
焦点距離で割ります

354
00:25:29,129 --> 00:25:32,299
他の次元でも
同じことをします

355
00:25:33,100 --> 00:25:36,737
内部パラメータ行列には

356
00:25:36,837 --> 00:25:39,573
キャリブレーションデータが
必要です

357
00:25:41,108 --> 00:25:47,314
TrueDepthストリームの
全フレームで行われます

358
00:25:47,414 --> 00:25:51,018
映像ストリームと
深度ストリームは

359
00:25:51,118 --> 00:25:54,788
２つのカメラから
来ているからです

360
00:25:55,556 --> 00:26:00,627
深度マップは
ポイントクラウドに変換でき

361
00:25:55,556 --> 00:26:00,627
深度マップは
ポイントクラウドに変換でき

362
00:26:00,727 --> 00:26:05,332
そこにRGB画像を
再投影させるのです

363
00:26:05,866 --> 00:26:10,971
深度ストリームはすでに
映像ストリームにあるため

364
00:26:11,071 --> 00:26:14,107
RGBDデータに
なるということです

365
00:26:14,274 --> 00:26:15,375
（口笛）

366
00:26:15,475 --> 00:26:17,377
ありがとうございます

367
00:26:17,478 --> 00:26:18,912
すごいですよね

368
00:26:19,913 --> 00:26:24,051
これはMetalの
シェーダで行われます

369
00:26:24,151 --> 00:26:28,889
ダウンロードすれば
２ヵ所に焦点が合います

370
00:26:30,424 --> 00:26:33,293
頂点シェーダで
頂点の集合を制御し

371
00:26:33,393 --> 00:26:38,499
深度マップを使って
3D座標に変換してから

372
00:26:39,032 --> 00:26:44,071
ビュー行列で位置を
変えることもできます

373
00:26:47,141 --> 00:26:51,044
フラグメントシェーダは
頂点シェーダを得て

374
00:26:51,345 --> 00:26:55,716
実際の値なのか
深度マップの穴かを判断し

375
00:26:55,816 --> 00:26:59,553
穴の場合は
深度は分からないため

376
00:26:59,653 --> 00:27:04,324
3Dには変換できず
その部分を除きます

377
00:26:59,653 --> 00:27:04,324
3Dには変換できず
その部分を除きます

378
00:27:05,058 --> 00:27:08,462
実際の値なら
RGBテクスチャを参照し

379
00:27:08,829 --> 00:27:12,032
その部分や点に色を加えます

380
00:27:14,701 --> 00:27:20,407
技術的な話が続きましたが
様々な分野の方々のために

381
00:27:21,375 --> 00:27:23,610
アプリケーションを紹介します

382
00:27:23,710 --> 00:27:25,946
背景を変えるものです

383
00:27:26,613 --> 00:27:27,915
お見せします

384
00:27:37,958 --> 00:27:39,193
始めましょう

385
00:27:40,994 --> 00:27:43,730
私はヨセミテにいます

386
00:27:43,831 --> 00:27:47,968
スワイプして
抽象的な背景を選べます

387
00:27:49,536 --> 00:27:52,740
アリゾナ州の
アンテロープキャニオン

388
00:27:52,840 --> 00:27:56,610
前回は行くのに
15時間かかりましたが

389
00:27:56,710 --> 00:27:58,378
今回はガソリン代節約

390
00:27:59,346 --> 00:28:03,650
これを使えば
宇宙にも飛び出せます

391
00:27:59,346 --> 00:28:03,650
これを使えば
宇宙にも飛び出せます

392
00:28:03,750 --> 00:28:06,386
ここでは技術的な話はなし

393
00:28:10,958 --> 00:28:15,329
（拍手）

394
00:28:15,529 --> 00:28:17,197
作り方は？

395
00:28:19,066 --> 00:28:22,903
映像アプリケーションを
扱う時は

396
00:28:23,237 --> 00:28:26,573
フレームベースで考えます

397
00:28:26,807 --> 00:28:29,643
まずは顔を認識させ

398
00:28:30,677 --> 00:28:33,781
深度マップから
新しいマスクを作り

399
00:28:33,881 --> 00:28:37,584
RGBに結果を反映させます

400
00:28:37,684 --> 00:28:43,223
前景マスクをアップスケールし
背景を少し暗くし

401
00:28:43,323 --> 00:28:45,859
両者を合成します

402
00:28:46,460 --> 00:28:50,998
その際 面倒なことを
省略できます

403
00:28:52,132 --> 00:28:57,304
背景をロードする際
RGBのサイズ合わせは一度だけ

404
00:28:57,404 --> 00:29:00,807
フレームごとには
必要ありません

405
00:28:57,404 --> 00:29:00,807
フレームごとには
必要ありません

406
00:29:01,041 --> 00:29:05,145
それで
大きな成果が得られます

407
00:29:06,113 --> 00:29:08,215
深度データにいきましょう

408
00:29:08,315 --> 00:29:12,085
まず顔の中央を見極めます

409
00:29:12,186 --> 00:29:17,791
iOSには顔のメタデータを得る
様々な方法があります

410
00:29:18,025 --> 00:29:21,795
Core Image detector
Vision Frameworkなどです

411
00:29:21,895 --> 00:29:25,833
しかし
顔の中心が知りたい場合

412
00:29:25,933 --> 00:29:29,336
AVMetadataObjectの
faceを使います

413
00:29:30,304 --> 00:29:34,842
これでRGB画像の中央は
分かりますが

414
00:29:34,942 --> 00:29:39,446
深度マップの中央も
知る必要があります

415
00:29:41,515 --> 00:29:45,719
顔の深度の値が判明したら

416
00:29:45,819 --> 00:29:51,058
しきい値を顔の深度＋25センチに
設定し

417
00:29:51,158 --> 00:29:55,963
マスクの前景を１
背景を０とします

418
00:29:56,430 --> 00:30:00,801
これでも十分ですが
バイナリマスクも使えます

419
00:29:56,430 --> 00:30:00,801
これでも十分ですが
バイナリマスクも使えます

420
00:30:00,901 --> 00:30:05,038
背景と前景の境が
鮮明になりましたが

421
00:30:05,839 --> 00:30:08,308
まだチラチラして見えます

422
00:30:09,276 --> 00:30:11,378
少し処理しましょう

423
00:30:11,712 --> 00:30:15,916
まず背景と前景の境を
スムーズにするため

424
00:30:16,016 --> 00:30:18,285
ブラーガウスでぼかしました

425
00:30:18,519 --> 00:30:23,524
ブラーガウスの範囲が
移行の度合いを決めます

426
00:30:23,624 --> 00:30:27,294
違う効果も試せますよ

427
00:30:29,296 --> 00:30:32,766
次はガンマ調節を行います

428
00:30:33,300 --> 00:30:37,137
背景と前景を
自然に移行させるためです

429
00:30:37,237 --> 00:30:43,477
ガンマ値を１以上にすると
前景のマスクが狭くなり

430
00:30:44,044 --> 00:30:49,783
１より小さくすると
前景のマスクが大きくなり

431
00:30:50,050 --> 00:30:51,552
オーラも出ます

432
00:30:52,219 --> 00:30:57,458
２つのパラメータの合成で
違う効果を得られます

433
00:30:58,225 --> 00:31:02,563
ぼかしの範囲と
ガンマ値を高くすると

434
00:30:58,225 --> 00:31:02,563
ぼかしの範囲と
ガンマ値を高くすると

435
00:31:02,663 --> 00:31:05,666
移行部分が透明になります

436
00:31:05,766 --> 00:31:09,069
宇宙でのホログラムのようです

437
00:31:09,436 --> 00:31:11,839
海中にも見えますね

438
00:31:12,372 --> 00:31:15,342
値を変えると違う効果も

439
00:31:15,442 --> 00:31:20,247
ぼかしを強くし
ガンマ値を非常に低くすると

440
00:31:20,347 --> 00:31:23,150
頭に後光が射します

441
00:31:23,250 --> 00:31:25,919
色々と試してみてください

442
00:31:27,387 --> 00:31:28,989
どう実装しますか？

443
00:31:31,225 --> 00:31:33,760
Core Imageは単純です

444
00:31:33,861 --> 00:31:36,597
３つのフィルタを
順につなげ

445
00:31:36,697 --> 00:31:41,802
ブラーガラスでぼかし
ガンマ値を調整します

446
00:31:42,469 --> 00:31:45,539
そしてRGBを
アップスケールします

447
00:31:46,507 --> 00:31:51,011
ベストプラクティスのため
注意点があります

448
00:31:51,945 --> 00:31:57,084
ブラーガウスのような
畳み込み操作をする際には―

449
00:31:57,184 --> 00:32:01,288
まず clampedToExtentから
始めてください

450
00:31:57,184 --> 00:32:01,288
まず clampedToExtentから
始めてください

451
00:32:01,722 --> 00:32:04,558
ピクセルを広げていくことで

452
00:32:05,159 --> 00:32:09,730
次第に境界の部分を
正しく処理できます

453
00:32:10,964 --> 00:32:14,902
さらにフィルタで
アップスケールする前に

454
00:32:15,002 --> 00:32:18,605
初期状態に戻すことを
お勧めします

455
00:32:18,705 --> 00:32:21,909
その映像が
何より大切だからです

456
00:32:23,777 --> 00:32:27,347
その後 Matteを
前景に取り込むと

457
00:32:27,448 --> 00:32:31,518
背景や前景に様々な
効果を与えられます

458
00:32:31,618 --> 00:32:33,921
前半で紹介した―

459
00:32:35,122 --> 00:32:36,523
Backdropでは―

460
00:32:37,758 --> 00:32:43,730
RGBとロードした背景を
Core Imageで出せます

461
00:32:43,831 --> 00:32:47,234
TrueDepthカメラの
Matteを使って

462
00:32:47,334 --> 00:32:50,704
背景に様々な効果が
与えられます

463
00:32:54,141 --> 00:32:57,544
TrueDepthカメラは

464
00:32:57,911 --> 00:33:03,317
30fpsで深度マップ
640X480の結果を得られ

465
00:32:57,911 --> 00:33:03,317
30fpsで深度マップ
640X480の結果を得られ

466
00:33:03,417 --> 00:33:06,520
映像ストリームに
登録されています

467
00:33:07,221 --> 00:33:12,326
ポイントクラウドを作ったり
背景を変えたり

468
00:33:14,328 --> 00:33:18,832
深度フィルタで
様々な映像効果も出せます

469
00:33:21,235 --> 00:33:26,740
Jupiter Notebookの
TrueDepthStreamerと

470
00:33:27,708 --> 00:33:29,109
Backdropを
ダウンロードしてください

471
00:33:29,276 --> 00:33:32,846
新たな
すばらしい映像製作のため

472
00:33:32,946 --> 00:33:38,185
皆さんに刺激を
与えられたとしたら幸いです

473
00:33:39,586 --> 00:33:44,024
AVCaptureラボにも
遊びにきてください

474
00:33:44,124 --> 00:33:45,959
（拍手）