Live2D

2016年3月20日 (日)

Live2Dにおける口の位置の思考

 アニメ的表現でよく口が鼻と顎を線で結んだ線上に無い場合が多い。
Live2Dでも、そのような点を注意するといい表現になるのではないか?というアプローチ。

_
画像1: アニメでの正面、斜め向き

Live2d__
画像2: Live2Dでの正面、斜め向き

Live2Dのモデリング技術が杜撰なので細かいところはご容赦。

__line
Live2d___line
画像3: ラインを追加した各画像

これを意識すればよりアニメ的表現に近づいたモデリングができるのかも。

どうしても斜め向きの時、直線上に口を置くと3DCG寄り表現になってしまいそう。もちろん、3DCG寄りの方向で作りたい場合はそっちの方がいいと考えられる。状況に応じて。

| | コメント (0) | トラックバック (0)

2016年3月 1日 (火)

[実験]唇をブレンドで切り替えつつ表示する

2016y03m01d_184340849

Live2Dコンテンツを作成した時に、小さい口からだと大きな口に広げると極端にカクカクしたり、開けられなかったり色々問題が出るので、「口が閉じてる時だけ小さい口を使用、開けるときは大きな口を使用する」という方法を思いついてやってみました。
結果から言うと微妙でした(制作能力の問題?)。特にFaceRigで使ってみると波紋のようなものが出て目立ってしまいました。(FaceRig以外ではいいのかもしれない)

-
--
方法

2016y03m01d_184656085
0.00の時は小さな口を使用し、0.01で透明度を活用し大きな口のモデルを使用します。
このときブレンドで違和感が出ないように0.01時点では小さい口に合わせるようにポリゴンを集めて小さい口の形に近づけます。
(小さい口:透明度100%→0%)(大きい口:透明度0%→100%)

2016y03m01d_184921405

その後大きさを調整しながら大きな口を開けられるようにします。
2016y03m01d_185004121

この方法だと口を2種類描く、ポリゴンを弄る必要があり少々手間ですが、より思った通りのモデルを作りたい場合の助けになるかもしれません。

目パチの際に閉じ目を別途用いて綺麗に見せる方法もあるので、口でも出来そうと思い、実験した次第です。覚え書きも兼ねて実験とその結果報告でした。

| | コメント (0) | トラックバック (0)

2016年1月16日 (土)

FaceRigのワークショップに自作Live2Dモデルを公開するまで

Live2Dのモデルを作成してSteamのFaceRigのワークショップに公開するまでの流れを書きます。ここでの前提条件として

 Live2Dモデル作成が終了済み
 FaceRig+FaceRigLive2DModule購入済み(しなくても大丈夫かもですが動作確認ができません)

が、あります。
モデル作成方法は公式様のマニュアルから【PSD&テンプレ機能で簡単モデリング

-
--
必要なもの------
FaceRig(+DLC:FaceRigLive2DModule)
Live2Dモデル
FaceRig Workshop Utility Kit

FaceRig Utility Kit はSteamからダウンロードします。
Steamアプリを開いて[ライブラリ]->[ツール]->[FaceRig Workshop Utility Kit]をインストールしてください。
2016y01m16d_081719838

次にLive2DモデルをFaceRigで読み込めるデータ作成を行います。

-
--
[必要モデルデータ作成]
Live2Dモデルは.cmoxファイルになっていますがFaceRigで読み込むデータは.mocファイルです。ゆえにその.mocファイルを作成します。

Live2DModelerと呼ばれるLive2Dモデリングソフトから作成を行います。
Modelerから[ファイル]->[mocファイル書き出し]を行います。
2016y01m16d_082403823

次にウィンドウが出現するので適宜設定を行います。画像の次に設定を行う説明をします。
2016y01m16d_082436843

赤枠内の2か所が設定で注意が必要な場所です。
 上赤枠では書き出しバージョンを設定します。ここではいくつかのバージョンで追加された機能を使用するかどうかで変更の余地が発生します。FaceRigでは最新版の2.1の書き出しは2016年1月現在、対応していません。なので書き出しバージョンを2.0にする必要があります。
 次に下赤枠では、model.jsonファイルというモデル設定ファイルの出力を行う項目があります。これも動作上必要なファイルなのでチェックボックスを入れます。その後、OKボタンを押し出力します。

 上記の設定で出力を行えば、
