ひとりでのアプリ開発 - fineの備忘録 -

ひとりでアプリ開発をするなかで起こったことや学んだことを書き溜めていきます

Unity - 2D PSD Importer:レイヤーを保持したまま画像を取り込む

初めに

 2D PSD Importer は PSBファイルを Unity のプロジェクトにインポートするための公式のパッケージです。これにより、Unity のエディター内で、Photoshop で作成されたグラフィックスやデザインの多くを、完全にレイヤー化された状態で使用できます。




2D PSD Importer

2D PSD Importer とは

 2D PSD Importer は PSBファイルを Unity のプロジェクトにインポートするための公式のパッケージです。これにより、Unity のエディター内で、作成されたグラフィックスやデザインの多くを、完全にレイヤー化された状態で使用できます。
 重要な部分は、PSD Importer といいながら、PSB ファイルを対象としている点です。ご注意ください。


PSD、PSB ファイルとは

 PSD(Photoshop Document) ファイルとは、Adobe Photoshop のネイティブファイル形式です。PNGJPEG と違い、作成したレイヤーやテキストなどを再度フォトショップで編集することが可能です。

 PSB(PhotoShop Bigdocument)ファイルとは、大容量のファイルで保存する形式です。幅か高さのいずれかが 30,000 ピクセルを超える場合や画像や容量が 2 GB を超える場合は、PSD ではなく PSB で保存します。

 どちらも Photoshop で使われる画像のファイル形式で、PSD が通常使うファイル、PSB は容量が大きい場合に使うファイルという認識です。

www.adobe.com
helpx.adobe.com

GIMP など他の画像編集ソフトでも、PSD 形式にエクスポートできるものであれば、PSB 形式に変換できるので、Photoshop を使わなければいけないというわけではありません。

2D PSD Importer のインストールの仕方

 Windows > Package Manager をクリックし、Package Manager を開きます。そこから 2D PSD Importer をインストールします。
 UnityでProjectを新規作成する際に「2D」テンプレートを選択すると、はじめからインストールされているはずです。


使い方

 PSB ファイルを Project ビュー の Assets フォルダーにドラッグ&ドロップすると、すべてのレイヤーを子オブジェクトとして含むプレハブを自動的に作成します。
 下の画像のようにレイヤーごとにレイヤーごとに読み込めていれば ok です。


Inspector

 Inspector には、通常の sprite にもある項目に加え、レイヤーに関する項目が追加されています。

  1. Import Hidden
    true にすると、非表示にしたレイヤーも表示します。
  2. Mosaic
    true の場合、レイヤー単位でスプライトがスライスされます。

    false の場合、1枚のスプライトとして認識されます。

  3. Character Rig
    true の場合、PSB ファイルで配置した場所にスプライトを配置します。

    false の場合、個別のスプライトとして扱われます。

  4. Use Layer Grouping
    Character Rig が true の場合のみ使用できます。
    true の場合、レイヤーグループごとにスプライトが空のゲームオブジェクトでまとめられます。

応用例

 多くのスプライトをまとめてインポートするだけでなく、2D Animation を使ってキャラクターのアニメーションを作ることもできます。少ない素材でいろいろなアニメーションを作ることができます。

GIMP を使って PSB ファイルを作る

 GIMP とは、無料で使える画像編集ソフトです。よく Photoshop の代替品として紹介されるソフトで、PSD ファイル形式で保存することもできます。

 GIMP を使って、次のように PSB ファイルを作ることができます。

GIMP を使って PSB ファイルを作る方法)

  1. 画像をエクスポートウィンドウを開く
    ファイル > エクスポートをクリック、もしくは Ctrl + E で開きます。
  2. PSD ファイル(Photoshop 画像)を選び、エクスポートをクリックする
  3. エクスポートした PSD ファイルを右クリックし、名前を変更。拡張子を .psd から .psb に変更する

なぜか複数あったレイヤーが1つになっている

 GIMP の画面上では、複数のレイヤーがあるが、PSD にエクスポートした段階で、レイヤーが1つに統合されることがありました。

 具体的な状況は下記の通りです。

GIF ファイルを GIMP で各レイヤーごとに読み込むことができた。

しかし、レイヤーグループはクリックできず、作ることができない。

さらに、このままPSD形式でエクスポートすると、全てのレイヤーが1つのレイヤーに統合されてしまう

〇一応の解決策
 GIMP 内で新しい画像を生成し、レイヤーとして画像を読み込むことで解決できます。

 しかし、手間が多いため、何か別の解決策が見つかれば追記します。

最後に

  • 2D PSD Importer は PSBファイルを Unity のプロジェクトにインポートするための公式のパッケージ
  • インストールしたら、Project ビューの Assets 内に PSB ファイルをドラッグ&ドロップすればよい