UE4で漫画の背景のような絵を作成する【セルシェーダ】

以下のような方におすすめの記事です。

Unreal Engine4でアニメのようなアウトラインを持つ絵を作りたい
セルルックでモデルを表示したい
3DCGの画面をアニメっぽい絵にしたい

この記事ではアセットストアで無料で手に入るAdvanced Cel Shader Liteを
試してみましたのでその過程をまとめています。

ポストプロセスボリュームで画面全体をセルルックにし,
アウトラインを表示する方法

使用するUnreal Engine4のバージョンは4.25です。

Advanced Cel Shader Lite

https://www.unrealengine.com/marketplace/ja/product/ce2cda95e5f54180b2cf7df24566bdf7
このアセットは無料ではありますが様々なセルシェーダーが使用できます。

有料版のAdvanced Cel Shader Essential ではより高度なセルルック表現が可能なようですのでご興味のある方は購入してみてもいいのではないでしょうか。

では実践してみましょう。
大枠は以下のような流れになります。

①post process volumeをレベル内に用意する
②post process volume のレンダリング機能にあるポストプロセスマテリアルのArrayに配列エレメントを追加
③セルシェーダー用のマテリアルを適用
④適宜アウトラインの太さなどを調整する

①post process volumeをレベル内に用意する

まず、アウトラインを設定するレベルはこちらで試してみることにします。
セルシェーダー適用前の画像

意味不明な画像かと思いますが(笑)、このオブジェクトの設置には以下の狙いがあります。
・キャラクターがどう見えるか(UE4のmannequin)
・格子状のオブジェクトなど細かいパーツが近距離にある場合どう見えるか確認したい(家などの建物)
・アルファの設定されたオブジェクトはどう見えるか確認したい(樹木、花など)
・テクスチャに文字が書かれている場合どう見えるか確認したい(中華料理の文字)

「アクタを配置」のウィンドウからポストプロセスボリュームをステージ内にドラッグします。

②post process volume のレンダリング機能にあるポストプロセスマテリアルのArrayに配列エレメントを追加


アウトライナでPostProcessVolumeを選択します。

レンダリング機能の項目内部のポストプロセスマテリアルを開き、
Arrayの配列エレメントの右側にある+をクリック、選択となっている部分をアセットリファレンスに変更します。
そこでスロットにマテリアル(CelShaderなど)を設定します。

③セルシェーダー用のマテリアルを適用

CelShaderをひとまず適用してみます。

‥‥全体がセルルックになりにアウトラインが適用されました。
しかし、期待していたよりも線が太いうえにテクスチャの模様にも適用されているため選が目立ってうるさい感じになっていますね‥。

CelShader80sCartoon というマテリアルを試してみます。

今回は各オブジェクトの輪郭に先ほどのCelShaderよりは細い線が表示されました。

キャラクターのアウトライン

アルファ値が設定された木の葉のメッシュ葉の形状に合わせてアウトラインが表示されています。

文字の書いてあるテクスチャ。

④適宜アウトラインの太さなどを調整する

アウトラインはマテリアルのパラメーターで線の太さなど調整します。
テクスチャにアウトラインを追加することもできるようですので適宜調整してみるといいでしょう。

他のマテリアルも数種類 試してみましょう.

CelShaderAgedComic
全体に漫画のスクリーントーンのようなドットが表示されました。

CelShaderAnime
アウトラインに加えセピア調の画面になりました。ストーリー中の回想シーンなどに使用可能か‥‥?

CelShaderColouredPencil
全体が白っぽくなり、メッシュの面にスクラッチ上のラインが入りました。使いどころは‥‥??

CelShaderForwardDefault
フォグがかかったようなアニメ調の絵になりました。

CelShaderHeroComic
HeroComicの名前がつけられたマテリアル。アメコミのようなテイストを狙っているようです。コントラストが強い。

他にも様々なマテリアルがあります。使いどころがすぐに思いつかないものもありましたが、ご自分のゲームや映像などのイメージに応じて使い分けてみるといかがでしょうか。

Unreal Engine4でアウトラインを表示する方法・まとめ

①post process volumeをレベル内に用意する
②post process volume のレンダリング機能にあるポストプロセスマテリアルのArrayに配列エレメントを追加
③セルシェーダー用のマテリアルを適用
④適宜アウトラインの太さなどを調整する

今回は以上になります。

最新記事をチェックしよう!