طراحی گرافیک

معرفی و بررسی اصول طراحی مسطح

معرفی و بررسی اصول طراحی مسطح

Flat Design (طراحی مسطح) چیست؟

همان‌طور که از اصطلاح «فلت دیزاین» یا «طراحی مسطح» و یا «طراحی تخت» مشخص است، در این نوع رویکرد عناصر قرار گرفته روی GUI (رابط گرافیکی کاربری) کاملاً مسطح و تخت هستند به طوری که از سایه، گرادیانت، تکسچر و … برای ایجاد نمایی سه‌بُعدی به هیچ وجه استفاده نمی‌شود. با اتخاذ چنین رویکردی، طرح نهایی فقط دو بُعد خواهد داشت: طول و عرض. برخی افراد طراحی مسطح را «طراحی ساده» نیز می‌نامند که شاید بتوان گفت این نامگذاری صحیح نیست! طراحی مسطح در عین سادگی، می‌تواند کاملاً پیچیده هم باشد. به عبارت دیگر، صرفاً به این خاطر که ظاهر وب‌سایت‌ها و اپلیکیشن‌های موبایل با استفاده از رویکرد طراحی مسطح ساخته شده، نمی‌توان گفت که ساده هستند. در واقع، از آنجا که در پس تک‌تک عناصر قرار گرفته در طراحی مسطح هدف و منظوری قرار دارد، می‌توان گفت که طراحی مسطح به همان اندازه که دیگر رویکردهای طراحی پیچیده هستند، از پیچیدگی‌های خاص خود برخورار است.

تاریخچه طراحی مسطح:

از طراحی مسطح مدت ها قبل از اینکه تبدیل به یک روند اصلی در دنیای طراحی بشه، استفاده می شد. تاریخچه طراحی مسطح به دهه هشتاد بر می گرده. توی این دهه، تکنولوژی هنوز اونقدری پیشرفت نکرده بود که بشه افکت ها، بافت ها و شکل های پیچیده ای طراحی کرد. با این وجود حتی توی اون سال ها هم طراحی مسطح تونست ویژگی های سکیومورفیزم رو ساده تر کنه و نمای واقعی تری به زندگی بده.

همون طور که الان می بینیم، بعد از اینکه مایکروسافت محصولات خودش رو به صورت Metro منتشر کرد، محبوبیت طراحی مسطح هم افزایش پیدا کرد. Metro یک زبان طراحی UI هست که توسط مایکروسافت تهیه شده و روی سادگی، تمیزی و مدرن بودن تاکید داره.

در سال ۲۰۱۰، مایکروسافت، Windows Phone 7 رو بیرون داد که در اون از طراحی مسطح UI با گرافیک مرتب استفاده میشه. این ویژگی از محصولات قدیمی تر مایکروسافت (Zune) اقتباس شده. بعدها به خاطر موفقیت این محصول، ویندوز ۸ OS با همون طراحی مسطح سبک Metro، منتشر شد.

10 نکته برای طراحی مسطح گرافیکی

در نهایت، در سال ۲۰۱۳ که کمپانی Apple، ios7 رو بیرون داد، طراحی مسطح به اوج محبوبیت رسید. چون توی این محصول طراحی جدیدی ارائه شد و این کمپانی تمام عناصر UI قبلی رو از جمله آیکن ها و فونت ها رو تغییر داد.

کمی بعد از اون، گوگل هم ظاهر صفحات وب و اپلیکیشن ها رو به صورت طراحی مسطح یا فلت در آورد و اسم اون رو Material Design گذاشت. گوگل بخش گسترده ای رو به Meterial Design اختصاص داده و هدفش اینه که آیکن ها، Layout و غیره رو به این صورت طراحی کنه.

از اون زمان به بعد، طراحی مسطح به مسیر اصلی برای طراحی تبدیل شده و ظاهر وب سایت ها، اپلیکیشن ها و سایر عناصر طراحی شده رو مرتب و تمیز کرده.

ویژگی های طراحی مسطح:

» طراحی ساده
» استفاده از رنگ
» استفاده نشدن از افکت های گوناگون
» به کارگیری اصول مینیمالیستی ( ساده گرایی)
» تمرکز بر روی تایپوگرافی (استفاده از فونت مناسب، در این طراحی » استفاده از فونت های فانتزی اشتباه است)

