2014年12月16日火曜日

Candy Rock Star をさわってみた#02 ~ テクスチャ

Candy Rock Star を題材にユニティちゃんディレクター杯に参加しました。
投稿後、作品制作過程での諸々をメモ。


ダンスユニット的にユニティちゃんを3人用意する。

1体はオリジナルのままでセンター配置。これはもう決まりで。

あと2体をテクスチャのみ変更で違うタイプを作る。


■開発環境/ツール

Windows7x64
Photoshop 5.5 (メイリオ系は使えないですがWin7でも動作します)

今となっては5.5は低機能なのでGIMP2等の方が機能ははるかに上だと思います。
5.5を使ってる理由は「慣れてるから」と、だいたい使う機能が限定的なので。

つまり「高度なこと」はしないからです(笑。

ちなみにElementsは透過レイヤが使えない為お蔵入り。


■テクスチャ変更部分検討

できるだけ3人ユニットとして「統一感」を維持したい感じで検討。

主要部分は、
  • ジャケット
  • 水着(?)・ニーソ
  • スキン
ツノ(触覚?)はユニティちゃんのアイデンティティ(?)なので今回はいじってません。バンダナの色もそのまま。
ユニティちゃんがユニティちゃんであるには「ツノ」は最重要パーツなので!

靴もそのままです。上下の先端を同じ配色にしておいた方が安定感(?)がありそうなので。
エフェクター類は悩むところでしたが、悩むくらいならいじらないことに決定。



■配色検討

※ちなみに色彩関係においては素人です。専門家さんだときちんとした理論に基づく色彩設計の仕方があると思います。以降あくまで私的な主観に基づいています。


CRSユニティちゃんをまじまじ見ます|д゚)ジー。

カラーバリエーション作成は配色でどうしても迷ってしまうので、ここは色相環(マンセル図)を利用して方向性を決めてしまいます、時間もなかったので。(→ 参考: Wiki 色相環

オリジナルのユニティちゃんの配色を見るとだいたいこんな感じ。


水着は髪の色の補色位置にきっちり選択されてます(さすがプロデザイン)。
補色は反対色なので相互に目立たせやすい色でよく使われます。


ジャケットは2つの中間となる色相環角度を取っています(ほぼ90度位置でバランス)。
(ちなみに目は緑系なのでさらにジャケットの対向位置にありバランスしています)。

と、いうことがなんとなく見えたところで独断と偏見で、




ユニティちゃんTypeA(右担当):
  • 髪色はオリジナル(C髪)から時計回りずらして薄緑系に。
  • 水着は半時計まわりにずらして緑系に。

ユニティちゃんTypeB(左担当):
  • 髪色はオリジナル(C髪)から半時計回りずらして赤系に。
  • 水着は時計まわりにピンク系に。

と、それぞれをオリジナルの色位置から一定角度ずらすということでだいたいの色調の方向性を決定。
2体はそれぞれ近い色相角度内に収めることで個々で親和性(?)を持たせる感じに。
それでいて3体の配色が一定の色相角度を保っているのでそこそこ(?)チグハグにならない程度にバランスするはず(すればいいなぁくらいな感じで)。

ちなみにステージ向かって左をTypeB(ピンク系)にしたのは一応ちょっとだけ理由があります。

おおむね現代人は左上からモノを見るクセがついているので(上>下。左>右で文字を読むので)左は一応目につく=派手さアピールしやすいので、そこにピンク系を配置。
ステージ右は落ち着いた感じで緑系を配置にと考えました。

実はSAK01のダンスはおとなしめ系なのでこの時点で緑のTypeAにアサインするつもりでいました。
なおかつSAK01ダンス中のキメポーズは右斜めからのアングルがカッコいい。
そうなると右斜めからSAK01のキメポーズ撮影となり、右に配置すべきだろうということで確定。
【画質向上版 】ユニティちゃん3人で踊ってもらった 2:40付近からのポーズ等)


■作業もろもろ

○ジャケット

