Live2D

Live2dモデルの作り方。初心者はまず全体の流れを知ろう!

狸禰 いり
記事内に商品プロモーションを含む場合があります
いり
いり

Live2Dモデルを初めて作りきることができたよー!!

ぽん吉
ぽん吉

おめでとう!!
ちなみにどれくらいかかった?

いり
いり

ありがとう!
Live2D Cubism自体触ったこともなかったから手探りだったけど、1ヶ月くらいかな?
まだまだ改善が必要な場所がいっぱいあるから、また作る時に困らないように、全体の流れをまとめておこうと思う!

ぽん吉
ぽん吉

まさに備忘録だね!

はじめて挑戦したLive2D

モデルを0から作ってみて、全体の流れを掴むことで作りやすくなったので、この記事では全体の流れを紹介していきます。

必要な細かい内容は、流れの紹介の中に別記事をリンクさせていくので、自分が今ゴールまでどのくらいの位置にいるのか確認しながら進めてみてください。

この記事はこんな人にオススメ
  • Live2Dモデルを作る時の全体の流れが知りたい人

Live2dモデルの作り方

全体の流れでは専門用語を使っていますが、1つ1つの工程では初心者でもわかりやすくLive2Dモデルの作り方がわかるよう、専門用語が何を表すのかできるだけ噛み砕いて解説していきます。

Live2dモデルの全体の流れ

  1. 動かしたいモデルのイラストを用意する。
  2. 各パーツのメッシュ割をする。
  3. テクスチャアトラス編集をする。
  4. 動かした時にはみ出して欲しくないパーツをマスクする。
  5. 目・目玉・口・眉の動きをつける。
  6. 髪の揺れの動きをつける。
  7. 輪郭X・Y軸の動きをつける。
  8. 輪郭に合わせて顔周りのパーツのX・Y軸の動きをつける。
  9. 頭と首の傾きをつける。
  10. 腕の動きをつける。
  11. 体の回転Xの動きをつける。
  12. 体の回転Yの動きをつける。
  13. 呼吸の動きをつける。
  14. 体の回転Zの動きをつける。
  15. ステータス異常がないかチェックする。
  16. 物理演算の設定をしていく。

動かしたいモデルのイラストを用意する

Live2Dで動かせるようにpsdデータを用意します。

用意するpsdデータは、綺麗に配信画面に映すために縦8500px以上のものが必要です。

デジタルアバターを使う時、配信画面では上半身を拡大して使うことがほとんど。
なので、拡大しても綺麗な状態を保つためには、このくらいのピクセル数が必要なんです!

イラストを作る・頼む時のポイント

  • イラストは縦8500px~10000px。
  • 左右対称に描いてもらう。
  • 使えるレイヤー効果は、通常・乗算・加算の3つ。
  • 落ち影、頬紅は画像統合せずはみ出した状態にしてもらう。(後でクリッピングマスクする)

各パーツのメッシュ割をする

イラストを動かせるように各パーツのメッシュ割をします。

メッシュは頂点と線で構成された三角形の集合体で、細かく分割することで細かい変形ができるようになります。

いり
いり

細かくメッシュ割をするほど頂点が増えるので、調整が大変になるデメリットもあります!
なので塩梅は実際に動かして慣れていくのがオススメ!

顔の上にある黄緑色の線がメッシュ割した時にできる線です。
これをパーツごとに全て行います。

メッシュ割のポイント

  • ポリゴンは正三角形を意識する。
  • 大まかな動きしか実装しないパーツは自動編集でも大丈夫。
  • 1番動く目・口・髪のメッシュ割は丁寧に。

テクスチャアトラス編集をする

テクスチャアトラス編集とは、キャラクターを構成する部品を平面上に並べた画像のことで、テクスチャアトラス編集は、MOC3ファイルを書き出す前に必要になります。

難しいものではなく、専用のボタンを使うことでサッと作れます!

テクスチャアトラスを差し替えることで、色違いバージョンを作ることができます!

テクスチャアトラス編集でできること

  • テクスチャの追加、削除、サイズ変更。
  • 各オブジェクトの配置や倍率の自動変更。
  • 選択中のテクスチャに配置されているアートメッシュの検証。
  • 各オブジェクトに対する変更を最初の状態に戻す。
いり
いり

縦8500px以上の絵をテクスチャアトラス編集するとき、初期設定の1024pxで作ると絵がボヤけて見えてしまうようになるので、4096pxくらいがオススメ!

動かした時にはみ出して欲しくないパーツをマスクする

メッシュ割が完了したら、はみ出してほしくないパーツを、クリッピングマスク機能を使って隠します。

左がクリッピングマスクをする前の口内。
右が口内のパーツをクリッピングマスクしたもの。

クリッピングマスク機能を使うことで、パーツを削ることなく見た目を削ることができます。

よく使われるのは、頬紅・口内・瞳の3箇所です。

