「初音ミク Project DIVA Arcade」のお知らせでおなじみ、2号より
「今度『pjd技術部』のタグ作るから記事を書くように」
との命が発動－－－
ディーヴァ・ステーションの読者のみなさま初めまして。
プログラマーのYと申します。主にアーケードの描画周りを担当。
美しいミクさんをより美しく、可愛いリンちゃんをより可愛く描き出すために日々精進しております。
さてこのタグでは、Project DIVAを支える色々な技術についてご紹介していきたいと思います。今回はグラフィクスプログラミングですが、デザインやサウンド、ネットワーク担当からも記事が寄せられるかも知れません。
いつものゲーム情報の合間に記事を楽しんで頂ければ幸いです。
では第一回のお題。
2号のリクエストで「アンチエイリアシング」について。
「初音ミク Project DIVA Arcade」ver.A Rev.1 で、改善したてほやほやのトピックです。
～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～
大半のコンピュータグラフィクスは「ピクセル」と呼ばれる枡目状の四角い箱に色を乗せて、絵を表現しています。方眼紙に色塗りする感じです。
ですので、特に工夫せずにミクさんを描いてみると…
★素のミクさん
画像クリックで大きい画像に
注：以下画像全てゲーム中のシーンをこの記事用に拡大したものです。
枡目に沿った「がたがた」が見えますね。
ゲーム中の動く画面では更に「ちらちら」も加わります。
これら「がたがた」「ちらちら」は「エイリアシング」と呼ばれます。
画像のノイズの一種です。
ノイズはできるだけ除去したい。
この除去/軽減操作を「アンチエイリアシング」と呼びます。
ver.A までは「temporal Antialiasing（略称temporal AA）」と言う手法で、エイリアシングを軽減しています。バーチャファイター5で導入したもので、DIVAアーケードでもそのまま採用しました。これをかけたのが次の画像です。
★temporal AA 適用のミクさん
画像クリックで大きい画像に
がたがたが軽減されているのが判ります。
ポリゴン形状の部分だけでなく、テクスチャで表現されているフリルも再現されるようになりました。
temporal AAは過去フレームとの合成で行います。静止している場合は綺麗なのですが、絵が動く（特にカメラが動く）と効果はほとんどなくなってしまいます。
バーチャファイター5に比べ、DIVAシリーズはカメラのパンやズームが多用されており、アンチエイリアシングの効果は限定的なものになっていました。
そこで、ver.A Rev.1で追加導入したのが
「Morphological Antialiasing（略称MLAA）」
と呼ばれる手法です[文献1]。
画像の「がたがた」になっている部分を検出し、中間の色で埋めて行きます。
★MLAAによるがたがたの検出と中間色での塗りつぶしのロジック
“Morphological Antialiasing”
http://visual-computing.intel-research.net/publications/pape… より
ではミクさんの絵に適用してみます。
★temporal AA + MLAA を適用したミクさん
画像クリックで大きい画像に
髮や輪郭が綺麗になりました。
他の部分のがたがたもほとんど目立たなくなっています。
MLAAは一枚の絵から処理を行いますので、カメラが動いても適用されます。
ゲーム中のパンやズームでのちらつきが軽減しました。
ver.A Rev.1 が稼働したらチェックしてみてください。
とは言え、アンチエイリアシングはピクセルサイズの処理で、なかなかゲーム中では確認しづらいです。
観賞モードや外付けのモニタを設置しているお店で、より美しくなったミクさんたちを眺めてみてくださいね。
今でしたらロケテスト店舗に出かけられる方は、ver.A と ver.A Rev.1 の見比べをしてみるのも楽しいかと思います。
■少し詳しい補足説明
1. アンチエイリアシングによって、画像は幾分ボケ気味になります。
製品ではこれにシャープフィルタをかけて画像をくっきりとさせています。
2. アンチエイリアシングの基本は、射影行列にジッタを入れて累積バッファに何度も描画して行くことです[文献2]。
リアルタイムゲームで 1フレーム中に何度も描画するのは処理が重いため、過去フレームを累積することでアンチエイリアシングを実現します。
これを temporal Antialiasing と呼ぶのは誤用かと思いますが、既に一般的に使用されているのでこの表記としました。
3. temporal AA も再射影と言う方法で、カメラの動きに追従できます。
バーチャファイター5の時に実験しましたが、処理の重さと絵が不完全になる場合があるのとで、再射影の実装は見送りました。
レースゲームには適しているかなと考えています。
4. ビデオカードにはMulti Sampling Antialiasing（略称MSAA）と言う、専用の機能があります。
かなりのメモリと性能を要求されますが、それが許される場合は MLAA より MSAA を使った方が簡単に美しい画面を実現できます。
ver.A Rev.1 でも、楽曲セレクタ中は MSAA（より正確にはNVIDIA社CSAA）を使って、ジャケットのエッジをアンチエイリアシングしています。
5. MLAAもかなり重い処理です。
先日発売された GPU Pro 2と言う本で、ビデオカードを用いた現実的な手法が発表されて採用しやすくなりました[文献3]。
ver.A Rev.1 では[文献3]の手法から、数カ所を改良して実装しています。
参考文献:
[1] Alexander Reshetov. “Morphological Antialiasing”, In HPG’09, 2009.
http://visual-computing.intel-research.net/publications/pape…
[2] OpenGL策定委員会. “OpenGL プログラミングガイド 原著第5版”,
第10章:フレームバッファ, シーンのアンチエイリアス処理, pp.464-469, 2006.
[3] Jorge Jimenez, Belen Masia, Jose I. Echevarria, Fernando Navarro, and Diego Gutierrez.
“Practical Morphological Antialiasing” In GPU Pro 2, pp.95-113, 2011.
～～～～～～～～～～～～～～～～～～～～～～～～～～～～～～
思ったより早めに記事を書いてくれたプログラマーYでした。
ホントはこういう大改変は改訂版（REVISION UP）では実装しないものですが、「常にミクさんを始めとしたキャラクターは美しく表現」をモットーに頑張っておりますので、目処が立った今回実装してみました。
twitterでフォロワーの皆様にお聞きしたところ中々の反響もいただきました。
そういう訳でスタートいたしました「pjd技術部」コラムはいかがだったでしょうか？
「難しいからもっと簡単に」
「いやいや、もっとマニアックに」
「アレとかコレが知りたい」
…など、御要望/読まれた感想等ございましたら、twitterの公式アカウントに返信していただければと思います。
明日も何かあるとか？
（2号）