مزایای طراحی فلت/مسطح :

» سرعت بالا
» کاهش صفحات
» پردازش سریع
» درک راحت تر مطالب

پیشنهاد مطالعه: اصول طراحی کاتالوگ

نکات مهم در طراحی فلت:

طراحی فلت یکی از سبک های جدید و شناخته شده در طراحی سایت هست، توی این سبک طراحی بیشتر از قبل به کارآیی و کارآمدی سایت اهمیت میدیم تا کاربران به راحتی به چیزهایی که توی سایت میخوان دسترسی داشته باشن، یکی از مواردی که در طراحی سایت بهش اهمیت زیادی داده میشه بحث UX هست که جز جدانشدنی از طراحی فلت هم به حساب میاد! طراحی فلت یکی از سبک های طراحی فول CSS در طراحی سایت به حساب میاد که در عین سادگی بسیار شیک و حرفه ای به حساب میاد.

» سادگی

در طراحی فلت دیگه مثل طراحی های سنتی سایه‌های مختلف، طیف های رنگی پیچیده، تکسچرها و پترنها استفاده نمی‌شه و به جای اون طراح های ساده و دارای ساختار تمیز و مرتب با فضای خالی زیاد ترجیح داده میشه توی این روش رنگها ساده اصطلاحا solid هستند و تمام المان ها دوبعدی می باشند و گوشه ها همگی تیز هستند و تمام دکمه ها و المنت ها بدون سایه و طیف رنگی طراحی میشوند.

» کاربرد

این سبک طراحی فقط محدود به طراحی وب سایت نیست بلکه امروزه این نوع طراحی رو توی رابط کاربری تمام اپلیکیشن های به روز موبایل هم میبینیم، در واقع در حال حاضر این برای طراحان وب سایت و طراحان اپلیکیشن جا افتاده که به جای طرح های زرق و برق دار و شلوغ که پر از المنت های مختلف هستند به سمت طراحی های ساده و در عین حال کاربردی برن!
اولین بار مایکروسافت در طراحی ویندوز ۸ و رابط کاربری مترو این نوع طراحی رو استفاده کرد و بعد از اون گوگل هم در محصولات و سرویس‌های خود از فلت دیزاین استفاده کرد. اگر چه قبلا هم نوعی طراحی فلت وجود داشته اما مایکروسافت نقش پر رنگی در جا انداختن و ارائه یک تعریف جدید در قالب یک نمونه‌ی عملی از طراحی تخت داره و در واقع این نوع طراحی به مایکروسافت بدهکاره!

» رنگ بندی

همونطور که گفتم در طراحی فلت از هیچ گونه آیتم سه بعدی استفاده نمی شه و تمامی عناصر صفحه باید به صورت تخت و دوبعدی طراحی بشه. یکی دیگر از علل محبوبیت طراحی فلت (Flat Design) رنگ بندی بسیار زیبای اون هستش. چون معمولا در طراحی فلت از رنگ های شاد و سبک برای حرفه ای نشان دادن طراحی قالب استفاده می شه در واقع در این نوع طراحی قوانینی وجود داره که شما برای اینکه بتونید اسم طراحی خودتون رو فلت (Flat) بذارید باید از این قوانین پیروی کنید.

» طراحی زنده و جذاب

طراحی فلت باید زنده و جذاب باشه و در عین حال ساده، نه خیلی پیچیده و حرفه ای این نوع طراحی اونقدر محبوب هست که سایت هایی برای تولید المنت های مختلف اون به وجود آمده، مثلا سایت Flatuicolors که آیکون های بسیار زیادی رو که اکثر هم رایگان هستند در طراحی سایت در اختیار شما میزاره، در اینجا توجه شما رو به یک سری از این آیکون ها جلب میکنم:

طراحی زنده و جذاب

قبلا ما در طراحی سایت ها برای دسترسی به آیکون های و المنت های مختلف سراغ سایت هایی مثل Iconfinder میرفتیم و از این نوع آیکون ها و المنت ها در طراحی سایت هامون استفاده میکردیم.

آیکون های مورد استفاده در فلت

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *