画像をLive2Dで加工してAnimaze上で口が動くまでの一連の流れをまとめました。
公式チュートリアルや説明サイトだといろいろ作業が多くて途中よくわからないところもありました。
ただ単にAnimaze上で顔の動きに応じてパーツを動かすというぐらいなら、比較的少ない手間でいけましたので紹介しておきます。
Live2DからAnimazeで入れ
最近はユーチューブで、イラストや3Dモデルを動かして自分の代わりに出演させている人も多いです。
よく使われている技術の1つがLive2Dで、これによって顔の動かし方をプリセットしておけばAnimazeというソフトで顔の動きに応じてアバターを動かすことができます。
今回は3Dではなく2D画像をLive2Dで設定してからAnimazeで動かすところまで、最短で試せるように紹介していきます。
まだ使って2日目なのですが、とりあえずAnimazeで動かせました。
素材編
顔画像を作る
最初はPSD形式でレイヤーで顔のデータを作ります。
うちはフォトショップエレメンツで作成。レイヤー名に「目」などパーツ名をつけておくと、Live2Dに読み込んだ後わかりやすいです。
Live2Dエディター編
まずはLive2Dエディターをダウンロードしておきましょう。FREE版もあります。
Cubism Editor ダウンロード | Live2D Cubism
Live2Dに読み込み
Live2Dエディターに、作ったPSDファイルを読み込みます。
FREE版で、ファイル>ファイルを読み込むで先ほど作ったPSDファイルを選びます。
するとプロジェクトのところにパーツも表示されるようになります。
口を動かす
まずは口だけ動かします。
画面上で口を選択し、パラメータウィンドウで口の開閉を選びます。
ゲージが左側にある段階でクリックして緑色の+アイコンを押します。
また、右側にゲージを移動した段階で緑色の+アイコンを押します。
これで口の開閉のキーフレームを作ったことになります。
もう一度ゲージを左端に移動。
ゲージが左にあるときに、画面上の口を大きく開くように拡大します。
あとは左右にゲージを動かして、口が開閉する動きを確認しましょう。
この段階で「ファイル>組み込み用ファイルの書き出し>moc3ファイル」を選ぶと、「テクスチャアトラスを生成してから行ってください」と出てしまい、出力はまだできません。
テクスチャアトラス
「モデリング>テクスチャ編集>テクスチャアトラス編集」を選び、ダイアログでOKを押します。
するとテクスチャアトラス編集画面が開きます。見てわかるようにテクスチャアトラスとは2D用の素材を1まとめにしたもののことのようです。
今回は特に編集せず「OK」で閉じます。
ファイル出力
これで最低限のファイルができたので「ファイル>組み込み用ファイルの書き出し>moc3ファイル」を選ぶと、今度は出力設定がひらきます。
AnimazeではJSON形式のファイルをロードするので「ユーザデータファイル(Userdata3.json)を書き出す」にチェックが入っていることを確認してから{OK」で書きだします。
Animaze編
Animazeを用意
Steamでアニメイズをあらかじめ入手。無料でダウンロードできます。
Animazeを起動したら、自分が口を開けたらアバターも口が明くかどうか確認します。
合わない場合はカメラが移ってない、カメラが自分の顔をとっていない場合があるのでキャリブレーションしておきましょう。
Animazeにインポート
「インポート>Live2Dをインポート」を選び、作成されているJSONファイルを選択します。
後は自分の口をあけたら、アバターの口も開けばOKです。
インポートできない?
以下の動画によると画像は4096ピクセル以下にしていないと駄目なそうです。
追加作業は?
今回は動作確認優先で口だけ対応しました。
これで動くのが確認できれば、ほかのパーツも設定していって完成させていけばよいでしょう。
ほかのパーツ
目や眉など、Live2Dにはパーツごとのキーフレーム設定がパラメータから行えます。
より細かい変形の指定
またメッシュを割り当てることでよりきめ細かく図形の変形を設定できます。
Live2Dで「モデリング>テクスチャ>テクスチャの自動生成」
するとダイアログが起動。ここでたとえば「プリセット」を「標準」とすると、以下のように細かいグリッド分割がされます。すると、さらに微妙な変形の仕方を設定できることになります。