# Figma sang Unity

Lưu bản .fig local, nhập VberAI Studio, chạy tách lớp tự động, rồi xuất sang Unity.

## Tóm lại: 6 bước

Logic chính của **Figma sang Unity**: với UI / HUD file `.fig` đã tách lớp, xử lý art hàng loạt rồi nhập vào Unity. [VberAI Studio](https://vberai.com/studio) nhập file bằng **Import Project (nhập dự án)**, rồi chạy [tách lớp tự động](/docs/sprite/auto-layering-image-to-layers/): phát hiện mép rồi cắt ảnh, xuất file đặt tên có nghĩa, sau đó chọn **Export to Unity**.

Đã là file Photoshop tách lớp: [PSD sang Unity](/docs/convert/psd-to-unity/).

## Bước 1: Lưu một bản `.fig` local

Trong Figma, mở menu: **File (Tệp) → Save Local Copy (lưu bản local)**. Nhóm đã đặt tên (khung, nút, thanh HUD) sẽ theo sang VberAI Studio.

![UI game pixel Figma: menu File tô sáng Save Local Copy](/images/figma-to-godot/figma_to_godot_step1_save_local_copy_.webp)

## Bước 2: Import Project trong VberAI Studio

Ở trang dự án của VberAI Studio, chọn **Import Project (nhập dự án)**, chọn file `.fig` vừa xuất từ Figma.

![VberAI Studio Recent Projects, tô sáng Import Project](/images/figma-to-godot/figma_to_godot_step2_import_project_.webp)

## Bước 3: Tách lớp tự động

Chọn board (ví dụ **cat_journey_UI**). Trên thanh công cụ khi đã chọn, mở lớp chồng, chọn **Auto-Layering (tách lớp tự động)**.

![Menu lớp chồng, gồm Auto-Layering và Layer Split](/images/auto-layering/step1_auto_layering_.webp)

Hộp thoại là **Run AI auto-layering?**, rồi nhấn **Start layering**.

![Hộp xác nhận: Run AI auto-layering, Start layering](/images/auto-layering/step2_confirm_debit_payment_.webp)

Biên có tên hiện trên ảnh, nghĩa là các tấm đã tách lớp xong. Chi tiết bước này xem [tách lớp tự động](/docs/sprite/auto-layering-image-to-layers/).

![Kết quả Auto Layering: biên có tên trên UI Cat Journey](/images/auto-layering/step3_ai_output_.webp)

## Bước 4: Xuất sang Unity

Giữ board đã tách lớp được chọn (ở đây là **cat_journey_UI_layer**). Mở **Export**, chọn **Export to Unity**.

![Menu Export, tô sáng Export to Unity](/images/figma-to-unity/step_3_export_to_Unity_.webp)

## Bước 5: Chọn dạng xuất sang Unity

Khi xuất sang Unity, chọn dạng xuất. Trong hộp thoại **Target engine** là Unity; định dạng có thể chọn **Prefab (.prefab)**. **Export to** chọn gói ZIP, hoặc ghi thẳng vào dự án đích. **Default paths** đặt file theo thư mục mặc định của engine.

![Hộp thoại xuất Unity: định dạng Prefab và gói ZIP](/images/figma-to-unity/step_4_export_settings_.webp)

## Bước 6: Kiểm tra kết quả xuất

Lần này chọn gói ZIP. Giải nén ra thư mục gốc `Assets`: `Prefabs` chứa `.prefab` dùng được trong Unity (giao diện đã lắp, kéo vào scene được); `Textures` là file cắt ảnh cụ thể (PNG đặt tên theo lớp).

![Assets sau khi giải nén: Prefabs và Textures](/images/figma-to-unity/step_5_check_output_.webp)