見出し画像

最速でLive2Dモデル（Cubism）をUnityプロジェクト上で動かす方法

梅しらす @ひたすら楽してゲーム制作


～Live2DモデルをUnity上でとりあえず動かすところまで～

基本的には公式のチュートリアルをなぞるだけですが、
細かいハマリポイントがあったので、そこに注意をしながらまとめます。
本ページ末には撮影した手順動画もあります。

Step.1～7に分けています。

準備環境

Windows 10
Cubism Editor 4.0
CubismSdkForUnity-4-r.2.unitypackage (公式サイトよりダウンロード)
Unity Editor 2019.4.11f1

前提

CubismでLive2dのモデルとモーションを作成済み


手順

ザックリ言えばLive2dモデルをUnity用に書き出した後、
SDKをインポートしたUnity上にドラックドロップするだけの簡単な作業。


Cubism編


Step.1　モデルの書き出し

a)テクスチャの書き出し
メニューアイコンのテクスチャアトラス編集をクリックしたあと、下の方にあるOKボタンを押す。
　※これを行わないとUnity用のモデル(moc3)が出力できない。
　※OKボタンが下方の分かり辛い箇所にあるので注意(CubismEditor 4.0現在)
　
b)モデルファイル（moc3）の書き出し
ファイル->組み込み用ファイル書き出し->moc3ファイル書き出し
　※書き出し推奨versionは自身の環境依存？調べるとUnityとのVersionの相性もあるようなのでとりあえず今回はver3.3
　※物理演算設定の書き出しも可能

Step.2　アニメーション（JSON）の書き出し

a)書き出し設定
　アニメーションのシーンを選択し、インスペクタウィンドウ->ターゲット設定->SDK(Unity)　に設定
　※Scene作成時にターゲット設定が聞かれるているはずなので、そこで設定してもOK
b)書き出し
　各Scene毎に、
　ファイル->組み込み用ファイル書き出し->モーションファイル書き出し->OK

Unity編

Step.3　Unity "2D" のプロジェクトを新規作成

Step.4　Cubism SDK for Unityをプロジェクトにインポート
　Assets -> Import Package -> Custom Package
　公式からダウンロード済みのCubismSdkForUnity-4-r.2.unitypackageを選択
　
Step.5　Live2dモデルとモーションをインポート
　Step1.2で生成したファイル群すべてをUnityプロジェクト上任意のフォルダにドラッグ＆ドロップすると自動でUnity用のプレハブやアニメーションクリップに変換される**.prefabs や **.anim など
　
Step.6　Live2dプレハブを置く
　自動生成された **.prefabsを適当なUnityシーンにドラック＆ドロップ
　※取り込み直後、テクスチャが反映されず、何も表示されないケースがある。その場合はインスペクタウィンドウからLive2dのパタメータを適当に弄るとテクスチャが表示された。
　
Step.7　Live2dプレハブにモーションをつける
　自動生成された**.anim をプレハブ上にドラック＆ドロップ


以上、設定等の細かいことは置いておいて、最速でLive2dモデルをUnity上の動作を確認したい人向けのステップでした。
これらStep1～7の手順を動画化したものがこちら

やりたかった事は↓　
（Unity上でLive2Dが動いているGameシーンのキャプチャ動画）
Unityのプロジェクト上でヌルヌル動いております。


別の話になりますがLive2dモデルに通常のUnityレイヤー通りに描画されてない。UIレイヤーで黒画にフェードアウトしてもゲーム画面上でlive2dモデルが表示されてしまう。

原因はこれっぽい
http://sites.cybernoids.jp/cubism2/sdk_tutorial/platform-setting/unity/csharp/render-mode
>Live2D Cubism SDK for Unityでの描画モードには以下の２種類があります。
> ・Live2D.L2D_RENDER_DRAW_MESH_NOW （デフォルトで設定されている値）
> ・Live2D.L2D_RENDER_DRAW_MESH
>デメリット
>描画したモデルよりもカメラ側に半透明のオブジェクトが置かれた場合、半透明のオブジェクトの上に
>Live2Dモデルが描画されてしまう。
>描画されるモデルにレイヤーを設定できない。
https://forum.live2d.com/discussion/204/live2dmodel-setrendermode-live2d-l2d-render-draw-mesh-%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6
おまけに公式も推奨していない。


とりあえずの一時しのぎとして、Live2DのモデルよりUIのレイヤーを上にしたい場合はOrder in Layer を２以上にしたCanvasを親プレハブにして回避(UI側)。正式なやり方はなんだろう。

いいなと思ったら応援しよう！