Embedded Files
このマニュアルはCubism 2 (前バージョン）用です。現行バージョンのCubismはこちら。
対応バージョン：Cubism 2.0以降
（解説ではCubism Editor 2.0を使用しているので、最新版ソフトウェアと若干見た目や操作が異なる場合があります。）
コスチュームを変えることができるLive2Dキャラクターを作ろう！
チュートリアル作者：kutata （URL：blog.naver.com/kutata0415 ）
Team Sinsiroadのゲームクリエイター
スマートフォンゲーム【ポーションメーカー】の制作者。
iOS: iTunes Store Android: Google Play
こんにちは。今回のチュートリアルを一緒にしてくれる「ティアちゃん」です。
本編では、コスチュームを変えるためのキャラクターのモデリングのコツを説明します。
したがって、基本的なモデリング方法については、ある程度理解している方のための説明になります。
このチュートリアルは、
・ ステップ1.準備
・ ステップ2.領域ボックスを使ったモデリング
・ ステップ3.領域ボックスを取り除く
・ ステップ4.服を着せ替える
で構成されています。
それでは、チュートリアルを開始します。
ステップ1. 準備
【１】ラフを描く
まず、作成したいキャラクターのラフを描きます。
【2】レイヤー分け
各パーツごとにレイヤーが分かれたキャラクターを準備します。
キャラクターの表情の変化などに使われる部分（ほほタッチなども含む）も可能な限りレイヤーを分けておくと、スムーズに自然な動きが作れます。
今回のティアちゃんは正面向きなので、
耳と翼、ツインテール、目の形などの左右対称のパーツは、テクスチャのサイズを節約するために、片側のみ製作しました。
レイヤーが分けられている場合は、Live2Dにインポートするときに自動的に便利なテクスチャの配置になるので、
psdのレイヤーは、実際に使われる位置に配置します。
※レイヤー分けを終えたら、必ずバックアップファイルを作成しておいてください。
【3】モデルのロード
ステップ1-【2】で準備したpsdファイルをLive2D Modelerにドラッグ·アンド·ドロップしてロードすることでモデリングができます。
この画面でテクスチャの編集ができます。
レイヤーとレイヤー（テクスチャとテクスチャ）の間が近すぎる場合は、今の形よりも大きなコスチュームへの変更が難しくなります。
① 左側のオプションから「レイヤー間のマージン」（Margin between layers）の数値を少し高く調整すると、
psdのレイヤーとレイヤーの間を開けることができます。
しかし、まつげ、瞳など小さなパーツにも不要に大きなスペースが設定されてしまうことがあります。
ゲーム制作の場合は、レイヤーのサイズがゲームの動作に影響するので、必要なパーツだけスペースを確保する方法を紹介します。
ステップ2. 領域ボックスを使ったモデリング
【1】領域ボックスとは
psdに戻ります。
ステップ1-【2】で準備したpsdファイルのコピーを作成し、テクスチャの空きを確保するための作業を開始します。
ティアちゃんの帽子を考えてみます。
ご覧のように、本来帽子より大きい「帽子パーツの領域」を表示する必要があります。
領域を表示する方法はいろいろありますが、そのパーツで想定される最大サイズにするという感じで余裕のあるサイズを作ってください。
以後、この青い四角を使ってパーツの領域を把握する方法を、「領域ボックス」と記載します。
ティアちゃんの場合には、帽子、各髪パーツ、髪飾り、服を着せ替える予定なので、それぞれの領域ボックスを作成しました。
それぞれのパーツとそれに対応する領域ボックスは、同じレイヤーに入れてください。
【2】確保したスペースの確認
ステップ2-【1】のpsdファイルをLive2Dにドラッグ·アンド·ドロップしてロードしてみると、以下のようなテクスチャの配置が行われます。
必要なパーツに領域ボックスが表示され、確保したスペースの状態が確認できます。
読み込みを終えた画面です。
ステップ1-【2】で説明したとおり、対称な部分をコピー、反転して作られました。
このようにすると、1つの耳を描くだけで、両耳に使用することができます。
また、テクスチャのスペースを節約することができるという利点があります。
【3】ポリゴンの設定
バストモーフィング、まぶたなど、細かな動きが必要な部分に、少し気を使ってPolygonを設定し、配置を整えてください。
【4】レイヤーの配置
各パーツの所属とレイヤーの位置関係（前後関係）の設定をすべて完了しました。
しかし、青色の領域ボックスがそのまま見えていて、まだ利用できません。
これから青ボックスを取り除きます。
ステップ3. 領域ボックスを取り除く
【1】テクスチャのエクスポート
Live2D Modelerからテクスチャをエクスポートします。
【2】psdファイルを編集する
Photoshopに戻ります。
ステップ1-【2】で作成されたpsdファイルと、ステップ2-【1】の段階を終えたpsdファイル、ステップ3-【1】でエクスポートしたファイルを一緒に開きます。
ステップ1-【2】で作成されたpsdファイルと、ステップ2-【1】の段階を終えたpsdファイルを重ねます。
（※この段階では、レイヤーを合わせないでください。）
【3】psdファイルを編集する 2
領域ボックスのある画像とない画像をステップ2-【1】で作成したテクスチャの上に重ねます。
テクスチャの上へ移動してきた二つのレイヤーを一緒にサイズ変更し、
テクスチャの領域ボックスとサイズが一致するように以下のように調整します。
領域ボックスがある画像レイヤーを消して、元のテクスチャの帽子の領域ボックスがクリアされれば完了です！
以下のように残りの領域ボックスも同じ方法で消去します。
【4】テクスチャの保存
領域ボックスをすべて削除すると、このようにすっきりとしたテクスチャを得ることができます。
このテクスチャを別のファイルに保存します。
ステップ2-【1】で得た領域ボックスがあるテクスチャは、個別にバックアップしておきます。
【5】テクスチャの置き換え
Live2D Modelerに戻ります。ステップ3-【4】で完成したすっきりとしたテクスチャに置き換えてみましょう。
すっきりとしたモデルができました！
これで、デフォーマを完成するとモデリングが完了します。
次は復習を兼ねてティアちゃんの服を他の画像に変えてみましょう。
ステップ4. 服を着せ替える
【1】新しい服を描く
ティアちゃんの服を変えましょう。
まず、新しいレイヤーに新しい服を描いてください。
（※領域ボックスがあるレイヤーには入れないでください。）
領域ボックスのサイズを超えないように注意してください。
【2】テクスチャの置き換え
もう一度ステップ3-【3】で行った手順を繰り返します。
領域ボックスがある服と新たに描いた服のレイヤーを同時に選択してテクスチャにインポートします。
自分のイラストを Live2D にするときにレイヤー構成や素材分けの参考にすると良いでしょう。
インポートした二つのレイヤーをテクスチャの領域ボックスのサイズに合わせて調整してください。
領域ボックスがあるレイヤーを消去してください。
これで服の変更は完了です！
他のパーツも同じ方法で変更します。
Live2D Modelerで戻って新しいテクスチャを置き換えればすぐに適用することができます。
この方法でテクスチャの変更だけでキャラクターのコスチュームを変更することができます。
【3】完成
このチュートリアルは、ここまでです。
ゲーム用モデリングをされる方のお役に立てれば幸いです。
ありがとうございます。
Article copyright © 2015 kutata
Page updated
Report abuse