【UNREAL FEST 2016 OSAKA】 Technical Art of STREET FIGHTER V メモ

UNREAL FEST 2016 OSAKAに行ってきました。
Technical Art of STREET FIGHTER Vは諸事情により写真撮影ＮＧのため、メモを共有します。

最初に

私はただのプログラマーのため、メモに記載した以外のことはわかりません。

mokoさんが「Technical Art of STREET FIGHTER V」レポートで非常に分かりやすくまとめていただいたので、詳細はリンク先を見てください。

「Technical Art of STREET FIGHTER V」レポート - ゲームエフェクトデザイナーのブログ (新) https://t.co/A7EPXIW9nj #UnrealFest2016Osaka

— moko (@moko_03_25) 2016年5月14日

mokoさんのを見て頂ければ私のは見なくていいですｗ それでもよければ読んで頂けると幸いです。

togetterもあります。

まとめを更新しました。幾つかツィートを追加。「#UnrealFest2016Osaka UNREAL FEST 2016 OSAKA」 https://t.co/dDItHd6btf

— 栗坂こなべ@ Live2D求道者 (@kurisaka_konabe) 2016年5月14日

こなべさん、ありがとうございます！　 関西圏のイベントでは毎回こなべさんがまとめて頂いたtogetterを見させて頂いております！

メモ

Technical Art of Street Fighter V
CS第二開発統括 第二開発部 第一開発室　アートディレクター　亀井敏征様

Technical Artist & Unreal Engine4
テクニカルアーティストにとってUE4はとても相性がいい

##テクニカルアーティストの仕事

ゲームの絵の作り方
目標・イメージ

・ゲーム

ただし、もやもやする　落とし込むのに
具体的な手法が分からない

・目標　イメージ
・インゲーム
・実現手法

Technical Artist＝もやもやを取り払う人

---

##全体項目

１.目標

高い視認性
個性的な絵作り

２.実現手段
キャラクター
背景
カメラ
ライティング
ポストエフェクト

３.まとめ

---

1.目標

ストリートファイター５で目指したアート

・高い視認性　格闘ゲームでは必須　アクションもね
個性的な絵作り

あ、これはストリートファイターの絵作りだ！
フォトリアルは溢れているので、その中でもストリートファイター５だとわかるように工夫した

・はっきりしたシルエット
・筋肉モリモリ
・大げさ

・キャラクター

状況をフィードバックするため記号として存在する

3/60フレームでもわかるシルエット
ゲームからのフィードバック
プレイヤーの判断
プレイヤーからのインプット

これをすごいスピードで行っている
格闘ゲームのアート
ゲームの状況を一瞬でプレイヤーにフィードバックするゲーム内の唯一の手段

・個性
埋もれないためのノンフォトリアル

・高い視認性
格闘ゲームとしての必須要件

・個性的な絵作り
世界中のタイトルとの差別化

2.UnrealEngine4を使っての実現手法

UE4のバージョン：4.7.6

キャラクター
・目指す絵：NPR
・できた絵：油彩　リッチなライティング

・NPRの実現
ライトベクトルとポリゴン法線の内積に一工夫

・ライトベクトルを使って計算していない
ライトベクトルを使ってBPを組んだが結局お蔵入り

結論：マテリアルでは複雑なことはしていない。スイッチパラメーターを使って切り替えを行っているだけ

・タッチの再現
エッジ・色協会の強調
色・彩度のコントロール

・ノーマルマップへのタッチ追加
筆のタッチの再現
ノーマルマップへ　２Dベースのフィルタリング

ちりめんシワフィルター：なし

・ノーマルマップへのタッチ追加

凸凹情報の隙間が大きくなり、フィルターがかかりづらくなった
470 160の差がある

・Tangent Space & Object Space
変換した

・オリジナルのノーマルマップ
ノーマルマップの変換
ノーマルマップへタッチの追加
ノーマルマップの再変換
UE4で確認

・ObjectSpace Touch追加

SNAP Art 4を使用

豊富なフィルターと、調整項目の多さ
安い：一万円以下

細かい⇔粗い：幾つかのフィルターを作成
合成のルールは絵的に見えることのみ

・情報の粗蜜
顔は密度が高い
顔から離れるごとに密度が低くなる

・背景

キャラクターのヒストグラム
明るい色から暗い色まで使っている

・背景のヒストグラム
狭い
白と黒はそこまで使ってない

キャラクターが手前にいるように見える
しかも背景との対比で色鮮やかに見える

・Multi Colorgrading
４つのLookUPTabel

明るいと見にくい
LUT

・カメラの画角の補正
3Dのカメラの特性上、端に行けば行くほどわかりにくい

FixProjection:カメラの横方向に補正をかける

ポストエフェクト&エッジ

RGBの差が大きい場所に、任意の色を乗せる

・ライティング
間接光の強調
照り返しに色をつける

・背景ライト
Sky Light＆Static Light

・キャラライト
Stationary Light

・間接光
Indirect Lighting Cache Enlighten
調節は全てEnlighten

絵的にかっこいいかを重視！

・Enlightenの導入目的
アーティストが思うままに、意図的な色おw間接光として当てたい。
ただし、その都度ライトビルドすることは、極力避けたい

3.まとめ

Unreal Engine4 を利用
思い描いたビジュアルを実現するハードルは下がった

常識はずれなことも実現出来る
実現手法が分からないもやもやが取り除きやすい

当時のBP：マテリアルファンクションでやると重くなる
なのでコードで保管　エンジンをいじくった

#　感想

ここまで教えてくれるとは、と思えるほどすばらしい内容、圧倒的な密度でした。
逆にここまで教えて良いのかと心配になるほどでしたｗ

正直あの場に行ってもう一度聞きたいです。非常に参考になりました。
ありがとうございます！