Live2Dアクションフレームの作り方

Live2Dアクションフレームの作り方

◆用意するデータ 

・フレーム部分の Live2Dモデル

フレーム表示用の部分(サンプルではトランプの部分)は、通常の Live2Dモデル作成と同じように自由に作成できますので、ここでの説明は割愛します。

※ 元々ある Live2D モデルの一部にハメ込み用画像を配置して、アクションフレームとして活用することもできます。

※ ハメ込み用画像よりも先に用意しても、あとから用意しても問題ありません。


・ハメ込み用画像の PNGファイル(シーンのはめ込み先指定用、通常は1920*1080サイズの画像) 

①ハメ込み用画像の PNGを Live2D Cubism Editorに読み込み

アートメッシュとしてモデルに追加します。

ハメ込み用画像(1920x1080と描かれた画像)から生成されたアートメッシュについて、このマニュアル上では「☆1920*1080」という名前に設定し、以下その名称で説明します。(実際の作成時の名前・IDは自由です)

②アートメッシュのメッシュを調整する 

「☆1920*1080」に対して、Live2D Cubism Editor の「メッシュの自動生成」機能を用いるなどして、細かく分割します。

曲面的な変形をしたい場合は、より細かく分割してください。あとから調整も可能です。

③テクスチャアトラスを編集する

このとき、新規テクスチャアトラス設定画面では

・幅と高さを2048*2048 

・初期配置を「配置しない」

 上記の設定にして問題ありません。


Live2D用のデータはテクスチャ番号「0」に配置しているものとします。


ハメ込み用画像を、「テクスチャ」「テクスチャを追加」で作ったテクスチャ番号「1」に配置します。

配置位置を、「X: 10,Y: 10」になるよう移動で調整してください。


 ※ ここで指定したテクスチャサイズ、テクスチャ番号、配置位置は、後述するユーザデータと一致していれば、その他の値でも問題ありません。

④「☆1920*1080」のアートメッシュを選択し、インスペクタでユーザデータを開く 


type: nizimaACTION-Template-1

textureSize: 2048, 2048

textureNo: 1

layout: 10,10,1920,1080 


アートメッシュを選択した際のインスペクタのユーザデータ欄に、上記の内容を記入する 。

(これでハメ込み用画像がシーンのはめ込み先として指定されました) 

ユーザーデータの説明 


type: nizimaACTION-Template-1 

この情報が入っているアートメッシュを nizima ACTION!!用のアクションフレーム素材として認識します。 


textureSize: 2048, 2048

テクスチャサイズは、テクスチャアトラス作成時に作成したサイズと同一の値を設定してください。

1024や 4096なども利用可能です。フルHD(1920x1080)がキレイに収まるため、2048x2048を推奨しております。


textureNo: 1

テクスチャアトラス作成時の何枚目のテクスチャに対応付けるかを指定します。0以上の数値となります。

layout: 10,10,1920,1080

ハメ込み用画像の配置位置に対応する情報を、layout: X,Y, 幅,高さ の順で指定します。

幅、高さは、元々の1920x1080のテクスチャを倍率100%で配置した場合は 1920,1080となります。

α版では倍率100%のみ検証済みとなります

以下の⑤~⑥は、Live2Dアクションフレームのモデル制作の一例です。この通りに作成しなくても問題ありません。 

⑤「☆1920*1080」用にワープデフォーマを作成し、変形しやすいようにする 

「☆1920*1080」のアートメッシュをそのままパラメータで変形しても問題はありませんが、通常ワープデフォーマに入れておくと変形しやすくなります。


⑥パラメータで動きをつける

フレームの素材と合わせて、「☆1920*1080」が変化するように自由にモデリングしてください。

リピートのパラメータを活用すると、無限に繰り返す動きが実現できます。 

💡ヒント

リピートパラメータについては、nizima ACTION!!上で最小~最大の範囲外のキーを打った場合はリピートする表現として動作します。

例えば、-180°~180°で回転するパラメータに対して、190°を設定すると180°を超えて回転できます(190° = -170°と同じ表現)。

0°から 540° に変化するアニメーションを作成すると、1.5回転するアニメーションが作成できます。


※ 2024/11/26 現在

Cubism Editorのアニメーション機能でリピートパラメータに対して最小~最大の範囲外の値を設定し他アニメーションからモーションデータ( .motion3.json )を作成した場合、nizima ACTION!!上で正常にリピート動作しません。今後正常に動作するように修正予定です。

⑦組み込み用moc3ファイルを書き出す

Live2Dアクションフレーム専用の設定は特にありませんので、通常の Live2D モデルと同様に moc3ファイルを書き出してください。


⑧書き出したデータをフォルダごとnizma ACTION!!にアップロードすれば、使用可能! 

moc3 や model3.json を含むフォルダ を nizima ACTION!!にドラッグ&ドロップすることで、作成したモデル(アクションフレーム)が表示されます。

アップロードタブの「ファイルを選択」ボタンからアップロードする場合は、あらかじめフォルダを ZIP 圧縮しておく必要があります。

▼Live2Dアクションフレームの使い方はこちら 

作成したら、nizimaに投稿してみよう!

素敵なLive2Dアクションフレームが作成できたら、ぜひnizima ( https://nizima.com/ )に投稿をお願いします!

以下のタグいずれかを含む作品がnizima ACTION!!の素材一覧で表示される予定です。(近日対応予定)

#Live2Dアクションフレーム  #nizimaACTION


nizima ACTION!!に表示された作品を選択するとnizimaの販売ページに遷移するので、あなたの作品をアピールできます!