FC2ブログ
スポンサードリンク

Live2D Cubism 3で三つ首のドラゴン!(描画順グループ)

Live2D Cubism 3 使ってみようキャンペーンに向けて、
三つ首のドラゴンを作りました!

ニコ動に改めて効果音を付加して投稿しました。

他版→無音Youtube版pixivうごイラ版

ループ再生も可能!



さて今回の目玉というか、三つ首を題材にしたのは、
3の新機能描画順グループをわかりやすく使うためでございます。
複数の部品からなる顔などでも、一括して前後関係を変えることができる機能です。





Cubism 2.1までは、描画順はアートメッシュ自体にパラメータを付けるしか変えるしかありませんでした。
つまり顔のように複数のアートメッシュで作られていると、
顔、口、鼻、まぶた、目玉、髪などなど、全てに個別にパラメータを付ける必要がありました。

デフォーマで動きを付けていればまだしも、
まぶたや口はアートメッシュ自体で変形させることが多いため、
そこに描画順変更のパラメータを掛け合わせるのは現実的ではありませんでした。

そこでCubism 3の描画順グループ
まずパーツ管理がフォルダ階層式になったのですが、そのパーツフォルダ内をグループ化させることができます。
グループ化にチェックを入れると、グレーでGと書かれたフォルダの描画順グループになります。

Live2D_Dragon000001.jpg


こうすると、その描画順グループに描画順のパラメータを設定することが出来るようになります。
Euclidの描画レイヤーも同様ですが、よりコンパクトな対応方法ですね。

上の画像で「下描き2」「顔」の描画順数値が濃いのは、描画順を比べる対象だからです。
「顔」の描画順グループの中を選択するとこのように。
Live2D_Dragon000002.jpg
「顔」内のアートメッシュの描画順数値が濃くなりました。
描画順グループ内は中だけで描画順を比較するので比較対象の数値が濃くなったのです。


さて、そうして描画順グループの「顔」にパラメータを付けると、
以下のように操作ができます。

Dragon_Byougajun_s.gif

普通は避けますが、わかりやすく貫通させてます。





今回は一般的に使いそうなということで顔を使いましたが、
個人的に前に作っていた自在な手の描画順をまとめられるのがとても嬉しいです。

手を回すことと指を曲げることに描画順を使っている手が、
このように体の前後に動かせる!

Michael_HandRoll2_GIFANIME.gif



ちなみに、手の何に苦労したかって以前散々書きましたが、
そういえば本当に大変だった点を書けていなかった気がする。

まずCubism3の機能で、描画順の変化具合を横から見てみましょう。
左に飛び出ているほど描画順が大きく手前に表示されるアートメッシュです。

Live2D_指折り描画順C3表示例

それぞれの関節のズレからも少しはわかるでしょうか。
「手首回転X」と各「指の屈折」により、
全ての指関節ごとの描画順管理が恐ろしいことになっていました。
それは以前も書きましたが、問題は描画順が入れ替わるタイミングだったのです。

描画順は1000までの整数で表します。
パラメータ間も整数で遷移するため、小数の描画順はありません

そのため、パラメータ間の差が少ないと、切り替わるタイミングが限定されます。
差が4しかなかったりすると、切り替わるタイミングはパラメータ間を4分割したどこかしかなく、
2.5ぐらいで入れ替わって欲しいと思っても無理なのです。

その場合差を8ぐらいまで広げるよう、パラメータ点の描画順を変えます。
するとやはりその前後のパラメータ点間の描画順切り替わりタイミングがズレてくる…と。
「手首回転X」×「指曲げ」なので前後左右とも言えます。

その為はじめ、手の描画順を大体±20ぐらいしか取っていなかったのを、
±40ぐらいまで倍増させたことも。
手の全てのアートメッシュのパラメータ毎の描画順を!

パラメータ間の描画順切り替わりタイミング。
これが一番調整に時間がかかったことなのでした。



しかしこれを描画順グループを使えるとすると。
まず描画順の範囲を小さめにしなくて良くなります。
描画順グループ内でなら1000段階使っちゃっても他パーツに干渉しません。
切り替わりタイミングが機敏になります。

あと指ごとに描画順グループがあると便利ですね。
指の関節に他の指がぶっ刺さるのを防げます。

なんと素晴らしい機能!!


あ、ちなみに、フリー版では描画順グループは2つまでしか使えません。
これはPRO版を使うしかありませんね!




おっと、他に使った手法を忘れてた。
首の縞は加算+クリッピングです。
Live2D_Dragon000003.jpg

本当はこんな色。
加算なのは首本体の陰影の位置を反映させるためです。
右首だと顎元が暗めですよね。

加算でちょうどいい黄色になるこの緑色はどうやって決めたのか?
それは以前書いた記事を参照してください。
【Live2D講座】厚塗り等を後からベース色と乗算・加算レイヤーに分ける方法



というわけでまた。
ぐっどらっく。

↓もし良ければお気軽にクリック投票お願いします↓

人気ブログランキングへ

 




テーマ:2DCG - ジャンル:コンピュータ

[タグ] オリジナル Live2D

2017.06.29 | コメント(0) | トラックバック(0) | Live2D

 

コメント

コメントの投稿


管理者にだけ表示を許可する

«  | ホーム |  »

プロフィール

まかかび

Author:まかかび
漫画描いたり作曲したり。
できればゲームも作りたい。
Live2D制作承ります。
Pixiv、niconico、Youtube
作品販売もいずれ。

最新記事一覧

きょうのらくがき202 アイボリー!らこらん 2019/01/03
2019あけましておめでとうございます! 2019/01/01
メリークリスマスなVカツマイケル伊豆でも 2018/12/25
きょうのらくがき201 猫ちゃんを捜せ 2018/10/24
きょうのらくがき200 魔法少女!らこらん 2018/08/19

     全記事一覧

タグクラウド


検索フォーム

ブロとも申請フォーム

この人とブロともになる

表示

Amazon.co.jpアソシエイトに
参加しています。

QRコード

QR

メールフォーム

ご連絡はこちらからどうぞ

名前:
メール:
件名:
本文:


計画表

・次回本編は人気投票公約話
・ラノゲツクールMVもやりたい

ロボット勇者β版

まかかび監修バーチャルYouTuberのトニア君です。 RBT001200.jpg →チャンネル →Twitter

正義のヒーローのどX

第1話はこちら→ BGM付き版pixivマンガごっちゃマンガハックマンガボックス

マンガ図書館Zに登録しました
1巻へ2巻へ

コラボ漫画公開中!記事へ

最新第9話!
9話サムネイル
→BGM付き版へ
  →コマ割り版へ

らくがき4コマ集その22
4コマ集22
→BGM付き版へ
  →コマ割り版へ

イラストや落書き集

↑クリック後のページから、画像を新しいタブで開くと最大サイズになるようです。


まかかびBGM

プレイリスト

絵と曲の10年進化録
10年進化録サムネイル
→絵と曲の10年進化録へ


プレイリスト

フリーBGM配布→DOVA-SYNDROME

Twitter

余所様リンク




当ブログ用バナーはこちら