イケメンテックラボでエンジニアをしている寺林です。
イケメンテックラボではゲームエンジンのUnityを使って開発しているのですが、Unityには画面に特殊効果をかけるPostProcessingStackというライブラリがあります。
僕個人もよく使っていたのですがそれがいつのまにかV2になり使い方が結構変わっていたので今回はその紹介をしたいと思います。
※以降PostProcessingStackを本記事ではPPSと略させていただきます。
PostProcessingStackとは？
そもそもPPSとは一体なんなのかということについて少し説明します。
ポストプロセス（後工程）という名が示す通り、ゲームの画面を描画した後に加えられるエフェクトの事です。既に描画されているものに対してエフェクトをかけるので、依存のゲームの内容に手を加えることもなく見た目を調整できます。
有名なエフェクトだとアンチエイリアス（画面のジャギを目立たなくする）やブルーム（オブジェクトが光っているように見せる）といったものがあります。
今回の記事ではPPS2の導入からエフェクトの適用方法とスクリプトからエフェクトのパラメータを変更する方法を紹介します。PPS1を使っていた方やこれからPPSを使ってみようという方はぜひ参考にしてください！
PPSの機能についてはUnite2017のセッションがとてもわかりやすく説明されているので使えるエフェクトを全て把握したいという方はこちらの動画をご覧ください。（PPS v1の頃のセッションなので本記事の導入方法とはかなり手順が異なりますのでその点だけ留意してください）
検証環境
今回使用するUnityのバージョン、PPSのバージョンは以下の通りです。
・Unity2019.1.1f(せっかくなので)
・PostProcessingStack2.1.6
PPSのインストール
PostProcessingStackはAssetStoreでは提供されていません。
Unity2018から搭載されたPackageManagerを使用します。
Window->Package Managerをクリックします。
PackageManagerが表示されるので、左側のリストの中からPost Processingを探し、右下にあるInstallボタンを押します。
少し待つとインストールが完了し、チェックマークが入ります。
これでインストールは完了です。 もしプロジェクトからPPSを削除したい場合はRemoveボタンを押せば一発で消えてくれます。便利ですね。
PPSを使えるようにする
ではPPSを使えるように準備していきましょう！
今回は適当なシーンを作成し、このようなワールドを作ってみました。
Cube,Sphere,Capsuleがあるワールドです。
今回はこのワールドにエフェクトをかけて遊んでみましょう。
まず、適当なオブジェクトをクリックし、LayerをクリックしAdd Layerを押します。
Tags&Layersが開くのでPPS用のレイヤーを追加してやります。今回はPPSというレイヤーにしました。
次にMain Cameraをクリックし、Add ComponentからPost-process Layerを追加します。
TriggerにはMainCameraを指定してやります。（おそらく最初から入っている）
Layerの部分に先ほど作ったLayer（今回はPPS）を選択します。
次に空のGameObjectを作成し、Layerを先ほど作ったPPSに設定します。
次にAddComponentからPost-process Volumeを選択し追加します。
まず、Is Globalにチェックを入れます。これを有効にすることで常にエフェクトがかかるようになります。無効の場合はこのGameObjectにコライダーをつけてやることでカメラとコライダーが接触してる時のみエフェクトが有効になるようになります。
次にProfileの横にあるNewをクリックします。Profileは各種エフェクトのパラメータをまとめたオブジェクトです。 複数作ってゲーム中に切り替えたりすることもできます。エフェクトをかける際に必ず必要なのでNewを押して作成しましょう。
Add effect…というボタンが表示されれば準備完了です！
画面エフェクトを使ってみる
PPSを使う準備ができたので早速エフェクトをかけてみましょう。
Add effect…をクリックすると使えるエフェクトの一覧が出てきます。
いろんなエフェクトがありますが全て説明しているとすごい長さになってしまうので今回はBloomエフェクトを使ってみましょう。Bloomエフェクトを使うとオブジェクトの周りが発光しているような表現を作ることができます。
Bloomを選択するとこのようにパラメータが出てきます。
規定値がすでに設定されており、パラメータを調整するにはパラメータ左側の四角部分をクリックしチェックを入れることで編集ができるようになります。
今回はIntensity（エフェクトの強さ）とColor（Bloomの色）にチェックを入れて値を変えてみます。
まずはIntensity０の状態。
Intensityを11くらいまで上げてみると…
いい感じに光ってくれてますね！神々しい！
次に色を青色にしてみます。
ちょっとSF感が出ましたね。同じワールドなのに印象が全然違います。
このようにパラメータを調整するだけで簡単にエフェクトをかけることができます。
スクリプトから制御する
ゲームを作っていると、「この場面ではエフェクトをかけたいけど普段はかけたくない」とか「動的にBloomの強さを変えていきたい」といったことがあります。
PPSのパラメータをスクリプトから弄るにはこのようなコードを書く必要があります。
コードではBloomのパラメータを取得して変更していますが、他のエフェクトでも同じことができるはずです。
Bloomのパラメータとその意味はUnityのドキュメントから確認できます。
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.Rendering.PostProcessing;
public class PostProcessManager : MonoBehaviour {
private PostProcessVolume volume;
private Bloom bloom;
void Start () {
volume = GetComponent<PostProcessVolume> ();
//設定を取得する
bloom = volume.profile.GetSetting<Bloom> ();
}
// Update is called once per frame
void Update () {
bloom.intensity.value += 0.1f;
}
}このスクリプトを先ほどのPost-process Volumeをアタッチしたオブジェクトに追加します。
実行するとこんな感じでどんどんBloomの強さが上がっていきます！
変更する関数などを作っておいて呼び出せるようにしておくと便利そうですね。
まとめ
PPSの導入とスクリプト上でのパラメータの変更方法を解説しました。
PPSを使うことでゲームの見た目が一気に引き立つので是非使ってみてください！
