DCCツールを用いた広色域テクスチャワークフロー

CEDEC2023の講演資料です。

講演タイトル：DCCツールを用いた広色域テクスチャワークフロー
講演者：多田　航、鈴木　雅幸、山口　翔平

セッションの内容：
Substance PainterなどのDCCツールを用いて、アーティストがRec2020などの広色域テクスチャを作成する手法を解説します。
具体的にはWindowsのディスプレイ設定やDCCツールでのOpenColorIO設定の解説となります。

これにより、sRGB色域外のマテリアルを表現できる他、テクスチャからレンダーターゲットまで描画パイプラインをRec2020で統一する事が出来ます。
また、広色域テクスチャを扱う時に考慮するべき物体色の限界についても解説します。

1. DCCツールを用いた広色域テクスチャワークフロー 株式会社バンダイナムコスタジオ 多田 航 鈴木 雅幸 山口 翔平
2. 自己紹介 主に関わったタイトル ・ACE COMBAT6 ・ACE COMBAT ASSAULT HORIZON ・テイルズ オブ カードエボルブ ・アイドルマスター ミリオンライブ！ ・ポッ拳 ・New ポケモンスナップ 多田 航 Wataru Tada 過去の講演 ・CEDEC2011 ACE COMBAT ASSAULT HORIZONにおける継続的インテグレーション ・CEDEC2011 「エースコンバット アサルト・ホライゾン」インゲームカメラ制作事例 ・CEDEC2015 ポッ拳におけるゲームエディタの設計と実装 ・CEDEC2019 家庭用ゲーム開発におけるゲームエディタの基礎設計と、安定かつ高速なアセット管理について ・CEDEC2019 DirectX Raytracingを用いたライトベイカーの実装について ・CEDEC2021 『New ポケモンスナップ』におけるライティング ・CEDEC2022 MaterialXとStandard Surfaceのゲームグラフィックスへの応用について など 主に関わったタイトル ・New ポケモンスナップ 山口 翔平 Shohei Yamaguchi 過去の講演 ・CEDEC2020 信頼性の高いHDRI作成術 ・CEDEC2021 『New ポケモンスナップ』におけるライティング 鈴木 雅幸 Masayuki Suzuki 過去の講演 ・CEDEC2008 リニア空間と物理的に正しいライティング ・CEDEC2019 『大乱闘スマッシュブラザーズ SPECIAL』～お借りしたIPをできるだけ綺麗に描くために ・CEDEC2020 信頼性の高いHDRI作成術 ・CEDEC2021 レイトレ時代のゲームグラフィックス、地に足をつけて備えよう - NVIDIA Falcor で次世代品質 のリアルタイム物理ベース照明を手軽に素早く検証する - ・CEDEC2021 『New ポケモンスナップ』におけるライティング ・CEDEC2022 MaterialXとStandard Surfaceのゲームグラフィックスへの応用について キャラモデリング、モーション、背景、 ライティングアーティスト、シェーダー アーティストを経て、現在はTAとして グラフィックに関する研究や各プロジェ クトのサポート業務を行っています。
3. アジェンダ • 基礎知識 • 実装方法 • DCCツールとOCIO • 色域とモニタ • データデバッグ
4. 基礎知識
5. 色域とは • 表現できる色の彩度の領域を表すもの • モニタやプロジェクタのRGB三原色の規格だと三角形になる
6. sRGB いつもの色域 • 我々にとって最も馴染み深い色域がsRGB
7. 広色域とは • sRGBよりも高彩度を表現することが出来る色域 → 色度図の三角形がsRGBより大きい • 例としてACES, AdobeRGB, DCI-P3, Rec.2020など • 今回のワークフローではRec.2020を使う
8. 広色域だと何が良い？ • 高彩度の表現幅が広がる • グレーディングで調整できる幅が広がる sRGBとRec.2020の彩度の差 Rec.2020 sRGB グレーディングの結果の差 Rec.2020 sRGB
9. 広色域な画像の見え方 • sRGB色域とRec.2020色域の画像を表示すると… • sRGB色域の方が高彩度に、Rec.2020色域画像の方が低彩度に 見える • これは何も処理をせずにそのまま表示した場合 • 正しくカラーマネジメントを行うと同じ色に見える sRGB Rec.2020 sRGB Rec.2020
10. sRGBモニタ Rec.2020モニタ(SDR) ⬆ sRGB画像 ※移動しているのはRec.2020画像
11. ピクセル値と色 • (1.0, 0.0, 0.0)と(1.0, 0.0, 0.0)だとどちらが彩度が高いか？ • → 正解は分からない 同じかもしれないし、違うかもしれない • なぜか？ • → 色空間の指定が無いから • Rec.2020の(1.0, 0.0, 0.0)とsRGBの(1.0, 0.0, 0.0)だとRec.2020 の方が彩度が高い • つまりピクセル値は色空間とセットになって初めて色が決まる • 「そんなことは気にしたことが無い！」と思われるだろうが、 それはこれまでsRGBでしか作業をしてこなかったから
12. ピクセル値と色 • 色空間とピクセル値をセットで考えると… • sRGBの(1.0, 0.0, 0.0)とRec.2020の(0.627, 0.069, 0.016)は同じ色
13. 色空間の説明
14. sRGB Rec.2020 RGB_to_XYZ ・立方体がRGB空間 ・点群が物体の色 ・ XYZに変形することで0-1に収める ・XYZ空間が絶対座標で、 RGB空間は相対座標をイメージ ・XYZは保存用または変換のハブの用途な ので直に描くには直感的ではない ・Yが明るさを表しているのが特徴 ※Rec.2020では物体色のはみ出る量が少なく、 XYZへの変形量も小さい
15. sRGB Rec.2020 XYZ_to_xyz ・XYZそれぞれの比率がxyz。 x,y,zを足して1になるようになっている ・xy色度図はこれを上から見たもの
16. sRGB Rec.2020 xyz_to_xyY ・xy色度図に対して高さ方向に 明るさYを利用 ※xy色度図は人の感覚とは違うので色域の広さを感覚 的に表すのには向いていない 緑の座標は大きな変化をしないと違いを感じないが、 青の座標は少しの変化で違いを感じる 補足資料のu’v’色度図とLABを参照
17. sRGB色域外はどのようなものが在るのか
18. sRGB色域外を実際に計測 • 色彩輝度計で計測してsRGB色域外か確認する • カメラではRAW撮影し、カメラネイティブの色域からsRGB色 域外かを判定する （色の再現性はそこまで正確ではない）
19. sRGB色域外を実際に計測 コニカミノルタ 色彩輝度計 CS-150 α7R III 現像設定 • WバランスはD65が白になるような設定 • カメラネイティブの色域でニュートラルに現像 • 色域判定時にカメラマトリクスも適用
20. sRGB色域外を実際に計測 sRGB
21. sRGB色域外を実際に計測 Rec.2020
22. sRGB色域外を実際に計測 sRGB
23. sRGB色域外を撮影で確認
24. sRGB色域外を撮影で確認
25. sRGB色域外を撮影で確認
26. sRGB色域外を撮影で確認
27. sRGB色域外を撮影で確認
28. sRGB色域外を撮影で確認
29. sRGB色域外はどのようなものが在るのか まとめ • 計測器で調べられる • カメラでもある程度は分かる • ライティングも加味された結果である • 植物の花や葉、標識、発光系の看板等はそれなりに色域外がある • Rec.2020ではほぼ収まる
30. 狭い色域でのレンダリングと写真との違い
31. 狭い色域でのレンダリングと写真との違い • ポスト処理等に影響する • 高輝度の色やブルームの色の違い • ホワイトバランスの違い • 理由 • 色域が狭いと高彩度のピクセルはチャンネルが0になったり小さくなり 余裕がない 一方カメラでは色域が広い状態で処理されその後に表示空間に変換
32. 高輝度の色の違い • sRGBの色域で露光調整をすると飽和する明るい部分に違和感 •周辺や中心も原色の緑 •中心のほうが値が大きいので間違っていない。 •HDRモニタで見れば違和感は無いがSDRだと違和感
33. 高輝度の色の違い • sRGBの色域で露光調整をすると飽和する明るい部分に違和感 • カメラで撮影したもの（リニア現像） •周辺や中心も原色の緑 •中心のほうが値が大きいので間違っていない。 •HDRモニタで見れば違和感は無いがSDRだと違和感 •中心は白に遷移 •カメラは広色域なので全チャンネルが刺激を受け易い •なので明るいと白くなる •その後にsRGBの色域にしても白いものは白い
34. HDRの写真を使って検証 ブラケット撮影をしてカメラ色域のままHDR化 使用した発光色 高輝度の色の違い
35. カメラ色域のHDR画像をsRGBに変換 写真（リニア現像） 高輝度の色の違い
36. HDRをカメラ色域のままSDRでクランプしてからsRGBに変換 写真（リニア現像） 高輝度の色の違い
37. 高輝度の色の違い
38. camera space R G B 0.99 3.53 1.20 sRGB space R G B 0.95 1.02 1 camera space R G B 0.99 1 1 sRGB space R G B 0 5.06 0 高輝度の色の違い •左がsRGBにそのまま変換 •右がカメラ色域でクランプしてから変換 実際にはモニタのターゲット輝度によって ソフトクリップするのが良い
39. ホワイトバランスの違い x y 0.685481, 0.314148 0.437236, 0.518884 0.185182, 0.723421 0.159008, 0.361109 0.13555, 0.0514863 0.30236, 0.13068 高彩度のライトを実際に当ててホワイトバランスを取る実験
40. ホワイトバランスの違い • カメラ色域は高彩度でも問題なくWBが取れる カメラ色域のまま現像
41. ホワイトバランスの違い • カメラ色域は高彩度でも問題なくWBが取れる カメラ色域のまま現像 カメラ色域の状態でホワイトバランスを合わせsRGB色域に変換 カラーチェッカーの色が違うのは高彩度ライトの演色性等の問題で合わないがレンダリングの場合は問題無いはず
42. ホワイトバランスの違い • sRGB色域は広いので高彩度は0のチャンネルが出来てしまう sRGB色域で現像
43. ホワイトバランスの違い • sRGB色域は狭いので高彩度は0のチャンネルが出来てしまう sRGB色域で現像 ホワイトバランスを合わせたいが0値は復元できない
44. 狭い色域でのレンダリングと写真との違い まとめ • 写真は内部的には広い色域でありその状態で処理されることが多い • 写真は広色域なので高輝度は白くなりやすい（HDR撮影は除く） • 低色域でポスト処理等をすると低色域出力だとしてもカメラの見た 目とは違ってしまう ※色域関係なしに彩度を下げてから処理して再度を元に戻すだけでもありかも
45. 物体色について
46. 物体色について 物体色Diffuse Albedo(base color)も高彩度なものはsRGB色域外に なることがあり、 特にスペキュラを除去した物体色は彩度が上がりやすい
47. スペキュラ除去したカラーチェッカー カラーチェッカーのスペキュラを除去するテストを行った 偏光フィルタと色彩輝度計を使用した スペキュラ除去する場合はライトに偏光フィルムを付け計測器にはカメラ用 の偏光フィルタを付けて計測した ライトは45度から当て正面から計測する 偏光を使わない場合はno22が反射率0.19(8bit値121)になるように調整 →(詳細は BNS_CEDEC2020_信頼性の高いHDRI作成術 p153) 偏光を使わない場合はno22が反射率0.138(8bit値104)になるように調整した ※反射率0.138(8bit値104)について 紙を裏から光を当て無偏光の拡散の透過を撮影叉は計測し偏光フィルタ の減光を調べ、通常の撮影と比較し推測している ※偏光を使ってスペキュラを除去できる測色計があるようなのでそれを使う 方が正確（測定照明条件M3）
48. カラーチェッカー sRGB色域外は1個 スペキュラ除外したカラーチェッカー sRGB色域外は6個に増えた 116 83 69 194 147 127 92 119 155 92 107 65 128 126 173 97 186 169 220 124 47 69 92 171 194 86 97 89 57 102 163 189 65 222 156 39 35 64 147 70 146 70 169 60 57 233 196 19 184 86 148 0 132 163 241 239 234 197 198 198 159 160 161 121 121 121 83 84 85 51 50 51 102 60 39 185 133 109 71 103 142 72 91 38 117 114 163 79 179 161 216 112 0 45 81 163 187 67 81 75 35 88 155 180 41 222 150 0 0 37 137 44 137 43 161 0 15 233 190 0 179 64 135 0 120 155 241 238 232 193 194 192 151 151 151 104 104 104 59 62 62 9 16 15 スペキュラ除去したカラーチェッカー
49. カラーチェッカー スペキュラ除外したカラーチェッカー カラーチェッカー 色域外判定（シアン） カラーチェッカー 色域外判定（シアン） スペキュラ除去したカラーチェッカー
50. スペキュラ除外したテクスチャ arnoldでレンダリング スペキュラ効果無効（参考） カラーチェッカーをレンダリング レンダリング結果 スペキュラ除外したテクスチャは濃いが スペキュラが乗るので自然になる ※今回はsRGB色域のテクスチャなので彩度が足りないことに注意 本当はRec.2020で持たせるほうが良い
51. スペキュラ除外していないテクスチャ arnoldでレンダリング カラーチェッカーをレンダリング レンダリング結果 これを使うとスペキュラが2重に乗って しまうので明るくなってしまう
52. その他スペキュラ除去したテクスチャの例1 除去前
53. 除去後 その他スペキュラ除去したテクスチャの例1
54. 除去後 その他スペキュラ除去したテクスチャの例1 スペキュラ除去したことによってsRGB色域外になった例
55. 除去前 その他スペキュラ除去したテクスチャの例2
56. 除去後 その他スペキュラ除去したテクスチャの例2
57. 除去後 その他スペキュラ除去したテクスチャの例2 スペキュラ除去したことによってsRGB色域外になった例
58. 除去前 その他スペキュラ除去したテクスチャの例3
59. 除去後 その他スペキュラ除去したテクスチャの例3
60. 除去後 その他スペキュラ除去したテクスチャの例3 スペキュラ除去したことによってsRGB色域外になった例
61. 拡散透過もスペキュラ成分が無いので色が濃いテクスチャになる 拡散透過テクスチャの例 拡散反射（スペキュラ除去） 拡散透過（スペキュラは入らない）
62. 拡散透過テクスチャの例 拡散透過によってsRGB色域外になった例
63. MacAdam limit 物体色の境界のMacAdam limit やマンセル表色系について
64. xyY色度上のMacAdam limit 拡散反射の色の理論的な範囲を表している 白い光の波長すべてを反射すれば白といった具合 高さの軸はY(輝度)を表している MacAdam limit MacAdam limitとは物体色として再現できる理論的な範囲のこと
65. 求め方 可視光の波長の一部だけが吐出したり切り立った反射が一番外側の色になる。 その幅を変えたものを反射波長としてxyYとしてプロットしていく。 ※この動画では分かりやすいように反射特性だけでをプロットしているが、 実際にはD65の波長分布をさらに掛け合わせてからxyYにプロットする MacAdam limit 左の各反射波長に対してXYZ等色関数をかけ合わせればXYZ値が出るので それをxyYに変換してプロットする
66. MacAdam limitと色域 sRGBとRec.2020で表せるDiffuseAlbedoを重ねた sRGB : カバーてきていない領域が多い Rec.2020 : カバー範囲は大きいが超えてしまう部分あり
67. マンセル表色系 - Wikipedia マンセル表色系とsRGB色域 • 色相、明度、彩度を人間が等間隔で感じられるように分割したもの • 物体色の端まで定義されているが色見本としては再現できるところまで
68. マンセル表色系とsRGB色域 • マンセル表色系をxyYにプロット 以下のreal.datを使用 https://www.rit.edu/science/munsell-color-science-lab-educational-resources real.datはIlluminant CなのでBradford methodでD65に変換してプロット
69. マンセル表色系とsRGB色域 • sRGB領域を重ねた
70. マンセル表色系とsRGB色域 • Rec.2020領域を重ねた
71. 広色域の注意点 広色域では物体色を簡単に超えてしまう • 例えばRec.2020でRGB(0.8,0,0)と入れると物体色をはみ出てしまう • 一方RGB(0.8,0.8,0.8) は問題ない • sRGB色域ではこういったことは起きない sRGB原色 Rec.2020原色 Rec.2020の原色をdiffuseにすると物体色を超える Rec.2020でレンダリングしてRec.2020のHDRモニタで表示した写真をRec.2020色域で現像 ※Rec.2020のHDRモニタで確認するとRec.2020の原色のマテリアルは 発光しているように見えてしまう
72. 物体色について まとめ • Diffuse Albedoはスペキュラ除去する必要がある • スペキュラ除去したDiffuse Albedoは高彩度になりやすい • 拡散反射の色の範囲は基本的にはMacAdam limit 内である • 広色域で直にテクスチャを描くと物体色を超える恐れがある
73. 蛍光について
74. 蛍光について • ある波長を吸収しそれよりも長い波長を放射する • 青を吸収し緑に放射したり目に見えない紫外線を吸収し青を放射したりする • 彩度や明度が高いため物体色を超えることも可能 • 蛍光成分は入射光に比例した強度で発光するのでDiffuse Albedoとみなせる？
75. 蛍光について 白い机の上に蛍光素材を置いた写真 R G B 赤チャンネルでは白い机よりもかなり明るいものがある
76. 測色計について Nix Spectro 2 https://www.nixsensor.com/nix-spectro/ 測色計で蛍光素材の色を計ってみる • 分光測色計 (10nm sstep) • 蛍光色を測色する場合は、測定照明条件M1を使用 (紫外線含む)
77. yellow orange pink green blue R G B R G B R G B R G B R G B XYZ 0.775 1.088 0.120 XYZ 1.005 0.667 0.047 XYZ 0.821 0.441 0.557 XYZ 0.221 0.538 0.104 XYZ 0.213 0.315 0.749 sRGB 0.780 1.294 -0.052 sRGB 2.208 0.279 -0.031 sRGB 1.704 0.055 0.545 sRGB -0.165 0.800 0.013 sRGB -0.167 0.416 0.739 Rec.2020 0.913 1.243 0.080 Rec.2020 1.476 0.409 0.033 Rec.2020 1.111 0.175 0.521 Rec.2020 0.161 0.725 0.079 Rec.2020 0.064 0.379 0.695 蛍光ペンの計測 Rec.2020は反射率を100%以上持たせれば色域内に収まる sRGBでは反射率を100％以上持たせたとしてもマイナスがある部分は彩度が足りないといういことになる 白い紙に蛍光ペンを塗って計測
78. 蛍光ペンの計測 sRGB Rec.2020 物体色 平面では分からない • 蛍光と色域の関係 物体色から3個はみ出ていた。 sRGBでは一つも収まらない
79. 蛍光の見え方は光源でかなり違う 実際の蛍光素材の見え方はライトの演色性の違いや紫外線量の違いによる影響が大きい もしもDiffuse Albedoとして使用する場合は演色性の良いライト且つ紫外線量もD光源と同等であ ると定義すれば見え方は同じになると考えてよい 以下は日向と日陰の写真だが日影の方が黄色やオレンジの蛍光はかなり目立っている 青空の光は占める青や紫外線の量が多い（太陽が遮蔽されても青や紫外線は残りやすい） 日向 日影（青空）
80. R G B 日 向 日 影 ( 青 空 ) 蛍光の見え方は光源でかなり違う 青空光ではRチャンネルでみると光が弱いにもかかわらずオレンジとピンクは強く反応 Gチャンネルでは黄色が強めに反応している
81. Diffuse Albedo IBL 平行光源 レンダリングスペース等の設定 今 ま で の ワ ー ク フ ロ ー 広 色 域 ワ ー ク フ ロ ー 蛍光をレンダリング 通常のsRGB色域フローとの主な違いを示した • Diffuse Albedoは1以上の値が必要なためEXRで用意した • ライトの値もRec.2020の値 • レンダリング色域もRec.2020にする • 表示はsRGBにした（Rec.2020のモニタで見るのなら表示はRec.2020） • 広色域ワークフローでレンダリングで行った ※実はこの白い紙のプリント紙の青は8bit255超えている。 白い紙は蛍光増白剤が含まれてることが多い
82. 蛍光をレンダリング レンダリング 日向 写真 日向 レンダリング 日陰 写真 日陰 測色計の値は紫外線含むD光源なので日向の見え方は相性が良く同じように見える 日影の場合は青色や紫外線の量が多いためレンダリング結果は実写程は蛍光が目立っていない
83. 蛍光について まとめ • 蛍光は高彩度になる • 蛍光は物体色を超えることが有る • 蛍光もDiffuse Albedoとして考えてよさそう（最初の反射だけ） ただしすべての照明下での蛍光を再現できるわけではない
84. 実装方法
85. 広色域テクスチャの適用例 • 広色域テクスチャの適用箇所としてHDRアプリケーション(HDR対 応ゲーム)が挙げられる • HDRアプリケーションの色域はRec.2020となっているため、色域を 最大限活用するにはレンダリングをRec.2020で行い、その後モニタ に合わせて色域変換を行う →Rec.2020でのレンダリングでは広色域テクスチャが効果を発揮する レンダリング (ライティング、ポストエフェクト...) HDRモニタ SDRモニタ 色域変換 Rec.2020色域 sRGB色域
86. テクスチャの色域について レンダリング(Rec.2020) • Rec.2020色域でのレンダリングにて、テクスチャをsRGB色域 で用意した場合、オフラインまたはシェーダー内部で色域変換 を行っていた 色域変換 シェーダーコード例 テクスチャ(sRGB) テクスチャ(Rec.2020)
87. 色域変換による制限 • sRGB色域はRec.2020色域よりも狭い色域なので、 sRGBテクス チャをRec.2020テクスチャに変換すると、テクスチャの値が制限さ れてしまう 色域変換例 sRGB (1,0,0) → Rec.2020 (0.6274,0.0691,0.0164) • PBRではBaseColorテクスチャは拡散反射の反射率として扱われて いるので、 BaseColorテクスチャをsRGBからRec.2020へ色域変換 した場合、反射率が制限されることになる →反射率が高いマテリアルを表現出来ない sRGBテクスチャでは表現できないマテリアル
88. sRGBテクスチャでは表現できないマテリアル • 緑色の紙コップを切ってモニタに貼り、Photoshopで紙の色を再現出来るかどうか検証した • モニタがsRGB色域の場合、紙の緑色が再現出来なかったが、モニタの色域をRec.2020に設 定すると、紙の緑色を再現できた →緑色の紙はsRGBでは表現できないマテリアルとなる モニタをsRGB色域に設定してカメラで撮影 紙とモニタの色が合っていない モニタをRec.2020色域に設定してカメラで撮影 紙とモニタの色が合っている 緑色の紙コップ ※当てている照明がD65ではなくて室内の蛍光灯なのでアルベドとしての正しい色ではないので注意 ※参考として測色計の色
89. Rec.2020テクスチャを用意する レンダリング(Rec.2020) • 色域変換による制限を避けるにはsRGBからRec.2020への色域 変換を行わずに、Rec.2020テクスチャを作成する必要がある テクスチャ(Rec.2020) 広色域画像 DCCツール
90. Rec.2020テクスチャの作成方法 • フォトグラメトリやHDRIなど、カメラで撮影した画像からテ クスチャを作成する場合、カメラの色域はRec.2020よりも広い ので、色域変換によってRec.2020テクスチャを作成できる カメラで撮影した画像 Rec.2020テクスチャ 色域変換
91. Rec.2020テクスチャの作成方法 • DCCツールを使ってRec.2020テクスチャを作成する場合は DCCツールのカラーマネジメントを設定して、Rec.2020テクス チャを出力する Rec.2020テクスチャ テクスチャ出力 DCCツール
92. テクスチャフォーマット Rec.2020色域 8bit png sRGB色域 8bit png • Rec.2020色域のテクスチャは8bitフォーマットでも使用できる • 色域が広がったからといってリッチな画像フォーマットを使わなくても良い
93. sRGBフラグについて • 人間の目は暗部に敏感に反応する • 8bitテクスチャの中で暗部の情報量を増やすため、テクスチャにはsRGBフラグが用意されて いる • sRGBフラグはGPUでリニア値に展開されるため高速に処理できる (DirectXでのDXGI_FORMAT_R8G8B8A8_UNORM_SRGB) • 8bit Rec.2020テクスチャも暗部の情報量を増やすためsRGBフラグをONにして使用する リニア値 sRGBフラグONのテクスチャに格納される値 リニア値 GPU処理 0 0.25 0.5 0.75 1.0 0 0.25 0.5 0.75 1.0 0 1.0 0.5371 0.7354 0.8808
94. 階調について • 8bitのRec.2020テクスチャはsRGBよりも色域が広いにも関わ らず8bitという情報量は変わっていないため、階調が不足する 可能性がある →グラデーションを描いたRec.2020色域の8bit pngを用意して検 証したところ、階調不足は問題にならないことが分かった (テクスチャのsRGBフラグはON) Rec.2020 8bit png sRGB 8bit png
95. sRGB Rec.2020 sRGBの8bitのグラデーションで比較した(ディザを無効にした256諧調のグラデーションを幅2048ピクセル) Rec.2020はsRGBのグラデーションを→ sRGBデガンマ → Rec.2020色域変換 → sRGBガンマエンコード → 8bit Rec.2020テクスチャとして保存 → sRGBデガンマ → sRGB色域変換 → sRGBガンマエンコード を表示 階調について sRGB Rec.2020 sRGB Rec.2020 sRGB Rec.2020 sRGB Rec.2020 sRGB Rec.2020 sRGB Rec.2020 普通に見る分には特に問題ないが 強調すると高彩度部分の諧調劣化が 分かる ディザが入れば目立ちづらい
96. DCCツールのRec.2020テクスチャ作成環境 • DCCツールでRec.2020テクスチャを作成する時に、プレビュー画面の 色域をRec.2020としてモニタに表示したい • WindowsのHDRアプリケーションは色域がRec.2020なので、DCC ツールがHDRアプリケーションとして作られている場合、プレビュー 画面の色域をRec.2020としてHDRモニタに表示できる →DCCツールがHDRアプリケーションかどうかを判別する HDRモニタ DCCツール
97. アプリケーションのHDR/SDR判別 • HDRモニタを使用して、Windowsの設定 > システム > ディスプレイから「HDRを使用する」 を有効にしておく • 設定 > システム > ディスプレイ > HDR を開く • 「SDR コンテンツの明るさ」のスライダーバーを動かした時に ウィンドウの明るさが変わらないアプリケーションはHDRアプリケーション、 ウィンドウの明るさが変わるアプリケーションはSDRアプリケーションとなる 「SDR コンテンツの明るさ」のスライダーバーを一番左に設定すると、モニタは80nit出力となる (Windowsのバージョンによっては「HDR/SDR 明るさのバランス」や「SDRコンテンツの表示」と表記されている) HDRビデオを表示したChrome(HDRアプリケーション) メモ帳(SDRアプリケーション)
98. DCCツールのHDR対応状況 • 「SDR コンテンツの明るさ」のスライダー操作によって、Substance Painterや MayaなどのDCCツールはSDRアプリケーションとして作成されていることが分かる →DCCツールのプレビュー画面の色域がRec.2020ではないので、モニタや外部ツール などのワークフローで対応する • SDRアプリケーションのDCCツールでRec.2020テクスチャを作成するため、カラー マネジメントが必要となる Kritaなど、OpenGLからDirectXへの変換レイヤーを使用してHDRアプリケーションとして作成されているDCCツールも存在する https://www.intel.com/content/dam/develop/external/us/en/documents/painting-with-light-krita.pdf Substance Painter Maya
99. DCCツールとOCIO
100. 広色域テクスチャの作成方法 • DCCツールがSDRアプリケーションだとしても… • OpenColorIO(OCIO)などでカラーマネージメントに対応してい れば • Rec.2020テクスチャが作成できる Rec.2020テクスチャ テクスチャ出力 Substance Painter
101. OpenColorIO(OCIO) • カラーマネジメントを行うライブラリや設定群 • githubで公開されている • 2021年1月にバージョン2.0.0がリリースされた (OpenColorIO v2) • Configファイルを記述することで、色域変換を定義することが できる • アーティストさんからするとDCCツール上のカラーマネジメン トシステムとして見える https://github.com/AcademySoftwareFoundation/OCIO
102. プリインストールOCIO Config • Substance PainterにはプリインストールされたOCIO Configが あり、プロジェクト設定から選択できる • C:¥Program Files¥Adobe¥Adobe Substance 3D Painter¥resources¥ocio • 各フォルダのconfig.ocioを読むと処理内容を把握できる フォルダ名 config.ocioの内容 substance sRGBをリニアライズするワークフロー aces_1.0.3 ACES AP1(ACEScg)が作業カラースペース aces_1.2
103. カスタムOCIO Configの読み込み • プロジェクト設定を開き以下の設定を行う • カラーマネジメントは「OpenColorIO」 • OpenColorIO 構成を「カスタム」にすることで独自の設定を行える
104. 従来のカラーマネジメント • プロジェクト設定でカラーマネジメントをLegacyとした状態 • sRGBを基準としたワークフローとなっていた sRGBテクスチャ読み込み 作業カラースペース (sRGB) sRGBテクスチャ書き出し Substance Painter内部と モニタの色域
105. OCIOを使ったカラーマネジメント • OCIO Configにより作業カラースペースと表示カラースペース を分けて制御することができる • 読み込み時、書き出し時も個別に制御できる ビットマップ読み込み カラースペース 書き出し時のカラースペース (sRGB/Rec.2020) 作業カラースペース (Linear/Rec.2020) 表示カラースペース (sRGB/sRGB) モニタの色域 Substance Painter内部の色域
106. カスタムOCIO Configの作成
107. プリインストールで解決しないこと 1. Rec.2020ベースに変更したい 2. ビューポートの見た目を維持したい 3. Rec.2020色域でエクスポートできるように変更したい フォルダ名 config.ocioの内容 substance sRGBをリニアライズするワークフロー aces_1.0.3 ACES AP1(ACEScg)が作業カラースペース aces_1.2
108. OpenColorIO Configの作成 • OpenColorIO Configをゼロから記述するのではなく、githubか らACES1.2用のOpenColorIO Configをダウンロードし、一部項 目を修正して使用する • https://github.com/colour-science/OpenColorIO-Configs
109. OCIO Config • config.ocioテキスト形式(YAML) で記述する
110. rolesとは • OCIOではrolesという項目でカラーパイプラインのどこでどの カラースペースが使われるか設定を行う • 様々なDCCツールでカラーマネジメントシステムとして使われ ているが、DCCツール独自のroleを持つ場合もある
111. 作業カラースペース
112. 作業カラースペースについて • 「作業カラースペース」とは内部的な計算が行われるベースと なるカラースペース • 一般的に作業カラースペースにはACES AP0またはACES AP1 が使われている場合が多い • ACES AP0 = ACES2065-1 • ACES AP1 = ACEScg • 今回は作業カラースペースをRec.2020とした • HDRゲーム用にワークフローを構築しているため • 自分達の意図したワークフローに設定することが重要
113. roles: scene_linear • Substance Painterではscene_linearというroleが作業カラースペー スに相当する • scene_linearをACEScgからLinear - Rec.2020に変更することで、 Substance Painter内部でRec.2020で作業出来るようになる OCIO Config Substance Painter
114. ビューポート
115. ビューポートのカラーマネジメント • CMS(カラーマネジメントシステム)にOCIOを使用すると ビューポートのカラーマネジメントが有効になる • しかしACES 1.2ではビューポートの見た目にRRTが含まれる • ※RRT(Reference Rendering Transform) フィルムの特性を考慮したルック 参考資料: https://area.autodesk.jp/column/trend_tech/scene_linear_workflow/04_fujifilm/ • OCIOで管理されていないソフトウェアとの見た目が異なるた め問題となる可能性がある • そこでOCIOの設定ファイルを編集しRRTの含まれない規格通り の表示を行う
116. ビューポート表示とRRT • プリインストールされているaces_1.2フォルダのconfig.ocioを 見ると、ColorSpaceにOutput - sRGBが用意されている • しかし RRTの含まれる 3DLUT(Log2_48_nits_Shaper.RRT.sRGB.spi3d)が使われてい る
117. ビューポートのカラーマネジメント sRGB sRGB+RRT
118. ViewTransformのcolorspaces • 表示時のカラースペースに規格通りのsRGBを指定するために colorspacesに項目を追加する • Utility - sRGB – Textureのtransformを参考にOutput用の ColorSpaceを作成する
119. ViewTransformのcolorspaces • Rec.2020モニタでの確認も行いたい • しかしsRGBのときと同じくOutput用のOutput - Rec.2020には RRTが含まれる • 同じく独自のColorSpaceを作成する
120. displays • 先程作成したcolorspaceを、displaysにViewとして追加する
121. active_views • Displaysにcolorcpaceを追加しただけだとビューポートのプル ダウンメニューに表示されない • active_viewsに設定することでcolorspaceがビューポートに表 示される • 先程作成したViewをactive_viewsとして設定した → Substance Painterのビューポートからcolorspaceを選択出 来るようになった Substance Painter OCIO Config
122. DCCツール OCIO Configの対応項目 Maya displays Houdini (Karma) active_views Substance Painter active_views DCCツールとOCIO Config • OCIO Configの仕様は決まっているが、DCCツールごとに Configの表示名が異なる DCCツールのView設定
123. テクスチャ出力
124. 書き出し時のカラースペース • 書き出しはRec.2020色域、sRGBガンマで書き出したい • 特殊なカラースペースなのでこちらも作成する • 名前は Utility - sRGB - Rec.2020 - Texture とする
125. 書き出し時のカラースペース • Substance Painterの読み込み/書き出しのカラースペースは config.ocioの中で独自のroleを使って定義されている • ソフトウェアによってrolesの解釈が異なるので注意 • 参考: https://OCIO.readthedocs.io/en/main/guides/authoring/overview.html#roles
126. 書き出し時のカラースペース • OCIO Configの設定によって、書き出し時のカラースペースに Rec.2020を設定できるようになった • テクスチャ書き出しダイアログを見ると、出力色空間が変更さ れていることが分かる
127. テクスチャ例 • JadeToadサンプルのBaseColorテクスチャを8bit pngでsRGB 色域とRec.2020色域で書き出した Rec.2020色域 sRGB色域 JadeToadサンプル
128. 色域とモニタ
129. ビューポートの広色域表示 • Substance PainterはSDRアプリケーションなので、ビューポート はsRGB色域しか表示できない →Rec.2020テクスチャをプレビューするには、モニタや外部ツール などのワークフローで対応する • モニタによって3種類のワークフローが存在する • Windowsの設定に関わらず広色域表示できるモニタ • 一般的なHDRモニタ • SDRモニタ
130. Windowsの設定に関わらず広色域表示できるモニタ • モニタの色域をRec.2020にすることで、Substance Painterのプ レビューウィンドウを広色域で確認しながら作業できる • OCIO Configにはモニタのガンマを考慮した値を設定する • 広色域表示なので、Substance PainterをHDRアプリケーション として表示できるわけではない (プレビューウィンドウ以外のGUIも色域変更の影響を受ける) ASUS ProArt PA32UCX-P ColorEdge PROMINENCE CG3146
131. 一般的なHDRモニタ • Substance PainterのプレビューウィンドウではRec.2020テク スチャをプレビュー出来ないため、HDRアプリケーションとし て作成されたツールを使ってRec.2020テクスチャをプレビュー する Substance Painter Rec.2020色域テクスチャ ゲームエディタなどの HDR対応ツール
132. SDRモニタ • sRGB色域外の色はクリップされるので、注意が必要
133. データデバッグ
134. データデバッグツール • テクスチャの色域間違いを目で見抜くのは難しい場合があるので、 画像ビューワなどのデータデバッグツールを作成して対応する デバッグツール例 機能 目的 テクスチャ色域変換表示 色域間違いを調査する sRGB色域外のピクセルを表示 Rec.2020テクスチャを使わないと表現できない ものかどうか確認する 物体色を外れたピクセルをエラー表示 意図していない色でテクスチャを作成してし まっているかどうか確認する デバッグ機能例
135. 物体色判定 • 物体色判定用のプロット値を3Dテクスチャとして読み込み、 シェーダー内部で3Dテクスチャ値を読み込む 物体色を超えたピクセルを 紫のエラー色で表示 元画像 物体色判定用3Dテクスチャ サイズは256x256x256 Houdini 物体色判定プロット値 シェーダーコード例
136. 色域の違いによる見え方の変化 • モニタとテクスチャの色域によってテクスチャの見え方が変わる • テクスチャが低彩度、高彩度に見えた時は色域とモニタの設定を 確認する テクスチャの種類 sRGBモニタ sRGBモニタ (ソフトウェア側の カラーマネジメント対応済み) Rec.2020モニタ Rec.2020モニタ (ソフトウェア側の カラーマネジメント対応済み) sRGBテクスチャ 正しく見える 正しく見える 高彩度に見える 正しく見える Rec.2020テクスチャ 低彩度に見える 正しく見える 正しく見える 正しく見える Rec.2020に変換したsRGBテクスチャ 低彩度に見える 正しく見える 正しく見える 正しく見える
137. HDRスクリーンショット • 在宅作業を行っていると他のアーティストのモニタを直接見る ことは出来ない • Windowsのリモートデスクトップやメッセンジャーアプリなど の画面共有ソフトはHDRに対応していない →HDRに関する情報共有はWin + Alt + Print Screenキーによる HDRスクリーンショット(.jxrファイル)や、レンダーターゲット をAVIFファイルに変換して使用している AVIFファイル 2019年に公開された、HDRを扱える画像フォーマット
138. AVIFファイルによる情報共有 • WindowsにプリインストールされているフォトやペイントではHDR 画像ファイルは表示できない • MicrosoftストアにはHDRビューワが存在するが、プロジェクトメン バー全員にインストールをしてもらうのは敷居が高い • そこで、HDRスクリーンショットをAVIFファイルに変換し、 ChromeのHDR表示機能を使って情報共有している →社内webサーバーにもAVIFファイルをアップロードして情報共有し ている AVIFファイルをChromeで表示している様子
139. まとめ • 広色域化で現実世界のsRGBで表現できない色を表現できる • 広色域により編集の幅が広がる • DCCツールでカラーマネジメントを行えば広色域テクスチャを作成できる • モニタのスペックや設定とデータの色域を考慮する必要がある • 広色域テクスチャのデバッグや情報共有も工夫次第で可能である
140. References • https://OCIO.org/ • https://github.com/AcademySoftwareFoundation/OCIO • https://OCIO.slack.com/. • Color management with OCIO | Substance 3D Painter • https://acescentral.com/
141. Questions?
142. 補足資料
143. WindowsでのHDRについて • WindowsはFloat16フォーマットのscRGBでフレームバッファを管理す ることで、HDRアプリケーションとSDRアプリケーションを同一モニ タに表示している • HDRアプリケーションを作成するにはDirectXを使ってDXGIを Rec.2020に設定するか、UWPを利用してアプリケーションを作成する →DirectXやUWPを使っていないDCCツールはSDRアプリケーションと して作られている可能性が高い https://learn.microsoft.com/en-us/windows/win32/direct3darticles/high-dynamic-range SDRアプリケーション sRGBフレームバッファ HDRアプリケーション Rec.2020フレームバッファ scRGBフレームバッファ モニタ
144. Substance Painterカラーピッカー • カラーピッカーでは作業カラースペースの値が表示される →作業カラースペースをRec.2020に設定していると、Rec.2020 色域のRGB値を簡単に確認できる
145. AVIFファイル作成ツール例 DirectXTex::LoadFromEXRFileなど 画像ファイル ピクセル値 Rec709 Linear OETFのRGBA 16bit floatまたは32bit float libavif用RGB Y410(YUV444 10bit) avifImageRGBToYUV avifEncoderAddImage、avifEncoderFinish AVIFファイル PQエンコードされたRGB各uint16_tフォーマット CPUでRec.2020 PQに変換
146. HDR画像ビューワ作例 • 一般公開されているHDR画像ビューワでは機能が足りなかった ので、自作HDR画像ビューワを使用している • ウィンドウ部分は.NET(C#)で作成し、画像表示部分は別プロセ スとしてDirectX12で作成することでHDR表示を行っている (プロセス間通信はTCP/IPを使用) • テクスチャの色空間変更や、sRGB色域外表示、物体色判定、 ピックした色をxy色度図で表示する機能などを実装している
147. sRGB色域外判定例 • シェーダー内部でRGBをxy値に変換し、xy色度図のsRGBに 入っているかどうか三角形の内部判定を行う sRGB色域外のピクセルを 紫のエラー色で表示 元画像
148. sRGB色域外判定例 カーソル位置の色をxy色度図で確認できる
149. 物体色判定例 カーソル位置のテクスチャの色を物体色からはみ出ているか判定 • 蛍光ペンのテクスチャを使った例 • 明るさに応じたMacAdam limitの断面が表示される • 白い紙も蛍光増白剤により物体色を超えている
150. • AVIFファイルをChromeにドラッグアンドドロップして表示 • 右上のPhotoshopでの表示とはダイナミックレンジが異なる(空など) • またSDRの白で表示されるメモ帳よりも明るい表示になる
151. • 社内のConfluenceにAVIFファイルを貼っての情報共有
152. xy色度図より人の感覚に近いもの u’v’色度図 sRGB sRGB LAB
153. xy色度図より人の感覚に近いもの u’v’色度図 LAB Rec.2020 Rec.2020 xy色度図ではsRGBとRec.2020の赤の違いはあまりないように見えてもこの座標ではかなり違いがあることが分かる
154. ご質問・ご意見 • ご質問やご意見ございましたらご連絡ください • 多田 航 Wataru Tada: w-tada@bns-g.com • 鈴木 雅幸 Masayuki Suzuki: m6-suzuki@bns-g.com • 山口 翔平 Shohei Yamaguchi: s6-yamaguchi@bns-g.com