【Live2D解説】破綻のない輪郭の変形方法(X軸)
Added 2022-04-22 17:26:05 +0000 UTCこんばんわ。通知見てひっくり返るかと思いました。
なんでこんな急に増えたのか謎だったのですが、新規の支援者さんが中国語圏の方が多い感じだったので調べたら、ビリビリ動画にこれが転載されてたのですね。
ご丁寧に概要欄に色んなリンクを載せてくださってたのでここまでたどり着いたのかなと思います。何はともあれご支援下さってありがたいです！
ということで今回はお礼もかねて輪郭の変形について解説しようかなと思います。
輪郭と言えば、1年前にnoteでLive2D社さん公式依頼の記事としてこんなものを書いてました。
正直に言います。
このnoteの内容、もう古いです。
間違いは言ってないのですが、説明が不十分だったり今はもう使ってない手法を解説している部分がめっちゃ多いです。
今の輪郭変形はこんな感じ。
bandicam 2022-04-22 22-45-49-634
めちゃくちゃな動かし方してるように見えてある程度の法則があります。
今回は、noteの記事がどう古いのかも見比べながら綺麗な輪郭の変形について解説します。
◆輪郭のパーツ分けについて
以前は「線画とベースを別々のパーツにする」と解説していました。
それ自体は今も変わりません。
ただし、輪郭パーツの範囲が大きく変わりました。
このように、以前は頭蓋骨を丸々覆うような形で作っていたのですが、今は生え際までの部分しか作っていません。
何故なら、実際には生え際の外側には髪の毛が生えており肌色は一切見えることがないからです。作るだけ無駄なんですね。
しかも、頭蓋骨部分を作ってしまうと、横を向いた時に耳の回り込みを考える必要があります。
こんな風に、斜めを向くと耳が輪郭の前面に来るので、その回り込みを考えないといけません。
生え際でパーツ範囲を止めておけばそのような順序の入れ替わりは起きませんので、作るのが楽になります。
ちなみにこの「生え際で輪郭パーツを作る」アイディアは私考案ではなく
雨瀬おるこさんのアイディアです。
良いと思ったアイディアはどんどん取り入れていくのがひもの流である！
皆さんも是非私をアイディアを取り入れて自分の形にしてください。
◆輪郭のメッシュについて
以前はこんな分け方でした。
いまはこう。内部の点が少し減ったのと、境界の内側にも1列点を増やしてます。
理由は線画パーツの方を見ると分かります。
点を1列増やすことでこのように線画を綺麗に囲う事が出来ますね。
可動域を大きく付けて線画が歪んでもこれなら手動で微調整が出来ます。
(今のところはデフォーマのみで綺麗に変形できていますが！)
◆輪郭の変形(角度X)について
以前はこんな解説をしていましたが、これがもうめっちゃ古い情報です…。
この変形には大事なものが欠けています。
それは「エラ」です。
ここの出っ張りが圧倒的に足りません。
もう一つ
ここの眉尻の出っ張りも足りません。
以前の変形も大きな間違いではなかったのですが、
本当に破綻のない変形を目指す場合、
意識しなければならないのは「骨」です
この赤線で囲んだ部分、自分の顔の同じ部分を触ってみると骨が出っ張って固いのが分かると思います。
こういった「出っ張った骨」部分は横を向いた時に飛び出て見えることを意識して変形しないといけません。
更に、実際には見えない部分ではありますが、ここの生え際の立体感を意識すると一気に立体への理解が増しますのでおすすめです。
更にもう1点大きく変わった部分があります。
昔はデフォーマの横線が真っ直ぐになるように作っていました。
「X軸は横の動きなんだから縦には動かさない方がいい」という考えですね。
そうやって作ると、顎や頬、おでこなどは正面向きと同じ高さになります。
一見正しく思えるこの動かし方。勿論これは間違ってません。
実際、3面図なんかはこのように頭や顎・鼻の高さを揃えて描くことが多いです。
しかしこれはあくまでも「2D」的な正しい考え方です。
今は手前側が下に、奥側が上に上がるように作っています。
何故このように作っているか。それは3Dモデルの動きをみると分かります。
ニコニ立体ちゃんをサンプルにお借りしました。
この「正面向き」「斜め向き」の画像を重ねてみましょう
これだけだと分かりにくいのでガイド線を引きます。
顎・口・鼻・眉毛にガイド線を引きました。
分かりますでしょうか？斜めを向くと向いた方向に少し高さが上がっています。
体の動きはもっとわかりやすいです
手前側の腕が下に、奥側の腕が上に上がっています。
こう見える理由はザックリいうと「3D空間では横軸にもパースがかかってるから」です。
構造的に正しいのは左だけど、実際の人間の目には右に見えているという事です。
以前のnoteにはこんな自作図を載せていましたが、実はここに既に答えが載っているんですよね。
横向きでもパースは掛かるんです。
という事で、現在はこのように、X軸の変形時は「手前が下、奥が上」になるようにデフォーマを斜めに動かし、骨を意識しながら出っ張りを作って変形しています。
bandicam 2022-04-23 01-56-07-886
動かすとこんな感じ
bandicam 2022-04-23 01-56-47-454
ちなみに輪郭だけだとこんな感じです。これだけでも立体感が分かるように作ると良いと思います。
今回の解説は以上です。
余談ですが、先ほど「3Dは横軸にもパースがかかる」と言いましたね。実はこれ半分正解で半分間違いです。実際には「透視投影の時は横軸にもパースがかかる」が正しいです。
実は3Dには「平行投影」と「透視投影」の2種類があります。
先ほどの図の左が「平行投影」、右が「透視投影」だと思ってもらえればいいです。
実際の見え方は右なのになんで左の投影方法があるかというと、作る時は左で作ったほうが楽だからですね。左の投影方法で、3面図などをガイドにしながら作ります。(そりゃそうだ。パースがかかってる状態で作るのはめっちゃ大変です。)
Live2Dも基本は並行投影の考え方で作るのが主流ですよね。
そこに透視投影の考え方を導入したのが今回の制作方法になります。
…正直、輪郭と表情だけのこの進捗動画がここまで反響があるとは思ってませんでした。(現在4.9万いいね)
勿論今までの技術をつぎ込んだ自信作ではありますが、何かインパクトのあるギミックがある訳でも、めちゃくちゃ凄い可動域がある訳でもないのになんでこんなに伸びたんだろうと少し不思議だったのですが、
「今まで2D的な平行投影の考え方しかなかったLive2D業界に透視投影の概念を持ち込んだ」からかなぁ、なんて思ったのです。
見た目はイラストなのに、現実世界や3D世界と同じような動き方をしている…そのギャップが何かしらの魅力を生み出してるのかもしれません。
最後に、この透視投影的なLive2D制作法、初心者にはマジで不向きです。
単純に難易度が高いですし、透視投影をある程度理解した人が作らないと、間違った固定概念を持ってしまう事に繋がりかねません。
平行投影で作ったとしても、最初に解説した頬骨やエラを意識するだけでかなり綺麗に動かせるとは思いますので、Live2Dに慣れないうちは平行投影で作ることをおすすめします！
今回はここまで！X軸の説明だけでめちゃくちゃ長くなっちゃったのでまた近いうちにY軸や斜めの解説も書きたいと思います。それでは！
Comments
ビリビリ動画でひもの先生の動画が見ましたから すぐFANBOXフォローしました！色々勉強しました！いつもありがとうございます！
ソウル 榎本
2022-07-06 07:17:15 +0000 UTC毎回、ものすごく楽しく読んでます！仕事柄カメラ画像の歪みも目にすることがあるんですが、イラストの世界ではこれ、「透視投影」っていうんですね。ひものさんのモデルの立体感の秘訣が、また一つわかりました！
たかき
2022-04-22 21:00:15 +0000 UTCありがとうございます！
KiRATiNA
2022-04-22 19:01:25 +0000 UTCあら！ご本人！ 大丈夫ですよ。私は今の所ビリビリ動画に投稿する予定はないので、悪意のあるまとめとかじゃなければ転載はご自由にどうぞ！
乾物ひもの＠Vtuber
2022-04-22 18:09:59 +0000 UTC優秀すぎるのでもっと多くの人に見てもらいたい！ ひもの先生の許可を得ずに勝手にあなたの動画を転載して申し訳ありません。
KiRATiNA
2022-04-22 18:04:13 +0000 UTC投稿お疲れ様です！横向きが異様に可愛いのはそういうことだったんですね～！ ひとまず頬骨とエラを意識して作ってみたいと思います！Y軸斜めも楽しみです！
秋乃雨音
2022-04-22 17:56:12 +0000 UTC
