• eye 仮想通貨投資
    仮想通貨は2018年以降、儲かるのか? 2017年に学ぶ、儲けるためのテクニック6選!
    2018年8月7日
  • Live2d 未分類
    FaceRig で動く Live2D アバター作成手順。オリジナルキャラでバーチャル ユーチューバーに!
    2018年8月31日
  • アイキャッチ 仮想通貨投資
    仮想通貨投資のリスク。資産を守るためにやること7選!
    2018年6月3日
  • zaif 仮想通貨取引所
    仮想通貨取引所Zaif(ザイフ)の口座開設方法 仮想通貨キャラが解説!
    2018年7月30日
  • アイキャッチ 漫画
    仮想通貨漫画「コイモン」番外編。過去作品倉庫
    2018年8月12日
  • アイキャッチ 漫画
    仮想通貨漫画「コイモン」第一話 ~はるちゃんとビットコイン君~
    2018年8月1日
  • アイキャッチ 漫画
    仮想通貨キャラ「コイモン」とは?
    2018年3月11日
  • eye コイモン図鑑
    コイモン図鑑 完全版①No1~No20 ~クセの強い仮想通貨キャラ達を漏れなく紹介~
    2018年7月8日
  • QUOREA 仮想通貨投資
    仮想通貨自動売買 クオレア( Quorea ) 初心者も安心の理由、登録方法を解説。
    2018年7月30日
  • eys コイモン図鑑
    コイモン図鑑 完全版②No21~No40 ~仮想通貨キャラと契約してしまった人々も紹介~
    2018年7月28日
FaceRig で動く Live2D アバター作成手順。オリジナルキャラでバーチャル ユーチューバーに!

こんにちは仮想通貨キャラ「コイモン」の作者のsocoです。

今回は自作したキャラでLive2Dアバターを作った際に試行錯誤した経緯と、その成果をご紹介します。

オリジナルキャラでバーチャル ユーチューバーを目指したい人必見です!

ビットコイン(BTC)君
俺もついにyoutuberデビューか・・・

Live2Dアバター作成の準備

Live2Dアバターの作成には以下のソフトが必要になります。

①PSDファイルを編集可能なイラスト作成ソフト
②Live2D Cubism 3 Editor
FaceRigと周辺機器

①PSDファイルを編集可能なイラスト作成ソフト

Live2d

PSDファイルとは「Photoshop Data」の略でAdobe Photoshop(フォトショ)で用いられるファイル形式です。
拡張子は「.psd」となります。

Live2d

本来Photoshop(フォトショ)専用のファイル形式でしたが、現在はいくつかのイラスト作成ツールでも編集/作成が可能になっています。
私はProcreate という、ipadで扱えるアプリを利用して作成しました。

②Live2D Cubism 3 Editor

Live2d

Live2D Cubism 3 Editorは2Dのイラストにアニメーションを付与するソフトウェアです。
2Dのデータでも立体感のある動きをつけることが出来ます。

FaceRigを活用すればモーションキャプチャで取得した人の動きと連携してバーチャルyoutuberを実現します。

FaceRigと周辺機器

Live2d

FaceRigとは、カメラから取得した人の動きをキャプチャし、用意されている3Dモデルとの連動を実現するソフトです。

自身の表情と連動し3Dモデルの表情も変化します。

動画の撮影/キャプチャが可能で、バーチャルyoutuberとして動画を作成することが出来ます。

周辺機器

FaceRigを利用するためにはWebカメラが必要です。
パソコンにカメラが内蔵されていなければ、購入する必要があります。

オリジナルのイラストを作成しよう

Live2Dアバターの作成の際、計画性なくイラストを描いても後ほど手戻りが発生します。
まずはテンプレートを参考に必ず動くものを作成することをおオススメします。

Live2d

テンプレートはこちらよりダウンロードできます。

「サンプルPSDをダウンロード」を選択して下さい。

Live2d

ダウンロードしたファイルをPSD対応のイラスト作成アプリで開くとこのように各パーツが分割されて管理されています。

各パーツを参考にイラストを作成しましょう。
位置がズレるとあとで面倒なことになるので、できるだけ各パーツの位置は動かさないようにしましょう。

仮想通貨キャラ「はるちゃん」

Live2d

この子は仮想通貨キャラの「はるちゃん」、仮想通貨で学費と奨学金を全て失った女の子です。
テンプレートに寄せて作成したため、各レイヤのサイズはほぼ同じとなっています。

後々非常に楽にアニメーションを付与する事ができます。

仮想通貨キャラ「ビットコイン君」

Live2d

このモンスターは仮想通貨キャラの「ビットコイン君」です。
仮想通貨ビットコインの妖精のようなキャラです。

はるちゃん
髪型がキモい!

はるちゃんと違い、人外の体格をしているため、上手く作成できるか不安です。

 

これらのキャラのデータをPSDファイルで書き出せば準備完了です。

Live2D でイラストにアニメーションを付けよう

Live2d

まずは公式ページよりLive2D Cubism 3 Editorをダウンロードしてください。

Live2D Cubism 3 Editorを起動すると、「Free版」「Pro版」を選択できます。

Live2d

今回使用したテンプレートは「Free版」で十分編集可能なので、「Free版」を選択してください。

もっとアニメーションをつけたい、レイヤを複雑にしたい方は42日間は無料で「Pro版」の無料トライアルをお試しください。

Live2Dを起動したら[ファイルを開く] or ドラッグ&ドロップで準備したキャラのpsdファイルを読み込んでください。

Live2d

サイズは原寸で問題ないと思います。

Live2d

読み込むとこのようにイラストが反映されます。