いり
いり

クリッピングマスクはできる数に制限があります!
Cubism SDK for Unityであれば64枚、それ以外は36枚です!

目・目玉・口・眉の動きをつける

動きをつけるとき、変形パスツールなどを使ってパーツを直接編集する方法と、面で動かす『ワープデフォーマ』・支点で動かす『回転デフォーマ』の3つがあります。

その3つの中の1つ、変形パスツールなどを使ってパーツを直接編集する方法を使います。

動きをつける時のオススメの順番

  1. 黒目の上下左右の動き。
  2. 目のまばたき。
  3. 口の『あ・い・う・え・お』の動き。
  4. 眉の動き。

髪の揺れの動きをつける

ここからは人によって取り掛かる順番は変わってくると思います。

デフォーマのはみ出しを防ぐために、親デフォーマを最後に作るのがオススメです。

合わせて読みたい
Live2Dでデフォーマのはみ出しをチェックして修正する方法
Live2Dでデフォーマのはみ出しをチェックして修正する方法

ということで、私は髪の揺れから作っていきます。

ここで使うのも面で動かす『ワープデフォーマ』。

前髪・横髪・後ろ髪の3パーツに分けて揺れをつけます。

ワープデフォーマの下部分をずらすだけで動きが出るので、ササっと終わらせることができる工程です。

動きを作る時の流れ

  1. 髪揺れにキーを追加。
  2. 右のキー(1.0)に合わせて左から右に揺れている動きを作る。
  3. 『動きの反転』で反対側に同じ動きを作る。

輪郭X・Y軸の動きをつける。

お次は輪郭のX・Y軸(上下左右)の動きをつけます。
X軸が左右、Y軸が上下です。

使うのは面で動かす『ワープデフォーマ』。

この工程はできるだけしっかりと向き合うのがオススメ

というのも、ここをなんとなくで進めてしまうと、この後の工程になる顔周りのパーツも崩れていってしまいます。

土台になる工程なので、バシッと形を決めていきましょう!

動きを作る時の流れ

  1. 角度Xで片方の動きを作る。
  2. 『動きの反転』で反対側に同じ動きを作る。
  3. 角度Yで上下の動きを作る。
  4. 『4隅の形状を自動生成』で斜めの動きを作る。
  5. 手動で違和感がないように調整する。
いり
いり

『動きの反転』でうまくいかなかった場合は手動で動きをつけます!

輪郭をより綺麗に動かすために

  1. 輪郭の影をつける。
  2. 輪郭線をマスクする。

輪郭に合わせて顔周りのパーツのX・Y軸の動きをつける

輪郭のX・Y軸ができたら、輪郭の動きに合わせて顔周りのパーツを動かしていきます。

ここでも使うのは面で動かす『ワープデフォーマ』。

基準にしやすい鼻の動きをつけると、バランスがとりやすいです。

動きは自動生成で作ることができるものもありますが、あくまで自動生成なので作りっぱなしにしないで、手動でも調整しましょう。

動きを作る時の流れ

  1. 角度Xで片方の動きを作る。
  2. 『動きの反転』で反対側に同じ動きを作る。
  3. 角度Yで上下の動きを作る(角度Yは動きの反転が使えません)。
  4. 『4隅の形状を自動生成』で斜めの動きを作る。
  5. 手動で違和感がないように調整する。
いり
いり

動きの付け方は輪郭と一緒!

動きをつける時のオススメの順番

  1. 耳(獣耳の場合は髪の後がオススメ!)

頭と首の傾きをつける

お次は頭の傾き。
傾きは角度Zのパラメータに設定していきます。

使うのは支点で動かす『回転デフォーマ』。

私は支点は顎に設定して、15度の角度をつけました。

頭の傾きができたら、次は首です。
体は繋がっているので、頭だけを動かすなんて無理ですもんね!

首は面で動かす『ワープデフォーマ』を使います。
顔の傾き同様、角度Zにキーを追加して傾きを作ります。

首の傾けが終わったら、髪の傾き。
前髪・横髪・後ろ髪それぞれに、角度Zのパラメータを設定していきます。

動きを作る時の流れ

  1. 頭以外のパーツに鍵をかける。
  2. 頭のパーツを全て選択し回転デフォーマをつける。
  3. 支点を顎に設定して角度Zにキーを追加。
  4. 右のキー(30.0)に合わせてウィンドウのインスペクタにある角度に15度と打ち込む。
  5. 『動きの反転』で反対側に同じ動きを作る。

この工程ですること

  1. 頭を傾ける。
  2. 頭の傾きに合わせて首を傾ける。
  3. 角度Zの場合の髪の揺れを作る。

腕の動きをつける

STEP9までで頭の動きができました。ここからは体の動きです。

まずは腕をパタパタ動かせるようにします。
デフォルトでパラメータがないので、右腕と左腕のパラメータを自分で作りました。

