5
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

[UE4] PostProcessでObjectにOutlineをつける~後編~[UE4.18]

Last updated at Posted at 2018-04-08

#はじめに
前編では、SobelFilterを用いたエッジ検出を行い、特定のオブジェクトに対してOutlineを描画しました。
-> https://qiita.com/kanurapoison/items/1b36fdaa0a33f0d278d5
今回は、少し手を加えて見栄えを良くしていきます。

#Outline色変更
まずはOutlineの色を変えてみましょう。これは本当に簡単で、マテリアル内に少し修正を加えます。SobelFilterの結果に応じて、赤色に描画されるようにLerpをかけています。また、MF_GetSobelValueに対する入力としてSobelWidth=3に設定することで、Outlineを太くしています。

描画結果
01.jpg

マテリアル
02.jpg
これだけでかなり見栄えが良くなりましたね!

#壁越しの場合
次は、この描画結果をもう少し詳しく見ていきましょう。ゲームなどで多く目にする場面が”壁の向こう側にObjectが存在する”状態です。
先ほどの2Objectを壁越しに見てみると以下のようになります。壁越しでもOutlineがしっかりと描画されていることが分かります。
03.jpg

しかし、ゲームによっては壁越しには描画してほしくない場合もあります。その時は、もう少し修正を加えます。そのためにSceneDepthとCustomDepthの比較”を行います。壁の向こうにオブジェクトが存在する場合は、”SceneDepth < CustomDepth”となるので、そのピクセルは描画しないようにします。以下が修正を加えたマテリアルと描画結果です。以下の場合は、”SceneDepth = CustomDepth”のピクセルだけ描画するように実装しています。

描画結果
05.jpg
手前に壁がある部分はOutlineが描画されていないことが分かりますね!

マテリアル
04.jpg

#おまけ
また、CustomStencilValueを用いることで、下図のように、特定のオブジェクトに対してのみ壁越しの描画のon/offを切り替えることも可能です。

06.jpg

他にも、OverWatchでインフラサイト使用時風にもできます。(同ゲームでは、もっと複雑な処理をしていると思いますが...)
07.jpg

5
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?