Mega Cat Studios は、当時の雰囲気を忠実に再現したレトロゲームの制作を 1 つのアートの形に昇華させました。実際、同社のいくつかのタイトルはカートリッジの形で入手でき、Sega Genesis などの古いコンソールでプレイすることも可能です。
このブログ記事を読む前に、レトロゲーム制作に関する前回のガイドの内容を理解しておくことをお勧めします。前回のガイドでは、2D Pixel Perfect の設定と、8 ビットスタイルのグラフィックスの再現方法を説明しています。
Unity 2019.2 では、ライトウェイトレンダーパイプライン(LWRP)パッケージの 2D Renderer に 2D Pixel Perfect が組み込まれています。2D Pixel Perfect は、LWRP を使用しないクリエイター向けに、スタンドアロンパッケージとしても用意されています(機能は同じです)。このガイドでは、LWRP でのプロジェクトのセットアップ方法を説明します。
2. 2D Pixel Perfect パッケージをインポートするには、ツールバーで「Window」メニューをクリックして、「Package Manager」を選択します。ポップアップウィンドウで、「Lightweight RP」パッケージを選択します。バージョン 6.9.0 以上を入手するようにします。
3.次に、エディターで 2D Renderer を設定し、新しいパイプラインアセットを作成します。「Project」ウィンドウで「Assets」ビューを右クリックし、「Create」>「Rendering」>「Lightweight Render Pipeline」>「Pipeline Asset」の順に選択します。
4. 「Project」ウィンドウの「Assets」ビューで右クリックし、「Create」>「Rendering」>「Lightweight Render Pipeline」>「2D Renderer」の順に選択して新しい 2D Renderer を作成します。
5.作成したパイプラインアセットを選択します。「General」を選択し、「Renderer Type」を「Forward Renderer」から「Custom」に変更します。
6. 作成した 2D Renderer をデータフィールドに割り当てます。
7.「Graphics」設定の「Scriptable Render Pipeline Settings」で、作成した新しいパイプラインアセットを使用するように設定します。
これで、2D Pixel Perfect Camera を含め、2D Renderer の設定は完了です。
Unity 2019.2 では、2D スプライトに「Sprite-Lit」マテリアルを設定することができます。これを設定すると、2D スプライトが 2D ライティング条件に影響を受けるようになります。プロジェクトで 2D Lights を使用しない場合、スプライト可視化のために 2D Lights を必要としないマテリアルを使用してください。その場合、マテリアルを「Sprites-Default」に変更できます。
メインカメラに Pixel Perfect Camera コンポーネントを追加する必要があります。「Run In Edit Mode」をオンにすることをお勧めします。
メガドライブコンソールの解像度は 320 x 224 ピクセル(8 x 8 ピクセルのタイルが 40 x 28 のマス目に表示される)です。これは NTSC バージョンです。スーパーファミコンの解像度は 256 x 224 ピクセル(8 x 8 ピクセルのタイルが 30 x 28 のマス目に表示される) であり、これも NTSC バージョンです。
グラフィックのスタイルがどちらの場合であっても、縦の解像度を 224 ピクセルにし、8 PPU でアセットを設計することをお勧めします。
2D Pixel Perfect Camera コンポーネントに用意されている各オプションの機能について説明が必要な場合は、レトロゲームに関する以前のブログ記事をご覧ください。
このセクションでは、ファミコン風のゲームを取り上げたブログ記事のように、さまざまなコンソールの表示を模倣したアートワークを作成するワークフローについて説明します。8 ビットのプロジェクトよりも制約が少なく、色の自由度も高くなっていますが、メガドライブには特有の制約があります。皆さまがご自分のレトロ風ゲームのプロジェクトでそのような制約を適用するために、オリジナルハードウェアの仕組みを説明することも重要だと考えています。
8 ビットコンソールから 16 ビットコンソールに移行すると、ハードウェアが高度になり、利用できるオプションが増えます。とは言え、ファミコン風ゲームの美しいアートワークを作成するときの基本は引き続き当てはまります。たとえば、スプライトであれ、背景要素であれ、すべてのグラフィックスは引き続き 8 x 8 のタイルに格納され、それが組み合わせられて大きな画像が作られます。16 ビットではパレットの自由度がいろいろな意味で大きくなるとは言っても、共通の透過色が設定された、制限のあるサブパレットで作業する必要があります。気楽なのは、16 ビットコンソールには通常、8 ビットコンソールとは異なり、ハードコーディングされたカラーパレットがないことです。つまり、利用できる色はファミコンよりも大幅に増えています。
次にメガドライブが誇る機能はサブパレットです。サブパレットには、15 色に加え、スプライトの透過色とレイヤーの透過色に使用する共通色が含まれています。しかし、メガドライブ向けのアートをデザインするうえでの弱点の 1 つは、このサブパレットにあります。サブパレットはスプライトまたは背景のタイルに自由に割り当てることができますが、メガドライブでは一度に使用できるサブパレット数が 4 つに制限されているのです。そのため、スプライトと背景で使用できる色を最大化できるように、アーティストはサブパレットで使用する色に注意する必要があります。メガドライブのサブパレットには通常、すべてをきれいに調和させるために、背景とスプライトの両方で使用する色が含まれます。
どの 16 ビットプラットフォーム向けに作成する場合でも、インデックス付きパレットを使って作業する必要があります。そのための、Photoshop の代替となるオープンソースソフトウェアとして Gimp があります。Gimp では、多くのインデックス付きパレット操作を行うことができます。
Gimp でインデックス付きパレットを作成するには、「画像」>「モード」>「インデックス…」の順に移動します。
「インデックスカラー変換」ウィンドウが表示されます。
「最大色数」を 15 に設定します。自動ディザリングパターンを使用できますが、手動で作成した方がきれいな見た目になる傾向があります。
これで、画像の色がインデックス付けされました。この情報は、この色インデックスを使用できるように、画像と一緒に自動的に保存されます。インデックスに含まれる色の順番に変更が必要な場合には、カラーマップを右クリックして「インデックスカラーの並べ替え...」を選択します。
ポップアップメニューが表示され、色をドラッグアンドドロップして新しい順番に変更できます。
色づかいを豊かにするためによく使われるテクニックの 1 つが、指定のラスターラインに合わせてパレットを制御することです(もっとも、パララックススクロールはファミコンの時点ですでに実現されていました)。メガドライブでは、指定のラスターラインに合わせてアートワークで使用するサブパレットを切り替えることができます。このテクニックは、レベルの一部を水中であるかのように見せかける場合によく使われています。「水中」の色は、まったく別のサブパレットに追加し、特定のラスターラインが画面上にレンダリングされたときに、そのサブパレットを読み込みます。
一般的に、16 ビットコンソールがグラフィックタイルを読み込む方法は、8 ビットコンソールとは異なっています。8 ビットコンソールでは、スプライトと背景のタイルを個別に、サイズの大きなデータチャンクとして読み込むことで、大量の処理能力を使用するのを回避しています。一方、16 ビットコンソールには、より柔軟性の高い処理能力があります。個別のタイルをその場で読み込んで入れ替えることができるため、必要なときに必要なグラフィックスだけを読み込めばよいのです。そのため、ゲームの 1 レベルや 1 画面で、さらに幅広いアートワークを使用できるようになっています。
メガドライブが独特な点のもう 1 つは、グラフィックタイルとパレットデータ以外のデータも、ゲーム中にコンソールの VRAM に読み込まれる点です。これにより、ゲームの状況に応じて、所定のタイミングでメモリに読み込むことのできるグラフィックタイルの数が変化するので、メガドライブ向けのアートのデザインがややこしいものになる場合があります。一般的に、ほとんどのゲームでは最大で 1000 タイルを読み込めるだけの十分な容量が用意されています。また、動的な要素がある場合は、いつでもタイルを自由に入れ替えることができます。
VRAM に一度に読み込んで利用できるタイルの幅が広がったとは言っても、それによって新たに使えるようになった容量は、画面上に一度に表示するスプライトのアニメーションのバリエーションを増やしたり、種類を増やしたりと、スプライトで利用するために取っておくことがほとんどです。つまり、背景でメモリ容量を使いすぎることのないよう、タイルのセグメントを繰り返し使用するという基本的なデザイン哲学は、16 ビットアートでも多分に使用される傾向があります。ファミコン、メガドライブ、スーパーファミコンの解像度はどれも似たようなものなので、この種のデザインでは、16 x 16 のセグメントが開始点となる傾向があります。
メガドライブでは、2 つの背景レイヤーを同時に画面上でアクティブにできます。つまり、背景をデザインするうえで、以前よりも簡単にレイヤード要素を利用できるようになっています。そうは言っても、利用できるレイヤーは 2 つだけなので、シーンの奥行を深く見せるためには、ラスターラインを使ったテクニックに頼ることになるでしょう。さいわい、そのようなテクニックはすべて 2 番目のレイヤーで使用するため、デザイナーは、奥行感を損なうおそれなく、背景の前に自由にフォアグラウンドオブジェクトを配置することができます。
また、2 番目のレイヤーの存在により、スプライトの優先度を使ってフォアグラウンドオブジェクトを作るテクニックは時代遅れになりました。(高度なレイヤー化ではスプライトの優先度を素早く操作する必要は引き続きあるかもしれませんが)スプライトの優先度をその場で何度も変更する代わりに、単純に 2 番目の背景レイヤーがプレイヤーの前に表示されるように設定すれば済むようになったのです。2 番目の背景ペインには、ヘッドアップディスプレイ(HUD)に使用できるサブペインも備わっています。サブペインは場所が固定され、スクロールしません。
16 ビットコンソールへ移行すると、スプライトを扱う際の自由度が大きくなります。メガドライブでは、画面上に同時に 80 のスプライト、1 つの水平線上に約 20 のスプライトが表示されるまで、新しいスプライトをレンダリングできます。さらに、スプライトは 8 x 8 の個々のタイルから構成されるものではなくなりました。メガドライブでは、複数のタイルから成るスプライトを生成できます。スプライトは、単一タイルの小さなものから、4 x 4 タイルの大きなものまでさまざまです。それ以上の大きさのものは、引き続き複数のスプライトから生成する必要があります。
16 ビット時代のアートワークの決定的な特徴の 1 つは、ディザリングの使用です。それまでのゲームは CRT モニターで表示されており、画面上のピクセルが互いににじみ合う傾向がありました。アーティストは、アートワークでディザリングパターンを使用して、このにじみを活用していました。繰り返しパターンで、あるピクセルが別のピクセルににじむと、実際に使用できるよりも多くの色が使用されているという錯覚が生じるのです。現在に至るまで、ディスプレイの性能向上にかかわらず、ディザリングはピクセルアートで多用され、美的外観の演出に一役買っています。
2 つの主要な 16 ビットコンソールのうち、メガドライブでは、色が大きなコントラストで表示されます。この点についても、サブパレット選択時に留意が必要です。アートの作成で落ち着いた、鈍い色を使うほど、実際に画像をハードウェアにレンダリングしたときに期待どおりの見た目になりません。最終的な見た目をアーティストの当初のビジョンどおりにするには、一般的に、アートをハイコントラストのカラーパレットで作成する必要があります。
スーパーファミコン向けのプロジェクトでは、引き続きサイズが 8 x 8 ピクセルのタイル/グリッドを使用するので、繰り返し可能なタイルを使うと非常に便利です。一般的に、それは 8 の倍数になります。
メガドライブとスーパーファミコンの最初の根本的な違いは、カラーパレットにあります。メガドライブと同様に、スーパーファミコンにもハードコーディングされたカラーパレットはないため、自由に色を選ぶことができます。
やっかいなのは、スーパーファミコンの場合、現在ではけっして一般的ではない、5 BPP(bits per pixel)色を使用していることです。これに対処するには、Gimp でアートワークを作成し、画像を 32 階調の RGB にポスタリゼーションします。すると、5 BPP 色になるように画像を保存していなくても、5 BPP 色の画像を作成できます。このようにして、コンソールで画像の色を正確に表示できます。
このオプションは、Gimp の「色」>「ポスタリゼーション…」にあります。表示されるポップアップウィンドウでポスタリゼーションのレベルを 32 に設定すると、5 BPP 対応の色を作成できます。
2 つのシステムにおける次の大きな違いは、画面解像度に関するものです。スーパーファミコンはファミコンの後継機であるため、この 2 つのシステムの画面解像度は似ています。スーパーファミコンの内部解像度は 256 x 224 です。これは、すべての画像が大半の CRT テレビのセーフゾーンに表示されるようにレンダリングされ、画像が欠けることのない解像度です。この解像度は変化しないため、これがアーティストが参照として使用する必要のある画像サイズとなります。
このセクションでは、各種のスクリーンモードについて簡潔に説明します。
2 つのシステムの最も大きな違いは、スーパーファミコンでは 7 つの異なるスクリーンモードで背景グラフィックスをレンダリングできることです。スーパーファミコンでは、特定のスクリーンモードで、1 つのサブパレットを使い、合計 256 色を画面上に一度にレンダリングできます。以下に、最も一般的なスクリーンモードをいくつか示します。
モード 7 で使用する 1 枚の背景プレーンの処理方法は、先述の機能を実現するために、他のスクリーンモードとはかなり異なっています。まず、処理対象である 256 色の背景プレーン 1 枚しかありません。つまり、すべてのスプライトは、背景プレーンのサブパレットの色を共有する必要があります。次に、モード 7 の背景プレーンのサイズは、スーパーファミコンの通常の画面サイズではなく、1024 x 1024 ピクセルです。これは、後でデザイナーの意図するように画面に合わせてサイズ変更されます。
背景スクリーンモードは複雑でしたが、スプライトのルールは比較的単純です。スーパーファミコンには、メガドライブと同様に複数のスプライトモードがありますが、ゲーム全体で 2 つのスプライトモードしか使用できないというハード制限があります。
スプライトのサイズは、8 x 8、16 x 16、32 x 32、または 64 x 64 のいずれかです。それだけでなく、デザイナーは、あらかじめ設定されたスプライトサイズの組み合わせリストから選択しなければなりません。スーパーファミコンのゲームに含めることのできる組み合わせは、次のとおりです。
これらのサイズは「決定事項」であり、一度選択したら、ゲーム内のすべてのスプライトをそれに準拠させなければなりません。スーパーファミコンでは、1 本の水平のラスターライン上に同時に 32 枚のスプライトをレンダリングできますが、画面上に同時に表示できるスプライト数は 128 枚という大変な制限があります。この数を超えたスプライトは、画面上にレンダリングされません。
スプライトには、作業用に 16 色のサブパレットを 8 つ設定できます。すべてのレトロコンソールと同様に、サブパレットの最初の色は、透過色に使用する共通色です。他のコンソールと比較して利用できるサブパレット数が多いため、スプライトの色をより自由に選ぶことができます。留意すべきは、256 色のハード制限だけです。
このブログ記事では、最新バージョンの Unity で 2D Pixel Perfect を使用して 8 ビットや 16 ビットのレトロゲームを制作する方法を紹介しました。楽しんでいただけたなら幸いです。
2D Pixel Perfect はまだ完成していません。今後、機能が Unity 2019.3 で制作に利用できるかどうか検証を行う予定です。また、Cinemachine 2D との互換性も強化する予定です。
皆さまの 2D Pixel Perfect プロジェクトの開発状況についてお聞かせください。また、2D フォーラムにアクセスして、Unity コミュニティや 2D 開発チームとぜひ交流してください。
Is this article helpful for you?
Thank you for your feedback!