パラメータを作ったら、腕を動かせるよう『回転デフォーマ』を使います。

高可動域のモデルを作りたい場合は、上腕・前腕・手の3箇所に回転デフォーマ設置して、更にひじをパーツとして用意する必要があります。

今回はまずは1体作りきることが目標なので、腕は上下にパタパタさせるくらいにとどめました。

体の回転Xの動きをつける

体の回転Xの動きは、左右に体を捻る動きです。
使うのは面で動かす『ワープデフォーマ』と、支点で動かす『回転デフォーマ』。

モデルの衣装や装飾によって区切る位置が異なってきますが、基本的に上から動きをつけるのがオススメ。
胸の回転をつけた後、腕→腰→下半身の順に動きを整えていきます。

キーを追加するパラメータは『体の回転X』。

胴体部分の傾きに合わせて腕の位置を調整します。

動きをつける時のオススメの順番

  1. 腕の位置調整
  2. 下半身

体の回転Yの動きをつける

体の回転Yの動きは足の曲げによる上下運動。
屈伸のような大きな足の曲げではなく、リズムをとるような比較的小さな動きです。

体の回転Yの動きをつけるときは、回転Xとは逆に、下から動きをつけるとうまくいきました。

足以外をワープデフォーマで一括りにするので、回転Xよりずっと簡単にできましたた。

動きをつける時のオススメの順番

  1. 足以外

呼吸の動きをつける

呼吸の動きはとても簡単。

頭・腕を含めた上半身のワープデフォーマを新しく作り、パラメータの『呼吸』にキーを打ち、右端の1.0の数値の時に息を吸った時の胸あたりが膨らむ動きを入れるだけです。

いり
いり

とても小さな動きなので一瞬不安になりますが大丈夫です!

体の回転Zの動きをつける

体の回転Xで左右に体を捻る動きをつけ、体の回転Yで上下の動きをつけたので、最後に体の回転Zで傾きをつけます。

体の回転Zは左右の傾きなので、面で動かす『ワープデフォーマ』を使って傾けるだけです。

ステータス異常がないかチェックする

デフォーマのステータスが正常でないと、モデルがカクついてしまったり、動かなくなってしまったり、問題が起きる原因になります。

最終確認も込めてしっかり正常に戻していきましょう。

 デフォーマの検証方法

  1. メニュー『モデリング』内にあるデフォーマから『デフォーマの検証』を開く。
  2. 『ステータスが正常でないものだけ表示』にチェックを入れる。
  3. 項目がなくなるまで問題点を改善していく。

もっと詳しく知りたい人は、こちらの記事をご覧ください。

合わせて読みたい
Live2Dでデフォーマのはみ出しをチェックして修正する方法
Live2Dでデフォーマのはみ出しをチェックして修正する方法

物理演算の設定をしていく

物理演算を設定するとき、パラメータから物理演算をかけるパーツを指定するので、あらかじめ揺らしたいものは独立したパラメータを作っておきます。

物理演算の設定方法

  1. メニュー『モデリング』内にある『物理演算設定』を開く。
  2. 物理演算タブのグループ名横の『追加』ボタンを押す。
  3. 出てきたポップアップに必要項目を入力。
  4. 出力設定タブに移り『追加』ボタンを押す。
  5. 出力パラメータから用意したものを選択。
  6. 物理モデル設定の『振り子の設定』で数値をいじる。

より詳しく物理演算の設定について知りたい人は、こちらの記事をご覧ください。

合わせて読みたい
Live2Dで物理演算を設定する方法を画像付きでわかりやすく紹介
Live2Dで物理演算を設定する方法を画像付きでわかりやすく紹介

さいごに

記念すべき初モデルの基盤が完成しました!
元になるデジタルアバターができたことで、とりあえず配信はできそうです!

まだまだ角度の付け方が上手くいってなくて違和感があったり、もっと動かせる箇所や作りが甘い箇所がわかったりと終始勉強あるのみを感じていますが、とにかく動くことが嬉しくて……感動しています。

ここから違和感を取り除いたり、作りが甘い箇所を補完したり、表情差分など追加したり……進化して行ければと思います!

初モデルを作りきったことで流れを掴めたので、セルフ受肉の様子は配信で公開しながらしていくので、よかったらtwitchYouTubeに遊びにきてください!

いり
いり

記事が更新できたらX(旧Twitter)でもお知らせするので、フォローしてもらえると嬉しいです!

-fin-

Xからの読者コメントをお待ちしています。
ブログ更新の励みになります!

このサイトではFreepikの素材を使っています

ABOUT ME
狸禰いり
狸禰いり
準備中Vtuber
セルフ受肉でVtuverになる狸。 ものづくりとゲームが大好き.ᐟ.ᐟ このブログでは、私の挑戦や失敗から感じた役立つ情報を更新していきたいです.ᐟ.ᐟ
記事URLをコピーしました