GDC 2012 | The Tricks Up Our Sleeves（後半） - ゲームエフェクトデザイナーのブログ

前回に続いて、残りの講演内容をピックアップしたいと思います。

ここからはアンチャーテッド３で直面した様々なエフェクト表現の課題と、それらをどう解決していったかについて紹介されています。

THE FX CHALLENGES OF UNCHARTED 3

Keith 氏のスライドに Uncharted 3 での課題として下記のように掲げられています。

How do we utilize dynamic materials to create complex detail and motion within the particle system?
パーティクルシステムで複雑なディテールやモーションを作成するためにダイナミックなマテリアルをどのように活用するか？

そして、風・煙・火などを大まかな動きだけでなく細かい制御まで行いたい場合にどうすれば良いか？とコメントで補足がされています。

● Scrolling UV Distortion

スライド内ではマテリアルでの最低限の構成から始まり、UV をタイリングしたり別のテクスチャで歪ませたりする基本的な構成を順に丁寧に解説されていますが、最終的に（恐らく）UVスクロールさせたテクスチャで UV Distortion させる「Scrolling UV Distortion」でディティールを与える表現に至っている様子が紹介されています。

そして Uncharted 3 のエフェクトでこちらのテクニックを最も多く使用しているそうですが、制御が難しく曖昧なノイズになりがちなデメリットも述べられています。

● Flow Technique

そこで、Uncharted 1 の水のために開発されたテクニック「Flow」（いわゆるフローマップ）について触れられています。「これをどう作成すれば良いか？」については「the coolest one for us takes advantage of the Paint Fluid Velocity tool in Maya.（我々にとって最もクールなものが Maya の Paint Fluid Velocity Tool を活かすこと）」であり、グラフィックスプログラマの Carlos Gonzalez Ochoa Aleman 氏が書いてくれたスクリプトでベクトルをテクスチャにベイクしたとのことです。

そしてフローマップを使った色々な事例が紹介されています。動画が再生されないのがとても残念ですね。。

そして砂漠の砂丘の頂上で吹く砂の風の構成では「blend with the desert, shift directions, randomness, etc（砂漠とのブレンド・方向のシフト・ランダム性など）」を加えているとのこと。
▼ Source: page 68 of "The Tricks Up Our Sleeves," 2012, by Keith Guerrette at Naughty Dog

ただし Flow Technique はデメリットとして「negative space（空白の部分）が多い = Overdraw」と指摘があります。

また余談ですが、アニメーションのあるテクスチャは Flipbooks と表現されますが、逆にアニメーションしない一枚絵のテクスチャは static textures / static sprite images と表現されています。なるほど！

BURNING DOWN A CHATEAU（焼け落ちる大邸宅）

次に火災の表現が取り上げられており「The Chateau level was one of the first production levels posing a challenge for the FX artists.（大邸宅のレベルは最初のプロダクション・レベルの１つであり、FX アーティストにとって難題でした。）」と説明されています。
▼ Source: page 71 of "The Tricks Up Our Sleeves," 2012, by Keith Guerrette at Naughty Dog

pose a challenge = 難題をもたらす

しかしクールな炎は作れても、部屋の中を十分な炎と煙で埋めて地獄の業火のような状態にできるか自信が無かったそうです。実際「When we tried filling the main hall with fire, we tanked the game to about 12 fps.（メインホールを火で満たしてみると、約 12 fps にまで落ち込んでしまいました。）とのこと。
tank [動] = 駄目になる・暴落する

30 fps で実現するために下記の方法を採ったそうです。

So what we needed was a cool way to imply all of the macro and micro detail of fire with as few particles as possible.
そこで我々に必要だったのは、できるだけ少ないパーティクルで、火の大規模～微細なディテールの全てを imply するクールな方法でした。※ imply（示唆する）の良い訳し方が分からない‥

The approach we tried, thanks to Eben Cook’s ingenuity, relies on a technique that we call “soft particles”, or that Unreal calls “depth bias blend”
我々が試したアプローチは、Eben Cook 氏の創意工夫により、我々が「ソフトパーティクル」と呼ぶ・または Unreal が「深度バイアスブレンド」と呼ぶテクニックを頼りにしたものです。

