Fluent Design System: زبان طراحی اختصاصی مایکروسافت

آیا تاکنون اصطلاح Fluent Design System به گوشتان خورده و آیا می‌دانید که این اصطلاح به چه معنا است و هدف شرکت مایکروسافت از ارائه این سیستم طراحی چه بوده است؟ پاسخ به این سؤالات و بسیاری موارد دیگر چیزی است که در این مقاله قصد داریم مورد بررسی قرار دهیم.

برای پاسخ به تمام سؤالات مطرح شده در بالا اجازه دهید کمی به عقب بازگردیم، زمانی که شرکت مایکروسافت در روز دوم کنفرانس Building 2017 خود از پروژهٔ Neon، که اکنون این پروژه Fluent Design System نامیده می‌شود، رونمایی کرد که معنای تحت‌اللفظی این اصطلاح «سیستم طراحی روان» است. در واقع، قرار است که با استفاده از این سیستم، شکل و شمایل تمام اپلیکیشن‌های ویندوز یکپارچه شود و این در حالی است که این سیستم بر پایهٔ یکسری اصول استوار شده است که عبارتند از:

- نور
- عمق
- حرکت (موشن)
- متریال
- و مقیاس

که در ادامه کارکرد تک‌تک این‌ها را در سیستم Fluent Design مایکروسافت برایتان توضیح می‌دهیم، اما پیش از آن قصد داریم کمی به تاریخچه و کاربرد فلونت دیزاین سیستم بپردازیم؛ سیستمی که دنبالهٔ جریانی است که امروزه در طراحی رابط کاربری ویندوز 10 می‌بینیم که تحت‌عنوان MDL2 شناخته می‌شود (لازم به ذکر است که Fluent Design System نسبت به زبان طراحی Metro، برای شرکت مایکروسافت موفقیتی بزرگ محسوب می‌شود.)

Fluent Design System چیست؟
Fluent Design System باعث به‌ وجود آمدن تغییراتی آرام در فلسفه و نحوهٔ طراحی در شرکت مایکروسافت شده است و اگر تصور می‌کنید که این سیستم طراحی فقط قرار است ویندوز 10 را دستخوش تغییر سازد، اشتباه می‌کنید چرا که این سیستم طراحی علاوه بر ویندوز، اپ‌های آی‌او‌اس و اندروید، قرار است که ظاهر اپلیکیشن‌های سازگار با ابزارهای همچون HoloLens را هم تحت‌تأثیر خود قرار دهد. حال در ادامه پنج اصلی را توضیح می‌دهیم که این سیستم بر پایهٔ آن‌ها استوار است که عبارتند از:

نور (Light)
با استفاده از این اِلِمان، نحوهٔ تعامل کاربران با میزان روشنی و وضوح برنامه‌ها مشخص شده و همچنین نشان داده می‌شود که نور (میزان روشنایی) چگونه کمک می‌کند تا حواس کاربران پرت نشود.

عمق (Depth)
عمق به ظاهر برنامه‌ها جلوه‌های مختلفی می‌بخشد و باعث بهره‌مندی طراح از امکان لایه‌بندی رابط کاربری می‌شود به طوری که عمق رابطهٔ بین اجزای را مشخص می‌کند.

حرکت (Motion)
می‌توان از این اِلِمان برای نشان دادن ارتباط، اتصال و بافت موجود میان اجزا استفاده کرد.

ماده (Material)
با استفاده از متریال می‌توان بافت یک اِلِمان را کنترل کرده و هنگامی که این جزء با سایر اجزا در تماس قرار گرفت، بسته به نیاز خود آن را دستخوش تغییر ساخت.

مقیاس (Scale)
مقیاس این امکان را برای اجزای رابط کاربری فراهم می‌آورد تا فراتر از دو بُعد رفته و خود را با اندازه‌ٔ اسکرین‌های مختلف هماهنگ کنند.

برخی از اجزای Fluent Design System در سیستم‌های طراحی گوگل موسوم به Material Design و Metro Ul هم دیده شده است که برای آشنایی بیشتر با این مفاهیم، می‌توانید به مقالات مرتبط زیر مراجعه نمایید:

- آشنایی با مفهوم متریال دیزاین گوگل
- Material Design Lite: ابزار عرضه شده توسط گوگل برای طراحی سایت
- آشنایی با برخی کامپوننت‌های متریال دیزاین گوگل برای طراحی اپ‌های کاربردی‌تر
- Resizer: ابزار طراحی گوگل برای وب دیزاینرها

حال نوبت به نظرات شما می‌رسد؟ نظرتان راجع به این سیستم طراحی جدید مایکروسافت چیست؟ نظرات و دیدگاه‌های خود را با سایر کاربران سکان آکادمی به اشتراک بگذارید.