【Live2D】イラスト制作からFaceRigまで！作り方全まとめ[チュートリアル]

CGメソッドの本記事では、FaceRig向けLive2Dモデルの制作手順をまとめて紹介します。

各機能を活用して効率よくモデルを作成する流れを解説します。

なお、VTuberモデル作成の簡易版を扱った記事もあります。

FaceRig用のLive2Dモデル用のイラスト作成について

モチーフについて

今回は2018年に流行した（2017年からすでに話題でしたが）ヒプノシスマイク（ヒプマイ）から、シンジュク・ディビジョン「麻天狼」の神宮寺寂雷（MC NAME：ill-DOC）をモチーフに描きました。

モチーフの選定には試行錯誤もありましたが、新たな試みとして選んでいます。

なお、イラストの制作時間は6時間程度です。

連休を活用し、3キャラクター分をおおむね描き進めました。

イラストの参考資料

人気IPのキャラクターはLive2D化が進んでいる事例も多いですが、ヒプマイのLive2Dモデルは比較的少ない印象があります。

理由の一つとして、参考にできる公式イラストの点数が限られている点が考えられます。

• 公式イラスト　→　1キャラあたり2枚程度のため、見えない箇所は想像で補って作画します。
• フェイスパック　→　Live2D用のイラストを描くうえで貴重な参考資料になります。

イラストで使用したソフトについて

作画ソフトはSAI2やCLIP STUDIO PAINTが主流ですが、普段あまり使い慣れていませんでした。

線の引きやすさにメリットはあるものの、最終的な書き出し処理をPhotoshopで行う都合もあり、使い慣れていて全て完結できるPhotoshopを選択しました。

ドキュメントサイズについて

キャンバスサイズは横2048px×縦2560pxに設定しました。

• FaceRigで表示するサイズは最大でもフルHD（1920×1080px）であること
• 基本は等倍ではなく、バストアップ（42%縮小程度）で配置して使用すること

なお等倍表示にすると、フルHDの縦画面にちょうど顔が収まるサイズ感になります。

• 1枚のイラストなら8K（8192×8192px）などの高解像度も選択肢ですが、テクスチャ容量を抑えるため2K（2048×2048px）1枚に収まる設計にしました。
• 過度な高解像度はPCスペックへの負荷が高くなり作業時間も増えるため、用途に合わせた適切なサイズに抑えています。

以上の理由からこのサイズ設定にしています。

ブラシ設定

線画は硬めのブラシ（3px）のみで描画しています。

レイヤーの設定

Photoshopの機能を活かし、塗りつぶしレイヤーとマスクを組み合わせて描いています。

• 後から色を調整しやすい
• マスクの白黒のみで塗り分けられる

といったメリットがあります。

マスク全体を黒く隠したい場合は、階調の反転を活用すると手早く作業できます。

（Ctrl+Iなどのショートカットを活用します。

）

レイヤー構成

Live2Dでアートメッシュ化したいパーツ単位でグループ化してまとめます。

アニメ調の塗りを意識し、ベースの通常色に影とハイライトを重ねるシンプルな構成にしています。

イラストの質感を高めるため、背景へのなじませや光源効果の調整レイヤーを重ねる手法もあります。

構成例： 後ろ髪（グループ） L線画 Lハイライト L2号影 L1号影 L通常色

グループの構成

基本手順として、手前に重なる表示順に合わせてレイヤーを配置します。

その他

• 閉じ目の状態を想定したアタリや資料を用意しておくと、後工程のモデリングがスムーズになります。
• 左右反転コピーのスクリプトがあると形状確認を効率化できます。

Live2Dインポート用に書き出し

書き出しには公式スクリプトを用途に合わせてカスタマイズしたものを使用しています。

FaceRig用のLive2Dの作り方2［テンプレートの適用まで］

使用したLive2DのバージョンはCubism 3.3です。

まずはPSDファイルのインポート手順から進めます。

1. 書き出したPSDファイルをLive2D Cubismのエディタ画面にドラッグ＆ドロップします。

※PSD側で非表示にしているレイヤーも、非表示状態のまま読み込まれます。

※グループに乗算や加算を設定している場合も、Live2D上で描画モードが設定された状態で読み込まれます。

