第2回UE4勉強会 in 大阪 - マテリアル基礎・初級

マテリアル基礎・初級
第2回UE4勉強会 in 大阪

2
自己紹介
● Twitter: com04
● ゲームプログラマー
● 趣味でUE4プラグイン作ってる
● 横浜×酒×UE4

3
自己紹介
● 第1回UE4勉強会 in 大阪 – エンジン改造ってどうな
の？
– https://www.slideshare.net/com044/1ue4-in
● 第8回UE4ぷちコン
– BPをほぼ使わずにマテリアルでゲーム作りました。
● http://com04.sakura.ne.jp/unreal/wiki/index.php?
%C2%E88%B2%F3UE4%A4%D7%A4%C1%A5%B3%A5%F3

4
もくじ
● マテリアルって何？
● 質感
– マテリアル周りの機能
– よく使うマテリアルノード
– 簡単な作例
● 演出
● その他

6
マテリアルって何？
● マテリアルは、シーンの視覚的な外観を制御するために、メッシュに適用
できるアセットです。概要として、マテリアルはオブジェクトに適用する
「ペイント」として捉えるのがおそらく一番わかりやすいでしょう。ただ
し、この考え方は誤解につながる恐れがあります。マテリアルは文字通
り、そこからオブジェクトが作成されたかのように見えるサーフェスのタ
イプを定義するものだからです。色、光沢の度合い、オブジェクトの透過
可否などを定義することができます。専門用語では、シーンのライトが表
面とぶつかる際に、ライトと表面が相互に作用する方法を計算するために
マテリアルを使用します。こうした計算は、様々な画像 (テクスチャ) や
計算式、またマテリアル自体に固有の様々なプロパティ設定からマテリア
ルに入力されるデータを用いて行われます。

7
マテリアルって何？
もっと簡単に！
質感！
演出！

9
質感
● 質感≒色
● 下記の写真、同じ「白」

10
質感
● 光のつき方や反射率が違う
紙プラスチック

11
質感
● UE4では「物理ベースのマテリアル」で再現
– Base Color : 材質の色
– Roughness : 表面のざらつき具合
– Metallic : 金属具合
– Specular : 光の反射スケール

12
質感
● Base Color
– 光が入ってない状態での物体の色
● （正確には「入射光をどれくらい反射するかの値」。多分）
● 撮った写真そのままでは光の影響があるので使えない
– とりあえずざっくり言って色味

13
質感
● Roughness（ラフネス）
– 表面の粗さ
● 目に見えない細かい粗さ。凸凹。
– ヤスリの500番がラフネス高め、1200番が低め的な
– 高くなると反射やハイライトがボケる
0.0 0.4 0.7 1.0

14
質感
● Metalic（メタリック）
– どのくらい金属なのか
● UE4 公式より
– > 純粋な金属、石、プラスチックなどの純粋なサーフェスでは、この値は 0 ま
たは 1 を使用し、その中間値は使用しません
– > 腐食している、埃っぽい、あるいは錆びたメタルなどのハイブリッドなサー
フェスを作成する場合には、 0 と 1 の中間値を使用する場合もあります。
0.0 0.4 0.7 1.0

15
質感
● Specular（スペキュラー）
– ハイライト
● 0になる事はない（スペキュラが入らない物質は今の所無い）
● UE4 公式より
– > ほとんどの場合、Specular 入力を接続せずに、デフォルト値
は 0.5 のままにしておきます。

16
質感
● 質感は大きく、BaseColor, Roughness, Metalicで構
成される！
● UE4だとノード繋ぐだけですぐに確認出来る！
– ※キッチリした物理ベースをやる人はちゃんと計測し
た数値を当て込みましょう

17
質感
● 参考
– UE4 公式　「物理ベースのマテリアル」
● https://docs.unrealengine.com/latest/JPN/Engine/Rendering/M
aterials/PhysicallyBased/index.html
– Cygames Engineers' Blog「物理ベースレンダリング -基礎編-」
● http://tech.cygames.co.jp/archives/2129/

