ポストエフェクトとは
第3回・第4回で紹介したエフェクトファイルは、オブジェクトに適用するエフェクトでした。これに対して、ポストエフェクトは、スクリーンに対して適用するエフェクトです。
ポストエフェクトでは、各オブジェクトの描画が完了した後のスクリーン全体の画像を入力とし、それに対して何らかの処理を施した後、スクリーンに再出力します。典型的な処理として、画像処理で用いられる「フィルタ」が挙げられます。
今回は、ポストエフェクトの基本を解説した後、「ぼかしフィルタ」と「ディフュージョンフィルタ」を作成してみます。
ポストエフェクトの基本
サンプルエフェクト
ポストエフェクトのサンプルとして、BasicPostEffect.fxを収録しました。これは、スクリーンに対して特に何も処理を行わず、入力画像をそのまま出力するだけのポストエフェクトです。しかし、ポストエフェクトとして最低限の実装を含んでいます。
使用するには、同梱のBasicPostEffect.xをアクセサリとしてMMD上で読み込んでください。これを行うだけで、BasicPostEffect.fxが自動的に読み込まれます。
![図1 アクセサリ読み込み](http://cz-cdn.shoeisha.jp/static/images/article/6298/image01.png)
なお、ここで読み込ませる際に指定したXファイル(BasicPostEffect.x)は、単に同名のfxファイルを読み込ませるためだけに使用しているものであり、正常なXファイルでありさえすれば中身は何でも構いません(このサンプルでは、MMD同梱のアクセサリnegi.xをリネームして使用しています)。
改変例
試しに、ピクセルシェーダに簡単な処理を記述してみましょう。
float4 PS_DrawBuffer(float2 Tex: TEXCOORD0) : COLOR { float4 Color = tex2D( ScnSamp, Tex ); // 何か処理 float Gray = (Color.r + Color.g + Color.b ) / 3; //この行を追加 Color.rgb = float3(Gray, Gray, Gray); //同上 return Color; }
このように記述すると、スクリーン全体がグレースケールになります。
![図2 グレースケール化ポストエフェクト](http://cz-cdn.shoeisha.jp/static/images/article/6298/image02.png)