Croquisエフェクトを改造してみた

2014-01-13 23:59

タグを編集ログイン

これとかで使っているポストエフェクトのエッジの紹介。

　データPのCroquisを自分に都合のいいように改造しただけのものです。
弄ったのは

色差エッジの検出方法
色差エッジの太さと綺麗さ調節
エッジ色テクスチャを指定可能(要モデルのUV展開)
エッジ太さテクスチャを指定可能(要モデルのUV展開)

というあたりです。

配布はこちら→http://seiga.nicovideo.jp/seiga/im3705513

　以下に比較も交えて、使い方の要点を解説していきたいと思います。

　まずMMD標準のエッジ(太さ:0.5)

　視野角でかいんでエラいことになってますね。

　次AlternativeFullの独自エッジ

　太さの計算頑張ってるのでMMD標準に比べて落ち着いてます。
今回はこいつに勝つことを目標とします。

　標準のCroquisをそのままの状態で使います。

　MMDやAlternativeFullの「反転拡大ポリゴン」のエッジに比べて線が出ているところが多いのがわかります。
　ただ、色差エッジ部分で、モデルの陰影にエッジが出てしまっているのが普通のエッジとして使おうとするとうるさい感じがあります。
　また法線エッジ、深度エッジとの太さのバランスもとれていない感じがありました。(法線・深度エッジは倍サイズのバックバッファーからリサンプルしているのに、色差エッジは等倍のバッファからの近傍平均であるためじゃないかなーとか。)

　主にこのあたりの改善結果が

　Croquis改のアクセサリでX=1/Y=1/Z=1/Si=1/Tr=1の結果です。

　陰影に色差エッジが出なくなり、線の太さがわりと揃ったかもしれません。(ただ何か今見ると色差エッジの検出結果に偏りがある気が…。袖の赤いラインを元のCroquisと比較してみればわかるかも。)

　線が黒でちょっと固いので、その部分の色からエッジの色を作る「色トレスエッジ」と勝手に呼んでいる機能を有効にします。

　わりといいかも？
　でもちょっと線が太い感じもありますので、Croquis改のアクセサリのSiを0.5に設定してやります。

だいぶ落ち着きました。

　ただ、この状態でもCroquisから受け継がれる大きな問題点が見えます。

　顔がケバく見える

　具体的には顔と白目の境界にエッジが引かれてるのとかそのへんからちょっとくどい感じになっています。
　これはやばいです。なんとかしてあげないとやばいです。

■さあ、見れるものにしていこうか

　ここからはモデルの材質やテクスチャにある程度の知識が必要になります。また、UV展開されていないモデルには残念ながらここに書く方法では対処できません。

　Croquis改をMMDにほおりこむとエフェクトの割り当てウインドウに以下のようなタブが増えます。

　元が2つだったことを考えるとかなり頭悪いですね。

　それぞれのタブの役割を一応説明しておきます。

CM_EdgeColorMap…エッジの色を指定するバックバッファー(レンダーターゲットというやつですが、とりあえずこう呼んでおきます。)
CM_ObjectColorMap…色差検出用にモデルを描画するバックバッファー
CM_EdgeStrengthMap…エッジ太さ用マスクを描画するバックバッファー
CM_NormalMap…法線エッジ検出用に法線情報を色として描画するバックバッファー
CM_DepthMap…深度エッジ検出用に深度情報を色として描画するバックバッファー

　不吉な予感しかしないかもしれません。でもちょっと頑張って欲しいナ。
とりあえずこれらを設定していくことで、ケバくなってしまった顔をなんとかします。

　ではまず、どうやって解決するかをいきなり書いてしまいますと、

　いらない部分の線の太さを0にしてしまえばいいじゃないか

　ということです。
　この他にも「いらない部分の線の色を地の色と同じにすればいいじゃないか」というのもありますが、わりと厄介ですので今回はこちらで。

　線の太さを弄るのは、CM_EdgeStrengthMapタブに適用されているEdgeStrengthDraw.fxsubというファイルになります。

　これをそのまま弄られてしまうとちょっと困りますので、コピーを作ってそちらを編集します。名前はなんでもかまいませんのでEdgeStrength_face.fxsubとしました。

　コピーを取りましたら、テキストエディタでEdgeStrength_face.fxsubを開きます。すると先頭部分に

//#define EDGE_STRENGHT_TEXTURE "EdgeStrength.png"

という箇所があります。必要な設定はここだけです。

　実際にやることとしては、テクスチャに黒(太さ0)～白(太さ1)という情報を描き込んでやって、それを参照させる…ということになります。
　このテクスチャを作るのがまず面倒だと思います。

　直接画像を作る方法の他には、Metasequoiaにモデルを持って行って、頂点カラー編集白黒の色を付けた上でテクスチャに書き出す…というのが一番簡単な気がします。

　まあうちは馬鹿なので、直接画像を編集していきます☆

　テクスチャが貼られているモデルでは、頂点のUV座標がテクスチャのどこかに対応します。なので、そのへんの部分をとりあえず適当に0(黒)にしてしまえばなんとかなりそうです。

　関係しそうなのは、モデルを見てみるとこのへんのテクスチャのようです。

　金剛さんモデルの顔の部分のテクスチャを見てみますと

こんな感じのようです。(実際はUVがわかる状態にしてあることが望ましいかもしれません。余計な周り道をすることになる可能性がありますので。というかしました。)

　注目はこのへんです。

　このへんに目のための穴が開いているはずなので、そこらのエッジの太さが0になるようなテクスチャを作ります。

　このテクスチャに半透明のレイヤーを重ねて白一色(太さ1)で塗りつぶしておきます。その上で、このへんかなー？とか考えながらエッジの出てほしくない場所を黒で塗りつぶします。

　境界をぼかしているのは、こうしておかないと急激にエッジが消えるのもなー、という考えからです。

　ここまでできたらあとはレイヤーを完全に不透明に戻して画像をEdgeStrength_face.fxsubと同じフォルダにface.pngとでも名前を付けて保存しておきます。

　EdgeStrength_face.fxsubがこのテクスチャを参照するように書き換えます。
　先ほどの先頭部分を、こうします。

#define EDGE_STRENGHT_TEXTURE "face.png"

　これでEdgeStrength_face.fxsubを上書き保存します。

　それからCM_EdgeStrengthMapタブの金剛さんの顔の材質にこのEdgeStrength_face.fxsubを適用します。これで該当部分のエッジの太さがコントロールされるのです…が、実際にこのテクスチャをモデルに適用してみてると、消え方が微妙だったので、もう少し範囲を広げてやりました。

　あと口の中も線がちょっと多すぎるかなーという感じでしたのでとりあえず太さ0(黒)で設定してみました。
　予想はしていましたが白くてよくわかりませんね…。

　まずはこれで顔は大丈夫になりましたので、白目とか瞳とか目のハイライトとかも処理します。
　ここらは、完全にエッジが出ないようにして逃げますので、適当に黒一色(太さ0)のテクスチャを流用して割り当てます。

実にやっつけですね。

　あとは先ほどと同じようにEdgeStrengthDraw.fxsubのコピーを作って、EdgeStrength_etc.fxsubという名前にしておき、それをCM_EdgeStrengthMapの金剛さんの白目、瞳、瞳中央、ハイライトの材質に割り当ててやると…
びゅ～りほ～!!