18
マテリアル周りの機能

19
● マテリアルノードの数値を変えた時に「適用」ボタン
を押して反映させる

20
● そして始まるシェーダーコンパイル

21
● →マテリアルインスタンスを使おう！

22
● マテリアルインスタンス
– 値の変更でシェーダーコンパイルが走らなくなる！
– 他にもマテリアルのパラメーターを変えて使いまわす
ことが出来る
– UE4 公式「インスタンス化マテリアル」
● https://docs.unrealengine.com/latest/JPN/Engine/Render
ing/Materials/MaterialInstances/index.html

23
● コンテンツブラウザでマテリアルを右クリック
– →「マテリアルインスタンス」を作成
– でアセットが作成される。

24
● マテリアルインスタンスで操作したいパラメーター
は、元マテリアルで「Parameter」系のノードを使用
する

25
● Parameter系ノードを使うと、マテリアルインスタン
ス側にパラメーターが出て来る。

26
● １つのマテリアルから複数のマテリアルインスタンス
も作れる
– 数値だけ変えたマテリアルを使い回せる。効率化。

27
マテリアルの出力、
何か他にも一杯ピンあるんだけど？

28
● Opacity（オパシティ）
– 透明度。ガラスとか。
● Blend ModeをTranslucencyにすると使える
0.0 0.4 0.7 1.0

29
● Opacity Mask（オパシティマスク）
– しきい値以下の値を非表示にする
● Blend ModeをMaskedにすると使える
● しきい値はマテリアルの詳細タブ
– 「オパシティマスク上限値」
0.0 0.4 0.7 1.0

30
● ざっくり良く使う所
– Normal
● 法線。ピクセル単位で法線を弄れる。
– World Position Offset
● 頂点座標にオフセットする。上手くやれば頂点アニメーションが実装出
来る
– Refraction（リフラクション）
● 背景を屈折させる（歪ませる）。水とかで向こうが歪んでいる感じ。
● 1.0で歪みなし。

31
Blend Mode

32
● Blend Mode
– マテリアルの「詳細」欄に有る
● マテリアルの背景との色の混ぜ方。

33
● Opaque（オパックとかオペイクとか）
– 不透明。普通のサーフェイス。
● Masked（マスクド）
– オパシティマスクがしきい値以下の所を消す。
– 不透明だけど、一部分だけ表示消したい時とか。

34
● Translucent（トランスルーセント）
– 半透明。オパシティの値が透明度になる。
– ガラスとか後を透かしたい時に使う。
● Additive（アディティブ）
– 加算。上に色を乗っける。主にエフェクトで使う。
Additive Translucent

35
● 参考
– UE4 公式「Material入力」
aterials/MaterialInputs/index.html
– UE4 公式「Material Blend モード」
aterials/MaterialProperties/BlendModes/index.html
UE4 公式「シェーディングモデル」
aterials/MaterialProperties/LightingModels/index.html

36
よく使うマテリアルノード

37
● Power
– 累乗。Exp=1.0はそのまま。Expを上げると0.0～1.0
の中間の色が0.0に近づいていく。＝明るい所が際立っ
てくる。
Exp=1.0 Exp=2.0 Exp=3.0

38
● Fresnel（フレネル）
– 端の方が1.0、正面が0.0返ってくる
● 正確には視線と垂直な所が1.0、視線と向き合う所が0.0

39
● LinearInterpolate/Lerp（リニアインターポレート/リープ）
– 引数のAとBをAlphaで補間する。
– ノードを出す時の名前はLinearInterpolateでノード名
はLerp。

40
● Time
– 経過時間が返ってくる。
– 時間毎に数値が増えていくので、アニ
メーションとして使うことが出来る
テクスチャUV テクスチャ