チェック模様やボタン類の目立たないところだけを変更程度。
ベース色の赤はそのままで3人ユニットとして「統一感」を維持。

この辺はアイマスのコス等を見ると感じるところです(アイマスやったことないですが)。
カラースキーム的に色は全員同じ色採用で統一感を維持。コスのデザイン差異=形状差異で同一性軽減。こういう設計をしているように感じます。



今回ジャケットデザイン変更=メッシュ修正はしないと決めているので形状はそのままです。

結果的に細かい点を少しだけいじりました。
  • ユニティちゃんTypeB(左担当):
    赤に白は王道なのでチェック模様の白はそのままにピンクを少しのせています。
    ただしベタ塗りだと安っぽくなりそうなので、ラメ的(?)な柄としてステンドグラス・フィルタを細かい目で生成。
    これをチェック模様白部分だけを抜いて下地調整、オーバーレイ、スクリーンなど3層で重ねています。
    オリジナルテクスチャには光沢も描きこまれているのでオーバレイ、スクリーンなどでその光沢描きこみも残す為です。

  • ユニティちゃんTypeA(右担当):
    赤に緑系なのでチェック模様の白部分を黒にして落ち着いた感じに(赤黒チェック柄)。
    黒ベタは安っぽくなりそうなので、皮のような模様をフィルタで生成。下地調整、オーバレイなどで重ね合わせ。その他はTypeB同様な感じで処理。



他、ジャケット/パンツの裾のボワぽいところも同様な感じで処理。

