https://virgool.ir/feed/@m_41254455Product Designer & Design System Designerfa2026-11-11 01:40:38https://files.virgool.ir/upload/users/3633695/avatar/NnhLQO.jpghttps://virgool.ir/@m_41254455https://virgool.ir/@m_41254455/تفاوت-figma-variable-و-design-token-lbq6iaconauhهر Figma Variable می‌تونه یک Design Token باشه، اما هر Design Token لزوماً یک Figma Variable نیست!این دو مفهوم خیلی وقت‌ها به‌جای هم استفاده می‌شن، درحالی‌که تفاوت مهمی بینشون وجود داره.اول از همه، Design Token چیه؟دیزاین توکن یک روش ساختاریافته برای تعریف، نام‌گذاری و مدیریت تصمیمات طراحی مثل رنگ، فاصله‌گذاری، تایپوگرافی و... است.مثلاً:color.primary = #7251B5نکته اینجاست که Design Token به ابزار خاصی وابسته نیست. می‌تونه در فیگما، وب، اپلیکیشن موبایل و پلتفرم‌های مختلف مورد استفاده قرار بگیره.حالا Figma Variable چیه؟Variable قابلیتی داخل فیگماست که به ما اجازه می‌ده مقادیر قابل استفاده مجدد رو تعریف و مدیریت کنیم.مثلاً یک Variable به اسم color.primary تعریف می‌کنیم و به چندین کامپوننت متصلش می‌کنیم.از این به بعد، با تغییر مقدار Variable، تمام کامپوننت‌های متصل به اون هم به‌روزرسانی می‌شن.پس تفاوت اصلی کجاست؟Design Token یک مفهوم مستقل از ابزار برای مدیریت تصمیمات طراحی محسوب می‌شه.اما Figma Variable یکی از روش‌های پیاده‌سازی این مفهوم در محیط فیگماست.فرض کنید یک Design System داریم که هم در فیگما و هم در React استفاده می‌شه.ممکنه یک تصمیم طراحی مشترک به دو شکل پیاده‌سازی بشه:در فیگما به شکل Figma Variableدر کد به شکل CSS Variableهر دو یک تصمیم طراحی رو نمایش می‌دن، اما نحوه پیاده‌سازی و استفاده از اون‌ها متفاوته.و اینجا یک نکته مهم وجود داره:صرفاً اینکه در فیگما Variable تعریف کنیم، به این معنی نیست که یک Design Token System استاندارد و هماهنگ با کد داریم.برای رسیدن به چنین سیستمی، باید به ساختار توکن‌ها، نام‌گذاری، لایه‌بندی و فرایند انتقال یا همگام‌سازی بین طراحی و توسعه توجه کنیم.در نهایت:Design Token فقط یک مقدار ذخیره‌شده نیست؛ بخشی از یک زبان مشترک بین طراحی و توسعه است.Figma Variables ابزاری برای پیاده‌سازی این زبان در فیگما هستند، نه تمام آن.Hediye fazeliHediye fazeliSun, 18 Oct 2026 12:38:24 +0330https://virgool.ir/@m_41254455/طراحی-فقط-برای-کاربر-نهایی-اشتباه-بزرگیه-k7xekj3aw3lkبنرتا مدت‌ها تصور من از «طراحی تجربه کاربری» (UX)، محدود به همان چیزی بود که کاربر نهایی با آن تعامل دارد؛ یعنی اپلیکیشن‌ها و وب‌سایت‌هایی که در گوشی یا لپ‌تاپ‌مان می‌بینیم. اما یکی از پروژه‌های اخیرم، دیدگاه من را نسبت به دیزاین زیر و رو کرد: طراحی پنل ادمین (Admin Panel).تا پیش از آن، هیچ تجربه‌ای در طراحی محیط‌های بک‌افیس (Back-office) نداشتم. مجبور شدم از صفر شروع کنم و بفهمم بک‌افیس اصلاً چیست و چرا نبض یک کسب‌وکار دیجیتال در دستان آن می‌تپد.دو دنیای متفاوت در یک محصولخیلی زود متوجه شدم هر محصول دیجیتال، در واقع از دو لایه اصلی تشکیل شده است: فرانت‌افیس (Front-office) و بک‌افیس (Back-office).فرانت‌افیس؛ ویترین احساسی: همان بخشی است که کاربر نهایی با آن روبروست. فضایی که باید ساده، زیبا، انسانی و لذت‌بخش باشد.بک‌افیس؛ موتور محرک: دنیای پشت‌صحنه است؛ جایی که اپراتورها، مدیران سیستم و تیم‌های پشتیبانی، ابزارهایی برای کنترل، مدیریت و گزارش‌گیری در اختیار دارند. اینجا خبری از افکت‌های رنگارنگ نیست؛ طراحی باید «وظیفه‌محور»، «دقیق» و «امن» باشد.یک مثال ملموس؛ از نوبت‌دهی تا مدیریت داده‌هاتصور کنید با یک اپلیکیشن پزشکی روبرو هستیم:در فرانت‌افیس، کاربر نهایی نوبت رزرو می‌کند، پروفایل پزشک را می‌بیند و پرداخت انجام می‌دهد. طراحی اینجا باید بر «اعتمادسازی» و «سهولت» تمرکز داشته باشد.اما در بک‌افیس، تیم پشتیبانی در حال مدیریت پروفایل پزشک‌ها، بررسی مدارک پزشکی، رصدِ تراکنش‌های مالی و خروجی گرفتن از گزارش‌های آماری است. اینجا اولویت با «سرعت در انجام کار» و «کاهش خطای انسانی» است.تفاوت‌های بنیادی؛ فراتر از رنگ و لعابدر نگاه سیستمی، تفاوت این دو دنیا عمیق‌تر از رابط کاربری است:۱. ذهنیت کاربر: در فرانت‌افیس، مخاطب دنبال تجربه‌ای بدون اصطکاک و خوشایند است. اما در بک‌افیس، کاربر حرفه‌ای است که می‌خواهد وظایفش را سریع، دقیق و بدون خطا به پایان برساند.۲. جریان کاری (Workflow): تعاملات فرانت‌افیس اغلب احساسی و اکتشافی است. اما در بک‌افیس، تصمیم‌ها باید تکرارپذیر و بهره‌ور باشند.۳. امنیت و حساسیت: فرانت‌افیس معمولاً با داده‌های محدودِ یک شخص سر و کار دارد. اما در بک‌افیس، مدیر سیستم با کل دیتابیس در ارتباط است؛ پس حساسیت امنیتی و حقوقی به‌مراتب بالاتر است.۴. مدیریت خطا: در فرانت‌افیس طراحی باید «خطاپذیر» باشد (چون کاربر عمومی ممکن است اشتباه کند). در بک‌افیس، طراحی باید «Audit-friendly» (قابل ردگیری) باشد؛ چرا که هر کلیک می‌تواند اثرات سیستمی و حقوقیِ ماندگار داشته باشد.جمع‌بندی: فراتر از یک طراح خوش‌سلیقهپروژه‌ی پنل ادمین برای من یک نقطه عطف بود؛ لحظه‌ای که فهمیدم اگر بخواهم یک «طراح سیستم» باشم، نه فقط یک «طراحِ خوش‌سلیقه»، باید هم با دنیای کاربر نهایی مأنوس باشم و هم پیچیدگی‌های پشت‌صحنه را درک کنم.طراحی بک‌افیس دنیایی است که چیزهای زیادی برای یاد گرفتن دارد؛ از چالش‌های طراحی جدول‌های پیچیده و فرم‌های داده‌محور گرفته تا شناخت دقیقِ نیازهای عملیاتی.پیشنهاد من به شما: اگر تا امروز در فضای بک‌افیس و پنل‌های ادمین کار نکردید، حتماً خودتان را به این چالش پرتاب کنید! اینجاست که معنای واقعی «حل مسئله» در دیزاین را لمس می‌کنید.Hediye fazeliHediye fazeliFri, 22 May 2026 16:20:54 +0330