新しい 2D サンプルプロジェクト：Lost Crypt

このたび私たちは、新しい 2D ツールの性能を試すために、2D の横スクロールデモを作成しました。この記事では、これらの統合型 2D ツールが、Unity でのハイエンドなビジュアル作成にどのように役立つかについてご紹介します。

高スキルなチームでは、これまでも Unity で魅力的な 2D ゲームが作られてきましたが、私たちは、個人レベルのアーティストから大規模なチームまで、誰もが優れたビジュアルのゲームを作成できるよう、2D ツールをさらに増やしたいと考えてきました。それらの多くは、現在ベータ版で提供されている、Unity 2019.3 の一部としてリリースされる予定です。

今回ご紹介するのは、包括的な 2D ツールスイートを使用して作成された、Lost Crypt というデモです。このゲームの生き生きとしたシーン表現には、アニメーション、ライトエフェクト、自然の地形、シェーダー、およびポストプロセッシングが使用されており、そのすべてが 2D でネイティブに作成されています。このデモは、あらゆる規模のチームやプロジェクトが、あらゆるプラットフォームを対象に、見る人を惹きつける美しい作品をよりすばやく実現できるようになったことを示すものです。

Lost Crypt はデスクトップコンピューターで快適に動作するよう作られていますが、iOS や Android デバイスでも実行できるよう、新しい Input System を使用したオンスクリーンのコントロールも実装されています。我々のテストでは、iPhone 6S などの一般的なデバイス上で、30 fps のパフォーマンスが確認されました。

アセットストアからダウンロード

アセットストアから Lost Crypt をダウンロードしたら、空の「New Project」から開始し、「2D」を選択した後、パッケージマネージャーの「My Assets」からプロジェクトをインポートすることをお勧めします（アセットストアページの「My Assets」をクリックしてインポートすることもできます）。プロジェクトには、必要な 2D パッケージがすべて含まれています。インポートすると、プロジェクト設定が上書きされ、レンダリング設定がユニバーサルレンダーパイプライン内の 2D Renderer に変更されます。

プロジェクトをインポートすると、Main Scene が表示されます。「Play」をクリックすると、キーボードの矢印を使用して普通にプレイし、スペースバーでジャンプできます。

スクリプトとゲームロジックは至ってシンプルです。というのも、このデモのメインフォーカスは、2D ツールを使用してデモのコンセプトアートを具現化することだったからです。

私たちは、デモをいくつかのタスクに分割し、そのビジュアル課題の解決に利用する 2D ツールを選択しました。

キャラクターは Photoshop でデザインされ、2D PSD Importer で直接インポートされました。スプライトエディターで Sara.psb ファイルを開き、キャラクターの設定とリグを表示してください。Photoshop でファイルを開くと、それぞれのパーツやレイヤー名が維持されているのがわかります。

ユニバーサルレンダーパイプラインで提供される機能の 1 つが、新しい Sprite Lit マテリアルです。通常のスプライトデフォルトマテリアルと違って、このマテリアルではスプライトを 2D ライティング条件に反応させることができます。

私たちは、スプライトエディターの「Secondary Textures」ドロップダウンメニューを使用して、キャラクターの法線マップをインポートしました。開発者は、2D アニメーション化したキャラクター、通常のスプライト、タイルマップ、および Sprite Shape に、法線マップとマスクマップを追加することができます。

キャラクターには 2D IK ソルバーがあり、これによってアニメーターは、足首と足の端（tips）を正しくポジショニングして、脚を現実感のある動きで追従させることができます。

キャラクターのリグ付けをした後、私たちは別のアニメーションを複数作成し、Animation ツールと Animator を使用してそれらのステートを制御しました。ツールがどのように機能するかについては、GDC 2019 でのこちらのトークでご確認いただけます。

キャラクターのポニーテールは、また別の子ゲームオブジェクトになっていて、2D 物理演算によって制御されます。ポニーテールのすべてのボーンに Hinge Joint 2D コンポーネントがあり、いくつかの制限が設定されているので、ポニーテールがリアルに反応するようになっています。これによって、髪が曲がり過ぎたり、キャラクターの動きに過剰に反応したりせず、かつ自由に動くようになっています。

スプライトに動的ライティングを適用することで最も効果が発揮される表現の 1 つが、環境の外観の変更です。同じスプライトを使用して、雰囲気、時間帯、場所の暗さなどを変えながら、隠された仕掛けから生き生きとしたリッチな世界観まで、さまざまなゲームプレイのメカニクスを作り出すことができます。

