Live2Dモデル作って遊んだ

かねてより友人間でやりたいなあという話をしていた『Live2Dモデル作って画面共有して遊ぶやつ』を遂に実現させました。

Discordの画面共有 たのC
本当はもう二人参加する予定だったのが色々あって参加できなくなってしまった。本当はここに範馬勇次郎が参戦する予定だったんですよ。またやりたい

これがトヤマのモデル用キャラです。可愛くないか?(自賛)

動くとこんな感じ!マジで動くとめちゃくちゃテンション上がっちゃうな

 

備忘録兼ねてざっくりメイキングみたいなのします。相変わらずこういうの書くの好きね 好きよ

作ったものの性質上死ぬほどGIF画像とかを貼っているので重いかも。一応画像は遅延読み込みになっているのである程度大丈夫かなと思うんだけど(スクロールしてから画像が読み込まれる形式にしてる)

キャラデザこねる

アバター作ろうの会
アイコン用のオリキャラ作った。名前はまだないです けっこう前から欲しいと思ってたんだよねアイコン用のオリキャラ アバター的な用途で使えるやつ インターネット存在体になるために不可欠なピース! もうけっこう長いこと特定キャ...

この記事で書いたように美男美女になりたい欲求はあんまないんですが、初めてLive2Dでアバターモデル作るならとりあえず『人型』が良いだろうということで。(チュートリアルも豊富だしね)

コイツの擬人化…ってわけじゃないんですが、デザインの取っ掛かりが欲しかったのでコイツをベースに作りました。擬人化ではない(重要)

ラフ 完成イメージとそんなに変わってないな

とりあえず私の好きなパーツ(マフラー・マント・うるさいシルエット)を入れて、あと動いたら楽しそうな揺れもの(アホ毛・マフラーから垂れてる謎の紐)を大量に付けました。

靴ぶっかぶかなのも袖がデカいのも私が末端デカくなる型のデザイン好き(所謂ガッツマン体型好き)だからだし、前髪で目が半分くらい隠れるの好きだし、スパッツと少年みたいな足(杉森絵みたいな足)好きだし、マジで私が楽しい要素しか入れてない

ただ、基本的にはバストアップで使うことになるのでメインの揺れ要素・目立つパーツは顔周りに集めてます。

撮ったやつを元に色を考えるの図
途中で『なんか等身高くね?』ってなってガッと下げてます

フライドポテトっぽい色合いにしたかったので(?)とりあえず赤&黄色ベースに、服の丸部分とか細かいところにちょこちょこ補色の青緑が入るとカラフルで可愛いかな。みたいな感じ

一番右は『髪に使ってる色』と『服に使ってる色』を完全に同じにしちゃってるんですが、流石にちょっと違和感があったので『髪の赤&黄色』と『服の赤&黄色』はそれぞれ違う色味に変更しています。

VOMSみたいにもっともっとシンプルでポップなデザインならカラーコード絞っても良いんだけどね

ちなみに真ん中の色は『白い服につけた赤みオレンジの波模様がケチャップみたいで不快だ』という理由でボツになりました(…)(フライドポテトケチャップアンチ…)

肌は水肌から土肌に変えました(俺屍脳)なんかコッテリしてる方が似合うかなって。実際最終形態に見慣れた状態で最初のカラーリング見ると「白っ!」ってなる

そんで最終的にこんな感じになりました。
白い服へのオレンジ模様は煩くなりそうなのでただのグラデに

因みに揺れものは

①アホ毛3本
②髪の毛の先の方
③マフラーの後ろ部分
④マフラ前面に垂れ下がってる謎の紐4本
⑤ベルト下の服・袖
⑥靴の横面に垂れ下がってる謎の紐
⑦マント

多すぎて草

いやなんか、最終的にどこまで手が回るか分からないけど『とりあえず揺らせるもの作っておいて拘りたくなったら徹底的にいじくる』ができる状態だと色々できて楽しいかなってさあ!

 

キャラ絵清書

先程の設定画を元に、実際のLive2Dに持っていく用の絵を作っていきました。

真っ先に思ったのは『どうして最終的に正面で描くことが決まっていたのにナナメの設定画を作ってるんですか??』でした。ばーか

左が下書き、真ん中が『だいたいこの辺パーツ分けて描きたいなメモ』、右が線画です。
パーツ分けメモでは靴が異様なほど色分けされてますが、流石にアホか?と思ったのでここは紐系以外全部一緒にしてます。

何故か歯茎まで描いてる口 グロくて笑う

パーツこんな感じ(画像はLive2Dで書き出したテクスチャ)

いやもうパーツ分けめんどすぎてここが一番の発狂ポイントですねえ…でもここ頑張れば後が楽しいから…動かせるパーツ多ければ多いほど楽しいから…

