前半のアートプロトタイプを各工程ごとに実演とそれにあわせた機能の解説になります。 実演に関しては動画にてごらんください。

1. UE4 背景アーティスト勉強会
in 大阪
デモンストレーションや
第2部

2. 前提として・・・
UE4をある程度触ったことある前提で
話を進めますので、
細かい部分まで解説が行き届かないと思います。
よくわからない操作の部分があれば
質問タイムや懇親会で遠慮無く聞いてください。

3. 前提として・・・
私がPolycountのNoobChallengeを見て
作ってみたものを使って解説をします。（未完成）

4. 工程
・ブロックアウト + 解説
・仮モデル作成 + 解説
・仮レイアウト + 解説
・仮ライティング + 解説
・仮ポストプロセス + 解説
・アートディレクターチェック

5. ブロックアウト
コンセプトアートを確認します。

6. ブロックアウト
パーツを上から描いて切り分ける。

7. ブロックアウト
厳密に細かく分ける必要はない。
壁、床、天井、柱など大きな構成パーツで分類。
作りながらイテレーションの中で細分化していく

8. 工程
・ブロックアウト + 解説
・仮モデル作成 + 解説
・仮レイアウト + 解説
・仮ライティング + 解説
・仮ポストプロセス + 解説
・アートディレクターチェック

9. 仮モデル作成
DCCツールで仮モデル作成する。
UVは自動展開ツールで展開するだけ。

10. この段階で
友達のコンセプトアーティスト
に見せてみた

11. 仮モデル作成
※元のコンセプトをディスしている
わけではありません。
形がかわいいね

12. 仮モデル作成
もっとかっこよくしたいよね

13. 仮モデル 修正

14. 仮モデル 修正
いいね♥

15. 仮モデル 修正
これに上から
描いていい？

16. もちろん、OK！

17. 新コンセプトアート
Concept art by Yap Kun Rong

18. UE4にデータをインポート

19. 仮モデルの設定

20. 仮モデルの設定でやること
・マテリアルのセット
・コリジョンの設定
・Light map解像度の設定

21. マテリアル
基本色、ラフネス、メタリックが変更できる
マテリアルインスタンスを作成。

22. マテリアル
色はグレー（0.25, 0.25, 0.25）ぐらい。
Roughnessは0.2 反射が入るように低め。

23. マテリアル
ライトの部分にはEmissiveを使った
マテリアルインスタンスを適用

24. 仮モデルの設定 コリジョン
Collision Complexityを
Use Complex Collision As Simple にする

25. Light map解像度
最初は適当に大きめで設定する。

26. 工程
・ブロックアウト + 解説
・仮モデル作成 + 解説
・仮レイアウト + 解説
・仮ライティング + 解説
・仮ポストプロセス + 解説
・アートディレクターチェック

27. レイアウト
仮モデルをレイアウトしていく

28. レイアウトで必ず配置するもの
・仮モデルのStaticMesh
・レイアウト用ライト
・反射キャプチャ

29. 反射キャプチャ
配置した所から一定範囲のCubemapをキャプ
チャしてくれる。

30. 反射について
詳細はUnrealDocumentを参照
・反射環境
・反射の事例

31. UE4の反射
・Screen Space Reflection
・Reflection Capture (Sphere/Box)
・Light（Movable, Stationary）

32. Screen Space Reflection
動的に計算してくれる反射

33. Screen Space Reflection
Screen Space （画面の範囲）
しか計算されない。

34. Screen Space Reflection
設定はPost process Volumeから変更可能

35. Reflection Capture
シーンに配置した位置から一定範囲を
キャプチャしたCubemapを貼ってくれる。

36. Reflection Capture
映り込む範囲はInfluence Radiusで変更
変形ウィジットのスケールでも可

37. Reflectionの問題点
複数のReflectionの結果のズレが見える

38. Reflection結果はおおよその結果でしかない。
（公式ドキュメントから）
Reflectionの問題点

39. 反射が目立つフラットな平面を使用しない。
ディテールノーマルを入れたり、
曲線形の形状を使用する。
問題の解決方法

40. ・Screen Space Reflectionは重い。
・Reflection Captureを配置しすぎると
描画負荷につながるので注意。
パフォーマンス