結果的に動画では「全く」わかりませんねコレ(汗;
作ってるときは楽しかったのでイイデスケドね(ボソ;


○髪


髪は最も個性付けしやすいところで重要パーツ。
とりあえず「髪をメッシュ気味」にするというのは私的に確定事項でイメージ。

まずはTypeBのピンク系がやりやすそうなので先にチャッチャと処理。
  • 濃いめのキャンディ・レッド(?)と白でグラデーション作成。
  • 明るめのピンクと白でグラデーション作成。
この2枚をオリジナルを下地にした上に乗算や焼きこみで重ねます。
さらにオリジナルの色調調整と、重ね位置(UVとグラデの位置具合)などを調整しつつ、ロングの毛先、生え際、左右の毛先などの位置と色加減も合わせこみ。

このとき髪のUV配置を3Dツールで確認した方が調整が確実ですが、これくらいならUnity上で貼って様子をみればだいたいすぐ合わせこめると思います。
一応グリッドテクスチャを一時的に重ねて貼り込んで位置確認しつつで処理。
(グリッドテクスチャ=格子状で全マスに番号がある。貼ると位置関係が見える)

TypeAも同様な感じで作成。
こちらはベースにかなり明るいエメラルド・グリーンを使ったので、顔左右の毛先は引き締まるように青入れ。
緑青系は難しいですが、結構TypeAの髪色は気にいってます。




○水着・ニーソ

  • ユニティちゃんTypeA(右担当):
    ブラはやや明るめの緑系(ジャケに黒を入れたので少し目立たせる方向に)。
    ニーソは暗い濃い緑で引き締めて、足元はあまり主張させない。
    同一色の使い重ねがしつこいとチープ感がでやすいので地味にメリハリを。

  • ユニティちゃんTypeB(左担当):
    ジャケ、髪が既に赤系なのでブラは明るさ抑え気味な若干暗めのピンクに。
    ニーソは濃い目で輝度は微落としたちょっと重さ(?)のあるピンク。

ブラの黄色いロゴ、星マークは全て黄色系で統一感を補助。
ただし全て少しずつ黄色は異なり、ベース生地の色に合わせて微調整。


○目

一番時間がかかったところです。

ちなみにオリジナルユニティちゃんの目は左右対称形ではありません。若干差異があるようにきちんと描かれています。

  • ユニティちゃんTypeA(右担当):
    ライトブルー系になるように、色調調整を繰り返し調整。
    一応逆光フィルタで輝きぽいものを描き込んでます。→ 動画では確実にわからないですが;

  • ユニティちゃんTypeB(左担当):
    ピンク+イエロー系になるように色調調整を繰り返し調整。
    ちょっと突っ込みどころがありそうですが、時間もなかったのでそこそこでFix。 




○スキン

  • ユニティちゃんTypeA(右担当):
    とにかく色白にしたかったので、かなり白めに調整してます。
    腰の星(☆)マークも緑にしますが若干色調を変える(他の緑と同一だと安っぽさがでるので)。


  • ユニティちゃんTypeB(左担当):
    服、髪が赤系なので、スキンはやや暗めの微赤系に調整。※動画だとこれもまず気づかないかも。
    腰の星(☆)マークは気持ち薄めのライトピンク。スキンの色調を暗めにしたのでここはワンポイントで少し明るめに。



ちなみにTypeAだけは顔に☆マークやほくろが描き込まれています。
※これも動画だと確認困難ですが、意図的にわかるかもしれないカメラアングルを仕込んでます。







結構テクスチャで印象がかわるのでこれはこれでやってて面白い作業ですが。
あんまり長時間こだわり過ぎると飽きてきてモチベが下がるので。
そこそこでFixしてしまうのがコツな気がします。



■脇の下破れ問題

これは結構早期に気づいていましたが放置してました。そもそも元のユニティちゃんがそうなっているわけですし。

ですが、ダンス中のキメポーズなところで確実に見えるのです。
いや、むしろ「見せている」ようなポーズのときがあるんですね。


これくらいならまだいいですが、

こっちは正面向きで完全に見える位置ではみでているので。


対策方法はいくつか考えられます。

  1. メッシュの頂点調整でスキンがはみ出さないようにする。
    → 今回メッシュはいじらないと決めてるので却下。
     
  2. はみ出ているスキンのテクスチャ面だけ透過にする。
    → 元RGBをRGBAにすることになる。体全体のスキンがRGBAになるので負荷増が予想されるので却下。負荷増えるくらいなら今回は放置にする。

  3. はみ出ているスキンのテクスチャ面に「上着の絵柄」を描きこむ。
    → 多分最もバランスのとれる解決策。しかし描き込むのが面倒だな~。重ねて焼きこむとかBlenderでやらないとかなぁ・・・日数もないし;
     
  4. はみ出ているスキンのテクスチャ面を上着の色でベタ塗りする。
    → かなり手抜きですが、動画上ではわかりにくいです。少なくとも何も対策しないよりは充分効果あり。
と、いうことで案4を採用。

グリッドテクスチャをスキンテクスチャ代わりに貼り付けて位置を特定します。
こんなテクスチャです。全マス内に番号が描かれています。



問題のポーズの状態でこれをスキンがわりにUnity上で貼って位置をだいたい特定します。

これで位置をメモしておいて、Photoshop上で元のスキンにグリッドテクスチャを重ねつつ位置を確認。
そこを問題箇所周辺の服の色でベタ塗りします。





ベタ塗りを適用した状態が右の2つです。

これなら作業がすぐ済むし意外と効果があります。

まじまじ見ると服の黒線が見えなくなるのでちょっと怪しく見えますが。
実際ダンス中はかなり気づきにくいです。元の状態に比べれば充分効果があります。

と、いう超手抜き超低工数で対策をしています。


しかし、

動画を見て、こんなことに気づいてる人は多分皆無でしょう(泣;


まぁどうでもいいといえば、どうでもいいことなので・・・。

ま~対策も短時間で済んでいるので良しです、自己納得で(笑。

ちなみにこれ以外でもはみ出ているシーンはありますが、他は今回のダンス&カメラ視点ではわかりにくそうだったのでスルーです。


スペキュラ、ノーマルマップはオリジナルをそのまま使用。特にいじる必要性もなかったので。

だいたい主にテクスチャ関連の修正はこんなところ。
たいしたことはしてないですね・・・。


0 件のコメント:

コメントを投稿