[name].2048 (1024 or 4096)
[name].moc
[name].model.json
([name]は、出力した時の名称です。ここでは抽象性を出すため[name]となっています)
が新しく生成されます。
2016y01m16d_083516299

 実際の所。このデータだけをアバター名フォルダ([name]フォルダ)でひとつにして、FaceRigにインポートすれば動作します。しかし、今回はワークショップにアップロードするまで行うのでもう少し手を加えます。次は、アップロードに必要なフォルダ構成です。もし、自分だけで楽しんだり、動作確認をしたい場合は[動作確認]の項目まで読み飛ばしてください。

-
--
[フォルダ構成]
フォルダ構成ではアップロードルールがありますので、それに従って構成していきます。
Objects
-[name]
  --[name].2048
  --[name].moc
  --[name].model.json
-preview.png
です。
2016y01m16d_085146128
2016y01m16d_085151943
2016y01m16d_085157323
preview.pngはワークショップで表示するためのサムネイルです。これが無いとアップロード時、エラーでアップロードできません。無事に表示できるという確認が取れたのは『512*512 png形式』のみです。何か理由が無ければこの形式をオススメします。

これにファイルを少々付け加えます。FaceRig動作時における名前・説明・サムネイルの表示です。

-
--
[FaceRig内の名前・説明・サムネイル表示]
 previewとは別にFaceRig用のサムネイルや名前などを設定する必要があります。ここではその設定を行っていきます。
 まず名前・説明は.cfgファイルというファイルを使って表示を行います。プログラマなど一部の方以外には聞きなれないファイル名かもしれませんがメモ帳や各エディタで編集できます。
 メモ帳や各エディタを開きます。記述内容は以下の通りです。

----------------------------------------------------
set_friendly_name [name] '[name]'
set_avatar_skin_description [name] default 'Description[説明文]'
----------------------------------------------------

set_friendly_name
ここで名前の設定を行います。日本語対応にもできますが記述方式が分からないです…。
2016y01m16d_090449578_name
赤枠内に設定が表示されます。

set_avatar_skin_description
説明文が記述されます。デフォルトだと英語ですがあらかじめ日本語でも説明文を入れれば言語設定で日本語が適用されます。ただし文字制限が存在したり、UTF-8(ROM無)という文字エンコード方式にしか対応してないなどが言われています。日本語周りでは実際に試したことがないので実際のところはよくわかりません。
2016y01m16d_090449578_description
赤枠内に設定が表示されます。

この上記の文章を書き終えたら
cc_name_[name].cfg
という名称にして保存します。保存ができない!という方は.txt形式で保存になっていないか確認してください。よくあります(経験談)。

次にアイコンの設定です。
アイコンはpreview.pngがサイズ512*512.png形式ならば使いまわせます。今回は使いまわします。当然使いまわさないでワークショップのサムネイル用。Facerig内でのサムネイルを別々にしても問題はありません。ただし、FaceRigのサムネイルはサイズ512*512、形式pngでしか表示確認ができてません。
名称はico_[name].pngにします。
2016y01m16d_090449578_ico
赤枠内に表示されます

2つのファイルが作成出来たら.mocファイルなどが入っている場所に入れてください。最終的にはこのようなファイル群になります
2016y01m16d_092807334

無事に終了したら次は動作確認を行います。

-
--
[動作確認]
先ほど作ったObjectフォルダを所定の場所に入れます。
場所はSteamフォルダ階層深くです。例としては
E:\Software\steam\steamapps\common\FaceRig\Mod\VP\PC_Common\Objects
です。
steamより上の階層はインストール場所に依存するのでデフォルトインストールの場合はProgramFiles(x86)に入っているかもしれません。

また、steamアプリからも飛べます。
ライブラリからFaceRigを表示して左の項目を右クリック->[プロパティ]でウィンドウを開きます
2016y01m16d_093529819