41. 詳細な反射が必要な箇所以外には配置は不要。
Red：レベル、背景全体
Blue：それぞれの部屋
Green：重要な詳細が必要な場所
パフォーマンス

42. レイアウトで知っておくとよいこと
・画角（FOV)
・ブックマーク機能
・カメラ配置
・全画面表示（F11)
・選択解除（Esc)
・ゲームビュー（G)
・半透明オブジェクトの選択（T）
・ブラシマーカーポリゴンを描画

43. 画角（FOV)
ゲームと画角と
揃える。
デフォルトは
FOV90

44. ブックマーク機能
カッコいい構図の
位置で登録
超便利！
数字はテンキーではない
方になるので注意。

45. カメラ配置
Camera Actorを配置
左下のピンをクリックで常時表示される
遠景のレイアウトをするときに便利

46. 全画面表示（F11)
時々全画面表示にして、椅子に持たれて眺める。
そして、自画自賛！
自分最高♥

47. 全画面表示（F11)
作業中は画面比率が正しくない事が多い。
正しい比率で時々チェックをする

48. 選択解除（Esc)
選択を解除する
ESCで選択解除

49. ゲームビュー（G)
エディタに表示されているアイコンを非表示

50. 半透明オブジェクトの選択（T)
半透明オブジェクトの選択の可否のトグル

51. ブラシマーカーポリゴンを描画
Volumeの調整をする時に便利

52. 工程
・ブロックアウト + 解説
・仮モデル作成 + 解説
・仮レイアウト + 解説
・仮ライティング + 解説
・仮ポストプロセス + 解説
・アートディレクターチェック

53. おことわり…
茄子はライティング、ポストプロセスに
詳しくありません。
今日解説する内容は
こういう一個人のやり方
という感じで捉えてください。
間違いがあればご指摘お願いします！
堪忍な～

54. ライティングで配置するもの
・Lightmass Importance Volume
・各種ライト

55. LightmassImportanceVolume
間接ライティングの計算範囲を指定するもの。
プレイヤーが受ける間接ライティングの情報が
サンプルとして配置される。

56. LightmassImportanceVolume
プレイヤーの移動する範囲のみ配置する
メモリの節約とビルド時間の短縮が出来る。

57. ライトの使い方
基本的な使い方はUnreal Documentで。
入門編＞ライティングクイックスタートガイド

58. ライトの設定の参考
Contents ExampleのLighting.umap

59. UE4のライトの種類
・平行光源（Directional Light）
・スカイライト(Sky Light)
・点光源（Point Light)
・スポットライト(Spot Light)

60. 平行光源
太陽専用ライト

61. スカイライト
空からの反射光を計算してくれるもの。
影の色を明るくしたい場合に使用する。
HDRIの画像を割り当てることでIBL環境を作成
することも可能。

62. 点光源
全方向を照らすライト
室内ライティングでは大変お世話になる。
よく使用する例
裸電球、蛍光管など

63. スポットライト
円すい形に一定方向を照らすライト
室内ライティングでは大変お世話になる。
よく使用する例
照明器具各種…

64. ライトを置く前に…
表示＞ポストプロセスの項目を全て外す。

65. ライトを置く前に…
ポストプロセスにはライティングに
影響を与える要素が多いため、
ライトだけで設定を行った方がいいのかなと思っ
てます。
（あくまでも個人的なフローになります）

66. では早速ライトを置いてみましょう

67. ライティングの目標

68. ライティングの目標
ライティングの目標はリアルではなく、
コンセプトアートの印象にあわせること。
ライティングは絵の重要な要素なので、
コンセプトアートの印象に合わる。

69. Previewの文字を消す
表示＞可視化＞Preview Shadows Indicator
チェックを外す

70. IES Profiles
点光源とスポットライトに使用することが可能。
IESデータは以下から無料でDL可能
http://www.mrcad.com/download-free-
ies-lights/

71. IES Profiles
StationaryもしくはMovableでしか
使用できない。

72. エリアライト
蛍光管のような一定の面積をもつものから発せら
れる光を表現するのに使用。

73. エリアライト
現在、球か円柱形のみ可能

74. Use Emissive For Static Lighting
Ver4.6以降
StaticMesh設定でチェックを入れると
EmissiveをStaticLightとして使用できる。

