Blog > 2024.10.06.

初挑戦! Live2D

[ 創作雑記 | 動画あり ]

 

 

はじめてのLive2D

 

 あかつきは Live2D を おぼえた!

 

 このたび、Live2Dの使い方を教わってまいりました。
 難しかったですが、操作をひとつ学ぶごとに「ウワー! 動いた!」「こんなことが私にもできちゃうの~⁉」と驚きと喜びがいっぱいで楽しかったです。この学びをもとに面白いことができそうで、とってもワクワクしています!

 

 さっそく20秒のアニメーションを作ってきたので、自慢しちゃいます。

 

ウィンクをする少女の頭部アニメーション
キャラクター:TRPGの自PC「北千里 蛍(きたせんり けい)」

 

 なんて楽しいんだ。

 

 まずはこの楽しい技術を教えてくださった先達と、この技術を作ってくださった方々に感謝を。ありがとうございます。 

 

 

 

アニメーション制作備忘録

 

 アニメーションを作った経験はほんの少しだけあります。ノートにパラパラ漫画を描いたり、数秒程度のアニメーションを作りかけて「やっぱめんどくさいな……」とあきらめたり、数枚程度のループGIF画像を作ったり。

 わずかながら、その経験で培った技術も今回のLive2Dアニメーションに利用しました。

 

 せっかくなので、制作で工夫したことを書き残しておきます。
 また「生き生きとしたアニメーションを作りたいぞ~!」と立ち上がったときに、どんな工夫ができそうかをすぐ思い出せるように。

  1. 見せ場を決める
  2. 動きに弾みをつける
  3. 視線が移動するタイミングに、まばたきを挟んでみる
  4. まばたきの瞬間には、黒目を軽く下に向ける
  5. 極めてゆっくりとした動きで、呼吸を表す

 ざっくりまとめると上記の項目になります。

 詳しくは以下で。

 

 

1. 見せ場を決める

 

 まずは一番見てもらいたい動きを定めます。
 今回は「ウィンクをする」ところを見せ場にしました。

 なぜなら、早くに教わったのが目の動かし方だからです。教わったときに動かしたのは片目だけだったのですが、片目だけ閉じる様子があまりにもかわいかったので。

 

 動きをつけるときには「見せ場は目立つように、逆に見せ場以外は目立たないように」を心がけます。見せ場では相対的に動きを大きく、見せ場以外では相対的に動きを小さく。見せ場と見せ場以外のコントラストを作ります。

 書いてしまえば当たり前のことなのですが、初めてだと調子に乗ってすべてを豪快に動かしたくなるので、その欲をぐっとこらえる必要がありました。ステイ……!

 

 具体的にやってみたことは以下の通り。

  • ウィンク前には「これから何かしでかしそうだぞ!」という「溜め」のフェーズを設ける
    (「あ」とこちらに気づいたらしいところからが溜めフェーズです)
  • ウィンク直前の視線移動をはっきり見せる
    (後述するのですが、理由があってほとんどの視線移動の瞬間にまばたきを挟んでいるので、見せ場以外では視線の動きは隠れています)
  • ウィンクの瞬間に、髪を毛先まで丁寧に揺らす
    (見せ場以外では、髪をあまり露骨に揺らさないようこらえました)
  • ウィンク直後にはウィンクを噛み締められる「静」の時間を用意する
    (視線をこちらから逸らすまでが「静」の時間です)

 

 

2. 動きに弾みをつける

 

 パーツを動かすとき、ちょっと余分に動かしてから少し戻します。

 数字でたとえると、0.0から0.8の位置にしたいとき、1.0まで動かした直後に素早く0.8にまで動かすような感じです。すると動きにメリハリがつきます。

 どのくらい弾みをつけるのが適切かは、ケースバイケースだと思います。リアルな人間らしさを重視するなら、控えめに。リアルな人間らしさにこだわらない作風なら、大きく弾ませても映えるかもしれません。今回は控えめです。

 主に頭や髪の動きで弾みをつけています。こちらも、見せ場の弾みは比較的大きくつけるといい感じです。

 

 

3. 視線が移動するタイミングに、まばたきを挟む

 

 これは実際にやってもらった方がわかりやすいですね。

 画面の向こうのあなた、よろしければ1秒だけ、視線を左に向けてみてください。

 

 さて。視線を左に向けたとき、まばたきをしたでしょうか?

 した方はそのまま。しなかった方は、今度はまばたきしながら視線を上へ動かしてみてください。

 たぶん、まばたきしながらの方が楽に視線を動かせるのではないでしょうか。

 (あてはまらない人もいるのかもしれませんが……)

 

 そんな感じで、視線移動と同時にまばたきをさせると、気持ちリアルな仕上がりになります。

 視線が動く過程を見せたいときには、あえてまばたきを挟まないのも手です(1にて先述)。

 


4. まばたきの瞬間には、黒目を軽く下に向ける

 

 まばたきの瞬間に、上まぶたにつられる形で黒目をすこーしだけ下げます。まばたきが終わった頃には黒目が元の位置に戻るようにします。

 これもリアルさ重視のおまけ動作です。
 動きとしては全然目立たないので、別になくても……とは思いますが、あった方がなんだかいい感じな気がします。

 

 

5.  極めてゆっくりとした動きで、呼吸を表す

 

 キャラクター自身が意図した動き以外にもわずかな動きをつけてみると、呼吸をしている感じが出ます。

 今回はパーツとパラメータをたくさん紐付けすぎて既定の呼吸パラメータを利用する余地がなかったので、呼吸のために顔の傾きパラメータを使い回しました。

 

 

 

 

おわりに

 

 今回制作でやってみた工夫は以上です。

 ソフトの制約上今回はできなかった工夫も、新たにしてみたくなった工夫もちょっとあります。前髪を透かして目が隠れないようにするとか、目をうるうるさせるとか、アホ毛だけ動かすパラメータを作るとか……。

 

 一度やってみたことで、どれだけの制約があるのかは少し把握できました(パラメータやアートメッシュや回転デフォーマの個数制限が特に気になる)。
 次に作るときには、工夫したい部分に充分なリソースを割けるよう、それ以外のリソースを節約したいなあと思います。