「pjd技術(shù)部」TAG誕生! :第一回「抗鋸齒」
【僅搬運來自游戲官網(wǎng)的博客原文,暫不作翻譯。】
【原文發(fā)布日期:2011/5/11】
【原文鏈接:https://info.miku.sega.jp/402】
「初音ミク Project DIVA Arcade」のお知らせでおなじみ、2號より
「今度『pjd技術(shù)部』のタグ作るから記事を書くように」
との命が発動---
ディーヴァ?ステーションの読者のみなさま初めまして。
プログラマーのYと申します。主にアーケードの描畫周りを擔(dān)當(dāng)。
美しいミクさんをより美しく、可愛いリンちゃんをより可愛く描き出すために日々精進(jìn)しております。
さてこのタグでは、Project DIVAを支える色々な技術(shù)についてご紹介していきたいと思います。今回はグラフィクスプログラミングですが、デザインやサウンド、ネットワーク擔(dān)當(dāng)からも記事が寄せられるかも知れません。
いつものゲーム情報の合間に記事を楽しんで頂ければ幸いです。
では第一回のお題。
2號のリクエストで「アンチエイリアシング」について。
「初音ミク Project DIVA Arcade」ver.A Rev.1 で、改善したてほやほやのトピックです。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
大半のコンピュータグラフィクスは「ピクセル」と呼ばれる枡目狀の四角い箱に色を乗せて、絵を表現(xiàn)しています。方眼紙に色塗りする感じです。
ですので、特に工夫せずにミクさんを描いてみると…

注:以下畫像全てゲーム中のシーンをこの記事用に拡大したものです。
枡目に沿った「がたがた」が見えますね。
ゲーム中の動く畫面では更に「ちらちら」も加わります。
これら「がたがた」「ちらちら」は「エイリアシング」と呼ばれます。
畫像のノイズの一種です。
ノイズはできるだけ除去したい。
この除去/軽減操作を「アンチエイリアシング」と呼びます。
ver.A までは「temporal Antialiasing(略稱temporal AA)」と言う手法で、エイリアシングを軽減しています。バーチャファイター5で導(dǎo)入したもので、DIVAアーケードでもそのまま採用しました。これをかけたのが次の畫像です。

がたがたが軽減されているのが判ります。
ポリゴン形狀の部分だけでなく、テクスチャで表現(xiàn)されているフリルも再現(xiàn)されるようになりました。
temporal AAは過去フレームとの合成で行います。靜止している場合は綺麗なのですが、絵が動く(特にカメラが動く)と効果はほとんどなくなってしまいます。
バーチャファイター5に比べ、DIVAシリーズはカメラのパンやズームが多用されており、アンチエイリアシングの効果は限定的なものになっていました。
そこで、ver.A Rev.1で追加導(dǎo)入したのが
「Morphological Antialiasing(略稱MLAA)」
と呼ばれる手法です[文獻(xiàn)1]。
畫像の「がたがた」になっている部分を検出し、中間の色で埋めて行きます。

“Morphological Antialiasing”
http://visual-computing.intel-research.net/publications/papers/2009/mlaa/mlaa.pdfよりではミクさんの絵に適用してみます。

髮や輪郭が綺麗になりました。
他の部分のがたがたもほとんど目立たなくなっています。
MLAAは一枚の絵から処理を行いますので、カメラが動いても適用されます。
ゲーム中のパンやズームでのちらつきが軽減しました。
ver.A Rev.1 が稼働したらチェックしてみてください。
とは言え、アンチエイリアシングはピクセルサイズの処理で、なかなかゲーム中では確認(rèn)しづらいです。
観賞モードや外付けのモニタを設(shè)置しているお店で、より美しくなったミクさんたちを眺めてみてくださいね。
今でしたらロケテスト店舗に出かけられる方は、ver.A と ver.A Rev.1 の見比べをしてみるのも楽しいかと思います。
■少し詳しい補足説明
1. アンチエイリアシングによって、畫像は幾分ボケ気味になります。
製品ではこれにシャープフィルタをかけて畫像をくっきりとさせています。
2. アンチエイリアシングの基本は、射影行列にジッタを入れて累積バッファに何度も描畫して行くことです[文獻(xiàn)2]。
リアルタイムゲームで 1フレーム中に何度も描畫するのは処理が重いため、過去フレームを累積することでアンチエイリアシングを?qū)g現(xiàn)します。
これを temporal Antialiasing と呼ぶのは誤用かと思いますが、既に一般的に使用されているのでこの表記としました。
3. temporal AA も再射影と言う方法で、カメラの動きに追従できます。
バーチャファイター5の時に実験しましたが、処理の重さと絵が不完全になる場合があるのとで、再射影の実裝は見送りました。
レースゲームには適しているかなと考えています。
4. ビデオカードにはMulti Sampling Antialiasing(略稱MSAA)と言う、専用の機能があります。
かなりのメモリと性能を要求されますが、それが許される場合は MLAA より MSAA を使った方が簡単に美しい畫面を?qū)g現(xiàn)できます。
ver.A Rev.1 でも、楽曲セレクタ中は MSAA(より正確にはNVIDIA社CSAA)を使って、ジャケットのエッジをアンチエイリアシングしています。
5. MLAAもかなり重い処理です。
先日発売された GPU Pro 2と言う本で、ビデオカードを用いた現(xiàn)実的な手法が発表されて採用しやすくなりました[文獻(xiàn)3]。
ver.A Rev.1 では[文獻(xiàn)3]の手法から、數(shù)カ所を改良して実裝しています。
參考文獻(xiàn):
[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)では実裝しないものですが、「常にミクさんを始めとしたキャラクターは美しく表現(xiàn)」をモットーに頑張っておりますので、目処が立った今回実裝してみました。
twitterでフォロワーの皆様にお聞きしたところ中々の反響もいただきました。
そういう訳でスタートいたしました「pjd技術(shù)部」コラムはいかがだったでしょうか?
「難しいからもっと簡単に」
「いやいや、もっとマニアックに」
「アレとかコレが知りたい」
…など、御要望/読まれた感想等ございましたら、twitterの公式アカウントに返信していただければと思います。
明日も何かあるとか?
(2號)