スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

■Live2Dを使って平面イラストを3D風にアニメ化してみた。~試作編~

sample01.gif
…ということで。前回の記事を更新した後、ちまちまと素材から作り直しまして
こんな感じのものを作ってみました。
ちなみにこのキャラクターは、以前発行したケモミミ本収録の創作キャラ〈日和ちゃん〉です。

制作時間はトータル5~6時間程で、試作品なのでかなり荒が目立ちます;
が、それなりにグリグリ動いてくれると達成感がありますねー(*´ω`)
▼ということで、簡単な制作の流れは追記にて
◆用意するもの
・photoshopやSAI等の画像編集・制作ソフト
・Live2D Cubism Modeler(32bit/60日間トライアルプロ版/無料)
・Live2D Cubism Animator(32bit/60日間トライアルプロ版/無料)
・元になるイラスト素材

今回の制作にあたり、Live2D公式のこちらのメイキングを参考にさせて頂きました。
実際に挑戦してみたい方はこちらの方を読んで頂いた方が解りやすいです。当たり前ですが…
制作に必要なソフトも公式サイトで一括ダウンロードできます。(試用期間無期限のフリー版と
試用期間ありのプロ版、選べます)


■①素材の準備
Live2Dの特徴はなんといっても「平面イラスト1枚だけで半立体のアニメが作れる」という所で
今までのようにフレーム数の数だけパラパラ漫画のようにイラストを描いたり
専門知識がなければ手出しすらできない3D化するためのポリゴン打ちも
とりあえずは必要が無いというところです。

hiyo_01.png
まず、PhotoshopやSAIでアニメーションの元となるイラストを1枚作成します。
イラストは正面向きで出来るだけ顔のパーツは左右反転できるようなものを描いた方が簡単です。
隠れる部分もしっかりと描き、重なりの優先順位を意識しながらパーツ毎にレイヤーフォルダを
分けて描いていきます。
ここでしっかりと作らないと後々アニメにしたときに苦労するので、一番時間をかけた方が良いかもしれません。
特に目のパーツだけでも「上まつげ」「横まつげ」「上下左右まぶた」「黒目」「白目」etc…と
細かく分ける必要があり慣れないうちはちょっと難しいです。データが揃ったらパーツ毎に
レイヤー統合したものをpsd形式で別名保存します。


■②Live2D Cubism Modelerを起動してpsdデータを読み込む

hiyo_02a.png
今回は自分で素材一つ一つポリゴン打ちする必要のない、PSD一括読み込みを使用しました。
[ファイル]→[PSDファイルをインポート]で、先ほど作成したイラストを読み込みます。

hiyo_02b.png
すると、こんな感じでレイヤーフォルダで分けた各パーツ個別に自動的にポリゴン化&整列してくれます。
本格的に凝ったものを作る場合はこの手順は手作業になるのでしょうかね。単純なイラストでもなかなか根気の要る作業です…。

そしてこれを配置したものがこちら。Live2D Cubism Modelerでは不透明度は自動で読み込めないため、
頬の赤み等不透明度を設定する必要がある場合は手動で調整します。
hiyo_03.png


ではいよいよ素材のモーション(動作)をつけていきます。
このソフトを使用するにあたり、「デフォーマ」やら「パラメータ」やら色々と専門的なパレットの仕組みと操作を
覚える必要があるのですが、今回はとりあえず動かしてみよう!ということで、基本的な動作を簡単に一括で
設定できるテンプレートを使用してみました。
hiyo_05.png
[ファイル]→[テンプレートを適用]で左の女の子のテンプレートモーションを設定します。

hiyo_06.png
テンプレートモデルを決定すると、このようなウィンドウが表示されます。
静止画ではわかりづらいですがテンプレの女の子と私の絵が交互に点滅するように表示されます。
テンプレートのモーションをトレースするには、それぞれのパーツが重なり合い
なるべく同じ位置にくるようにする必要があるので
(そうしないと、認識しなかったり変な所が動いてしまったりするのです)
目・鼻、口の位置、顔の大きさと長さ等がピッタリ重なるように微調節します。

hiyo_07.png
元のイラストがバストアップなので、テンプレートを拡大しました。

hiyo_08.png
おおよその大きさを合わせたら、元のイラストに合わせて、テンプレートの方の顔の配置を細かく
合わせます。(テンプレートのモデルはパラメーターでそれぞれのパーツの大きさや位置を変える事ができます)

hiyo_09.png
うまく調節できると、それぞれのパーツがリンクされて、テンプレートのモーションと連動して元のイラストも
顔を傾けたりまばたきをしてくれるようになります。プレビューで確認してみましょう。

hiyo_10.png
細部までは自動で綺麗に動くことはまずない(そうです)ので、目などの細かな粗は直接パラメータを
いじって調整します。(①を左右にスライドさせると、絵の②が上下に動き“まばたき”の動作になります)

hiyo_12.png
かなりやっつけですが…ギザギザっと広がってしまっていたまつ毛を無事閉じさせて、
まばたきモーションの修正が完了しました。

hiyo_13.png
さらにパラメータの各パーツを左右に動かしてみておかしな所がないかどうか確認します。
すると、頭を右に傾けた際に地肌が飛び出ている所を発見。これも手動で調節してひっこめます。

hiyo_14.png
ポリゴン打ちされた素材パーツはイラレのパスデータに似た所があるかもしれません。
アンカーポイントを動かして修正していきます。

hiyo_15.png
地肌が隠れて無事綺麗になりました。


…というところで、Live2D Cubism Modelerの工程はここで終わりです。
データを保存したら、お次はLive2D Cubism Animatorに移り
タイムラインに沿ったアニメーションを設定していきます。
QLOOKアクセス解析
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。