テンプレートの適用

Live2d

[ファイル]>[テンプレートを適用]を選択してください。

Live2d

今回は先ほどダウンロードしたEpsilon(基本)を選択すればOKです。

Live2d

モデルを選ぶとこのような画面になります。
位置とサイズが合うように調整してください。

はるちゃんの方はピッタリですね。

Live2d

ビットコイン君の方は・・・
後でかなり修正が必要そうです。

Live2d

[テンプレート適用プレビュー]を選択して各パーツを対応づけていきましょう。

左右で各パーツをクリックし対応をチェックしてください。
対応が取れてないものがあれば、[選択要素を対応付け]を選択し、対応付けを行いましょう。

全てのパーツの対応付けが終わればこのようになります。

案外いい感じに動くようになりました。
まだまだ修正が必要ですが・・・

パラメータの設定

Live2d

Live2Dにおいて表情はパラメータで表されます。
目が空いている状態が1なら閉じている状態は0、半開きは0.5といった感じでしょうか。

パラメータは多く設定でき、デフォルトでこれだけ用意されています。
自身でパラメータを設定することは出来ますが、FaceRigの連動して動作するパラメータを調整していきましょう。

まずは目の開閉を例に設定していきましょう。

Live2d

現在は目が開いている状態ですが、スライダーを動かすと、目は閉じようとしますが、形が崩れてしまいます。

Live2d

スライダーを目が閉じた状態に固定し、操作したいパーツをクリック。

Live2d

パーツの形状を操作できるように点が表示されます。
この点をドラッグすることでパーツの形状を変形します。

目が閉じた状態と思われる形状に整形し直せばOKです。

Live2d

画像を変形させる点は付け足し可能です。

Live2d
パーツをダブルクリックすると好きな箇所に点を打つことができます。
このように点を増やすことで、より細かい変形ができるようになります

スライダーで各状態に対応するように顔のパーツを変形すれば完了です。

モデルの書き出し

Live2d

[ファイル]>[組み込み用ファイルの書き出し]>[mocファイルの書き出し]を選択し、モデルを書き出しましょう。

Live2d

[OK]を選択すれば、任意の場所にファイル/フォルダが書き出されます。
・【モデル名】.moc
・【モデル名】.model.json
・【モデル名】.2048

解像度が異常に低いとき

Live2d

上記をを選択し、新規テクスチャアトラス設定を変更しましょう。

Live2d

各パーツがこのサイズで保存されています。

Live2d

ドラッグ&ドロップでサイズを引き伸ばし、解像度を上げてください。

FaceRigで自分の顔と連動させよう

Live2d

FaceRigをインストールしましょう。
残念ながら1480円と有料のソフトです。

アバターファイルの準備

先ほど作成した
・【モデル名】.moc
・【モデル名】.model.json
・【モデル名】.2048

これに加えて以下の二つのファイルを用意します。
ico_【モデル名】_marisa.png
  >アイコンとなる画像ファイル

・cc_names_【モデル名】_marisa.cfg
>詳細情報が記載されたファイル
   テキストファイルを作成し、以下を記載しておけば反映されます。

set_friendly_name【モデル名】 'Live2D【モデル名】' set_avatar_skin_description 【モデル名】 default '【説明文】'

FaceRig Live2D Moduleのインストール

Live2d

FaceRig で動くLive2D Moduleをインストールします。
値段は400円と比較的安いです。
私が作成した時は何故かこれをインストールしなければ動きませんでした。

もしかしたら、環境によって不要かもしれません。。。

Live2d

ProgramFiles(x86)>Steam>Steamapps>common>FaceRig>Mod>VP>PC_Commn>Objects
のフォルダ内に先ほどインストールしたFaceRig Live2D Moduleが格納されています。
ここに【モデル名】のファイルを作り以下を格納してください。
【モデル名名】
>【モデル名】.moc
>【モデル名】.model.json
>【モデル名】.2048
 >ico_【モデル名】_marisa.png
 >cc_names_【モデル名】_marisa.cfg

この状態でFaceRigを起動すると自身が作成したモデルが反映されています。

動作は以下のようになります。

まとめ

今回はオリジナルキャラをデザインし、FaceRigで動くLive2Dアバター作成手順を説明しました。
細かな動きを自身で設定できるので、作りこめば本当に面白いものが作れる気がします。

FaceRigもLive2Dも発展途上であり、今後さらなるバージョンアップが想定されます。
タイムラグなしに全身の動きをキャプチャできる日もそう遠くないのではないでしょうか。

ただ、変化に伴い、作成環境、動作環境も変化していくことが見込まれます。
もし、作成手順に不備や変更があれば教えていただけますと幸いです。

 

さて、私は引き続き仮想通貨キャラ「ビットコイン君」と「はるちゃん」のキャラを布教していきます。
ご興味のある方は作者のtwitterを応援していただけますと幸いです。
コイモン@仮想通貨漫画@soco_illusts

関連キーワード
未分類の関連記事
  • Live2d
    FaceRig で動く Live2D アバター作成手順。オリジナルキャラでバーチャル ユーチューバーに!
  • アイキャッチ
    仮想通貨 用語集
  • 【2018 4/16】コイモンまとめ(LINEスタンプ第二弾、ライバル登場、モザワンなどなど)
  • ついにスマホアプリDappの登場!スマホDappsゲーム「くりぷ豚(トン)」について
  • suzuriで仮想通貨キャラ「コイモン」グッズを買ってみた
  • 【2018 3/28】コイモンまとめ

この記事が気に入ったら
フォローしよう

最新情報をお届けします

おすすめの記事