※PSDを再調整した場合も、ファイルを再ドラッグ＆ドロップすることでテクスチャを差し替え・更新できます。

Live2Dの設定（テンプレート適用前の準備）

原画の固定設定

イラストをインポートしたら、パラメータパレットのメニューからデフォルトのフォームをロックを実行します。

調整作業中に意図せず原画の基準形状がずれてしまう事故を防ぐため、必ず設定しておきます。

描画モードの設定

乗算および加算の設定確認です。

Photoshop側で描画モードを設定して書き出していればそのまま引き継がれるため、Live2D側での再設定は不要です。

メッシュ編集

※完成形のイメージが定まっていない場合は、先に仮でテンプレートを適用し、パラメータを動かしてパーツ分けの不足や不備を洗い出してから素材を調整する方法をおすすめします。

パーツ構成を見直して、素材の分けが適切であると確認できた段階でメッシュ編集に進み、テンプレートを正しく適用できるよう準備を整えます。

仮メッシュの作成

1. パーツパレットですべてのパーツを選択します。
2. 「モデリング」メニュー＞「テクスチャ」＞「メッシュの自動生成」（Ctrl+Shift+A）を実行します。
3. プリセットから「変形度合い（小）」を選択して適用します。

仮メッシュの確認

1. パーツパレットからオブジェクトを1つ選択します。
2. 「モデリング」＞「テクスチャ」＞「メッシュのエディタで開く」（Ctrl+E）を選択し、メッシュの割り当て状態を確認します。

※余計な範囲までメッシュが広がっている場合は、PSD側でゴミや余分なピクセルを消去し、修正したPSDをドラッグ＆&ドロップして素材を更新します。

メッシュの作成

変形度合いが大きいパーツは、一つ一つオブジェクトを手動でメッシュを割り当てていきます。

手間のかかる工程ですが、綺麗な変形を作るために重要です。

大きく変形させないパーツは自動生成の仮メッシュのままで問題ありません。

メッシュを手動で割り当てるオブジェクト

• 長い髪の毛のパーツ
• 目周りのオブジェクト（まつ毛・眉毛）
• 口周りのオブジェクト（上唇・下唇・口内）
• 顔の輪郭と首

その他のパーツは大きな変形を伴わないため、プリセットの自動生成メッシュを活用します。

手動メッシュの作成方法

1. 対象のオブジェクトを選択し、「モデリング」＞「テクスチャ」＞「メッシュのエディタで開く」（Ctrl+E）を実行します。
2. 頂点を全選択（Ctrl+A）してDeleteキーを押し、既存の頂点をすべて削除します（1点のみ削除する場合はAlt+クリック）。
3. 手動で頂点を配置します。まずオブジェクトの中心線に沿って、カーブが急な部分は細かく、直線的な部分は粗めにクリックして頂点を作成します。
4. 続いて中心に打った点から外周に向けて頂点を配置し、二等辺三角形（または正三角形）を意識してポリゴンを構成していきます。
5. 外周を囲むように三角形を作成したら、外側の頂点同士を結んでメッシュを閉じます。
6. 最後に頂点を選択・移動して全体のバランスを整えます。

別オブジェクトへのメッシュの反転コピー

1. メッシュ編集済みのオブジェクトを選択してCtrl+Cでコピーします。
2. 反転コピー先のオブジェクトを選択し、Ctrl+Eでメッシュ編集モードに入ってからCtrl+Vでペーストします。

1. 不要なメッシュを消しゴムツールで削除したあと、反転したい頂点を選択して右クリックメニューから「左右反転」または「上下反転」を実行します。

以上の手順で別オブジェクトへメッシュ形状を反転コピーできます。

左右対称のパーツを効率よく作成できるおすすめの手法です。

同じオブジェクト内でのメッシュの反転コピー

1. オブジェクトの片側半分に頂点を配置してメッシュを作成します。
2. メッシュ編集モードを終了した状態でオブジェクトを選択し、Ctrl+Cでコピーします。
3. 再度Ctrl+Eで編集モードに入り、既存のメッシュを選択して反転します。
4. Ctrl+Vでコピーしておいた元の形状をペーストします。
5. 中央のつなぎ目部分の頂点を結合・調整して仕上げます。

