Live2Dで動かすイラストを用意するとき、普通にイラストを描くとは違う点に気をつけないといけません。Live2Dで使える形式でイラストを用意しないと、いざLive2Dにインポートする際にトラブルになってしまいます。
そこで、ここではイラストを描く前と描いた後を中心に、イラスト作成で気を付けるべき点をまとめてみました。Live2D用イラストを描くときに参考にしてみてください。
イラストを描く前に気を付ける点
まずは、イラストを描く前に気にしておきたいポイントを押さえておきます。もし以下のことをクリアしていなければ、Live2Dへのインポート自体できなくなる場合もあります。
使うソフトはPhotoshopかCLIP STUDIO PAINT
使用するペイントソフトは、PhotoshopかCLIP STUDIO PAINTがオススメです。なぜかというと、Live2Dのマニュアルに下記のような注意書きがあるからです。
Cubism EditorでPSDが正常に読み込めることが確認されている画像編集アプリケーションは以下の2つです。
・Adobe Photoshop
・Celsys CLIP STUDIO PAINT上記のアプリケーション以外で作成されたPSDについては正しく読み込まれない可能性があります。
引用元:PSD作成上の注意点 | Live2D Manuals & Tutorials
他のソフトでもイラストを描けますが、Live2Dへ正常にインポートできないことがあるようです。色が変わることもありえるので、なるべく2つのソフトのどちらかを使いましょう。
ちなみに、個人的には、安価で多機能かつスマホやタブレットでも使える、CLIP STUDIO PAINTをオススメします。PRO版とEX版がありますが、Live2D向けのイラストを描くのであれば、PRO版で十分です。ちなみに、EX版はマンガやアニメーションも作る人向けになります。
もし、Photoshop も CLIP STUDIO PAINT も持っていなければ、購入を検討してみてください。
CLIP STUDIO PAINT PROCLIP STUDIO PAINT EX
保存形式はPSD
Live2Dで使えるファイル形式は、基本的にPSD形式だけです。
イラストを描くときは別の形式でも構いませんが、最終的にはPSD形式でイラストを保存する必要があります。なので、これからイラストを描く場合は初めからPSD形式で保存していきましょう。
カラーモードはRGB
Live2DではRGBカラー以外のイラストはインポートできません。特に、Photoshopを使用している場合はカラーモードが多彩なので注意が必要です。
PhotoshopでカラーモードをRGBに変更するには、[イメージ]メニュー →[モード]→[RGBカラー] を選択します。
CLIP STUDIO PAINTは、画像の新規作成時に基本表現色を[カラー]にすればRGBカラーになります。
カラーチャンネルの設定は8bit/チャンネル
カラーチャンネルは8bit/チャンネルでないと、Live2Dでは使えません。16bitや24bitでは画像を読み込めません。
Photoshopでは、[イメージ]メニュー →[モード ]→[8bit/チャンネル] を選択すれば8bit/チャンネルに設定できます。
CLIP STUDIO PAINTでは、基本的にチャンネル設定はできないようです。なので、チャンネルを気にする必要はなさそうです。
カラープロファイルはsRGB
カラープロファイルをsRGBにしていないと、Live2Dにインポートした際に変色してしまいます。別のカラープロファイルに設定していてもインポート自体は可能ですが、あらかじめsRGBに設定したほうがいいでしょう。
Photoshopでは、[編集]メニュー →[プロファイル変換 (V) ] を選択します。そして、表示されたウインドウ内の[ソースカラースペース]が sRGBになっているか確認してください。sRGBになっていればウインドウをそのまま閉じ、sRGBになっていなければ[変更後のカラースペース]をsRGBに変更してOKボタンを押しましょう。
CLIP STUDIO PAINTでカラープロファイルを変更するには、[表示]メニュー →[カラープロファイル] →[プレビューの設定]を選択します。[プレビューするプロファイル]をsRGBに変更すれば設定完了です。
ちなみに、カラープロファイルを選択する際、sRGBの前後に文字が入っています(sRGB IEC61966-2.1など)。
イラストの描き方と必要な作業
Live2D用のイラストを描くときに、通常のイラストと大きく異なるのは、パーツ分けをする必要がある点です。他にも、イラストを動かすからこそするべき作業があります。
パーツごとにレイヤーを分ける必要がある
(一枚絵からの場合と、はじめから分けて描く場合)
Live2Dを使っての動き設定は、パーツ(レイヤー)ごとに設定していきます。そのため、すべてを1つのレイヤーにまとめていると、思い通りの動きを設定するのが難しくなります。
たとえば、手をふる動きを付けたい場合は、手だけを描いたレイヤーを別に作る必要があります。もし、関節ごとに動きを変えたければ、前腕のレイヤーと、二の腕のレイヤーと、手のひらのレイヤー、指のレイヤー・・・と細かく分けていかなければいけません。
一枚絵からパーツ分けする場合
パーツの1つ1つを切り抜き、別レイヤーに貼り付ける作業になります。投げ縄選択などを使ってパーツ分けする部分を選択し、別レイヤーに移していきましょう。
はじめからパーツ分けして描く場合
ラフ画や下絵を描き、下絵に沿ってパーツごとに描いていきます。一枚絵を描くより手間がかかりますが、切り抜き作業をする必要がなくなり、Live2Dにあわせたイラストが描きやすくなります。
見えない部分の描き足し
Live2Dでパーツを動かすと、一枚絵と違ってパーツの裏側が見えます。そのため、パーツのつなぎ目が不自然にならないよう、通常は見えない部分も描き足す必要があります。
例をあげると、髪の裏側、口まわり、首や腕など関節の付け根、といった部分に線や色を追加します。それぞれのパーツが動くことで透明部分などの不都合な部分が見えないようにしましょう。
ちなみに、描き足しをする際、描き足し部分だけをさらに別レイヤーに分けると、あとでパーツを修正するときに便利です。
ゴミの除去
消しゴムで消し残した部分や色の塗り残しのように、パッと見ただけでは気付かないところも確実に修正したほうがいいです。動いていない状態では目立たなくても、Live2Dで動かしたら目につくということがよく起こります。
Photoshopについては、Live2Dがゴミ取り用のスクリプト「Live2D_Cleaning」を配布しています。Live2D公式ページからスクリプトをダウンロードして使えば、比較的簡単にゴミを取り除けるでしょう。
CLIP STUDIO PAINTでは、サブツールのゴミ取りを使えば、細かい点を探して消去できます。他にも、レイヤープロパティの[境界効果]を使うことで、描画部分の周辺に色をつけられます。こういった機能を駆使して、ゴミを丁寧に取り除いていきましょう。
Live2Dへのインポート前に気を付ける点
パーツ分けしてイラストを完成させても、インポートする前にすることがあります。Live2Dで効率よく作業を進めるためにも必要なことなので、最後にチェックしておきましょう。
レイヤーなどを結合する
イラストを描く際、パーツごとに線画レイヤーや着色レイヤー、特殊効果レイヤーなど、複数のレイヤーに分けているかと思います。これらのレイヤーに分けたままLive2Dにインポートすると、レイヤーごとに動きを設定することになるため面倒です。1つのパーツとなるレイヤーを結合させていきましょう。
また、ペイントソフトで設定したクリッピング機能やマスク機能やパス情報は、Live2Dに反映されません。それらの機能が残らないよう、レイヤーに統合しましょう。
もし、Photoshopを使っているのであれば、これらの結合作業をスクリプトで行うことが可能です。Live2D公式ページから、「Live2D_Preprocess」をダウンロードして使ってみましょう。
ところで、レイヤーを統合して保存してしまうと、あとでイラストを修正するのが難しくなります。レイヤー統合したPSDファイルは、統合前とは別に、インポート用ファイルとして保存するのがいいでしょう。
レイヤー名が被らないようにする
Live2Dで表示されるパーツ名には、ペイントソフトのレイヤー名が適用されます。そのため、レイヤー名が被っていると同じパーツ名が横並びになり、ややこしくなってしまいます。
少なくとも、レイヤー結合したあとはレイヤー名が被らないようにするのが吉です。
画像は統合せずに保存する
インポート用にPSDファイルを保存するとき、[画像を統合して書き出し]をするとレイヤーがまとめられてしまいます。別名保存をすればLive2Dに問題なくインポートできるファイルとして保存できます。
意外とこれが原因でハマる人がいるようなので、要注意です。
2度手間にならないように注意しよう
ここまで紹介したことが要因で、Live2Dとペイントソフトを行ったり来たりすることになれば、ソフト間を往復するたびに創作意欲が削がれてしまいます。
このページなどを確認しながら、なるべくエラーに引っかからないように注意しながらイラスト制作を進めていきましょう。