このデモでは、カラーグラデーション値（昼間から夜までのライト色）を保持したシンプルなスクリプトを使用してシーンのライトを制御し、親ゲームオブジェクトの Time パラメーターに応じてライトとマテリアルの色が変わるようにしました。このようなセットアップによって、異なるライト同士がどのようにブレンドし合うかを視覚的に制御できるようになっています。

2D ゲームの開発者がかつて抱えていた大きな課題の 1 つに、丘、勾配、不規則な地面など、自然の地形をいかに効率的に作成するかという課題がありました。これは、緻密に作られたタイルシートを使用しなければ達成できない表現でした。その後、これはテレインのパーツを表す複数のスプライトを使用することで表現できるようになりましたが、ワークフローやパフォーマンスについては改善の余地がありました。

2D Sprite Shape を使用すると、ベクトルベースの描画アプリケーションと同じような方法で、テレインとコライダーを生成することができます。開発者は、ブラシ（Sprite Shape Profile）を調整できるので、環境のイテレーションのたびに多数のスプライトやコライダーの調整が発生することを心配せずに、製作を開始することができます。

Lost Crypt では、NodeAttach スクリプトなど、Sprite Shape の拡張もいくらか使用されています。これによってスプラインに要素をアタッチし、それらをスプラインに追従させるようにしています。このデモでは、岩にこのスクリプトが使用されているほか、花のレイヤーに ConformingSpline が使用されていて、草スプラインの形状に追従するようになっています。開発者は、私たちがフォアグラウンドの草レイヤーで行ったように、この機能をゲームプレイや装飾要素に使用することができます。

タイルマップは、おそらく最も重要な 2D ツールの 1 つと言えるでしょう。これは、「タイル化」して繰り返し使えるグラフィックスの小さな塊によってメモリスペースを節約するという目的だけでなく、レベルデザインにおいても不可欠なツールです。

Lost Crypt では、2D タイルマップエディター（パッケージマネージャーから利用可能）を使用して地下室の内部を再現し、いくつかの Tilemap エクストラツール（GitHub から入手可能）を追加的に使用して、レベルデザインプロセスを効率化しました。たとえば、タイルをブラシのようにペイントできる、Rule Tile というタイルタイプも使用されました。これを使用すると、隣接するタイルや終端に応じて、適切なタイルが自動的に選択されます。

ゲームでは、炎のエフェクトもよく使用されます。そこで私たちは、Lost Crypt でも炎のエフェクトを 1 つ追加しました。私たちはまず、パーティクルシステムと 2D 用シェーダーグラフを使用して、松明のゲームオブジェクトをいくつか作成しました。出力シェーダーには Sprite-Lit マスターノードを使用しました。そして、パーティクルシステムでアニメーションの再生に使用される従来のスプライトシートで、炎のアニメーションを作成しました。

私たちが炎用に作成したシェーダーでは、HDR の色合いを使用して、ボリュームポストプロセッシングを使ったオブジェクトの周囲の発光の強さが高められています。親ゲームオブジェクトには、アルコーブを照らすスパークのパーティクルとライトが含まれています。

リフレクションや屈折も、シェーダーでよく見られるユースケースです（たとえば、水、氷、鏡、またはモニターに、そのレベルの別の領域が映る表現など）。

地下室内での水のエフェクトは、すべてシェーダーグラフで作成されました。私たちは、いくつかのパラメーター（水の色、波の速さ、歪み、波紋エフェクトなど）を公開し、シーンでの最終的な外観を調整できるようにしました。環境の反射イメージを投影するために、私たちは追加のカメラを作成してイメージをテクスチャに出力し、それがシェーダーグラフによって読み取られるようにしました。また、ポストプロセッシングブルームのパスを追加して、水のコースティクスが光るようにし、水面に見栄えのよいエフェクトを加えました。

アニメーション化した環境表現の 1 つとして、風に揺れる木の枝があります。これを表現するために、私たちはそれぞれの木の枝葉プレハブにシェーダーを 1 つだけ使用するようにしました。これにより多様性が確保され、重複が回避されています。

