妹でもわかるUnrealEngine4

毎日更新? 妹に説明するために書いてるけど、たまにわかってない場合もあるUnrealEngine4を中心としたゲーム制作の話。略すとイモリアル

毎日更新? 妹に説明するために書いてるけど、たまにわかってない場合もあるUnrealEngine4を中心としたゲーム制作の話。略すとイモリアル

Live2D Cubism3で何か動かす実験(3) 目を寄せてみようとした

f:id:una_unagi:20170509235810g:plain

「最初はまずシンプルな動きからつけてみようと思って、それで目を動かしてみたわけなんだけどね……」

妹「目は寄ってるけど、なんか、えぐれてますね……」

「うすうすこうなるんじゃないかとは思ってたんだけど、気のせいかもしれないので確認したら、やっぱりこうなった」

f:id:una_unagi:20170510000028p:plain

「まず"目を寄せる"というパラメータを設定すればいいだろうと思ったんだけど、なぜか標準のパラメータにはそういうのがなくて」

妹「ここに載ってるパラメータは最初からあるやつなの? 眉毛とかもあるけど」

「最初からある。他にも髪揺れとか。人間キャラの立ち絵が主用途だから、そういうので使いそうな物はあらかじめ準備してあるかんじ。ただこれは追加したり消したり出来る」

f:id:una_unagi:20170510000330p:plain
f:id:una_unagi:20170510000338p:plain

「こうやって適当にパラメータを作って動きを設定する。動く前と動いた後の動きを設定して、スライダーを動かすとその中間になる。自動で出来た中間がオカシイ時は、手動でポイントを増やして、動きの精度を上げていく感じ。一般的なタイムラインアニメーションの考え方」

www.youtube.com

「パラメータの範囲は、初期設定は-30.0~30.0とか出てくるんだけど、どうも0.0~1.0か、-1.0~1.0の範囲にするのが自然っぽかった。左右に揺れるやつとかは、中間を0と考えて、プラスとマイナスで同じ数値まで動かせる方がいいし。逆方向の動きが考えにくいケースはマイナスがあると混乱するから」

妹「それでなんで失敗したの? やっぱりポリゴンが足りてないから?」

「多分そうだと思う。まず目の部分のポリゴンを動かすと、必然的にそのとなりのポリゴンも引っ張られる。で、今回目のポリゴンの隣に、輪郭のポリゴンがあった。それで目だけ動かすというのはどうしても無理だった」

妹「でもどんなにポリゴン増やしても、結局となりのポリゴンはあるのでは? そしたらやっぱりそこ歪んじゃうのでは?」

「今回の場合、目と輪郭の間は白一色だから、目と輪郭が正常なら、中間のポリゴンのとこが歪んでてもわからない。複雑な塗りの場合はやっかいだけど、1つのポリゴンに歪みを集中させずに、たくさんのポリゴンをちょっとずつ歪めることで、全体としてはそんなに歪んでないように見える、はず」

Live2D Cubism3で何か動かす実験(2) PSDの読み込みと、アートメッシュの編集

「ようやくLive2Dに入っていくわけだけど、今回使うのはLive2D Cubism3で、Euclidの方じゃない」

妹「どう違うの?」

「Cubism(キュビズム)というのは以前からある、2Dパーツを分けて、アニメーションする、つまり今やろうとしてるやつ。Euclid(ユークリッド)の方は、何枚かのイラストから3Dモデルを作って、3Dモデルとして動かすという新しい仕組みらしい」

ch.nicovideo.jp

「Euclidも面白そうなんだけど、どうもざっと調べた感じでは人間のひとを想定してるみたいで、あざらしとか、しゃもじとかには対応してないみたいだった」

妹「そうすると、とんびにも対応してなさそう」

「あとUE4の対応もまだみたいで(予定はある)、今のところUnityでしか使えないらしい。そっちはまた今度試すとして、今回はCubismの方を使う」

f:id:una_unagi:20170508232920p:plain

「インストールしてから起動すると、こんな感じの画面が出るので、とりあえず体験版として起動。Free版が出たらFree版でいいと思うけど、まだ発表から日が浅いから、全員が体験版の使用期限内になってる状況」

f:id:una_unagi:20170508231357p:plain

