طبقه بندی: فناوری وب و پورتال
چچ
فلت وب دیزاین : انقلابی در طراحی وب

فلت وب دیزاین : انقلابی در طراحی وب

1392/02/09

سبک و استایل طراحی وب در سال 2013 خیلی اساسی تغییر کرد. در این نوشته به صورت خلاصه به بررسی این تغییر و سبک جدید می‌پردازیم .

از آنجا که ما طی اجرای پروژه های پورتال درگیر پروسه طراحی وب‌سایت و پورتال های مختلف هستیم بهتر است این سبک‌های جدید را بشناسیم و یا الگوهای آن را حداقل در توسعه‌ی Front-End سرویس‌ها در پورتال سامان رعایت کنیم. از طرفی این نیاز جدی و عمیق وجود دارد که ما به عنوان یک توسعه‌دهنده حرفه‌ای وب با این مفاهیم حداقل آشنا باشیم و بتوانیم راجع به آنها فکر کنیم و نظر بدهیم .

مدتی است که در طراحی‌های مدرن و جدید از تکنیک "طراحی تخت " یا Flat Design استفاده می‌شود و در حال حاظر به علاقه‌ی اکثر طراحان وب و گرافیست‌ها تبدیل شده است .

در طراحی تخت به مانند طراحی سنتی دیگر از سایه‌های مخلتف ، گرادینت‌ها ، آنیمیشن‌ها ، تکسچرها و پترنها استفاده نمی‌شود. این نوع طراحی clean ، ساده و دارای یک ساختار تمیز و مرتب است ، فضای خالی زیاد دارد ، رنگ‌ها روشن، ساده و یکپارچه هستند ، همه‌ی المان‌ها 2 بعدی می‌باشند ، گوشه‌ها شارپ هستند ، روی تایپوگرافی نوشته‌ها کار شده است و دکمه‌ها و المان‌ها یک دست بدون سایه و برآمدگی هستند.

اما Flat Design از کجا آمد ؟

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

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

هیجان انگیزه نیست ؟ همه چیز سادست ،‌ قشنگی در سادگیست . من لذت میبرم مثلا http://www.windowsphone.com/en-us


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

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

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

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

اما فلت دیزاین چه متود‌هایی در پیاده‌سازی دارد :

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

توجه به تایپوگرافی
این کلمات هستند که وظیفه رساندن پیام به کاربر را دارند و کاربر با کمک همین کلمات و لینک‌ها در سایت جابجا می‌شود و به صفحات دیگر می‌رود . برای ایجاد یک تایپوگرافی جذاب و زیبا برای متون سایت باید از فونت‌ها و سایز مناسب استفاده کرد . در یک پست دیگر راجع به تایپوگرافی فارسی صحبت خواهیم کرد .

رابط کاربری و المان‌های ساده
دکمه‌ها نباید پیچیده باشند . هرچقدر که المان‌ها ساده و شفاف‌تر باشند کارکرد آنها مشخص‌تر می‌شود و مؤثرتر خواهند بود .

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

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

اجازه انتشار: قید نشده
نوع: تالیف