その他のTIPS

• 編集ツールごとの設定やオプションは「ツール詳細」パレットで確認できます。
• 「メッシュが適切ではありません」と警告が出た場合は、Ctrl+R（自動接続）を実行すると適切なポリゴン接続に自動調整されます。
• 頂点作成の途中状態（接続線が伸びている状態）を解除したい場合は、Escキーを押します（状況により編集取り消しダイアログが出る場合があります）。

目のクリッピングの設定

1. 白目オブジェクトを選択し、インスペクタパレットでパーツIDをコピーします（Ctrl+C）。
2. 瞳やハイライトのオブジェクトを選択し、クリッピング欄にコピーしたIDをペーストしてEnterキーで確定します。

白目をマスク元として指定し、瞳やハイライトをクリッピングします。

テンプレートの適用

1. 「ファイル」メニュー＞「テンプレートを適用」を選択します。
2. モデルの骨格に合わせて、男性モデルならチトセ、女性モデルならイプシロンを選択します。

※FaceRig用モデルのナルミも選択可能ですが、標準テンプレートモデルの方が安定した挙動を得やすいため今回はチトセを使用しています。

1. サンプルモデルのサイズや位置をイラストに合わせて重ねます。

透明度を固定表示に設定しておくと位置合わせがしやすくなります。

1. @マークが付いた位置合わせ用パラメータを調整します。

目や輪郭のサイズ、長さ、位置をサンプルモデルの形状に合わせて調整します。

1. 全体の位置関係を合わせたら、「テンプレート適用 プレビュー」へ進み、各パーツの対応付けを行います。

サンプルモデルの前髪と自作イラストの前髪をそれぞれ選び、「選択要素を対応づけ」をクリックして紐付けます。

※モーション再生中に対応付けを行うとデフォルト形状がずれる原因になるため、必ずモーションを停止した状態で対応付けを行います。

1. パラメータパレットで角度X・Y・Zなどを動かし、パーツの追従や変形が正しく連動しているか確認しながら微調整します。

荒削りな状態でも、この段階でおおまかな動きのベースが完成します。

素材の修正

テンプレート適用後に動かすことで、パーツ分けの過不足やテクスチャの塗り残しが見つかるため、PSDに戻って素材を修正します。

• パーツを細かく分割しないと変形時に不自然な歪みが出る箇所
• 動いたときに下地が見えてしまう箇所の塗り足し

パーツ分けを大幅に見直した場合は、無理に修正を重ねるよりテンプレート適用からやり直した方が早く整う場合もあります。

PSDを修正したあとは再度書き出しを行い、Live2Dのエディタへドラッグ＆ドロップしてテクスチャを差し替え更新します。

ここまでのまとめ

以上の工程でモデリング作業の前半が完了です。

テンプレートが正しく適用できれば、あとは不要なパラメータを整理し、各動きの精度を個別に詰めていきます。

FaceRig用のLive2Dの作り方3［各パラメーターの調整まで］

テンプレート適用完了後のパラメータ調整作業を進めます。

パラメータの紐付けとオブジェクトのパーツ階層・描画順を確認します。

テンプレート適用時に意図しない階層へ入ってしまったオブジェクトを正しい親デフォーマやパーツ階層へ移動します。

耳やハイライトなどが適切な描画順や親階層に配置されているか確認し、ズレを修正します。

パラメーターの整理

FaceRigで使用するパラメータに絞って調整するため、不要なパラメータは削除します（初期状態はチトセのテンプレートが適用されています）。

削除するパラメーター

• 体の回転X（※キーを角度Xに移植してから削除）
• 体の回転Y（※キーを角度Yに移植してから削除）
• 左腕
• 右腕
• 左眼 笑顔（※使用せず、笑顔表現が必要な場合も口の変形に集約）
• 右眼 笑顔（※使用せず、笑顔表現が必要な場合も口の変形に集約）
• 目玉 縮小

これらを整理すると、髪揺れを除き調整が必要なパラメータは21個になります。

追加するパラメーター

FaceRigのトラッキングではなく物理演算で動かす髪パーツについて、揺れの表現力を高めるためにパラメータを追加します。

