Article · 06

Skin و شخصی‌سازی کاراکتر در Spine: ترکیب لباس، مو و سلاح در زمان اجرا

یک اسکلت و یک مجموعه انیمیشن می‌تواند ده‌ها ظاهر داشته باشد. Skin در Spine این کار را ممکن می‌کند؛ مهم این است که از ابتدا درست برنامه‌ریزی کنی.

داود جنگجو مهر ۱۴۰۵ مطالعه: ۸ دقیقه متوسط تا پیشرفته
SpineSkinsCustomizationUnity

Skin چیست؟

اسلات‌ها در اسکلت جایی هستند که تصویر روی آن قرار می‌گیرند. Skin مشخص می‌کند در هر اسلات کدام Attachment (تصویر یا مش) نمایش داده شود. به این ترتیب یک اسکلت با همان انیمیشن‌ها می‌تواند با لباس، مو یا سلاح متفاوت نمایش داده شود، بدون ساخت انیمیشن جدید.

  • کاراکتر با چند ظاهر (فروشگاه، شخصی‌سازی بازیکن).
  • دشمنان هم‌خانواده با ظاهر متفاوت.
  • تغییر ظاهر بر اساس سطح پیشرفت یا رویداد.

برنامه‌ریزی آرت و اسلات‌ها

موفقیت شخصی‌سازی بیشتر به طراحی اسلات‌ها بستگی دارد تا کد. قبل از ساخت آرت این‌ها را مشخص کن:

  1. بخش‌های قابل تعویض: مو، کلاه، بالاتنه، پایین‌تنه، کفش، سلاح و ...
  2. یک اسلات برای هر بخش: مثلاً hair، torso_cloth، weapon.
  3. اندازه و مفصل یکسان: تمام نسخه‌های یک بخش باید روی همان استخوان‌ها و نقاط اتصال سوار شوند.
  4. Draw Order ثابت: ترتیب لایه‌ها را برای همه‌ی ظاهرها هماهنگ نگه دار تا یکی زیر دیگری نرود.

نام‌گذاری Skinها با یک قرارداد (مثلاً hair/long و outfit/knight) هم برای خودت و هم در کد کار را ساده می‌کند.

قاعده‌ی طلایی

تا جایی که می‌شود Skinها را کوچک و تک‌منظوره بساز (یک Skin برای یک ست لباس یا یک مدل مو). بعد با ترکیب آن‌ها هزاران حالت می‌سازی.

ترکیب Skinها در Unity

در ران‌تایم Spine می‌توان چند Skin را در یک Skin ترکیبی جمع کرد (به آن Mix and Match می‌گویند):

using UnityEngine;
using Spine;
using Spine.Unity;

public class CharacterOutfit : MonoBehaviour
{
    SkeletonAnimation skeleton;

    void Awake() => skeleton = GetComponent<SkeletonAnimation>();

    public void Equip(string hairSkin, string outfitSkin, string weaponSkin)
    {
        var data = skeleton.Skeleton.Data;
        var combined = new Skin("combined");

        combined.AddSkin(data.FindSkin(hairSkin));    // مثلاً "hair/long"
        combined.AddSkin(data.FindSkin(outfitSkin));  // مثلاً "outfit/knight"
        combined.AddSkin(data.FindSkin(weaponSkin));  // مثلاً "weapon/sword"

        skeleton.Skeleton.SetSkin(combined);
        skeleton.Skeleton.SetSlotsToSetupPose();
        skeleton.AnimationState.Apply(skeleton.Skeleton);
    }
}
  • بعد از SetSkin حتماً اسلات‌ها را به Setup Pose برگردان و انیمیشن را دوباره اعمال کن، وگرنه ظاهر قبلی تا فریم بعد باقی می‌ماند.
  • اگر FindSkin مقدار null برگرداند، نام Skin اشتباه است؛ قبل از AddSkin بررسی کن.
  • هر بار که کاربر ظاهر را عوض می‌کند یک Skin جدید ساخته می‌شود؛ از ساختن مداوم آن در هر فریم خودداری کن.

تغییر رنگ

برای تغییر رنگ بدون ساخت آرت جدید، رنگ اسلات را تغییر بده. بهتر است آرت برای این کار خاکستری یا روشن و خنثی ساخته شود تا رنگ‌ها درست بنشینند.

// رنگ پوست، مو، لباس و ...
var slot = skeleton.Skeleton.FindSlot("hair");
slot.SetColor(new Color(0.9f, 0.4f, 0.2f, 1f));
  • رنگ‌دهی ضرب‌شونده روی آرت تیره نتیجه‌ی ضعیفی می‌دهد؛ طرح پایه روشن‌تر بساز.
  • برای تغییر چند بخش هم‌زمان، یک تابع کمکی با نام اسلات‌ها بنویس.

هزینه‌ی رندر

ترکیب Skinها اغلب باعث می‌شود تصاویر از چند صفحه‌ی اتلس بیایند و Draw Call بالا برود. چند راه برای کنترل:

  • همه‌ی بخش‌های یک کاراکتر را تا حد ممکن در یک اتلس بگذار.
  • رانتایم Unity ابزارهای Repack برای ساخت یک اتلس واحد از ترکیب Skinها دارد؛ از مستندات نسخه‌ی خودت بخوان، چون مصرف حافظه‌ی موقت و زمان ساخت دارد.
  • تعداد ظاهرهای هم‌زمان روی صفحه را با بودجه‌ی Draw Call بسنج.
  • برای ظاهرهای پرتعداد ولی کم‌تغییر، به‌جای Mix and Match در لحظه، Skinهای از پیش ترکیب‌شده بساز.

چک‌لیست

  • اسلات‌ها و نام Skinها قرارداد ثابت دارند.
  • همه‌ی نسخه‌های یک بخش روی همان استخوان‌ها سوار می‌شوند.
  • بعد از SetSkin، وضعیت اسلات‌ها و انیمیشن دوباره اعمال می‌شود.
  • تعداد Draw Callها با چند ظاهر هم‌زمان روی دستگاه هدف سنجیده شده است.

پروژه‌ای با Spine یا Unity داری؟

برای انیمیشن کاراکتر، UI و پیاده‌سازی در Unity می‌توانیم با هم صحبت کنیم.

Telegram View Portfolio