パーツひとつひとつを描き出してゆく
前回の記事までで作成できたイメージキャラクターを形にするための準備段階までやって来ました!今回はパーツの書き出しについて少し触れようかと思います!

ここで注意する点は少ないのでサクサクっと行っちゃいましょー!
ちなみにですが、この段階で目・眉・口のパーツを書き出す必要はありません。なぜならここで作成するのは【のっぺらぼうの肉体】の方だからです。
私の場合はですが、目パチ・口パク・眉パーツは別のillustratorデータで作成しました。(大きめのデータで作成したので使い回しが出来てその点めっちゃ便利でした!)
動かさなくて良い塊と動かすパーツを分けていく
例えば前回の記事で私は「色んなポーズを取らせると、その都度動画を入れ替えなきゃいけなくなるから面倒だし、やーめっぴ!」と言って途中から方向を変えています。

今思えば、「面倒」って結構酷くないですか!?
全身版を作ったタイミングではまだその面倒くささに気が付いてなかったので、胴体と肘から手までを別々に分けて書き出していたのですが…。↓

今思えばどうせポーズも変えないし腕も動かすことが無いので、胴体と腕を一体化した状態で画像化しておけば良かったなと思っています。(接合部分の位置の調整が難しくなるため)
このように、動かす必要のない部分で重なり順に問題が無ければひとつのパーツでまとめた方が分かりやすいです。
逆に動かしたいパーツの場合は左右対称なら片方だけ、そうでなければ各パーツごとに細かく書き出す必要があります。
ちなみに目・口・眉はまだ書き出ししなくてOKとお伝えしましたが…鼻の影だったりまぶたの部分の影だったりは輪郭の一部として書き出しを行いました。
アートボードをパーツぴったりに合わせて描き出す
髪の毛や衣装を揺らすための風揺れTですが、動きが結構独特です。
真ん中にぽつんとパーツがあって、その周りにすっごい余白がたっぷりある状態で風揺れをさせると意図せぬ動きになってしまうトラブルが起きることもあります。
それゆえ、アートボードをそのパーツのサイズぴったりに合わせて書き出す必要があります。

例えそうでなくても余計な余白はデータを重くする原因なので、少しでも画像を軽量化させるために無駄な余白が出ない様にしておきたいところですね。

こちらの例で言っても余計な余白は含まれていません。
アートボードをパーツぴったりサイズに合わせて描き出す方法
風揺れTは独特な動きをする為、パーツにぴったりと沿った画像ではないと上手く行かない可能性があります。それゆえパーツぴったりにアートボードのサイズを合わせて描き出さなければなりません。
※これらの作業をする前に一旦データの保存をしておきましょう!
作成したパーツを【ALT(⌥ Option)キーを押しながら】一旦何も無い空間まで持って来て…↓


メニューバーのオブジェクト → アートボード → 選択オブジェクトに合わせる
をすると、選択したオブジェクトに合わせてアートボードのサイズ・位置が変化します。
この際パーツにぴったりと沿うようなサイズになりますので、そのままweb用に書き出し【ctrl+Alt+shift+S(⌘ Command + ⌥ Option + ⇧ Shift + S)】を行えばOKです。
オブジェクトをアートボード外に運び出す際は忘れずに【ALT(option)キーを押しながら】するようにしましょう。これはオブジェクトを複製するショートカットキーです。
風を受ける方向を考えて描き出す
前回の記事でもご紹介しましたが、風を受ける方向を考えて書き出すようにしましょう。
こちらをご覧ください↓
AとBの動画では、後ろ髪の揺れ方が違うのが分かりますか?
実は使っているパーツの画像が異なります↓


Aの動画では後ろ髪を半分に分けて画像として書き出しを行いました。そして今しがた書き出した左半分は左に向けて揺らし、右半分は先ほど風揺れTを適用したパーツを反転させて反対方向に向けて揺らすことによって、まるで前方から風を受けているかのような動きを再現出来ています。
一方でBの動画は一方向から風が吹いているかのような動きをしています。

前髪や他の毛は正面から風を受けているのに、後ろの毛だけが片方から風を受けているようでなんだか不自然ですね。
なので、こうなってしまうかも?と思った方、それはいやだ!と思った方はパーツを半分にクリッピングしてから画像として書き出ししましょう。
クリッピングのやり方は簡単で、必要な分だけ図形で囲ってオブジェクトもろとも選択。
その後ctrl+7(command (⌘) + 7)でクリッピングできます。