前髪と後ろ髪の揺れに加えて、以下の2つを追加します。

• 髪揺れ 横（PARAM_HAIR_SIDE -1, 0, 1）
• 髪揺れ アホ毛（PARAM_HAIR_AHOGE -1, 0, 1）

これらを新規パラメータとして追加しておきます。

パラメーターの調整

最終的に23（21 + 2）パラメーターに絞って動きを調整します。

1.体の回転 X（最後消します）

基本形状はテンプレートの設定をそのまま適用しています。

腕と胴体の間に隙間が生じていたため、腕オブジェクトにワープデフォーマを追加し、左右に傾いても隙間が見えないよう形状を整えます。

• オブジェクト自体の頂点ではなく、親デフォーマを追加して形状を制御するのが基本です（口やまつ毛など極端に変形する部位を除く）。
• 1パラメータにつき1デフォーマの割り当てが原則です。複数パラメータを同一デフォーマに関連付けると組み合わせ構造が複雑化します。

デフォーマによる修正は以上です。

ただし「体の回転 X」はFaceRigのフェイストラッキングでは直接連動せずマウス操作扱いとなるため、顔の向きに連動する「角度 X」へキーを移植します。

関連パラメーターの調べ方

1. パラメータパレットで「体の回転 X」を選択し、右クリックメニューから「選択」を実行します。
2. これにより、「体の回転 X」にキーが割り当てられているオブジェクトやデフォーマが抽出されます。

• 腕の位置×2
• 腕の曲面×2
• 首の回転
• 首の曲面X
• 体の回転X
• 体のオブジェクト×3（右アウター／左アウター／インナー）

合計10箇所が抽出されます。

別のパラメーターにキーの移植する方法

1. 対象オブジェクトを選択し、パラメータパレットで移植元の「体の回転 X」を選択します。
2. パラメータ横のメニューから変更を選び、移行先として「角度 X」を指定します。

以上の手順で、キー設定を別のパラメータへそのまま移植できます。

抽出された10箇所すべてで同様に移植を行い、角度Xの動きに合わせて体も自然に傾くよう設定します。

移植が完了したら、体の回転 Xのパラメーターは不要となるため削除します。

※FaceRigでは顔のトラッキングに体の動きを連動させることで、配信時の立体感と表現力が向上します。

2.体の回転 Z

テンプレートの設定をそのまま適用します。

3.呼吸

テンプレートの設定をそのまま適用します。

4.5.左/右目の開閉

ハイライト以外のパーツは左右対称のため、片目の開閉パラメータを作成したあと、形状の反転とパラメータ変更を適用して反対側に反転コピーします。

1. あらかじめイラスト上で目を閉じた状態のラインを想定しておきます。

1. 閉じ目のアタリに合わせて、まつ毛と白目のオブジェクト形状を整えます。

目の開閉のような細かな変形はデフォーマを使わず、オブジェクト自体の頂点を動かして形状を作ります。

変形パスツールでおおまかな曲線を合わせてから、頂点編集で微調整して仕上げます。

※変形パスツールはシャープな角を出すのが難しいため大枠のアタリ付けにとどめ、細部は直接頂点を操作して詰めるのが確実です。

反転コピーのやり方（複数オブジェクトまとめても可）

整えた目のパーツをまとめて反対側へ反転コピーします。

1. 目のパーツ群の親である「左目の変形」を子オブジェクトごと選択してコピー＆ペーストし、複製を作成します。
2. 挿入先・追加先を「Root Part」に指定し、キャンバス中央に空の回転デフォーマを新規作成します。
3. 作成した回転デフォーマの子階層に、先ほど複製したパーツ群を配置します。
4. 回転デフォーマを選択し、右クリックメニューから「反転」を実行します。
5. 反転したパーツ群を「右目の変形」と同階層へ戻し、名称の変更とパラメータの変更（左目パラメータから右目パラメータへ切り替え）を行います。
6. 最後に、テンプレートから残っていた古い右目パーツをすべて削除します。

※キャンバス中央に反転用の回転デフォーマを用意しておくと、左右反転の基準軸として重宝します。

6.口の開閉

