【Unity】世界が変わるBloom(ブルーム)の使い方【Post Processing】

【Unity】世界が変わるBloom(ブルーム)の使い方【Post Processing】

UnityにはPost-Processing(ポストプロセシング)という画面の見栄えをグレードアップさせてくれるツールがあります。このツールに含まれているBloom(ブルーム)のエフェクトを使うと簡単に素敵な雰囲気の画面を作り出すことができるので、この凄さをあなたにお伝えしたいのです。

 

 

環境

macOS 10.15 Catalina

Unity2019.2.9f1

Unity Hub 2.2.2

Post Processing 2.1.7

 

参考文献

公式のマニュアル

 

公式のパッケージ解説

公式のバッケージ解説の方は英語で書かれていますが、自動翻訳すれば概要を掴みやすくなります。

 

Post-Processing(ポストプロセシング)とは

Post-Processing(ポストプロセシング)とは、画面に描画する前の画像に対して処理を行うことで、最終的に描画される画像の見栄えを良くする機能です。インスタのフィルターのようなイメージです。

ポストプロセシングの概要や導入方法については以下の記事で解説しているので、こちらもご参照ください。

 

 

この記事の中ではポストプロセシングが導入されている状態で進めていきます。

 

Bloom(ブルーム)とは

Bloom(ブルーム)とは、シーン内の光源から放出される光が、あたかも他のオブジェクトに映り込んでいるような表現を追加するエフェクトです。Bloomは「咲く」という意味の言葉で、光の花が咲いているような表現ができます。

通常、光っているオブジェクトはその境界線までが明るく、隣のピクセルまでは明るくしてくれません。光をベイクしたり、ライトプローブを使うことで光を受け取ることができますが、Bloomではカメラを通して見た画像に対して光がにじみ出るような表現を加えます。

 

例えば、以下の画像のようにオブジェクトを配置したとします。画像中央の白い球体と右上の白い箱はマテリアルで発光させています。この時点では光をベイクしていないので、明るいのは分かりますが発光しているようには見えません。

配置直後のGameウィンドウ
配置直後のGameウィンドウ

 

続いてオブジェクトをStaticにして光をベイクします。白い球体に注目してもらうと、床に光が映り込んでいることが分かります。ベイクする前より光っている感じはありますが、オブジェクトそのものの境目を見ると、自分自身が白いだけのようにも見えます。

ライトをベイクさせた
ライトをベイクさせた

 

ここにBloomを加えてみます。白い球体の境界線に注目すると、空中にピンク色の光がにじみ出ているのが分かりますね。単純にオブジェクト自体が明るくなるだけではなく、他のピクセルに対して光の色を描き込むことで、より光っている感が増します。

BloomとColor Grading
BloomとColor Grading

 

Bloomを使う場合には、光の強さが大きくなるのでColor Grading(カラーグレーディング: 色調補正)のエフェクトと組み合わせてトーンマッピングを行うと良いでしょう。上の画像でも組み合わせて使っています。

光の強さが1を超えるHDR(High Dynamic Range)の扱い方については、以下の記事で解説しています。

 

 

Bloomを追加する

「Bloom」のエフェクトを追加する場合は、「Post Process Volume」のコンポーネントで [Add effect…] ボタンをクリックし、[Unity] -> [Bloom] を選択します。

Bloomの追加
Bloomの追加

 

トーンマッピング(ディスプレイで表示できるように輝度をマッピングし直すこと)を使うため、「Color Grading」のエフェクトも追加しておくと良いでしょう。

Color Gradingの追加
Color Gradingの追加

 

ポストプロセシングを使うための設定は以下の記事をご覧くださいな。

 

 

 

Bloomの設定項目

Bloomの設定項目は以下のようになっています。Bloomの左にあるチェックボックスを外すとエフェクトが適用されなくなります。チェックを外すと全体がグレーアウトされて設定値を変更できなくなるため、うっかり値を変更するのを防ぎたい時はこちらで。

また、右側にあるOn/Offのボタンで切り替えてもOKです。On/Offで切り替える時は値を変更できるので、エフェクトは表示しないけど値は変えておきたい、なんて時にはボタンで切り替えると良いでしょう。

設定値を変える場合は、各項目の左側にあるチェックを入れます。チェックを外した状態だとデフォルトの値が使用されます。

Bloomの設定項目
Bloomの設定項目

 

Bloom

Bloomのエフェクトは2つのパートに分かれています。まずは上の方から。

 

Intensity

エフェクトの強度を設定します。Intensityを上げると光の強さが上がるため、画面が白飛びすることもあるかもしれません。Colorの項目で設定するカラーピッカーの中でもIntensityの項目があるので、うまくバランスを取るようにすると良い感じです。

 

Threshold

閾値の設定です。この値に満たない明るさの光にはエフェクトを適用しないようにします。特に強い光だけを強調してエフェクトをかけたい時に便利です。画面全体にBloomをかけるとぼやけた感じにもなってしまいますからね。

この値はガンマ色空間の輝度、つまりガンマ補正された輝度が使われます。

 

Soft Knee

ソフトニーは直訳すると柔らかな膝。……この説明だとなんのこっちゃですが、折れ線グラフの折れ曲がり方が膝のようだから「ニー」という言葉が使われています。

ニーのイメージ図
ニーのイメージ図

 

膝の部分が閾値を表しており、ハードニーだと閾値を超えたら急にエフェクトを適用、ソフトニーだと閾値を超えていなくても閾値に近ければちょっとエフェクトを適用、というイメージになっています。

「Soft Knee」の設定値は0から1の間をとり、0だとハードニーに、1だとソフトニーになります。

 

Clamp

ピクセルに対するBloomの量を制限するための値です。Thresholdと同様にガンマ色空間の輝度が使われます。