Vegetation Wind-Lit グラフを見ると、私たちが作成した 2 つのエフェクトの内容を確認できます。1 つはアニメーション（揺れ）エフェクトです。これは、ノイズパターンを変更するいくつかのパラメーターに従って頂点位置を動かすことにより作成されました。もう 1 つのエフェクトは、G（緑）チャンネルを使用して、枝葉の周囲のリムライトのトーンを調整するエフェクトです。

ライトのブレンドスタイルは、ライトがスプライトにどのように影響するかを示す、2D Renderer 内のプロパティのコレクションです。たとえば、特定のチャンネルだけに影響するブレンドスタイルを作成することもできます。ブレンドスタイルを使用したシーンにライトを追加した場合、そのライトは、マスクマップのチャンネル情報が示すスプライト領域にのみ影響を及ぼします。

下記の例では、パラメトリックライトで Direct Lighting ブレンドスタイルが使用されています。これは、スプライトのマスクマップの R チャンネルで示された領域にのみ影響を及ぼします。

Lost Crypt には、冒険者が地下室で魔法の杖をつかんだときに使用される、短いシネマティックが含まれています。この瞬間をより特別なものにするために、私たちは環境の雰囲気を変える演出を加えました。変化がタイミングよく起こるようにしたかったので、Timeline を使ってパーティクルが適切なタイミングでスポーンされるようにしました。森の中に飛んでいくパーティクルを追いかけるために、アニメーショントラックのブレンディングカメラも設定して、Cinemachine カメラの切り替えを行いました。

杖をつかんだときに現れる光のリングには、スプライトタイプのライトが使用されています。リングのグラフィックでは、光を強めたり弱めたりしながら、環境を照らすオーラが表現されます。

パーティクルのグローエフェクトは、主にボリュームポストプロセッシングのブルームエフェクトを使用して作成されました。また、パーティクルとトレイルのマテリアル/シェーダーでは、HDR カラーを使用して、このオブジェクトにポストプロセッシングエフェクトを適用する強度が定義されています。

森をよく見ると、幽霊のようなキャラクターがいます。これを表現するために、私たちは他の幻獣にも使用できるシェーダーを作成しました。幻獣たちは透明ですが、フレネルエフェクトによってスプライトの縁が光り、浮遊生物のように揺らめくようになっています。

このシェーダーの面白いエフェクトの 1 つに、杖のゲームオブジェクトのトランスフォーム位置の追跡があります。たとえば、杖が幻獣に近づくと、幻獣がより明るくなるようになっています。これを表現するために、私たちは杖に小さなスクリプトをアタッチして、マテリアルシェーダーでの杖の位置が更新されるようにしました。

幻獣には、1 つのグラフィックから別のグラフィックへと切り替わる小さなアニメーションも設定されています。これを表現するために、私たちはチャンネルごとに異なるグラフィックスを使用したマスクマップを作成しました（R に 1 つのビジュアル、G に別のビジュアル、そして B にフレネルエフェクトを割り当て）。

仕上げの最終レイヤーでは、ユニバーサルレンダーパイプラインに含まれている、いくつかのポストプロセッシングエフェクトを追加しました。たとえば、空のゲームオブジェクトを作成し、それに Volume コンポーネントをアタッチしました。Lost Crypt では、ブルーム、ホワイトバランス、およびビネットを使用しましたが、2D プロジェクトで使用できるエフェクトは、ほかにもたくさんあります（モーションブラー、フィルムグレインエフェクトのカラーコレクションなど）。

Lost Crypt デモを通じて、2D ツールの統合型スイートを、類似の用途にどのように使用できるか理解していただければ幸いです。Lost Crypt についてご質問がある場合は、フォーラムを通じてお問い合わせください。

2D ツールについてご質問がある場合は、フォーラムの 2D セクションと「Beta & Experimental features」にある、専用のスレッドをご確認ください。

Lost Crypt の制作の舞台裏についてリアルタイムに話を聞きたいですか？私たちの活気あるウェビナーにご登録ください（注：ウェビナーは好評のうちに終了いたしました）。2D Lights、シェーダー、およびポストプロセッシングが Lost Crypt でどのように使用されたかについて、グローバルコンテンツエバンジェリストの Andy Touch がご説明します。また、R&D の 2D チームが、2D ツールスイートやプロジェクト自体についてのご質問にお答えします。 

登録

参加人数に限りがありますので、お早めに登録し、ご使用のカレンダーにリマインダーを追加することをお勧めします。