その後、ウィンドウの[ローカルファイル]->[ローカルファイルを閲覧]でFaceRigフォルダまで飛べます。その後、FaceRig\Mod\VP\PC_Common\Objectsまで開きます。
2016y01m16d_093543229
2016y01m16d_093950646

ちなみに、\PC_CustomData\Objectsの内部に入れても同様に機能します。他のブログではこちらを入れることが多いですが、このフォルダは実際にワークショップからサブスクライブ(使用登録)するときに使うフォルダです。そのためこのフォルダに入れて動作させた後、アップロードした自作モデルをサブスクライブした場合、フォルダがダブります。その場合どちらが動作確認用なのか、アップロード物なのか分からなくなるので、ここでは動作確認を行う場合、原則PC_Common\Objectsにしています。

PC_Common\Objectsに先ほど作ったフォルダの[name]フォルダのみ入れます。
2016y01m16d_094635631
入れるのは赤枠内のみです

そしてFaceRigを起動し、無事に入っていれば成功です
2016y01m16d_094751906

最後にワークショップアップロードです

-
--
[アップロード]
steamアプリの[ライブラリ]->[インストール済み]からUtility Kitを選択し、プレイします
2016y01m16d_095126838
2016y01m16d_095133977

ウィンドウが出現するはずです。
2016y01m16d_095309520
このウィンドウ、もといソフトを用いてワークショップへアップロードを行います。

設定後はこのようになります。
2016y01m16d_095700832

Update Item
Add new item -no update 新規アップロードします
前に上げたデータをボックス内を変更でアップデートという形でアップロードできます

Title
ワークショップで公開するもののタイトル

Description
ワークショップで公開するものの説明

Tags
タグ設定(,で区切れる)

Data Folder
アップロード時、参照するフォルダ
ここではObjectsフォルダを参照します。注意点として、間に日本語フォルダがあると文字化けして正常にアップロードされない可能性があるので予め英語フォルダで最後まで統一するようにしてください。

Preview Picture File
ワークショップで公開するもののサムネイル
Data Folderを選択した時に一緒に設定されますが、そのままアップロードしようとするとエラーを吐くので、しっかり[Browse]ボタンからPreview.pngを設定します。

Item Visibility
public 誰でも閲覧可能
friend only フレンドのみ閲覧可能
private 自分のみ閲覧可能
基本はpublic です。最初は御試しアップロードでprivateで上げる、というのも手です。

Change Log
アップロード、アップデート履歴
変更点などを記す

最後まで設定が終了したらTerms and Agreement(規約同意)にチェックボックスがあるので、チェック(同意)して[Add Item]ボタンを押します。
これでアップロードが完了します。もし、失敗した場合は何か問題があるので、ゆっくり甘いものでも摂りながら確認してみてください。

以上でLive2Dモデル公開手順を終了します。

-
--
[参考文献]
FaceRigにLive2Dモデルを追加する方法 [GALVAS diary]

Twitter[オノッチ様]

Cagliostro of GranblueFantasy ver.1.1 [Live2D content]

| | コメント (0) | トラックバック (0)

2016年1月 4日 (月)

FaceRigで舌を出す方法と留意点

FaceRigがセールだったので買いました。Live2DModuleも一緒に買いました。良いですね、楽しいですね。

 で、テンプレートで入っている3Dモデルキャラの舌を出したくて少し苦戦したので少しまとめます。
 舌はトラッキングでは出せません。ショートカットで出せます。前の古いバージョンでは[Special Action]という場所から設定を行うのですがv1.274ではありません。ですのでショートカットから手動で出す形になります。

2016y01m04d_194643185
まず①のアドバンスドUIにして上部の少しと右側のUIを出現させます。
次に②の歯車マークからセッティングをします。

2016y01m04d_194658303
で、赤枠内のショートカット弄って対応させれば準備完了。ショートカットを押して舌を出してくれたりすればOKです。

[舌をだしてくれない対処]
ショートカットを押しても舌を出してくれない場合はNumLk(ナムロック)が入っているかいないかで対処が出きます。

https://steamcommunity.com/app/274920/discussions/0/611704730313573130/
情報ソース

