# PSD から Unity へ

レイヤー付き PSD または PSB を VberAI Studio に読み込み、自動レイヤー分割を実行してから Unity に書き出します。

## 要約: 6ステップ

**PSD から Unity へ** は、レイヤー付き Photoshop ファイル（PSD または PSB）を Unity に読み込みたい場合に向いています。[VberAI Studio](https://vberai.com/studio) がデザインを読み込み、[自動レイヤー分割](/docs/sprite/auto-layering-image-to-layers/) が検出したエッジから名前の付いたパーツを切り出します。**Export to Unity（Unity に書き出す）** で、それらのパーツをエンジンに書き出します。

`.fig` の場合は：[Figma から Unity へ](/docs/convert/figma-to-unity/)。まだレイヤーが必要な平面 PNG の場合は：[PNG から PSD へ](/docs/convert/png-to-psd/)。

## ステップ 1: レイヤー付き PSD を開く

名前の付いたグループ（フレーム、ボタン、HUD バー）を残します。その名前は、VberAI Studio まで引き継がれます。

![Main Screen UI のレイヤー付き PSD](/images/psd-to-godot/psd_to_godot_step1_psd_file_.webp)

## ステップ 2: PSD/PSB を読み込む

VberAI Studio で **Import（読み込み）→ PSD/PSB** を選びます。

![VberAI Studio の Import と PSD/PSB](/images/psd-to-godot/psd_to_godot_step2_import_psd_.webp)

## ステップ 3: 自動レイヤー分割

ボードを選びます（例：**cat_journey_UI**）。選択ツールバーの、重なりレイヤーの操作を開き、**Auto-Layering（自動レイヤー分割）** を選びます。

![重なりレイヤーのメニュー。Auto-Layering と Layer Split がある](/images/auto-layering/step1_auto_layering_.webp)

**Run AI auto-layering?（AI 自動レイヤー分割を実行しますか？）** を確認し、**Start layering（レイヤー分割を開始）** を押します。

![確認ダイアログ：Run AI auto-layering、Start layering](/images/auto-layering/step2_confirm_debit_payment_.webp)

名前の付いた範囲が画面に載ります。切り出した、名前の付いた画像の準備ができます。詳しい手順は [自動レイヤー分割：画像を複数レイヤーに](/docs/sprite/auto-layering-image-to-layers/) にあります。

![Cat Journey の UI に、名前の付いた範囲が載った自動レイヤー分割の結果](/images/auto-layering/step3_ai_output_.webp)

## ステップ 4: Unity に書き出す

レイヤー分割後のボードを選んだままにします（ここでは **cat_journey_UI_layer**）。**Export（書き出し）** を開き、**Export to Unity（Unity に書き出す）** を選びます。

![Export メニューで Export to Unity が強調表示されている](/images/psd-to-unity/step_3_export_to_Unity_.webp)

## ステップ 5: Unity の書き出し形式を選ぶ

ダイアログでは **Target engine（対象エンジン）** が Unity になります。形式は Prefab（`.prefab`）にできます。**Export to（書き出し先）** は ZIP アーカイブ、または対象プロジェクトへの直接書き出しです。**Default paths（デフォルトパス）** はエンジンの既定ディレクトリを使います。

![Unity の書き出しダイアログ：Prefab 形式と ZIP アーカイブ](/images/psd-to-unity/step_4_export_settings_.webp)

## ステップ 6: 出力を確認する

今回は ZIP アーカイブで書き出しました。解凍するとルートは `Assets` です。`Prefabs` には Unity の `.prefab`（シーンに置ける組み立て済み UI）が入り、`Textures` にはレイヤー名に沿った切り出し PNG が入ります。

![解凍した Assets フォルダ。Prefabs と Textures がある](/images/psd-to-unity/step_5_check_output_.webp)