線の色トレスは流石にめんどい&難しい、でも真っ黒線のままっていうのも味気ない…と思ったので、クリスタのオートアクションでざっくりやってます。

主線色かえ - CLIP STUDIO ASSETS
イラスト・マンガ制作に役立つトーン、ブラシ、3Dデータなどの素材をダウンロードしたり、自作の素材をアップロードしたりできます。CLIP STUDIO PAINTなどのグラフィックソフトに読み込んで使えます。

厳密な…というか自分好みの色トレスにはしにくいんだけど、とにかくざっくり変えられるので重宝してます。

瞳回りなど、自分で調整したいところは手動で調整しました。テラテラバカ色!サイコー!

 

モデリング

こっからが本番よぉ!!!

Live2Dで立ち絵モデル作るの初めてと書きましたが、Live2Dを触ったこと自体はあったので(モーションアニメとか作ってみたことあった)なんとなく勝手は知ってます。

でも、前に使ってたのが旧版(買い切り時代)のLive2Dなので新しい方分からん・当然ながらVtuber的なモデルを作ったことはなかったので講座動画などを見ながらちまちまと

参考にしたもの

初期設定~目まではこちらのシリーズを見つつ、

Live2D 超入門講座②顔のXYZ設定【ディープブリザード】Facerig・Animaze
【よりわかりやすい講座動画版投稿!】Live 2D Cubism Editor4対応版Live2D入門はこちら!でキャラクターを動かしてみたい!Facerigに導入して私もVTuberデビューしたい!そんな方向けの初心者講座である…。第1部「準備...
Live2D 超入門講座③仕上げ・物理演算・Facerig 実装【ディープブリザード】Facerig・Animaze
【よりわかりやすい講座動画版投稿!】Live 2D Cubism Editor4対応版Live2D入門はこちら!でキャラクターを動かしてみたい!Facerigに導入して私もVTuberデビューしたい!そんな方向けの初心者講座である…。第1部「準備...

顔の角度~物理演算設定はディープブリザード先生の動画を見ながら作りました。正直言われてる通りにするだけでできる。ありがて~
なんやかんやこういうのは動画で見るのが最強に分かりやすいな…と思う

 

いきなり講座で言われてないやり方しててアレなんですが、このキャラは玩具やドラえもんみたいな目の構造なのでシャッターみたいに開閉します。かわいいね

ただ、完全にシャッターみたいな動き(上下のみ)だと味気ないので、『開く時は目に沿った形に変形』するように設定してます。これで目が球体っぽく表現できたんじゃなかろうか

ただこのシャッター目、実際に運用するとけっこうこういう状態で止まったりするんだよね笑

実際に自分の顔を反映してみると『常に目を全開にしてるわけじゃない』じゃん。だからすげえ頻繁にこういう顔になる ウケる まあこれはこれで

この顔好き

 

口も割とセオリー無視なんだけど、くるみ割り人形みたいな構造なのでそんな感じで動かしてます。

パーツは①上唇②下唇③左右のとこ って感じで

マフラーあるからある程度ごまかせるのも良いですね(?)

それと、最初の動画の人が言ってたので『口の動きに対応して目が笑顔になる』っていう設定を試してみたんですが、目が開いている状態だと笑顔目にならなくてあんまりうまく行きませんでした。難しいね

個人的にお気に入りなのは、『閉じた時若干ナナメになる口』と『“い”の口の時口角上がって若干歯茎見える』ところです。フィクションキャラの左右非対称な表情の付き方可愛いよね

 

左右を向く(X)

左右向いてるっぽくしたくて輪郭と耳のところ色々いじってみた

角度によって耳と輪郭のレイヤー順を入れ替えてます。なので右向きだと左耳が前に、左向きだと右耳が前にくるようにできました。
まあ結構ガタっと入れ替えてるので、こうやって繰り返しGIFで見るとレイヤー入れ替えの瞬間の耳ちょっと変なんだけども。ぐりぐり動かしてるとあんま気にならないから良いかなって

ただこの『輪郭と耳のレイヤー順を入れ替える』をやる想定をしていなかったので、ここの描画順をいじったせいで他のパーツも上に来たり下に行っちゃったり(目が輪郭より下になってのっぺらぼうになったり)頭かきむしりながら深夜に修正してました。計画的にやろうね…

『バストアップなんだから誰も見れねーじゃん!!』ポイントなんですけど、膝見て!膝!!!ちゃんと動いてるの~~!!!無駄なこだわり!

膝小僧描きたくて作ったキャラみたいなところがあるので膝小僧動かせて嬉しかったです(作文)

 

上下を向く(Y)