ingenuity = 創意工夫・発明品

ソフトパーティクル自体の説明はここでは割愛しますが、深度との比較にテクスチャを使ってスクロールしたらどうかとコメントがあります。

But what happens if we input a texture to offset/bias this Z-Depth comparison?
しかし、この Z 深度の比較をオフセット/バイアスするためにテクスチャを入力するとどうなるでしょうか？

Further more… what happens if we scroll this texture?
さらに、このテクスチャをスクロールさせるとどうなるでしょうか？

その結果がこちら。
▼ Source: page 75 of "The Tricks Up Our Sleeves," 2012, by Keith Guerrette at Naughty Dog

これは‥！

今までマテリアルを作ってきていて全く考えたことがありませんでした。

ビルボードをテクスチャでただ透過した場合とどこまで違いが出るかは分かりませんが、背後のオブジェクトと近い場所だけマスクされるのがむしろ都合が良い感じでしょうか（しかしカメラが水平に近いとほとんど透過しなくなってしまう弱点がありますが）。とりあえず一度試してみたいと思いました。

最終的な製品のシーンはこちら。
UNCHARTED 3 DRAKE'S DECEPTION Gameplay Walkthrough Part 1 FULL GAME [4K 60FPS PS4 PRO] No Commentary - YouTube

ちなみにこちらを UE で試したい場合、自前でパーティクルのピクセルと深度とを比較する必要があるので、ベースマテリアルノードのプロパティで Z Test を無効にしておき、PixelDepth と SceneDepth の差に応じて透過度を与える際にテクスチャを加える形になるかと思います。

または DepthFade を２つ使って距離が近いピクセルの領域だけ抽出して、そこに対してテクスチャでマスクしてあげるのが手っ取り早いかも知れません。

そして、下の画像は２枚のパーティクルを表示しただけのものだそうです（！）
▼ Source: page 76 of "The Tricks Up Our Sleeves," 2012, by Keith Guerrette at Naughty Dog

背景に沿って配置するマテリアルで、良い感じのリアルな炎に見せるのはそれ自体が難易度が高いとは思いますが、１つのマテリアルの中で複数枚の Flipbook を重ねたりと色々工夫しがいがありそうですね！

パーティクルの枚数が減ると CPU にも優しいと思いますが、気を付けないと１枚の表示サイズが大きくなる = ソートの問題が起こりやすくなるという事にもなりそうです。

火災のシーンを少し集めてみました。

CRASHING A CARGO PLANE

次の大きな課題は砂漠に墜落する貨物機だったとのことです。
▼ Source: page 80 of "The Tricks Up Our Sleeves," 2012, by Keith Guerrette at Naughty Dog

How do we make a realistic looking, thick, volumetric smokestack with enough broad and subtle motion to feel like its huge, but in the distance?
我々はどうすれば、十分に太く繊細な動きのある巨大かつ遠方に感じさせるリアルなルックでボリュームのある煙を作れるのでしょうか？

The answer that we came up with for this challenge uses a few normal maps, and some fancy math.
今回の課題のために私たちが考え出した答えは、いくつかの法線マップといくらか凝った計算を使うことです。

fancy [形] = 手の込んだ・風変わりな・極上の

という訳で、ライトベクトル・法線マップと Dot Product（ドット積 / 内積）を利用してハイライトとセルフシャドウを得られるだけでなく、モコモコと隆起のある法線マップを UV スクロールさせることでかなり複雑な動きを与えることができると解説されています。
▼ Source: page 84 of "The Tricks Up Our Sleeves," 2012, by Keith Guerrette at Naughty Dog

By using 3 sets of scrolling normal maps, and the scrolling distortion concept I talked about early on the alpha, I can generate a material like this one.
３セットのスクロールする法線マップと、最初にお話したスクロールディストーションの概念を使うことで、このようなマテリアルを生成できます。

なるほど‥煙に対してノーマルをスクロールさせる発想は無かった‥ので、こちらもまた試してみたいと思います！

