【Unity】Post Processing(ポストプロセス) を使って画面演出をリッチにする

Post Processing を使って画面演出をリッチにする

バージョン情報

Unity 2020.2.0f1
Post Processing 2.3.0

ポストプロセスとは?

ポストプロセスとは、画面に表示する直前の画像に対して処理を適用することで、画面をより現実感のある見た目にしてくれる機能です。

ポストプロセスのあり/なし比較

ポストプロセスは英語で「後の(ポスト) + 処理(プロセス)」と訳せるように、カメラでオブジェクトをレンダリングした後にかける処理のことを指します。

レンダリングのおおまかな流れとしては以下のような形になります。

「3Dモデルの描画」-> 「ポストプロセスの処理」->「画面へ表示」

Post Processing のインストール方法

Unity の上部メニューから 「Window」->「Package Manager」を選択します。

menu-package-manager

Post Processing」を検索して選択し、右下の「Install」からインストールを実行します。

package-manager-post-processing

Post Processing の項目の右側にチェックマークが付けばインストール完了です。

post-processing-installed

Post Processing を使ってみよう

本記事では Unity Asset Store の無料アセット「Fantasy Forest Environment – Free Demo」を使用しました。

Post Processing の適用にこのアセットが必須というわけではないので、好きなオブジェクトをご用意ください。

Post Process 用の Layer を追加

Inspector ウィンドウで Layer を選択して「Add Layer…」からレイヤーを追加します。

レイヤーの追加

レイヤー名は好きな名前で大丈夫です。ここでは「Post Processing」と名付けました。

レイヤーの命名

Post-Process Layer の設定

対象のカメラオブジェクトに「Post-Process Layer」コンポーネントを追加します。

カメラオブジェクトを選択し、 Inspector ウィンドウにて「Add Component」から「Post-process Layer」を選択します。

Post-process Layer コンポーネントの追加

追加したコンポーネントの Layer を設定します。こちらに先程追加した「Post Processing」レイヤーを選んで設定します。

Layer の設定

カメラの設定はこれで完了です。

Post-Process Volume の設定

Hierarchy ウィンドウ上で右クリックし「3D Object」->「Post-Process Volume」 を選択し、「Post-Process Volume」オブジェクトを追加します。

Post-Process Volume の 追加

追加した「Post-Process Volume」の Inspector ウィンドウを確認して、Layer を「Post Processing」に変更します。

Layer を Post Process に変更

Post-Process Volume コンポーネントにて「IsGlobal」にチェックを入れます。「Profile」の項目は None かと思います。

Post-Process Volume の Inspector

Profile」の右側にある「New」ボタンを選択すると、新たに「Post-process Volume Profile」が生成されます。

Post-Process Volume の Profile を作成

これで Post-Process Volume の追加は完了です。

ポストプロセス(Bloom)の適用

先程追加した「Post-process Volume」を使い、ポストプロセスを適用していきます。今回は「Bloom(ブルーム)」を使ってポストプロセスの処理をします。

Bloom を使うことで、画像のようにもやのかかったような柔らかい演出を作り出せます。

Bloom のあり/なし

Post-process Volume」コンポーネントの下部にある「Add effect…」ボタンを選択し「Unity」-> 「Bloom」を押すと Bloom コンポーネントが追加されます。

Bloom の追加

追加した Bloom のパラメータを設定します。「Intensity」と「Threshold」にチェックを入れ、値をそれぞれ 2.50.6 に変更しました。ここの値は自由に調整していただいて問題ありません。

Intensity」は明るさの強度が設定でき、「Threshold」は輝度のしきい値が設定できます。

Bloom の設定

上記設定が完了すれば、以下のようにもやのかかった演出になります。

Bloom 適用後のアセット

また「Color」にチェックを入れて効果全体の色を変更することも可能です。

Bloom のカラー設定

以下は Color を赤っぽい色に変更した画像です。画面全体が赤みがかり、夕暮れ時のような雰囲気を作り出せました。

赤みがかった Bloom のカラー

おわりに

Post Processing を使って画面演出にリッチさを出す処理を行いました。

今回使用したのは Bloom ですが、この他にも様々なポストエフェクトが使用できますので、気になる方はそちらも試していただければと思います。

参考資料

参考 ポストプロセスを理解するdocs.unity3d.com 【Unity】Fill Amount で場面転換のトランジションをさくっと作る 【Unity】Fill Amount で場面転換のトランジションをさくっと作る【UI】