• 設定前に資料を確認し、「あ・い・う・え・お」それぞれの口形状のイメージを決めておきます。
• 口関連のオブジェクトを選択し、「口 開閉」パラメータにキーを4点（0.0、0.3、0.6、1.0）設定します。
• 口内のみを表示し、最大開口の「お」（値1.0）、中間形状の「う」（値0.3）と「え」（値0.6）の大きさの基準を決めます。Altキーを押しながら縦横比を保って拡縮調整します。
• 下絵に合わせて変形パスツールで輪郭を整えます。事前に唇のラインにパスを正確に沿わせておくと調整が容易になります。
• 編集レベルを1に切り替えて頂点を微調整します。元の三角形メッシュの均等な配置を崩さないよう注意しながら整えます。

あごの動き

口の変形が整ったあと、口を大きく開けた動きに合わせてあごがわずかに下がる連動設定を加えます。

• 顔の輪郭オブジェクトに「あごの曲面」デフォーマを追加します。
• 「口 開閉」パラメータにキーを打ち、口の開き幅に合わせてあごのデフォーマを下方向へ変形させます。

口の開閉にあごのラインが連動することで、FaceRig上でのリップシンクがより自然で立体的に見えます。

7.口の変形

口の変形のパラメーターの整理

チトセの標準設定から、FaceRigの入力仕様に適合するパラメータ範囲へ変更します。

• パラメータの最小値を-2.0から-1.0に変更します（FaceRigでは通常マイナス方向の口変形はトラッキングされないため、0以下の形状は基本的に調整不要です）。
• 「口 変形」パラメータにキーを3点（-1.0、0.0、1.0）設定します。
• パラメータ値を1.0にして笑顔用の口形状（「あ」や「い」の横に広がった形）を作成します。

8.目の変形

テンプレートの設定をそのまま適用します。

9.目玉 X

左右のパーツをそのまま反転コピーすると視線の向きが逆転して寄り目や離れ目になるため、複製側のパラメータのキー（中央値0を除く左右端）を選択して右クリックメニューから反転を実行して動きの向きを揃えます。

10.目玉 Y

テンプレートの設定をそのまま適用します。

11.12. 左/右眉上下

テンプレートの設定をそのまま適用します。

13.14.左/右眉左右

テンプレートの設定をそのまま適用します。

15.16.左/右眉角度

テンプレートの設定をそのまま適用します。

17.18.19.20.前/後/横/アホ毛髪揺れ

横髪とアホ毛用にでワープフォーマーを追加。髪の長さに合わせてベジェ分割数を増やし、左右の揺れのパラメーターを作成する。 ※アホ毛に関しては変形パスツールでパラメーターを作成しました。

21.角度 Z

テンプレートのままにでOK。

首のつながり（首の曲面）や後ろ髪だけ調整。

スナップショットを使うと調整しやすいです。

22.23.角度 XY

最後に顔の縦横回転、髪や耳、今まで調整したパーツも含め、こまかく微調整していきます。

• ※モデリング＞パラメーター＞4隅の形状を自動生成機能を使うと手数が減らせます。

物理演算の設定

髪を体の動きに合わせて揺れるように設定します。

プリセットを作成して、パラメーターを割り当てるだけで自然な揺れが作成できます。

1. 上部メニューからモデリング＞物理演算・シーンブレンド設定を開く
2. 物理演算タブ＞追加ボタン
3. 部位の名前と入力プリセット、物理モデル、のプリセットを入力して作成

■ 名前/入力プリセット/物理モデル ・アホ毛 / 頭 入力 / 髪 3段振り子 ・前髪 / 頭 入力 / 髪 2段振り子 ・後髪 / 頭 入力 / 髪（長い） ・横髪 / 頭 入力 / 髪 2段振り子

1. 出力設定タブを押して追加ボタンで揺れる部位を割り当てます。

■ 名前/出力（パラメータ名）/変更箇所 ・アホ毛 / 髪揺れ 後 / デフォルト設定 ・前髪 / 頭髪揺れ 前 / 倍率2.5倍 ・後髪 / 頭 入力 / デフォルト設定 ・横髪 / 頭 入力 / デフォルト設定