左右が膝小僧なら上下は腕がついてきます。バタバタしててかわいいね

マフラーで顎・首回りをごまかしているので思いっきり上向きにできていい感じ。マフラー最強かもしれん
一応下向いた時にちょっとマフラーの曲面下向けてみたりとかしてます

ていうか、『上下左右』動かす時に難しいのって『顎と耳』なのかなって思うので、横髪なりマフラーなりでここを隠しちゃうデザインにするとかなり角度のある動きもつけやすいのかも。

上向いた時顎の線消えるモデリングマジで謎技術だよな…あれどうやってるんだろう…(ホロライブIDのオリーちゃんとか→短尺でモデルの動き見れる動画

 

もうほんと『バンダナとかぱっつん前髪キャラの目が半分隠れるやつ』が大好きなのでこの角度が最強なんじゃないかと思ってますね。素晴らしい 素晴らしい角度 可愛い

あとこれは膝と同じような『誰もみーへんぞ』ポイントなんですけど、上下に連動して靴紐がピョコピョコしてます。かわいいね

アニメ的というか、キャラがぴょこぴょこすると装飾パーツも一緒に動くみたいな表現可愛いよね 可愛い~~

これは腕の上下もそうなんですが、『顔と体上向き⇔腕と靴紐下向き』『顔と体下向き⇔腕と靴紐上向き』にしています。上に上がると揺れものは下がり、下に下がると揺れものは上がってくる、って方が自然だし可愛い

それと地味すぎるこだわりポイントなんですが、『上・中・下』で口の中も調整してみました。
上を向くと口の中の空間が大きく見え、下を向くと舌しか見えない感じ。しただけに(ドッ)

XとYの動きを組み合わせるとこんな感じに。斜め上下も向けるようになって、もう大分動いてるって感じする
因みにナナメは自動生成しつつ調整してます

 

傾き(Z)

おちゃめ機能の動きだやったー!

これも動きに合わせて腕やマフラーの後ろ動かしてます。あと肩もシーソーみたいに動かしてる
マフラーの謎紐はハリガネみたいになってますが、ここは後で物理演算先生にどうにかしてもらうのでこのままです。

最初は髪の毛や各パーツもっと大げさに動かしてたんですが、動いた時の各パーツ揺れは物理演算先生に任せた方が綺麗ということが分かったので最低限の動きに留めています。最低限でもまあまあ動きうるさいけど

 

ここまでの動きを組み合わせて、Live2Dに入っているランダムモーション再生を入れるとこんな感じに。

正直これでも初めてにしてはまあ動いてるんじゃないでしょうか!?って感じなんだけど、せっかくなのでもっとリッチな動きを入れたーい!具体的に言うと針金化してるマフラーの謎紐とかをゆらゆらさせたい!ということで

物理演算

物理演算さんに入ります!ワーイ!

物理演算ってなんぞやというと、『体などの揺れに合わせてゆらゆら動かすアレ』です。Vtuberとか見てる人は分かるかなと思うんですが、長い髪や揺れものがふわっと揺れてるモデルはこれを使われてるらしい。

↑こういうやつ けっふぃー氏のモデルどれもこれも色々エグすぎて見るたびにエグ!?って鳴くだけの生き物になってしまう

 

物理演算と聞くとなんかすげえ難しそうに聞こえますが、設定方法は割と簡単でした。ディープブリザード先生の動画見ながら言われた通りにやったらできちゃった

というわけで物理演算を加えてこうなりました。ゆらゆらしてる!!

これはカーソルドラッグでゆらゆらしてるので、短いパーツなどはけっこうガクガクして見えますが、実際はここまで機敏に動かすわけじゃないのでランダム再生でちょうどいい感じの設定にしています。

これ設定した上でランダム再生させたのが冒頭の動画やこれですね。アホ毛が!謎紐が!袖が!靴紐が!ゆらゆらしてる!!

マジでゆらゆらするのが楽しすぎてめちゃめちゃ物理演算設定しちゃった…へへ…
でもエグい動きしてるモデルとかはもっと大量に設定されてるんだろうな…

こことかめっちゃ良くないですか?どこって?髪のたゆみ部分ですよ!

ここ!!

元々Zの動きで『左に傾いた時は左のたゆみが大きく、右に傾いた時は右のたゆみが大きく』なるように設定してたんだけど、ここに物理演算のゆらゆらが加わり最強になってしまった

Live2D、マジでこだわろうと思うと無限にこだわれてしまうので深い沼を感じる。なんか気付くと動き調整したくなっちゃうんだもん…

Live2Dの見栄えを良くしてみよう:髪の毛編|ナナメ|note
こんにちは、ナナメです。 突然ですが、皆さんは Live2Dの髪の毛をどのようにモデリングしていますか? VTuberさんは特に上半身を映す機会が多く、Z(顔の傾け)やX(横向き)が主な動作になると思います。 その際に髪の毛が自然に動いていたら、とっても可愛いと思うんです! というわけで、今回は髪の毛まわりの見栄...

スキニングでもーっとゆらゆら~っとさせるのも試してみたんだけど、今回のパーツにはあまり合わなかったのでやめました。長髪とかをふわっと動かすならこれなんだろうなあ

(↑のnoteは夕刻ロベルさんのモデリングされた方のやつ)

 

Animazeへ

というわけでモデリングが終わったので、顔面トラッキングで動かせるように書き出しやらなにやらをしています。

モデル動かすのには、SteamでDLできるAnimazeを使用しました。Live2D動かすと言えばFaceRigのイメージあったんだけど、後継ソフトが出てたらしい。知らなかった…

 

そこでちょっとトラブルもあったので備忘録も兼ねて書いておこう

①テクスチャアトラス編集

上にも貼ったけど、3Dモデルのテクスチャのようにパーツごとのテクスチャをバラバラにして敷き詰めたような画像を生成します。
これ、旧版だと最初から生成されてたので最初分かんなくて焦っちゃった

↑の画像はバラッバラに配置してますが、多分本当はもうちょっとキッチリ敷き詰めるような画像の方が綺麗なんだろうな…とは思う。ただ、自動で綺麗に敷き詰められたテクスチャ画像だとちょいちょいパーツ同士が干渉を起こしてモデルの表示が変になっちゃったので、もうこれでええわ!とスッカスカのテクスチャ画像に編集しました。

 

②モデルのIDを変換

Live2D 超入門講座③仕上げ・物理演算・Facerig 実装【ディープブリザード】Facerig・Animaze
【よりわかりやすい講座動画版投稿!】Live 2D Cubism Editor4対応版Live2D入門はこちら!でキャラクターを動かしてみたい!Facerigに導入して私もVTuberデビューしたい!そんな方向けの初心者講座である…。第1部「準備...

書き出しについては上にも貼ったディープブリザード先生の動画を参考にしたんですが、これだとAnimazeへ読み込んだ時にモデルが動かなかったので色々調べてみました。

どうやらこれが原因だったらしく、こちらの記事に倣ってIDを変換したら動くモデルになりました!やったー!

 

③画質めっちゃ低い問題

読み込んだ時『なんか画質悪くない!?お前はもっときれいなはずだが…!?』って焦ったんですが

設定から『レンダースケール』を上げたら綺麗になりました。
逆にPCの負荷とかが高い場合はここ下げてやるといいのね。なるほどね

 

動いてる~~~!!!自分の動きに合わせて~~~!!!半目~~~!!!笑

ちなみにトラッキングの関係で眼鏡無い方が正確に表情読み取ってもらえます。ウインクとか瞬きとかは特に。
まあ眼鏡ないと見えないんで無理なんですけどね!笑

その後冒頭のように友人らと画面共有で記念写真撮りつつこの状態で駄弁ったり

惜しむらくは私のPCと回線のスペックがアレすぎて動きがカックカクだったことか。次はつよつよPCとつよつよ回線に生まれ変わりたい

Vtuberごっこできるやん!っつってOBSを立ち上げ、VitaTVにインストールしていたTOEを映してみる図

なお、キャラモデルの色が多すぎてクロマキーで背景透過すると体のどっかしらのパーツが透けてしまうもよう

それと、『お絵かき配信ごっこやろうぜ』ってことになったので友人と二人でPixivSketchに画面映してお絵描きしたりしました。Vtuberみてえ!笑
まあマイクなしの無音配信だったんですけどね

↑このスクショはその画面を再現するために今撮ってきた画像なので絵が完成しています。配信画面スクショしときゃよかった

ただこれもPC激重すぎて最初は描けたものじゃなかったので、①PC再起動②モデル動かして配信する以外のものは開かない・スタートアップ系も全部閉じる(通話はスマホでやる)③モデルの画質・配信画質を下げる でやっとまともに描ける状態にできました。うーん、スペック!

 


楽しかった~ し、せっかく作ったので何かに使えたら良いなあ。Youtuberデビューはしませんけど(喋りたくないしやりたい事も無いため…)

お絵かき配信する時にとりあえず左下に置いておくっていうのはアリかもね。PCが耐えられればだけど

やっぱスペックなんだよな~~!強くなりたい理由を知った 普段のお絵かきや画像編集作業には今の環境でも支障ないんだけどね~

夕刻ロベルさんが3Dの肉体を手に入れる前につよつよ環境が欲しいんだけどなあ…と言ってるうちに時間が過ぎていきそう