41
● 参考
– UE4 公式「マテリアル式リファレンス」
● https://docs.unrealengine.com/latest/JPN/Engine/Rende
ring/Materials/ExpressionReference/index.html
●

43
簡単な作例
● ガラスのマテリアル。
– 本来は視線からの角度で屈折率、透過率が変わる筈
● 第2回：鏡面反射光反射レベルを素材の値で管理
– http://area.autodesk.jp/column/tutorial/3ds_max_kitchen_stadium/2_ha
nsyalevel/Before After

44
簡単な作例
Before After

45
簡単な作例
● ガラスのマテリアル。
– 「Fresnel」で視線と角度が急な所（端っこ）を取り出
してリフラクションとオパシティを変更している

46
簡単な作例
● 草揺れる

47
簡単な作例
● 草
– 「Time」で時間経過を取ってアニメーション。
– 「Sine」に繋ぐことで0.0～1.0を-1.0～1.0に変換し
て前後に揺らせる数値にする
– その結果を「ワールドポジションオフセット」に繋い
で頂点を前後に揺らす。

48
簡単な作例
● 草
– BoundingBoxBased_0-1_UVW
● メッシュのサイズでUVを取る。RGB→XYZ
– →Bでメッシュの高さを取り出して、根本＝0.0、葉先＝1.0で
根本だけ動かないようにする

49
簡単な作例
● 簡単な水

50
簡単な作例
● 水
– MaterialFunctionCallノードからMotion_4WayChaos
● エンジンコンテンツを有効にしていると出てくる（最後の
「その他」ページで）
● 4方向からいい感じにテクスチャをスクロールしてくれる

51
簡単な作例
● 水
– テクスチャもエンジンコンテンツの中を”water”で検索
すると出て来る

52
簡単な作例
● 水
–
波の模様のカラーを
２種類混ぜる
波の速度を調整する
波の模様のカラーを
２種類混ぜる
波の模様テクスチャ

53
簡単な作例
● 水
– 透明度を出すにはBlend ModeをTranslucentにしてオ
パシティに繋ぐ

55
演出
● マテリアルでアニメーションを付けることが出来る。
– →演出を付けることが出来る。
– 最終的に色やαの数値を書き出すだけなので、その途中
の計算は自由自在。
● 計算は頑張ろう
● また、BPから数値を渡すことも出来るので、ゲームや
映像の進行に応じた演出も可能

56
演出
● 何か光る演出

57
演出
● 何か光る演出
– 「Rate」は外部から0.0～1.0を渡される演出時間
– 「Fresnel」で視線からメッシュの端を抽出
– 「Emissive」に50を入れてギラッと光るように

58
演出
● 何か光る演出→動きが無くて静かな印象を変える

59
演出
● 何か光る演出→動きが無くて静かな印象を変える
– 「Time」ノードで経過時間を取得
● 「TexCoord」ノードに加算してUVアニメーション
– ノイズテクスチャで模様の強弱を付ける

60
演出
● 穴開けるマテリアルの詳細設定

61
演出
● 穴開ける
– 「SphereMask」で「Radius」範囲内1.0、範囲外0.0
の値が取れる。
● 「1-x（OneMinus）」ノードで値を反転すると、位置から近
い所が0.0となり真ん中に穴が開けられる
– 「ActorPosition」はActorの原点。外部から値を渡せ
るようにすれば当たった所に穴を開けるとかも出来る

62
演出
● よくあるゲームの敵消滅演出（Dissolve）
– ディザで消えていく
マテリアルの詳細設定

63
演出
– ディザで消えていく
– 「DitherTemporalAA」の引数、「Alpha Threhold」
の1.0～0.0に応じてディザ抜きする数値が返ってくる

64
演出
– ノイズテクスチャに合わせて消えていく
マテリアルの詳細設定

