Unity(URP)：いい感じのポストエフェクト紹介

## はじめに
「[CYBIRD Advent Calendar 2023](https://qiita.com/advent-calendar/2023/cybird)」 の23日目の記事を担当する@cy_ryosuke_zushiです。
22日目は@yoooosu さんの「[【Unity】SimpleAnimationを使ってみた話](https://qiita.com/yoooosu/private/eaa147b4d7cc6673e131)」でしたね。
アニメーションの切り替えが簡単になるのは助かりますね！

ところで皆様、
ゲームの見た目を手早くいい感じにしたい時ありませんか？ありますよね！！
ということで今回はUnityで用意されているポストエフェクトを触ってみました。
コード不要でサッと触ってぱっと魅力がわかるものを厳選して紹介します！
(著者環境　Windows Unity 2022,3.14f)

## 目次
- ポストプロセスとは
- 準備
- 紹介
   - Bloom
   - Chromatic Aberration
   - Color Adjustments
   - Depth Of Field
   - Lens Distortion
   - Split Toning
   - Vignette
   - Motion Blur
   - Film Grain
- 最後に

## ポストプロセスとは
Post Processing (ポストプロセス) は、画像を画面に表示する前に、カメラの画像バッファにフルスクリーンのフィルターと効果を適用する処理です。これによって、設定に時間をほとんどかけずに、アプリケーションの外観を顕著に向上させることができます。ポストプロセスエフェクトを使用して、物理カメラやフィルムのプロパティのシミュレーションを行えます。（Wiki参照）

そう。インスタとかでよく見るフィルター機能です！
ゲームの画面も映えさせたいですよね！では準備しましょう。

## 準備
大まかな流れはこんな感じ
1. いい感じの部屋（オブジェクト）とカメラを用意する
1. Camera->Rendering->Post Processingにチェックをつける![スクリーンショット 2023-12-20 004028.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/2a06e2c7-333d-7075-e2db-7cfe52e52484.png)

1. 空のオブジェクトを作成
1. "Volume"をアタッチしてnewボタンを押す![スクリーンショット 2023-12-20 165751.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/6c08d9ce-ecb5-f5e3-3c7a-d731e7af4850.png)
![スクリーンショット 2023-12-20 004254.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/6ca8ecb9-95d2-ad2d-1bd7-a04938a5fb40.png)

1. Add Override->Post-processingの中からいろんなポストエフェクトをかける![スクリーンショット 2023-12-20 165751.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/a7ff0f63-aa1a-82c6-4e79-534f33560aab.png)



それではいよいよ紹介です。

# 紹介
## Bloom
「あービカビカに光らせたいなぁー」
そんなあなたに"Bloom"。
 Before↓
![default.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/edd04851-886a-9c5e-33ca-aa9809c15a76.png)

After↓
![スクリーンショット 2023-12-20 011536.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/db1efdb6-efc9-53d4-95eb-db8f2cb988dd.png)
↓色も調整できる
![スクリーンショット 2023-12-20 011857.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/9ce20e3c-a0ac-ab2e-6e6a-a0d40a4fdb90.png)

このように光源の輝き方を調整できます。

## Chromatic Aberration
「頭痛表現したいなぁ」「ガンギマリ表現したいなぁ」
そんなあなたに"Chromatic Aberration"。
![chromaticAberration.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/b7e7eb4f-c663-0b65-ca93-c20c2fc78ef7.png)

このようにRGBごとにずれた表現をすることができます。

### Color Adjustments
「カラーフィルターをかけたいなぁ」「コントラストをつけたいなぁ」
そんなあなたに"Color Adjustments"。

青のカラーフィルター↓
![スクリーンショット 2023-12-20 014730.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/6a492dff-522f-5d7a-0ec0-084370780c20.png)
コントラストを強く↓
![スクリーンショット 2023-12-20 014756.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/c9514794-cd52-d412-e8b8-da2539e31a45.png)

このようにカラーフィルターや、コントラストの調整が行えます。

### Depth Of Field
「背景ぼかして写真っぽくしたいなぁ」
そんなあなたに"Depth Of Field"。
Before↓
![スクリーンショット 2023-12-20 015301.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/4dec4550-a705-4ab0-20f5-3bd95e47f0cc.png)
After↓
![スクリーンショット 2023-12-20 015318.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/3dd5d1e5-cd3c-1670-3b06-9c5872e5833e.png)

このように「ぼかし」の調整を行うことができます。

### Lens Distortion
「魚眼レンズみたいにしたいなぁ」
そんなあなたに"Lens Distortion"。
![スクリーンショット 2023-12-20 133351.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/31f07882-fb71-37b9-1d0c-3a218ce549e6.png)
![スクリーンショット 2023-12-20 133658.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/a33d421f-d5e3-dfd2-82ae-31d24d023612.png)

このようにレンズのように歪みをつけることができます。

### Split Toning
「なんか雰囲気つけたいなぁ」
そんなあなたに"Split Toning"。
暗い雰囲気↓
![スクリーンショット 2023-12-20 133728.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/7c0ba5f9-7166-69be-96dd-42f854eb7f83.png)
明るい雰囲気↓
![スクリーンショット 2023-12-20 133900.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/c077113a-17a9-3278-968a-d0b48b75828d.png)

このようにハイライトの色、影の色を調整し雰囲気を出すことができます。

### Vignette
「ダメージの表現、毒の表現したいなぁ」「覗き見表現したいなぁ」
そんなあなたに"Vignette"。
毒表現↓
![スクリーンショット 2023-12-20 133922.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/67078f07-32bb-d015-3948-0d06acc6d02a.png)
覗き見表現↓
![スクリーンショット 2023-12-20 134009.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3626472/06a3da20-8a56-4b43-f007-0505bf2055d5.png)

このように画面淵に色をつけることができます。

### Motion Blur
「振り向きにリアル感が欲しいなぁ」
そんなあなたに"Motion Blur"。
<iframe width="560" height="315" src="https://www.youtube.com/embed/Fjk7weNcnMo?si=_6Tv78zUG1SR62Uf" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
このようにカメラを動かすと残像のようなものが描画されます。

### Film Grain
「ビデオカメラで撮っているような表現がしたいなぁ」
そんなあなたに"Film Grain"。
<iframe width="560" height="315" src="https://www.youtube.com/embed/evDCyPYyMu8?si=NvERE5vRAQ0PZWs7" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>

このようにチラチラノイズが映ります。

## 最後に
いかがだったでしょうか？
今回紹介したもの以外にも何個かありますし、自作することも可能なようなので、興味のある方はぜひ！
明日のCYBIRD Advent Calendar 2023 24日目は@shiso_c さんの
「ShaderGraphで遊んでみた 〜キャラクターの設定に説得力を与える方法〜」です！
どのような表現をご紹介いただけるのか楽しみですね！