要約: 3ステップ

PNG から PSD へ は、ゲーム UI が 1枚に潰れた PNG しかない場合に向いています。HUD、画面キャプチャ、一度もレイヤーになっていないボードを、もう一度 Photoshop で扱いたいときです。自動レイヤー分割 を実行し、検出したエッジから名前の付いたパーツを切り出してから、Export to Photoshop PSD(Photoshop PSD に書き出す) を選びます。.psd では、それらのパーツがグラフィックレイヤーとテキストレイヤーに分かれています。起点が 1枚の PNG である画面が複数ある場合も、同じ手順で進められます。

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

VberAI Studio で PNG を開き、ボードを選びます(例:cat_journey_UI)。選択ツールバーの、重なりレイヤーの操作を開き、Auto-Layering(自動レイヤー分割) を選びます。

重なりレイヤーのメニュー。Auto-Layering と Layer Split がある

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

確認ダイアログ:Run AI auto-layering、Start layering

名前の付いた範囲が画面に載ります。切り出した、名前の付いた画像の準備ができます。詳しい手順は 自動レイヤー分割:画像を複数レイヤーに にあります。

Cat Journey の UI に、名前の付いた範囲が載った自動レイヤー分割の結果

ステップ 2: Photoshop PSD に書き出す

レイヤー分割後のボードを選んだままにします(ここでは cat_journey_UI_layer、1536×864)。Image Export(画像の書き出し) を開き、Export to Photoshop PSD(Photoshop PSD に書き出す) を選びます。

Image Export メニューで Export to Photoshop PSD が強調表示されている

ステップ 3: PSD を開く

ファイルは {name}_layer.psd として書き出されます。このボードでは cat_journey_UI_layer.psd です。Photoshop には、名前の付いたグラフィックレイヤーとテキストレイヤー(スキルスロット、通貨アイコン、HUD ラベル)が並びます。画面を撮り直さなくても、パーツごとに動かしたり、隠したり、見た目を変えたりできます。

Photoshop で開いた cat_journey_UI_layer.psd。名前の付いたグラフィックレイヤーとテキストレイヤーがある

そのファイルを Godot に読み込むには:PSD から Godot へ