最終的な製品のシーンはこちら。
UNCHARTED 3 DRAKE'S DECEPTION Gameplay Walkthrough Part 1 FULL GAME [4K 60FPS PS4 PRO] No Commentary - YouTube

こちらのテクニックのデメリットとして「Requires A LOT of particles（大量のパーティクルが必要）」と「Very expensive shader（シェーダーの負荷が非常に高い）」点が挙げられていますが、真面目にライティングするより Unlit で疑似的にライティングする方がずっと安価になりますよね。

INTERACTING WITH THE DESERT

次は砂漠とのインタラクションについて取り上げられています。
まずは砂丘に吹く砂煙の表現について。

How do we make fluid, realistic sand interactions that consider the angle and direction of the sand dune?
砂丘の角度や方向を考慮した、流体・リアルな砂の相互作用をどうやって作れば良いでしょうか？

こちらに関しては Marshall 氏がパーティクルをデカールのように砂丘ジオメトリに投影させる機能を用意してくれたことで解決したそうです。なるほど！

UE で言えば、Niagara 登場以前はデカールコンポーネントをパーティクルにように扱う（移動・スケール・色やアルファをカーブアニメで制御するなど）のは標準機能では難しかったと思いますが、Niagara なら Component Rendereで DecalComponent を利用することで可能なのではないでしょうか。（ちゃんと試してないですが。。）

それから、Marshall 氏からエミッシブの代わりにワールド法線に描画するパーティクルを使うことを考えてみてくれないかと提案があり「This concept had some jaw dropping outcomes for us.（このコンセプトは、私たちにとって衝撃的な結果をもたらしました。）」とのこと。
jaw drops = びっくりする・驚いで大口を開ける
▼ Source: page 97 of "The Tricks Up Our Sleeves," 2012, by Keith Guerrette at Naughty Dog

他のパーティクル同様に制御が可能なため、単に足跡だけではなく砂山から砂が流れ落ちるような表現も可能になったそうです。

We can make a hole in the ground, again scaling and threshold blending, with some flow on the grain to imply the sand falling into the middle
私たちは地面に穴を開け、再びスケーリングと閾値ブレンドを行い、砂が真ん中に落ちるニュアンスを出すために粒にいくらか流れを作ることができます。

▼ Source: page 99 of "The Tricks Up Our Sleeves," 2012, by Keith Guerrette at Naughty Dog

デカールで法線を上書きして足跡を表現するようなことは定番かと思いますが、さらに砂が流れ落ちるような動きを加えるというのは非常に良いアイデアですね‥！Death Stranding で手のひらの形に地面が窪んで水が溜まる表現は非常に刺激的な事例でしたが、工夫次第で面白い表現がいくらでも広がっていきそうですね。。

ここから、足跡と砂丘の傾斜に合わせて流れる砂を併せてひとまとめのエフェクトにするといったさらなる工夫を加えていったそうです。足跡を付けるだけで終わらず、より良い表現を追求していく姿勢が素晴らしいです。
▼ Source: page 103 of "The Tricks Up Our Sleeves," 2012, by Keith Guerrette at Naughty Dog

最終的な製品のシーンはこちら。
UNCHARTED 3 DRAKE'S DECEPTION Gameplay Walkthrough Part 1 FULL GAME [4K 60FPS PS4 PRO] No Commentary - YouTube

RETROSPECTIVE（振り返り）

最後に、オープンなコミュニケーション・実験・チームワークが私たちの最大の資産であるとしつつ、以下のようなデメリットの列挙でスライドは締め括られています。

● “With great power comes great responsibility”
　「大きな力には大きな責任が伴う」
　　We break the game all the time…locally.
　　我々は常にゲームを壊している...ローカルで。

● Slow workflow from the vast amount of control
　膨大な量の制御による遅いワークフロー

特に２番目はまさに、日々悩ましさを痛感していることでもあります。

制作環境を便利にすればするほど機能・パラメータが膨大になり、表現力が増す一方で習得コスト・制作コスト・不具合が出た際のデバッグコスト・メンテする人の保守コストが跳ね上がりますよね。。

と言う訳で、2012 年の講演スライドでしたが学べることが非常に沢山ありました！