Dead Cellsの3Dパイプラインを順に見る

アーティスト自身が語ったパイプライン

2018年1月、Dead Cellsを手がけるMotion Twinで1年間唯一のアーティストだったThomas Vasseurは、Gamasutra(現Game Developer)に“Art Design Deep Dive: Using a 3D pipeline for 2D animation in Dead Cells”を寄稿しました。手順は次のとおりです。

1. まずピクセルアートのモデルシート。キャラクターの基本的な2Dシートを描き、それを下敷きに3ds Maxでキャラクターとスケルトンを3Dで作り、FBXとして書き出しました。
2. とても単純なモデル。ゲーム内のキャラクターは高さが約50ピクセルしかないため、3Dモデルを細かく作り込む価値はありませんでした。
3. アンチエイリアスなしで小さくレンダリング。自社製のプログラムが、アンチエイリアスなしでメッシュをごく小さなサイズにレンダリングし、ピクセルらしい見た目を作りました。
4. 2Dと同じようにキーフレームでアニメーション。攻撃はポーズ・トゥ・ポーズで作られました。まずキーを最小限のフレーム数でタイミング調整し、そのあとでキーの前か後ろにだけ中割りを足し、キーとキーの間には入れませんでした。
5. 全フレームをノーマルマップ付きで書き出し。各フレームはノーマルマップとともにPNGとして保存され、ゲーム側は単純なトゥーンシェーダーでライトを当てられました。

うまくいった理由

ディープダイブは理由をはっきり述べています。すべてのフレームを描き直す必要がなかったこと。1つのアニメーションを複数のモデルで使い回せたこと。鎧のパーツは、それが映るフレームをすべて描き直すのではなく、3Dモデルに取り付けるだけで追加できたこと。古いモデルやパーツを再利用して新しいモンスターを作れたことは、ワークフローで最も役立つ工夫であり、何百時間も節約できたと本人は述べています。

何より、やり直しが安くなりました。ゲームプログラマーが攻撃のタイミングを変えたり武器を遅くしたりしたときは、タイムライン上でキーを動かして、もう一度レンダリングするだけです。手描きのアニメーションなら同じ変更でも描き直しになり、結局やらないことも多いのです。

Pixorで同じことをする

Dead Cellsのレンダラーは独自のもので、公開されたことはありません。Pixorは別のアプリで、Blenderでリグを組んだモデルでも、Mixamoからダウンロードしたモデルでも、無料ライブラリのモデルでも、手元のどんなモデルにも同じ手順を適用できます。

横向きカメラ。シーンのステップで、アウトライナーの南カメラをクリックし、ゲームをプラットフォーマーに設定します。右向きの横から見た1方向で、左向きはミラーで作ります。武器を持つキャラクターなら、幅と高さを64ピクセルか96ピクセルに上げてください。選ぶときはスプライトサイズのガイドが役立ちます。

小さく、くっきりレンダリング。Pixorは各フレームをスプライト自身のピクセルグリッド上に描きます。既定ではエッジのアンチエイリアスなし(--aa 0)で、色はパレットのランプ内に限られ、全フレームで1つのピクセル/メートルのスケールを使い、ピボットは1ピクセルに固定されるので、キャラクターがふらつきません。

小さいだけでなく、ルックを。Dead Cellsはライティングとトゥーンシェーダーに頼っていました。スタイルのステップでは、seloutプリセットが明暗の帯、色相シフトしたランプ、選択的アウトラインを与えます。帯はフレーム間で安定しているので、走りのアニメでもちらつきません。

ポーズ・トゥ・ポーズ。アセットのステップで、スプライトノードの残すフレーム数は、クリップのポーズから選んだスマートフレームをその数だけ残し、それぞれ次のポーズまで保持します。これがポーズ・トゥ・ポーズのカットです。スイングの極端なポーズは残り、やわらかい中割りは消えます。

ノーマルマップ。書き出しにノーマルマップ(--export normal)、またはライトキット(--export light-kit)を加えます。ライトキットはGodot、Unity、GameMakerで、ノーマルからスプライトにライトを当て、光が当たったピクセルも自分のカラーランプ上にとどまります。パレットに忠実なライティングを参照してください。

鎧と武器。小道具はボーンに取り付けます。手に剣、頭に兜といった具合です(--prop sword.glb:hand.r)。すべてのクリップがそれを引き継ぎます。

アニメーションの再利用。同じスケルトンを持つ別ファイルのクリップは、--animで、またはモデルの隣にmodel@clip.fbxという名前のファイルを置いて追加できます。モーションライブラリのクリップ、lib:idle、lib:walk、lib:run、lib:attackなどは人型スケルトンに合わせてあるので、新しいキャラクターもアニメーションを付ける前から走りと攻撃を持てます。

コマンドラインから

上の騎士を、ビルドスクリプトが作るならこうなります。

pxr render knight.glb --preset selout --camera platformer --size 96 \
  --clip lib:run --clip lib:attack --smart-frames 8 --export png,json,normal

そしてやり直し。3Dツールでクリップのキーを変えるか、ここでフレーム数を変えて、同じ行をもう一度実行します。どのフレームも同じスケール、同じピボットで出てくるので、新しいシートは古いシートの場所にそのまま差し替えられます。モデルのフォルダ全体に同じ行を使えば(pxr batch models/ --camera platformer --size 96)、キャラクター全員が1つのルックにそろいます。

最後に手直し

Dead Cellsのフレームは3Dの中で仕上げられていました。その上に手描きのディテールを足したいなら、Pixorはアクションごとにタグを付けた.asepriteファイルを書き出し、再レンダリングしても自分で描いたレイヤーは残ります。手直ししてから再ベイクを参照してください。この技法の1990年代から現在までの歴史は、プリレンダリングスプライトにあります。