Live2D 高可動域モデルの顔の角度XYのすすめ①
はじめに
皆さんこんにちは。乾物ひものと申します。
この度、Live2D社から公式にご依頼いただき、「Live2D LAB」にて記事を書かせていただくことになりました。お話を頂いた時は飛び上がって喜びました。本当にありがとうございます！
今回は、私が普段Live2Dモデルを作る上で特にこだわっている、「顔の角度X」「顔の角度Y」の動きに焦点をあてた解説をしようと思います。
※斜め向きの顔にも一部参考になる部分はあると思いますが、今回は正面向きの顔を前提として書いていきます。
記事は3回に分けてお送りします。今回は「輪郭〜鼻」までを解説します。
それでは早速、本題に入っていきたいと思います。
制作にご協力いただいたVTuberさん
記事を公開するにあたって、私がLive2Dを制作したVTuberさん数名にご協力をいただきました。VTuberの皆さん、そしてイラストレーターの皆さん、制作過程公開の快諾、誠にありがとうございます！
【お名前一覧(敬称略)】
駆動ルル
Twitter
YouTube
イラストレーター:めーすけ
黒咲ユリア
Twitter
YouTube
イラストレーター:本田ロアロ
Live2D 制作フロー
まず、私のLive2Dモデルの制作手順はこんな感じです。
今回は、「顔の角度XY」に焦点を当てた記事なので、他の制作過程については割愛します。
(どこかのタイミングで、個人的に公開できたらいいなー、とは思っています)
下準備
顔の角度XYは基本的に、表情(まばたき・口・眉などの動き)が完成してから作ります。
(表情は先に作りましょう)
輪郭のパーツ分け
それでは、輪郭の動きから作っていきましょう。
輪郭のパーツは1パーツで作る方も多いと思いますが、私は
・線画
・ベース
2パーツに分けています。
こうすることで、上下左右を向いたときに、線画のみをマスクで消して立体的な表現が可能になります。
輪郭のアートメッシュ
アートメッシュの打ち方は基本こんな感じです。
線画パーツにも、メッシュをコピーして全く同じ割り方にしています。
輪郭の変形(角度X)
アートメッシュの編集が終わったら、デフォーマで横向き(角度X)の変形をしていきます。
輪郭のデフォーマは、昔から使いまわしてるので形状が複雑になってしまっていますが、原理としては
・横を向いたときは奥行きの関係で横幅が狭くなる
・奥の頬の輪郭がカーブを描く
・手前の顎の輪郭が緩やかな丸みを帯びる
・前髪パーツからはみ出ないように手前のこめかみ部分を引っ込める
という感じで動きを付けています。
また、キャラクターの性別や年齢、絵柄によって、横を向いたときの頬の膨らみ方は違いますので、その都度デフォーマの形を微調整しています。
片側の輪郭の向きが出来上がったら、「動きの反転」機能で、反対側にも同じ動きを付けます。
(参考：Live2D公式チュートリアル「動きの反転」)
これで輪郭の角度Xは完成です。
輪郭の変形(角度Y)
次は角度Yの動きを付けます。デフォーマはあまり変形させずに、上下にずらしています。
(角度Yは、動きの反転機能は使わず、手動で上下の動きを作ります)
角度Yの動きも、キャラによって個体差が大きいのでその都度微調整しています。
ユリアちゃんはかなり大きく変形させています。
これで上下左右の動きが出来ました。
輪郭の変形(斜め)
次は鬼門、斜めの動きを作ってきます。
Live2Dには「4隅の形状を自動生成」というとても便利なツールがあります。
(参考：Live2D公式チュートリアル「4隅の形状を自動生成」)
二つのパラメータの形状をかけ合わせて、自動的に斜めの動きを作ってくれる、というツールなのですが、これを高可動域の角度XYに反映させるとどうなるかというと…
こうなります。(ぎゃああああああああ)
一見、とんでもないことになっていますが、XYの動きのかけ合わせ自体はとても綺麗に出来ているので、あとは手動で微調整していきます。
そもそも、なんでこんな歪みが発生してしまうかというと、人体の動きには「パース」がかかっているからです。
人間の頭を単純化して立方体で考えた時、このように斜め上や斜め下を向いたときはパースがかかります。
しかし、「4隅の形状を自動生成」機能では、パースを考慮していないのでこのような動きになり、形が歪んで見えます。
つまり、パースのかかってない部分を斜めにずらせば、歪みは解決するのです。
(裏を返せば、動きが少ない=パースがかかりにくい体の動きなんかは、ほとんど無修正で綺麗な動きが作れる神機能です)
輪郭の動きに戻りましょう。まずは、4隅の形状を自動生成で斜めの動きを付けた後に、全体的に形を斜めにずらします。
デフォーマの編集レベルを3にすると動かしやすいです。
あとは、反対側の動きを、「動きの反転」機能で作れば、両側の斜めの動きが出来ました。
(デフォーマの形がかなり歪んでいますが、なるべくデフォーマだけで変形を終わらせたいためです。どうしても輪郭の歪みを無くすのが難しい場合は、アートメッシュもパラメータを打って直接弄ります。)
拡張補完について
最後に、角度Xのパラメータに「拡張補完」という機能を反映させます。
通常、デフォーマやアートメッシュは、パラメータ間を直線的に動きます。
なので、そのままだと斜めの動きの時にカクついた動きになってしまいます。
しかし、拡張補完機能を入れると、パラメータ間の動きを補完して、曲線的な動きを自動的に作ってくれます。
素晴らしいですね！！！！
(この機能が追加される前は、皆さん自分で補完する動きを点を打って作っていたみたいです…いにしえのモデラー達は凄い…)
これで輪郭の角度XYは完成です！
…と、言いたいところですが、私はさらに何点か工夫を加えています。
顎の影の生成
まずは顎の影の生成。
こんな感じのパーツを新規に作って、輪郭のベース部分にクリッピングします。
そして、輪郭とは別のデフォーマを作成し、影をスライド状に動かして立体感を付けます。
(分かりやすいように、クリッピングを外して表示しています)
線画とベースを別々に作っておくことで、線画に干渉せずに影を付ける事が可能になります。
輪郭の線画のマスク
さらに、今度はこのようなパーツを作ります。
このパーツの不透明度を0%にし、線画をクリッピングさせ、「マスクの反転」を適用させると…
このように、顎の線だけを消すことが出来ます！
これを利用して、横や上を向いた時の顎の線を削っていきます。
かなり立体的な動きになりましたね。今度こそ輪郭の角度XYの動きは完成です。
鼻のデフォーマの作り方
次は鼻の動きを作っていきます。
目や口など顔のパーツはとても複雑な動きをしますが、その動きの指標になるのが「鼻」の動きです。なので、顔のパーツは鼻から作っていきます。
鼻のパーツ分けやメッシュ割りも個体差が大きいです。女の子の単純化された鼻の方がパーツ数も少なく動かし方も単純に、男の子の高い鼻の方がパーツ数が多く複雑な動かし方になることが多いです。
鼻のパーツのデフォーマの入れ方にはコツがあって、
このように、鼻の一番高い部分にデフォーマの中心が来るように入れます。
(デフォーマからアートメッシュがはみ出さないようにしましょう。多くの場合デフォーマの下部分が余ってしまうと思いますが、それで大丈夫です)
鼻の変形(角度X)
男女共、基本的に横を向いたときに「く」の字になるようにデフォーマを動かします。
このとき、くの線があごに繋がる位置にくるようにします。
青葉くんは男の子ですが、キャラデザインも私のため、モデリングしやすい鼻の形状で作っています。
しかし、地味に難しいのがこういう鼻です。
男性絵だとよくある描き方ですが、正面向きの時点でどちらかに向いている鼻だと、反対側に向かせる時にとても歪みやすいです。
解決策としては、アートメッシュを直接弄って力技で変形させるか、鼻の折れ目でパーツを分けて別々に動かすといいでしょう。
反対側の動きを「動きの反転」機能で付けたら、鼻のXの動きは完成です。
鼻の変形(角度Y・斜め)
こちらも原理は同じで、横向きのくの字になるように動かします。
このとき、奥になる方を縮めると立体感が出ます。
上下左右の動きが出来たら、輪郭の時と同じように、
4隅の形状を自動生成→手動調整
で斜めの動きを作っていきます。
拡張補完も忘れずに！
これで鼻の動きは完成です。
今回はここまで！
おわりに
いかがだったでしょうか。
次回は、目の動きから解説していきたいと思います。
今回の解説で登場した雨森青葉くんですが、彼のモデルの制作過程はYouTubeでも公開しています。
そちらでは、音声付きで原画作成から詳細に解説している(しかも英語字幕付き！)ので、もし興味があったら是非ともご覧下さい。
お読みいただきありがとうございました！！
それでは。
乾物ひもの
----------------------------------------------------------
乾物(かんぶつ)ひもの
バーチャルYouTuberとしてメイキング動画・ゲーム実況・歌ってみた動画などをYouTubeとニコニコ動画に投稿する傍ら、フリーランスのLive2Dモデラーとして多数のVTuberモデルを制作。元々はイラストレーターとして活動。
昨年11月には「Live2Dクリエイター表彰プログラム」を受賞
代表的なLive2Dモデルの制作実績
ホロライブID/Ayunda Risu
Twitter…https://twitter.com/ayunda_risu
YouTube…https://www.youtube.com/channel/UCOyYb1c43VlX9rc_lT6NKQw/
ⓒ 2016 COVER Corp.
歌衣メイカ
Twitter…https://twitter.com/meikahaotoko
YouTube…https://www.youtube.com/channel/UC7-N7MvN5muVIHqyQx9LFbA/
歌衣イツミ
Twitter…https://twitter.com/Itsumi_V
YouTube…https://www.youtube.com/c/%E3%82%A4%E3%83%84%E3%83%9F%E3%81%A1%E3%82%83%E3%82%93%E3%81%AD%E3%82%8B/
歌衣アズミ
Twitter…https://twitter.com/As_me_V
YouTube…https://www.youtube.com/c/%E3%82%A2%E3%82%BA%E3%83%9F%E3%81%A1%E3%82%83%E3%82%93%E3%81%AD%E3%82%8B/
いいなと思ったら応援しよう！