ショートカットは元々テンキーで行うものらしく、テンキーが使える状態でないといけないのでNumLkのONOFFで使えない場合があるそうです。
ですのでフルキーボードでない場合はこのNumLkを怪しんで変更してみてください。無事に動けばOKです

Facerig_4_1_2016__19_45_52
イメージ図

そしてDLCであるLive2DModuleを購入したので自作Live2Dを入れて遊んでます。
Facerig_4_1_2016__11_52_39

導入の方法は以下のサイト様からどうぞ
FaceRigにLive2Dモデルを追加する方法

--

---

---------[2016/01/09追記]

上記の方法でも出せなかった場合

2016y01m09d_182627371

[Avatars]->[Behaviour]->[Enable Custom Actions]をEnableにしてください。(もしかして初期設定はDisable?)

| | コメント (0) | トラックバック (0)

2015年8月22日 (土)

Live2DのSampleApp1を用いて自前のキャラクターをクリックで反応させる

ーLive2DがUnity用のSDKを配布しています。その中のsampleに含まれるSampleApp1に自前のキャラクターを入れてクリックするとモーションを再生するようにします。

2015y08m22d_194958729

ここで一つ大きな壁として「当たり判定を持ったLive2Dキャラクター」を作成します。
今回、その作成法は参考URLだけで済ませてしまいます。もし、作っていない場合は以下のURLを参考に作成してください。
当たり判定の配置

作る際に大まかな問題点としては、

 当たり判定を持ったLive2Dモデルの作成

 json手書き

です。これをクリアすれば、他は言うほど大きな障害になりません。

----必要なもの--------------------------------------------------------

Unity5

オリジナルの(当たり判定を持った)Live2Dモデル

Live2D_SDK_Unity_2.0.09_1

---------------------------------------------------------------------------

SampleApp1を用いて表示、モーションを対応させる場合.jsonファイルがModelerでもViewerでも出力されない内容なので、元から入っているデータのjsonファイルを参考に手で構築していく必要があります。ここが一番大変なところであり、これが出来れば大方できたことになります。jsonファイルはメモ帳でも開けます。

これから作るjsonファイルは図にするとこんな感じになります。

Json

各々のツールで生成されるjsonデータ内部は

Modelerでは

type

name

model

texture

であり、

Viewerでは

version

model

texture

motions

(physis)

(pose)

(expressions)

etc...

です。

今回は、「クリックしてモーション再生」を行うので、物理演算のPhysisや腕の切り替えなどを行うpose、表情変化をさせるexpressionsなどは省きます。というかカッコ内のは作って出力したことがないので、Viewerから出力されないかもしれません。

これから作るjsonのデータは、

type

name

model

texture

layout

hit_areas

motions

  --idle

  --tap_body

となります。手打ち作業でjsonをやるので慣れてない人は時間がかかるかもしれないので、時間と飲み物を甘いものを用意してのんびり行ってください。あと、折れない心もあるといいです(私はこの記事を書くまでに3回挑戦して失敗してます)。SampleApp1に入ってるモデルのjsonを真似ながらそれっぽく作ればいいんですが、それを言ってはおしまいなので、拙いながらを解説を。

type,name,model,textureはModeler出力からmotionsをViewer出力から使います。

Viewer出力の際は、モーションとUnityとの関連付けの問題で、体をタップさせて再生したいモーションのタグを「tap_body」にしてください。方法はmocファイルをViewerで開き、motionsフォルダをドラッグ&ドロップでインポートした後に、モーションデータをクリックすれば「グループ名」というのが表示されるので、そこをtap_bodyにします。

2015y08m22d_194645837

この今、写っているキャラクターのjsonファイルはこうなりました

---------------------------------------------------------------------------------------

2015y08m22d_195425352

