
[unity]いいフォグは7難隠す。美しいフォグを求めて。
unityでフォグを表現するには、Window -> Remdering -> Lighting で設定する。なかば常識ではあるのですが、このフォグは納得いかないというかたも多いのでしょうか。少なくとも私は納得できませんでした。
フォグというのは重要だと思っていて、美しい雰囲気をだすのは作品としてよく、遠くを隠すのはゲームとしてよい。その他にも「隠す」というのはゲームのようなインタラクティブ作品にとって、直接的でよい効果が期待できます。
今回はKronnectのフォグアセット2つ、Volumetric Fog & Mist 2 と、Dynamic Fog & Mist 2 をインストールして比べてみました。
どちらもURPで使います。
なお、今回は試験用サンプルとして、あらかじめGaiaにて地形を作成しております。
1. アセットのインポート
はじめに、Volumetric Fog & Mistをインポートします。
2段階インポートとなっており、まずWindow -> Package Manager から URPパッケージを選んでインポートし、ついで Project / Assets / VolumetricFogBundle / URP にある VolumetricFog2_URP.unitypackage をインポートします。



続けて、Dynamic Fog & Mist 2をインポートします。
こちらも2段階インポートとなっており、まずWindow -> Package Manager から URPパッケージを選んでインポートし、ついで Project / Assets / DynamicFog / URP にある DynamicFog_URP.unitypackage をインポートします。



2. フォグの設置(Volumetric Fog)
Volumetric Fog & Mist 2の Volumetoric Fog を追加してみます。
HierarchyにEffectObjectを追加することでフォグを設定できます。



Fogの領域が小さすぎるようですので、地形の低地部を覆うように inspector の Scale を拡大してみます。

このままでは、プロファイルがなくて正しく表示されていないようです。Inspector の New Fog Profileをクリックしてフォグのプロファイルを追加します。

プロファイルが追加され、パラメータを調整できるようになりました。


動かしてみると、たしかに霧のエリアができているようです。


フォグは自然な感じで流れていますが、濃すぎです。
フォグの濃さは、Densityで調整できそうです。


フォグの色はアルベドを変更するとよいようです。


3. フォグの設置(Dynamic Fog)
Dynamig Fog & Mist 2 を試してみます。
こちらも Volumetric Fog を追加してみます。
HierarchyにEffectObjectを追加することでフォグを設定できます。
Volumetric Fog は削除してあります。

Dynamic Fogのほうは、全体にフォグがかかるようです。

プロファイルがないためうまく表示されていないようですので、InspectorのNew Fog Profileでフォグのプロファイルを作成します。


Inspector で Dynamic Fog のDensity Linear と Density Exponential を調整して、フォグの効き具合を調整します。


このようにフォグを弱めたのですが、TPS あるいは FPS のコントローラで弱まったはずのフォグに突入すると、視界はまっしろになってしまいました。
Dynamic Fog & Mist 2 は、トップビュー系ゲーム専用といえそうです。
Inspector にある、 Fog od War Editor をオンにすると、フォグの形状の加工ができるようになりました。これで、一部最初から霧が晴れているという設定などができそうです。興味がありましたら試してみてください。
4. Fog of War(戦場の霧)について
Volumetric Fog での、Fog of Warの使い方 を調べてみました。使い方自体はそれほど難しくなさそうです。
Inspectorの Enable Fog of Warにチェックを入れます。

コントロールスクリプトに、霧を消去するコードを追記します。
// 定義部に追記
using VolumetricFogAndMist2;
(中略)
//初期化部に追記
public VolumetricFog fogVolume;
public float fogHoleRadius = 8f;
public float clearDuration = 0.2f;
(中略)
// キャラクターコントロール部に追記
fogVolume.SetFogOfWarAlpha(transform.position, fogHoleRadius, 0, clearDuration);
このスクリプトに hierarchy の FogVolume をセットします。

今日はunityで、Fog of war(戦場の霧)を試してみました。歩いたところの霧が晴れていくという、Civilizationなどにあった演出です。
— k1t(外神) (@k1togami) October 22, 2022
ちょっとおもしろいですよね。 pic.twitter.com/EArBolMvSg
Fog of War は Volumetric Fog と Dynamic Fog によって Script が異なりますが、どちらでも同様に使えます。便利だなぁ。
Fog of War は、ゲーム性に密接しているシステムです。特に、探索型ゲームではこの機能の有無でゲームルールが大きくかわりかねません。
いままで Fog of War の実装が難しくて諦めていたところがあったのでうれしい! ほしかった! ありがとう Kronnect さん。
5. Volumetoric Fog と Terrain の調整
Volumetric Fog は羊羹のような形状のエリアフォグでしたが、Inspector の Geometry / Terrain Fit をオンにすると、フォグがテレインにぺたっとフィットするようになりました。
これはテレインを使ったゲームでは便利そうです。


今回は Fog & Mist でした。
この Fog はなかなか見栄えもするよう考えられているようで、調整のしがいがあるのではないでしょうか。
たとえば、Resive Shadow をいれると木漏れ日に近い効果が得られたりしました。

こういうのがあれば、フォグの濃淡をつかった導線の示唆なんていうのもできそうですね。
本アセットがあれば、ひととおりフォグにもとめていそうな機能が使えそうなことはわかりました。トップビューのゲームかそうでないかで、2つの Fog & Mist を使い分ければよさそうです。
これでまたギミックが増やせそうですね。
ではまた。ゲーム制作者魂がともにあらんことを。(k1t)