قواعد طراحی Flat

Flat Design یا طراحی تخت، چند سالی است در بین طراحان به یک قاعده یا اصل محبوب و مرسوم تبدیل شده است. در این مقاله قصد داریم تا شما را با قواعد طراحی فلت آشنا کنیم. اما قبل از آن بیاید ببینیم طراحی فلت چیست؟

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

یک طراحی فلت همیشه خالی از افکت ها و جلوه ها نیست اما در آن ویژگی های «هوشمندانه» مانند عمق و بُعد وجود ندارد.

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

۱. هیچ افکتی در کار نیست

طراحی فلت اسم خود را از گوشه ها می گیرد. در طراحی فلت تنها از استایل ساده دو بعدی استفاده می شود. 

این مفهوم خود به خود موضوعاتی مانند -سایه افتادن، کج بودن از داخل، گرادینت و عناصر سه بعدی سازی- را رد می کند. 

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

خب طراحی فلت برای چه استفاده می شود؟ طراحی فلت بدون داشتن هیچگونه المنت اضافی قصد دارد تا احساس و دید مشخصی را به کاربر بدهد. از طراحی فلت زمانی استفاده می شود که طراح بخواهد، کاربر مورد نظر با سرعت بیشتری یک موضوع را درک کند و با آن تعامل برقرار نماید. در حالی که وبسایت های زیادی از این طراحی استفاده می کنند اما محبوبیت این طراحی بیشتر در اپلیکیشن های موبایل خود را نشان داده است. دلیل این محبوبیت نیز خیلی ساده است. میزان فضای اشغال شده طراحی فلت در اندازه‌های کوچک صفحات موبایل و تبلت بسیار کمتر از طراحی های معمولی و سه بعدی است. همین قابلیت باعث می شود که استفاده از این اپلیکیشن ها ساده تر و لذت بخش تر شود.

عناصر ساده

در طراحی فلت، از اجزای ساده‌ای مانند دکمه ها و آیکون‌ها برای رابط کاربری استفاده می شود. طراح معمولا در این گونه طراحی ها از شکل های ساده ‌ای مانند مربع، دایره و مستطیل استفاده می کند. هر کدام از عناصر استفاده شده در رابط کاربری باید به سادگی قابلیت کلیک یا لمس را داشته باشند. تعامل برقرار کردن کاربر با این المنت ها باید هر چقدر که می شود ساده‌تر باشد، به صورتی که کاربر برای ارتباط برقرار کردن با آنها درگیر هیچ مشکل و مسئله‌ای نشود. در طراحی المان های یک صفحه باید از رنگ های جذابی استفاده شود. این کار کاربر را به کلیک کردن تشویق می کند. 

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

تمرکز روی تایپوگرافی

به دلیل ضرورت وجود سادگی در طراحی فلت، تایپوگرافی نیز از اهمیت کاملی برخوردار است. 

وضعیت سبک حروف در وبسایت باید به گونه‌ای تعریف شود که با تمام وبسایت همخوانی و سازگاری داشته باشد. تزئین بیش از اندازه متون در وبسایت می تواند نقطه مقابل طراحی فلت باشد. در قرار دادن متن ها باید از حالت های مختلف «Bold، Light و ...» استفاده کنید. اینگونه می شود روی خوانایی متون تاثیر مثبتی گذاشت.

از برچسب های مناسب برای دکمه ها و فرم ها استفاده کنید. به یاد داشته باشید که در یک طراحی موثر و مفید باید تلاش زیادی برای برقراری ارتباط بین کاربر و وبسایت کنید.

تمرکز روی رنگ

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

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

در طراحی فلت باید در نظر بگیرید که طرح شما باید دارای یک رنگ اصلی و چند رنگ فرعی باشد. در نهایت باید از رنگ اصلی بیشترین استفاده را در طرح‌تان بکنید.

رویکرد مینیمالیست

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

«تقریبا» مبتنی بر طراحی فلت

طراحی هایی وجود دارند که طراحان معتقدند این طراحی ها تقریبا فلت هستند، نه کاملا.

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

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

در آينده سعی می شود که مقالات بیشتری با محوریت اینگونه از طراحی داخل وبسایت قرار بگیرد.

منبع