75. 可動性について
3つ種類があります。
・Movable
・Stationary
・Static

76. Movable
ゲーム中に移動、回転など様々な変更が可能。
処理負荷が最も高い。
太陽光の時間変化シュミレート
プレイヤーが持つランプ、懐中電灯など…

77. Stationary
ゲーム中に移動、回転は出来ないが、
IntensityとColorの変更が可能。
（ただし、直接光のみ）
ライトの重なりは3つまで。
反射に影響あり。
IES Profileが使用できる。

78. Static
完全にLightmapに焼き付けられるライト。
負荷がほとんどない。
反射に影響しない。

79. 可動性について
alweiさんのblogに
わかりやすい解説があります。

80. 工程
・ブロックアウト + 解説
・仮モデル作成 + 解説
・仮レイアウト + 解説
・仮ライティング + 解説
・仮ポストプロセス + 解説
・アートディレクターチェック

81. Post Process
本来なら…
アーティストの好みで設定するのではなく、
アートディレクターと相談をしながら
決めていく工程。

82. Post Processで配置するもの
・Post Process Volume

83. Post Process Volume
とりあえず置きます。

84. Post Process Volume
Unbound ☑ で全域にかかる

85. 表示＞ポストプロセス
ポストの表示をもとに戻す。

86. Post Processの参考
Unreal Document ポストプロセスエフェクト

87. Post Processの参考
Contents ExampleのPostProcessing.umap

88. Post Processで設定するもの
・Auto Exposure
・Scene Color
(Fringe, Vignette, Grain)
・Ambient Occlusion(SSAO)
・Bloom
・Lens Flares
・Color Grading
などなどお好みで…

89. Scene Color（Fringe)
いわゆる色収差。
現実のカメラで起こる現象のシュミレート。

90. Scene Color（Vignette)
カメラの端がだんだん暗くなる効果の
シュミレート

91. Scene Color（Grain)
画質が悪い感じの細かいノイズ。
ISO感度のシュミレーション？？

92. この3つが入るだけで
レンズっぽさが出てくる
お得やね

93. Ambient Occlusion
Post Processで設定するAOは
Screen Space Ambient Occlusion
リアルタイムで計算されているAO
デフォルト値
Intensity : 1.0 Radius : 120

94. Ambient Occlusion
視覚化したいときは
表示モードからアンビエントオクリュージョン

95. Bloom
発光現象。
Bloomなし Bloomあり

96. Bloom
発光現象。
ThresholdはBloomが反応する輝度の値。
デフォルト1なので 1以上の値 にするのがよ
さそう。
発光させたいもの（ライトなど）は一定の輝度値
を決めておくとコントロールしやすいかも

97. Bloom
汚れマスクも設定出来ます。

98. Lens Flares
レンズが明るい光源に向けられている時に起こる
現象。
Lens flares なし Lens flares あり

99. Lens Flares
映画のようなアナモルフィックレンズの効果は
ポストプロセスでは出来ないので注意

100. Color Grading
ルックアップテーブルにフォトショップでかけた
色調補正と同じ効果をかける機能
Photoshop で調整
ColorGradingを適用

101. これで、ひと通りの設定が完了

102. しかし、
これで終わりではありません。
なんやて！！！

103. （大事なので2回目）
アートプロトタイプは
イテレーションを
何回も行います。

104. 工程
・ブロックアウト + 解説
・仮モデル作成 + 解説
・仮レイアウト + 解説
・仮ライティング + 解説
・仮ポストプロセス + 解説
・アートディレクターチェック

105. ということで、
現段階をアートディレクターに
チェックしてもらいました。

106. 太陽光の向きが
よくないね…
床が目立ちすぎるし…

107. まじか…
（予想はしてたけども…）

108. ライトの向きを
色々テストしてみようか

109. 一緒に調整してみた。

110. こんなかんじでいいよ！

111. という感じで、
アートディレクターと
一緒に簡単に調整できるのは
UE4の良い所です。

112. ・グラフィック方針の確定
・レベルデザインの調整
・仮モデル精度のアップ
・メモリの確認
ArtPrototypeで行うこと

113. ご質問は？

114. ご清聴ありがとうございました。
最後まできいてくれて
おおきに！