デフォルトの値は65472なので、めちゃくちゃ大きいです。Bloomをかけてみて過度に明るくなりすぎるな、なんて時に減らすようにすると良いでしょう。

どんな感じに制限されるか確かめたいときはClampを0に設定してみて、少しずつ値を大きくしていくと様子が分かります。65472がいかに大きい値か分かってもらえるはず。

 

Diffusion

光の拡散の度合いを表す設定です。設定値は1から10までで、1にすると拡散がほとんどない状態、10だと画面全体に広がる状態になります。10にするとちょっとやりすぎ感があるので、画面を見ながら調整します。

Diffusionが10の場合
Diffusionが10の場合

 

内部的にイテレーションカウンタ(ループのカウンタ)として使っているようなので、整数で設定するのが良さそうです。

 

Anamorphic Ratio

Bloomのエフェクトに与える歪みの割合を設定します。Anamorphic(アナモルフィック)は歪んだ、歪像の、といった意味の言葉です。映画用フォーマットである横長の映像を撮影するために横方向に縮めて撮影できるレンズがあるのですが、これがアナモルフィックレンズと呼ばれています。

ポイントは像を歪んだ状態にすることで、Bloomの広がり方を縦方向、あるいは横方向に設定することができます。

設定値は-1から1で、-1から0の範囲にすると縦方向の歪み、0から1の範囲にすると横方向の歪みになります。デフォルトでは0で、全方向に広がるようになっています。0から離れた値になるほどパフォーマンスへの影響が大きくなります。

 

Color

Bloomの色を決める設定です。HDRのカラーピッカーを使って、色と強度(Intensity)を設定できます。上でも書きましたが、エフェクトのIntensityと、このカラーピッカーのIntensityの両方を強くすると一気に画面が明るくなって白飛びするので、画面を見ながらバランスを取るようにしてください。

HDRのカラーピッカー
HDRのカラーピッカー

 

Fast Mode

Bloomのクォリティを下げて、パフォーマンスを向上させます。モバイルなどのPCほど性能が高くないデバイスでゲームをリリースする場合に便利です。

Bloomが適用されているだけで結構見栄えも変わるので、多少クォリティを下げたとしても、何もしないよりは良い結果を得られるはずです。

 

Dirtiness

下のパートはDirtinessに関する設定で、レンズについた汚れを表現します。

 

Texture

汚れを表現するテクスチャーを選択します。Post Processing Stack v2のパッケージをインストールするとデフォルトで4種類の汚れテクスチャーが付いてくるので、これを使ってみると様子が分かりやすいです。下の画像だと右側にレンズの汚れがあるように見えますね。

Dirtinessの例
Dirtinessの例

 

テクスチャー選択画面の右上にある表示切り替えボタンをクリックすると、パッケージ内のテクスチャーも表示されるようになります。

テクスチャーの表示を切り替える
テクスチャーの表示を切り替える

 

Intensity

汚れの強度を設定します。レンズに入ってくる光の量が多くなると、レンズ表面の汚れもより目立つようになります。

Bloom側のIntensityと相乗効果で光が強くなるので、こちらも上げすぎて白飛びしないように全体のバランスを見ながら設定しましょう。

 

デモ

Bloomを使っていくつかシーンを作ってみます。

 

デフォルトのオブジェクト

アセットをインポートすることなく使えるSphereやCubeを使って以下のシーンを作成しました。

配置直後のGameウィンドウ
配置直後のGameウィンドウ

 

マテリアルの設定、ライトのベイク、ポストプロセシングの設定を行っただけで見た目がだいぶ改善されました。

BloomとColor Grading
BloomとColor Grading

 

夕方の村

アセットストアで購入したアセットを使わせてもらって以下の画像を撮影。シンプルにBloomを設定するだけでもいい感じに。

村の外灯
村の外灯

 

夜の図書館

夜の図書館で撮影。ろうそくの光にBloomを適用することで暖かい雰囲気になります。Dirtinessでレンズ汚れのテクスチャーも設定したので、画面右側のろうそくのあたりに表示されるようになっています。

こんな図書館で本を読みたい
こんな図書館で本を読みたい

 

大聖堂

大聖堂の中で撮影。単純にIntensityを上げると手前のろうそくが白飛びしてしまったので、Clampを1.3にして制限をかけました。ステンドグラスの青い光は結構強度を上げないといけなかったので、Clampを使ってバランスを調整する必要がありました。

ラスボスがいそう
ラスボスがいそう

 

冒険者の宿

冒険者の宿についている酒場のイメージで。活気のある雰囲気を出したかったので、Thresholdを下げて全体的に暖色系のBloomが適用されるようにしてみました。

活気のある雰囲気を演出
活気のある雰囲気を演出

 

まとめ

Bloomの使い方やエフェクトの設定項目について解説を行いました。

お手軽に素敵な雰囲気を演出できるBloomをぜひマスターしてみてね。強度と閾値のバランス調整をしっかりすれば、欲しいところにいい感じのBloomが適用されてプレイヤーもワクワクすること間違いなし。

そして作っている側もワクワクするので、モチベーションがめっちゃ上がります。

 

     

ゲーム開発の攻略チャートを作りました!

CTA-IMAGE

「ゲームを作ってみたいけど、何から手を付けていいか分からない!」


そんなお悩みをお持ちの方向けに、todoがアプリをリリースした経験を中心に、ゲーム作りの手順や考慮すべき点をまとめたe-bookを作成しました。ゲーム作りはそれ自体がゲームのように楽しいプロセスなので、「攻略チャート」と名付けています。


ゲームを作り始めた時にぶつかる壁である「何をしたら良いのか分からない」という悩みを吹き飛ばしましょう!