妹でもわかるUnrealEngine4

毎日更新? 妹に説明するために書いてるけど、たまにわかってない場合もあるUnrealEngine4を中心としたゲーム制作の話。略すとイモリアル

毎日更新? 妹に説明するために書いてるけど、たまにわかってない場合もあるUnrealEngine4を中心としたゲーム制作の話。略すとイモリアル

マテリアルによるトゥーンアウトライン研究(9) 外側にアウトライン生成するポストプロセスマテリアル

f:id:una_unagi:20170409224754p:plain

「研究の結果、だいたい納得のいくマテリアルが出来た」

妹「これは外側に線入ってるの?」

「多分そうなってる……と思う。虫眼鏡でじっくり調べたわけじゃないけど、線を太くしても中のキャラクタの大きさ変わらなかったから上手くいってるはず」

ポストプロセスマテリアルの中身
f:id:una_unagi:20170409225401p:plain

ポストプロセスの設定(深度によるぼかし、光の調節)
f:id:una_unagi:20170409224808p:plain

「ポストプロセスマテリアルの設計としては、左上と右下のピクセルとの深度差を調べて、どちらかが一定以上手前にある場合に線を生成する。ただ左下と右下の深度が真逆だった場合、斜めの面にあると判断して線の表示をとりやめるようにした。標準設定のままだと線が見えにくいからポストプロセスのパラメータもいじってある」

妹「空が網目模様になってるのは?」

「それは結局よくわからないままで、普通にやってるつもりなんだけどなぜかああなる。空のブループリントの構造を調べてみたらとわかるかもしれないけど。とりあえずあんまり遠くだと線を出さないとかで回避は出来る。遠くかどうか調べるのも外側仕様だとちょっとやっかいそうだけど」

f:id:una_unagi:20170409230217p:plain

「あとはまあ、左上と右下しか調べてない関係で、左下とか右上には線が出ない。丸いアイコンもそうだし、階段の線もカドのとこ切れてる。けどそれはOKとする」

妹「OKなんだ」

「サンプルの点を増やせば解決出来るけど、深度差がどれだけあれば線が出来るかっていうのも、完璧に仕上げるのは無理だろうし。ある程度あいまいにしといた方が良さそうな気がする。これはこれでカリグラフィっぽい感じもするし」

f:id:una_unagi:20170409230041p:plain

f:id:una_unagi:20170409230052p:plain

「いつものSunTempleにも同じやつを入れてみた。やっぱり空に網目がついちゃう」

妹「網目もだけど、部屋の中は線がちょっと見づらいね」

「線自体はちゃんと出てるんだけどね。色合いを明るめにするとか、影を簡略化するセルシェーディングを併用するとか。場面によって線の色を変えるという手もある」

f:id:una_unagi:20170409231136p:plain

マテリアルによるトゥーンアウトライン研究(8) 内側と外側のどちらに線を入れるか

妹「線を内側に出すのと外側に出すのって、そんなに違うものなの? お絵かきソフトとかでやる時はあんまり変わんなかったと思うんだけど」

「内側と外側というのは、より手前にある物体の表面に線があるか、奥にある物体の表面に線があるかという違いなんだけど、原理としては違わないけど、マテリアルの仕組みで考えると外側の方が難易度高い」

f:id:una_unagi:20170409002646p:plain

「これは例えば各ピクセルごとに現在地+上下左右4箇所のピクセルを調べて、輪郭線を出そうとしてるケース。これだと処理負荷は同じだし、現在地の方が深度値が大きい場合と小さい場合、どちらの場合にその場所を線の色にするかで内側か外側かが変わってくる」

妹「やっぱり同じような物なのでは?」

実際に線の形を決めている部分を現在地に出来るかどうかという点が違う。例えば昨日のマテリアルの考え方は、現在地の法線を調べて、面が傾いた方向のピクセルだけ調べることで、調べる点を少なくするという仕組み。外側方式で考えると、実際に傾いてる面が遠くにあって、その傾きを調べるためにまず全ての点を調べないといけないから節約にならない」

妹「他に違うところは」

「手前にある物体は線を太くする、というのも外側方式の方が難しい。4ピクセルの太さなら4ピクセル先を調べるというのは同じだけど、内側だと最初に物体の深度がわかるけど、外側だと全方向調べないと深度がわからない。だから最悪数倍の処理時間が掛かってしまう」

妹「できるけど遅くなるってことなのかな」

「複雑なことを考える場合ほど内側が有利な感じ。そのうちもっと速い方法が発見されるかもしれないけど。あとポストプロセスマテリアル以外の方法で線を生成する場合はまた違ってくる」

マテリアルによるトゥーンアウトライン研究(7) 先行事例の研究

qiita.com

「UE4を使ったトゥーンレンダリング(ノンフォトリアル)の事例はいくつかあるんだけど、説明が日本語で、かつ導入が簡単なのがEpicのシモダさんが作った物。ポストプロセスマテリアルがすぐ使える状態で公開されてる」

f:id:una_unagi:20170407234654p:plain

「これは線がみやすいようにモノクロモードにしてあるバージョン。他にも色々プロパティで制御出来るようになってる」

妹「もうあるんだったら研究しなくても大丈夫なのでは?」

「この方法だと、原理的にキャラクターの内側に輪郭線が出てしまう気がする。処理に手を加えれば範囲は広げられそうだけど、そうするとこの手法による高速化のメリットはなくなる気がする。そのへんももう少し調査してみないとわからないんだけど」

妹「内側じゃ駄目なの?」

「内側に線を生成するとキャラクターの絵がちっちゃくなってしまう。線を太くしたら余計にそうなる。完全に好みの問題だけど。なので処理時間を犠牲にしても外側に輪郭線を出したい。もしくは輪郭線以外の方法を考えるか」