アートメッシュ直でパラメーターを設定しているオブジェクト

モデリングはできるだけデフォーマーで作成するほうが、付け足し・削除できて便利です。

ただまつ毛や口の開閉のように、大きく変化する場合はどうしてもデフォーマーでは制御できません。

＜意識的に直でパラメーターにしてるもの＞

• 顔
• まつ毛/眉毛（目の開閉）
• 上唇/下唇（口の変形・開閉）
• あほ毛（髪揺れ あほ毛）

＜テンプレートのままでは直だけど、デフォーマで代替できそうなもの＞

• 首（角度XY）
• 髪の毛系（角度XY）
• 鼻系（角度XY）

まとめ

基本的には目と口の開閉を作成したら、あとはパラメーターをお好みで調整していくだけです、 最後はFaceRigへ表示させる方法です。

FaceRig用のLive2Dの作り方4［FaceRigに表示するまで］

まずはLive2Dでmoc3データを書き出しする方法です。

テクスチャアトラスの作成

1. モデリング＞テクスチャ＞テクスチャアトラスの編集
2. 新規テクスチャアトラス設定ウインドウで各種情報を入力。テクスチャサイズを2048 pxにしました。

moc3ファイル書き出し

1.ファイル＞組込み用ファイル書き出し＞moc3ファイル書き出し ※出力するSDKのバージョンは3.0にすること！まだFaceRig側は最新のSDK3.3未対応です！（2019.3.5）

FaceRigを起動する前までの設定

フォルダの作成

C:\Program Files (x86)\Steam\steamapps\common\FaceRig\Mod\VP\PC_Common\Objects

にキャラ名（ill-doc）のフォルダを作成します。

Live2Dから書き出した4種のデータをフォルダに格納

• ill-doc.2048
• ill-doc.moc3
• ill-doc.model3.json
• ill-doc.physics3.json

キャラ情報テキストの作成

FaceRig内で掲載するキャラ情報を作成します。

1. メモ帳で、下記の内容をコピペ

set_friendly_name my_avatar 'キャラ名'
set_avatar_skin_description my_avatar default 'txt_descLive2dAvatar1'

1. 「cc_names_キャラ名.cfg」（例：cc_names_ill-doc.cfg）という名前・拡張子で保存しフォルダに格納します。

環境設定情報の作成

カメラ位置やアイドリング、重力や風などの情報を設定します。

1. メモ帳で、下記の内容をコピペ

set_cam_pos キャラ名 0.0 -0.2 1.0
cubism30_set_gravity キャラ名 0 -1
cubism30_enable_wind キャラ名 true
cubism30_set_wind_optons キャラ名 0 0 0

1. 「cc_キャラ名.cfg」（例：cc_ill-doc.cfg）という名前・拡張子で保存しフォルダに格納します。

サムネイルの作成

256x256pxで「ico_キャラ名.png」でフォルダに格納 ※ FaceRigを起動する前に作成しておきます。

サムネイル作成前にFaceRigを起動してしまった場合

万が一、先にFaceRigを起動して自動でサムネイルが生成された場合は、下記の場所にサムネイルが生成されるので削除。

自分で作成したサムネイルを入れて再起動すれば適用されます。

C:\Program Files (x86)\Steam\steamapps\common\FaceRig\Mod\VP\PC_Common\Objects\ill-doc

キャラ名のフォルダが生成されているので、フォルダごと削除してOK 以上、設定がすべて終わったら、FaceRigを起動します！

FaceRigで確認

自作キャラがアバターギャラリーに登録されているでそれを選択すれば、FaceRigで自分の顔をトラッキングして動きを連動することができます。

以上、今回は技術書典6のため一部をブログで公開しました。

このキャラのテーマとしては、「効率良くFaceRig用Live2D」を作成してみる！でした。

本に関してはこちらを御覧ください！ https://cg-method.booth.pm/items/1277718?utm_campaign=fanbox-booth-item&utm_medium=promotion&utm_source=fanbox&utm_content=creator-page 短期間でVtuberを作成する方法を記事に書きました！

作成するべきFaceRig用Live2Dのパラメーターをまとめました！

Live2Dでのモデル制作は、ほかにも書いています。