ケモミミ大好きイラストブログ

「ケモミミは至高」と語る主のイラスト創作ブログです。

【Live2D】描いたイラストをLive2Dで動かそ〜イベントモーション追加編〜

こんにちは、立花です。(`・ω・´)

前回から引き続きキャラクターのアニメーション設定をして行きたいと思います。

今回はいよいよキャラクターの各部位に当たり判定を設けて、イベント設定をします。

当たり判定を作成する

まずはモデリングデータに当たり判定を追加します。「テクスチャ編集」からポリゴンの編集画面を開きます。

f:id:afami1682:20170423174713j:plain

テクスチャのない余白に四角形のポリンゴンを作成して「OK」を選択します。

f:id:afami1682:20170423174714j:plain

四角形の透明なパーツが生成されました。これが当たり判定の枠になりますので合計2個作成し頭と体に割り当てます。

f:id:afami1682:20170423174715j:plain

頭と体の当たり判定をそれぞれ「D_REF.HEAD」と「D_REF.BODY」とリネームしました。「D_REF」は当たり判定の命名規則になります。

f:id:afami1682:20170423174718j:plain

これで当たり判定の追加は完了となります。

タッチイベント用のモーション作成

Animatorでタッチイベント用のモーションを3パターンほど作成しました。

余談ですが、現在Animator(Mac版)で音声データはQuickTimeの問題で使用出来ないようです。色々調べた結果、QuickTimeをダウングレードすれば可能のようですが、アンインストールにもそれ用のツールのインストールなど色々面倒そうだったので、おとなしく修正されるのを待つことにしました。

f:id:afami1682:20170423174724j:plain

音声データは「ゆくも!テキスト発話サービス」で用意しました。

www.yukumo.net

プロジェクトを作成する

前回の記事で使用したプロジェクト(基はSampleApp1)に各データを再配置します。

afami1682.hatenablog.com

配置後のディレクトリ構造はこんな感じです。

f:id:afami1682:20170423174721j:plain

モデリングデータ(moc)をLive2D Viewerで開き、作成したモーションデータをドラッグして読み込みます。その後、音声データと当たり判定(ID)を選択して動作テストします。

f:id:afami1682:20170423222035j:plain

さらに「プロジェクト>サンプル」から「物理演算:髪揺れ」と「表情:笑顔」「表情:怒り」を追加してテストします。

f:id:afami1682:20170423222032j:plain

追加したモーションや髪揺れの動作確認が出来たら、jsonファイル(mai.model.json)を出力します。メニューから追加した表情や髪揺れのファイル(physics.json)もそれぞれ個別で保存(出力)しておきます。

f:id:afami1682:20170423222033j:plain

出力したデータそれぞれをプロジェクトに配置します。(表情データはリネームしてます。)

f:id:afami1682:20170423232405p:plain

最後に「mai.model.json」をSampleApp1の記述に合わせて修正します。

{
    "version":"Sample 1.0.0",
    "model":"mai.moc",
    "textures":[
        "mai.2048/texture_00.png"
    ],
    "expressions":[
        {"name":"f01","file":"expressions/f01.exp.json"},
        {"name":"f02","file":"expressions/f02.exp.json"},
        {"name":"f03","file":"expressions/f03.exp.json"}
    ],
    "hit_areas": [
        {"name":"head", "id":"D_REF.HEAD"},
        {"name":"body", "id":"D_REF.BODY"}
    ],
    "motions":{
        "tap_body":[
            {"file":"motions/tabBody_00.mtn","sound":"sounds/tapBody_00.mp3"},
            {"file":"motions/tapBody_01.mtn","sound":"sounds/tapBody_01.mp3"},
            {"file":"motions/tapBody_02.mtn","sound":"sounds/tapBody_02.mp3"}
        ]
    },
    "physics":"physics.json"
}

以上で修正は完了です。

完成!!

今回の追加内容

  • 頭をタップすると表情が変わります。
  • 体をタップするとイベントモーションが発生します。※音量注意
  • 画面をグリグリした際に、髪が揺れます。

いかがでしょうか?(`・ω・´)

今回はここまでとなります。次回は追加修正からくがきでもしようかなと思います。

(`・ω・´)もしよければクリックお願いします。私のやる気が「+10」されます。

にほんブログ村 イラストブログ オリジナルイラストへ
ご閲覧ありがとうございました。(*゚▽゚*)ノシ