65
演出
– ノイズテクスチャに合わせて消えていく
– 「オパシティマスク上限値」0.01なので、出力の「オ
パシティマスク」がその値以下になると表示が消える
– 「Rate」が0.0の時、1.0 – テクスチャの値
– 「Rate」が1.0の時、0.0 - テクスチャの値。で全部
0.0になる

66
演出
– 消える端を光らせる。焼けて消えるとか

67
演出
– 消える端を光らせる。焼けて消えるとか
– 「SmoothStep」は「Min」以下を0.0、「Max」以上
は1.0、その間は補間してくれる
– ノイズで消える所から0.1の範囲を補間して色を付ける

69
その他
● エンジンコンテンツを有効にする
– コンテンツブラウザの右下の
「表示オプション」選択
– 「エンジンのコンテンツを表
示」にチェックを入れる

70
その他
● エンジンコンテンツを有効にする
– 参考になるマテリアルやテクスチャが一杯！

71
● エンジン側のマテリアル等の機能を使う
– マテリアルノードのMaterialFunctionCallからエンジン
の機能を使えるようになる

72
その他
● BPからマテリアルへ数値を渡す
– コンテンツブラウザを右クリックでブループリントク
ラスを作る
● →Actorを選択

73
その他
– 開いたコンポーネント欄にある「コンポーネントを追
加」を選択して、メッシュ系を追加
– 詳細パネルに出てくるメッシュに適用なアセットを設
定、Materials欄に作ったマテリアルを設定

74
その他
– イベントグラフ等で追加したコンポーネントから
「Set*Parameter Value」を使うとマテリアルの
Parameterノードに値をセット出来る

75
その他
● まだまだ他にも一杯機能があります！三日三晩語っても尽きない！
– Shading Model
– Post Process Material
– Particle
– Decal
– マテリアル関数
– Material Parameter Collection

76
その他
● 公式のラーニング等のサンプルや、フリーでアップさ
れているマテリアル等が非常に参考になる
– ノードの組み方や発想。知らないノードも。
– 公式Forumにも上がってたりします。
● https://forums.unrealengine.com/
– マテリアル本も非常に参考になります
● https://www.unrealengine.com/ja/blog/ue4-books-material-design

77
その他
● ノードの種類が多い！
– 公式ドキュメントに詳しく乗っている
● UE4 公式「マテリアル式リファレンス」
– https://docs.unrealengine.com/latest/JPN/Engine/Renderi
ng/Materials/ExpressionReference/index.html
● （ただ多くて全部は覚えれない）

79
参考リンク
● UE4のマテリアルをもっと楽しもう！～マテリアルで
ぐっと広がるリアルタイムCG表現の幅～
– https://www.slideshare.net/EpicGamesJapan/advanced-material-44530654
● アンリアルエンジン4でノンフォトリアル描画しよう！
@UNREAL FEST 2015 YOKOHAMA
– https://www.slideshare.net/EpicGamesJapan/4-unreal-fest-2015-yokoham
a-54129845
–

80
参考リンク
● 中級者向け
– 大規模タイトルにおけるエフェクトマテリアル運用 (SQEX大
阪: 林武尊様) #UE4DD
● https://www.slideshare.net/EpicGamesJapan/sqex-ue4dd
– マジシャンズデッドポストモーテム ~マテリアル編~ (株式会
社Byking: 鈴木孝司様、成相真治様) #UE4DD
● https://www.slideshare.net/EpicGamesJapan/byking-ue4dd
– マテリアルとマテリアルインスタンスの仕組みと問題点の共有
(Epic Games Japan: 篠山範明) #UE4DD
● https://www.slideshare.net/EpicGamesJapan/epic-games-japan-ue4dd

第2回UE4勉強会 in 大阪 - マテリアル基礎・初級

More Related Content

What's hot

Similar to 第2回UE4勉強会 in 大阪 - マテリアル基礎・初級

More from com044

Recently uploaded

第2回UE4勉強会 in 大阪 - マテリアル基礎・初級