「PSDの読み込み。この時点で起きた問題としては、昨日Kritaで保存したPSDをそのまま読み込むと、レイヤの日本語が文字化けして、??というパーツ名になってたこと。これは英語に書き換えてから読み込み直した状態」

妹「日本語使えないの?」

「そんなことはないはず。説明動画とかでも普通に日本語レイヤだし。それにClipStudioPaintで保存したPSDだと日本語レイヤ名のまま読み込めた

妹「じゃあ、例えばKritaで保存したやつをClipStudioで読み込んで、もう1回PSDに保存しなおしたらどうなるの?」

「それだと普通にうまくいく」

妹「意味がわからん……Kritaさんが悪いわけではないの?」

「PSDにも色々あるもんだから、Live2DではPhotoShopで保存したPSDだけを正式サポートしてる。他のソフトのは読み込めたら嬉しいな、という感じ」

forum.live2d.com

「ただこういう報告がすでにあがってるから、そのうち直るんじゃないかという気はする」

2.イラストを動かす準備 | Live2D Manuals & Tutorials

f:id:una_unagi:20170508231403p:plain

「読み込んだ後は、動画を参考にしつつ、アートメッシュの設定。アートメッシュというのは……要するにパーツのことだと思う。パーツを形成するポリゴンというニュアンスが強そうだけど。とりあえず全部オートの、標準設定でやってしまう」

妹「どれぐらいがいいんだろう」

「全体的な変形なら、そんなに細かくはしなくていいと思うんだけどね。多すぎても編集大変そうだし。ただ顔のあたりはもう少し分割増やして、分割の形も考えないと、動かしにくいかも。面倒だからやらないけど」

妹「やっぱりそれレイヤを分けた方がよかったのでは?」

「そんな気はする」

Live2Dで何か動かす実験(1) 絵の準備

「とりあえず昨日描いた、通称バケツたまちゃんの絵を動かせるように、まずはパーツ分けをしてみようと思う。手順としては、1枚のレイヤに描いた絵をパーツごとに切り取って、パーツごとに別々のレイヤにしつつ、色とかを調整していく」

妹「1枚のレイヤなの?」

「パーツごとに光とか影とかレイヤを作る人の方が多いみたいだけど、それは絵を描く時や後で調整するためのやり方で、別に動かすのに必要なことではなさそうだったから。もともと普段絵を描く時にもそんなにレイヤ作ってないから、これでいけそうな気がする。レイヤたくさんある方式のは多分他の人の解説があるだろうし」

f:id:una_unagi:20170507231003p:plain
f:id:una_unagi:20170507231008p:plain
f:id:una_unagi:20170507231014p:plain

「で、昨日の絵は背景が白い前提でざっくり塗っただけだから、1枚のレイヤに絵を描けた状態にはなってなかった。まずは背景に違う色のレイヤを置いてわかりやすくしつつ、パーツの形に白く塗ったレイヤを作って、統合。これで1枚のレイヤになった」

f:id:una_unagi:20170507231901p:plain
f:id:una_unagi:20170507231911p:plain

「パーツ分けを、まずゴミバケツからやる。Kritaの場合、"コピーした内容を新しいレイヤに貼り付け"というのがなさそうだったんで、まずレイヤをコピーして、それから投げ縄で選択、選択反転してDELキー、という手順でパーツを作ってる。その後は塗り足し」

f:id:una_unagi:20170508001401p:plain
f:id:una_unagi:20170508001406p:plain

「本体も作る。ゴミバケツとかは適当に半透明とかにして見やすくしながら作業。本当はもっと大きいサイズの、あざらし状の物体が、ギュッと詰め込んであるイメージなんだけど、一応元の絵としてはバケツにすっぽり収まるサイズに。必要ならあとで変形すればいいじゃないかと思ってる」

妹「そういう変形はLive2Dだとやりやすいのかな」

「たぶんそうなんじゃないかと思うんだけど、そのへんも含めて実験」

f:id:una_unagi:20170508001836p:plain
f:id:una_unagi:20170508001855p:plain

「本体に手がくっついたままだったから、別パーツに分離して、ボディの方からは手を消す。これで手が動くようになる」

妹「顔とかはいいの?」

「そのへんは今回メッシュ変形でやってみようかと思ってる。他のパーツと重なる部分じゃないし、やりやすそう」

f:id:una_unagi:20170508002029p:plain

「そして各パーツを適当に塗り足して、とりあえず絵のデータは完成」