{
    "type":"Live2D Model Setting",
    "name":"totomi",
    "model":"totomi.moc",
    "textures": [
        "totomi.2048/texture_00.png"
    ],
    "layout":
    {
        "center_x":0,
        "y":1.2,
        "width":2.9
    },
    "hit_areas":
    [
        {"name":"head", "id":"D_REF.HEAD"},
        {"name":"body", "id":"D_REF.BODY"}
    ],
    "motions":{
        "idle":[
            {"file":"motions/totomi_idle.mtn","fade_in":2000,"fade_out":2000},
            {"file":"motions/totomi_idle_02.mtn","fade_in":2000,"fade_out":2000}
        ],
        "tap_body":[
            {"file":"motions/totomi_angry.mtn","fade_out":0},
            {"file":"motions/totomi_sleep.mtn","fade_out":0},
            {"file":"motions/totomi_sleep_up.mtn","fade_out":0},
            {"file":"motions/totomi_smile.mtn","fade_out":0},
            {"file":"motions/totomi_tameiki.mtn","fade_out":0},
            {"file":"motions/totomi_tere_01.mtn","fade_out":0},
            {"file":"motions/totomi_toboke.mtn","fade_out":0},
            {"file":"motions/totomi_unazuki.mtn","fade_out":0}
        ]
    }

}

----------------------------------------------------------------------------

上から順番に、type,name,model,textures,layout,hit_area,motionsです。以下各々の説明です。このjsonファイルを読み込んでUnity上で出力するのでこの内部のパス階層が違っていたり、名前が間違っているとエラーを吐きます。根気よく。

タイプ(type)はLive2D Model Settingです。

ネーム(name)は、このモデルの名前です。

モデル(model)は、mocファイルの名前です。

テクスチャ(textures)は、テクスチャが入っているフォルダ/名前です。

レイアウト(layout)は、表示位置と幅の指定です。同じ数値でも、Unityの方で位置を弄ればいいので同じ数値でも問題ないかも。

ヒットエリア(hit_areas)は、ヒットエリアの名称、idを各々指定します。

モーション(motions)は、何もしない状態で再生させたいモーションを”idle”タグとして、体をクリックして再生させたいモーションを”tap_body”タグとして分けます。括弧やカンマ打ち等プログラムを触ったことがある人もない人もお気をつけてください。

無事に修正が完了したら覚えやすい名前(キャラ名等)を行い拡張子を「.model.json」にして保存して終了です。

Unityへ移動させるファイルはこのjsonファイルのほかに、モーションフォルダ、テクスチャフォルダ、モックファイルです。この4つを使います。

以後はUnityでの操作です。

2015y08m22d_200606720

まず、自分の作成したキャラの名前のフォルダを作ります。(ここではtotomiフォルダになっています)

次に、その内部に先ほど使うと行った4つ、jsonファイル、モーションフォルダ、テクスチャ、モックファイルをドラッグ&ドロップします。

2015y08m22d_201448285

その後にメニューバーの「Live2D」→「CreateLive2DCanvas」をクリックしてキャンパスを作成し、分かりやすいように作成されたキャンパスの名前を変更します。

2015y08m22d_201747368

最後に、LAppModelProxyのPathに「live2d/(フォルダ名)/(.model.json名)」を打ち、無事に表示されればひと段落です。

2015y08m22d_201829183

その後再生ボタンを押し、体をクリックしてモーションが再生されれば無事に導入終了です。お疲れ様でした(*'ω'*)

-( ˘ᾥ˘ )問題発生した-----------------------------------------------------------------------------

もし、表示されない、モーションが再生されない等があれば以下の項目をチェックしてみてください。表示エラーがあればスクリプトのチェックが外れます。

---表示関連-----

上記のjsonファイルを参考に、カンマや括弧の打ち間違えが無いか

json内に書かれたフォルダ名と導入したフォルダ名が同じか

json内に書かれたモック名とモックファイル名は同じか

LAppModelProxyに書いたパスが合っているか

---モーション関連-----

json内に書かれたヒットエリア名とModelerで作成したネームとあっているか

json内に書かれたidとModelerで作成したidと合っているか

json内に書かれたモーション名と導入したモーション名があるか

大体がjsonファイルのスクリプトエラーが表示されない原因でした。ゆえに、ここをクリアできれば後は楽です

--------------------------------------------------------------------------------

それでは皆様よき、開発ライフを!!

| | コメント (0) | トラックバック (0)