UnityでLive2Dのアバターを作ってみる

今回はCubism SDK for Unityを使用して、キー入力に応じて動作するアバターを作成してみます。

スポンサーリンク

Cubism SDK for Unityとは?

Live2Dで作成したモデルをUnityで動かすためのパッケージ。
Cubism SDK for Unityを導入する手順についてはこちらで紹介しています。

Cubism SDK for Unityを使ってみる
この記事ではゲームエンジンUnityでLive2Dモデルを動かすCubism SDK for Unityを導入する手順を紹介しています。導入後はまばたきや呼吸などの基本的なスクリプトを設定するチュートリアルを進めます。

Unityでキー入力に応じて動作するアバターを作ってみる

UnityでLive2Dのアバターを作成するまでの流れを紹介します。

1. 腕を動かすパラメータを作成する

前回Live2Dで作成したモデルに腕を動かすパラメータを追加します。
今回はユーザーと同じ動きをするアバターを制作したいので、キー入力時の腕の形状を基準にしてパラメータを調整しました。

肩と肘に回転デフォーマ、手にワープデフォーマを配置した上で、各種パーツを動かしています。

腕の動き

2. 指を動かすパラメータを作成する

キー入力時の指の動きを作成します。
10本の指をそれぞれ動かすとなると恐らくパラメータも10個必要になるので、パラメータの枠がかなり圧迫されます。(Live2DのPro版だったら制限なくパラメータを作成できます。)

今回はとりあえず右手の指4本と左手の指4本で、計8個のパラメータを作成しました。
下図サンプルのような感じで指を動かすことができます。

指の動き

3. キーボードを配置する

アニメーション用のパラメータが完成したので、Unityを起動してキーボードを配置する作業を行います。
上部メニュー「GameObject > 2D Object > Sprite」でキーボード用のGameObjectを作成します。
Inspector の Sprite Rendereer にキーボードの画像を設定します。

Transform の Position でキーボードの位置、Scaleで大きさを調節します。
ArtMesh の Local Order や GameObject の Order in Layer でパーツが重なる順番を指定できるので、手と体の間にキーボードが重なるように配置します。

机を配置

4. Unity Raw Inputで非アクティブ時のキー入力に対応させる

最終的にはゲーム画面の隣にCubism SDK for Unityの画面を配置したいので、非アクティブの状態でもキー入力を検知する必要があります。ということでUnity Raw Inputというパッケージを使用することにしました。
Unity Raw Inputはgithubからパッケージをダウンロードすることができるので、ダウンロード後Projectにドラッグ&ドロップします。

Unity Raw Inputの基本的な使い方は Qiita の記事「【Unity】バックグラウンド動作時のキー入力取得」を参照してください。

完成予想図

5. idle状態とplay状態でモーションを切り替える

idle状態(待機中)とplay状態(キー入力中)でモーションを切り替えることにしました。
Live2Dで作成したモーションファイル(idle.motion3.jsonとplay.motion3.json)をまとめたフォルダをProjectにドラッグ&ドロップします。

そうするとAnimationClipが生成されるので、モデルのGameObjectにドラッグ&ドロップします。
Animatorの画面で確認すると下図のようにモーションが追加されています。

モーション追加

Parameters の + をクリックして Bool(真[true]か偽[false]を格納する型) を追加します。
名前はis_idleとしました。これでidle状態とplay状態の切り替えを行います。

is_idle

idleを右クリックしてMake Transitionsを選択すると、矢印が出るのでplayに繋げます。
playからも同様にMake Transitionsでidleに繋げます。

矢印をクリックするとInspectorにConditionsという項目があるので、is_idleが false だとplay状態、is_idleが true だとidle状態になるように設定します。

モーション切替

モーションを切り替えるスクリプトの例です。

PlayAnim.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class PlayAnim : MonoBehaviour
{
  private Animator animator;

  void Start()
  {
    animator = GetComponent<Animator>();
  }
  void Update()
  {
    if(Input.GetKeyDown(KeyCode.A)) {
      animator.SetBool("is_idle", false);
    }
    else if(Input.GetKeyDown(KeyCode.B)) {
      animator.SetBool("is_idle", true);
    }
  }
}

上記スクリプトの場合、Aが押されたらidle状態からplay状態に切り替わり、Bが押されたらplay状態からidle状態にモーションが切り替わります。
上記スクリプトの条件分岐にUnity Raw Inputから取得した値を使用すると、非アクティブ時でもモーションを切り替える(入力を受け付ける)ことができます。

Unity Raw Inputの使い方については次の記事で書いているので、使用する場合には参考にしてください。

[Unity+Live2D]UnityRawInputの設定
この記事ではUnityでバックグラウンド動作時のキー入力を取得するUnityRawInputについて紹介しています。このスクリプトを導入することで、非アクティブ時のアバターにキー入力を渡すことができます。

6. キー入力に応じて指を動かす

キー入力を検知してモデルのパラメータを更新することで、指を動かすことにしました。
パラメータ更新の詳しいスクリプトはCubism SDKチュートリアル「モデルのパラメータ更新について」で紹介されています。

ParameterLateUpdate

SDKチュートリアルで紹介されているスクリプトParameterLateUpdateを参考にして、下記のように変更を加えました。

1. パラメータを変化させるvalueの値を単純に += で増加させる。
(この場合 _t の値に上限を設定するか、毎回リセットする必要があります)
キーが長押しされた時など、パラメータをマイナス方向に動かしたくない状況があったので、+= としました。
パラメータを波状に増減させたい場合は、チュートリアルと同様にSinを使ってください。

2. キー入力を検知してパラメータの更新を行う。
モーション切り替えのスクリプトと同様に、指定したキーが押されたら処理を実行するようにします。

ParameterLateUpdate.cs
if(Input.GetKey(KeyCode.Space)){
    var parameter = _model.Parameters[1];
    //上書き
    parameter.BlendToValue(CubismParameterBlendMode.Override, value);
}

7. ビルドして動作を確認する

ビルドの前に画面の解像度と終了に関するスクリプトを追加しました。
下記のような感じのスクリプトを、空のGameObjectに追加しています。

GameControl.cs
using UnityEngine;
using System.Collections;

public class GameControl : MonoBehaviour {
    void Start() {
      //解像度(480×640)FPS:60
      Screen.SetResolution(480, 640, false, 60);
    }
    void Update() {
        if (Input.GetKey(KeyCode.Escape))
            Application.Quit();        
    }
}

上部メニュー File > Build Settings で作成した Scene をビルドします。
プラットフォームは Standalone としました。

Player Settingsでは Resolution の Fullscreen Mode を Windowed としてデフォルトのサイズを指定し、Run In Background にチェックを入れています。
設定が完了したらBuildをクリックして、プロジェクトの実行ファイルを生成します。

Cubism SDK for Unity Sample

左側にゲーム画面、右側に今回作成したアバターの画面を配置して、画面の録画を行いました。

タイトルとURLをコピーしました