ساعدنیوز
ساعدنیوز

نحوه طراحی فلت با کورل

  چهارشنبه، 23 مهر 1399   زمان مطالعه 8 دقیقه
نحوه طراحی فلت با کورل
در دنیای امروزی سبک جدیدی از طراحی به وجود آمده است به نام فلت یا فلت دیزاین که این نوع طراحی در محیط های وب، بیشترین کاربرد را دارد و بعد از این که مایکروسافت، ویندوز 8 را ارائه و از این نوع طراحی در برنامه نویسی این ویندوز استفاده کرد. در این مطلب نحوه طراحی فلت با کورل را آموزش خواهیم داد.

طراحی فلت چیست؟

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

تاریخچه ای کوتاه از طراحی فلت

طراحی فلت از مدت ها قبل از اینکه به شکل امروزی استفاده شود در جوامع استفاده می شده است. طراحی فلت که ما الان میبینیم محبوبیت خود را بعد از اینکه مایکروسافت از آن استفاده کرد به دست آورد. که نام آن را سبک طراحی مترو Metro نامید. Metro یک زبان طراحی UI است که توسط مایکروسافت ساخته شد و همه چیز در آن به صورت ساده، روشن و مدرن است. در سال 2010 مایکروسافت ویندوز فون 7 را منتشر کرد، که از طراحی فلت با لبه های تیز و گرافیک واضح و روشن بهره میبرد. بعد از آن مایکروسافت با توجه به موفقیتش در طراحی ویندوز فون، ویندوز 8 را برای پی سی منتشر کرد که پایه و اساس طراحی آن از طراحی Metro بود که بالاتر در مورد آن توضیح دادیم.

تصویر
طراحی مترو مایکروسافت
در نهایت طراحی فلت در سال 2013 وقتی اپل iOS 7 را معرفی کرد و تمام آیکون ها و فونت های قبلی خود را به طراحی فلت تغییر داده بود وارد مرحله ی جدیدی شد.

تصویر

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

به طور خلاصه سه نمونه از سبک طراحی فلت وجود دارد:

  • طراحی مترو مایکروسافت (Metro Design)
  • طراحی iOS 7 اپل
  • طراحی متریال گوگل
  • ویژگی های مهم طراحی تخت (Flat Design)

سادگی

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

تصویر

زیبایی

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

تصویر

رنگ ها

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

تصویر

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

سایه ی بلند

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

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

فونت ها

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

نکات مثبت و منفی در طراحی فلت

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

نکات مثبت

سادگی

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

شفافیت

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

نکات منفی

مشکل انعطاف پذیری

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

مشکل تایپوگرافی (چیدمان حروف)

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

محدودیت

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

آینده طراحی فلت (طراحی تخت)

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

تصویر

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

چگونه طراحی فلت را شروع کنیم

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

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

دیدگاه ها
  دیدگاه ها
پربحث های هفته   
تصویری بسیار قدیمی از 17 سالگی آیت الله خامنه ای رهبر انقلاب/ساده زیستی رهبر از ابتدای زندگی (417 نظر) میز عزای ساده و بدون تجملات مادر محسن کیایی، مجری برنامه صداتو +عکس/ روحشون شاد چه چهره دلنشینی داشتن (171 نظر) بهترین گردو ایران متعلق به کدام شهر است (152 نظر) (عکس) دمپایی‌های لاکچری بچه‌های دهه شصت / هر کی از اینا برای بچش می‌خرید خیلی لاکچری بود ... (145 نظر) تصویری از خانه ابدی همسر جوان فریبا نادری/ روحش شاد و یادش گرامی (50 نظر) شبی که محمود احمدی نژاد مهمانِ خانه ابدی مادرش شد و در آن خوابید+عکس/روحش شاد و یادش گرامی... (45 نظر) (عکس) زیبایی بی حد و اندازه روژان سریال نون خ در عکسی که هدیه بازوند در اینستاگرامش منتشر کرد / مهیار حق داره این قدر عاشقش باشه ... (40 نظر) حضور چهره های فوتبالی در بیمارستان و روحیه دهی به علی دایی در عیادت از اسطوره فوتبال+ عکس/ مهدی رحمتی، عادل فردوسی‌ پور، کارلوس کی‌روش و ... (42 نظر) رونمایی از نوزاد خوشگل و بامزه ریما رامین فر، همای پایتخت+عکس / عاشقانه های ریما و امیر جعفری ارزش صد بار دیدن رو داره👌 (33 نظر) برنامه عالی صداوسیما که توسط رهبر معظم انقلاب تحسین شد/ خیلی اوقات دلم نمی‌آید که برخیزم و بروم+عکس (30 نظر) خلاقیت خنده دار و هوشمندانه قصاب اهوازی برای فریب گوسفند و قربانی کردنش حماسه آفرید+عکس/ مغز تو رو باید طلا گرفت😂 (29 نظر) میز عزای شیک پسر نسرین مقانلو با گل آرایی منحصر به فرد و شمع و تسبیح/ حیف جوونیش+عکس (29 نظر) علی دایی: دکترها گفته بودند شاید زیر عمل زنده نمانم+عکس/ همیشه عضو خانواده پرسپولیس هستم/ همه درآمدم را در ایران سرمایه‌گذاری کردم (28 نظر) شعرخوانی زیبا و دلنشین رهبر معظم انقلاب/ سرشارم از جوانی، هرچند پیر دهرم...+ویدیو (23 نظر) نگاهی به گل آرایی فوق زیبا و شیک مراسم ترحیم رضا داوودنژاد/ واقعا حیف جوونیش+عکس (21 نظر)
دیگران می‌خوانند   
فال شمع روزانه امروز یکشنبه 9 اردیبهشت 1403 فال روزانه امروز یکشنبه 9 اردیبهشت ماه 1403 عجیب‌ترین بخشش در خوزستان: مقتول دستور بخشش قاتلش را داد خواهرکشی ناموسی در مشهد/ قتل زن 23 ساله به دست برادر 17 ساله سورپرایز تولد خاص علی دایی برای یک دوست و طرفدار/ چه کیک خرسی بامزه و قشنگی+عکس خواستگاری باحال مهران مدیری از نعیمه نظام دوست 20 ساله/ این سکانس عالیه+ویدیو اتمام حجت خلاقانه صاحب بوتیک تهرانی با خریداران درباره تعویض و پس دادن لباس +عکس/ مشخصه یا بیشتر توضیح بده😂 عجیب و غریب‌ترین مهریه‌های تاریخ ایران که باور نمی‌کنید/ از بال مگس و 1000 سفر پیاده به کربلا تا.... کاظم نوربخش، سلمان نون خ: توی مراسم ختم به من میگن بخند! فال ابجد روزانه یکشنبه 9 اردیبهشت 1403 فال قهوه با نشان روز یکشنبه 9 اردیبهشت ماه 1403 کوچکترین و منحصربفردترین کتابفروشی تهران که در دیوار جا خوش کرده+عکس فال حافظ با تفسیر روز یکشنبه 9 اردیبهشت 1403 + فیلم خلاقیت خنده دار اُوستا معمار در طراحی در و پله برای ورودی/دکترا افتخاری حق توئه هم وطن+ عکس زیبایی و جذابیت منحصربفرد ندا قاسمی، شیرین سریال نون خ/برق نگاهش هوش از سر آدم می پراند+عکس رونمایی مژده لواسانی از کیف زیبا و شیکش به رنگ کرمی/ در عین سادگی خیلی خاصه+عکس نگاهی به عکس های خصوصی شاهان شکیبا مجری خوش بر و روی تی وی پلاس/ ماشالا چه چشمای خوشگلی بیوگرافی و زندگی خصوصی مصطفی و مجتبی بلال حبشی، رحمان و رحیم سریال پایتخت+ تصاویر جذاب و دیدنی صدای بهشتی پسر شرکت کننده با خوانندگی آهنگ چشمای تو در برنامه صداتو +ویدئو/هنوزم چشمای تو مثل شبای پر ستارست... وقتی ستاره سادات قطبی کمبود نداشتن دختر رو با عروسک جبران میکنه+ویدیو/ ولی بهش میاد مامان دختر باشه نه 4 تا پسر خلاقیت منحصر به فرد یک مشتری در مدل موی درخواستی از آرایشگر حماسه آفرید +عکس/سلطان شینیون در سطح خاورمیانه😂 خلاقیت تحسین برانگیز شهرداری تبریز برای زیباسازی شهر حماسه آفرید/ این تصویر زیبا رو فقط تو ایران میشه دید+عکس مهران مدیری: گربه‌ام را هم به هنرمندان نمی‌دهم چه برسد به دخترم! +ویدئو اقدام تحسین برانگیز صاحب نیسان تبریزی در حمل بار با ماشینش+ویدیو/ سخاوت به جیب نیست به دله👌 نگاهی به خانه پدری استاد شهریار در روستای خشکناب شهرستان بستان آباد/ شعرهای مشهور استاد برای این روستاست +عکس حضور چهره های فوتبالی برای عرض تسلیت به عابدزاده در مراسم ختم پدرش+عکس/از علی دایی و کریم باقری تا علی پروین و مهدی و رحمتی تصویری از رژه گشت کمیته در دهه شصت+ تاریخچه گشت ارشاد از اول انقلاب تاکنون خلاقیت خنده دار و حواس پرت کن فردی در رانندگی با ماشینی عجیب که سر و تهش برعکس شده+ویدیو/لامصب این معلوم نیست که داره میره یا میاد😂😂 بهترین سایت خرید پیج اینستاگرام در ایران کدام است؟ برای موفق شدن درترید باید این موارد را رعایت کنیم استوری عاشقانه هادی چوپان برای ته تغاری خونه اش/ چقدرم شعرش زیباست+عکس خلاقیت و شگرد هوشمندانه محمود احمدی نژاد برای دست ندادن با زنان+عکس 9 اردیبهشت 1357 در ایران چه خبر بود؟ قیمت هر متر مربع تخته سه لایه به چه عواملی بستگی دارد؟ پیشتازی در قشم در گردشگری روستایی؛ با رزرو تور قشم از این 7 روستا دیدن کنید رونمایی از چهره واقعی و جذاب امین میری، زهرمار خان سریال گیلدخت/ در خیابان اصلاً قابل شناسایی نیست+عکس (عکس) ست جالب و بهاری کت و دامن زرد به سبک مریم اوزرلی / چه خوب ست کرده به رنگ پوستشم میاد (تصاویر) چیدمان شیک و باسلیقه ی گوشه ای از اتاق خواب نرگس محمدی، بازیگر نقش "ستایش" و عروس حشمت فردوس (تصاویر) عجیبت ترین زن جهان با دو لگن و چهار پا که 5 فرزند بدنیا آورد/ نمونه نادری از یک انسان با دو بدن (فیلم) به دام انداختن الکتریسیته داخل شیشه و خلق اثر هنری خارق العاده / لحظه ای هیجان انگیز ولی مرگبار
تیتر امروز   
فال شمع روزانه امروز یکشنبه 9 اردیبهشت 1403 فال روزانه امروز یکشنبه 9 اردیبهشت ماه 1403 عجیب‌ترین بخشش در خوزستان: مقتول دستور بخشش قاتلش را داد خواهرکشی ناموسی در مشهد/ قتل زن 23 ساله به دست برادر 17 ساله عجیب و غریب‌ترین مهریه‌های تاریخ ایران که باور نمی‌کنید/ از بال مگس و 1000 سفر پیاده به کربلا تا.... فال ابجد روزانه یکشنبه 9 اردیبهشت 1403 فال قهوه با نشان روز یکشنبه 9 اردیبهشت ماه 1403 کوچکترین و منحصربفردترین کتابفروشی تهران که در دیوار جا خوش کرده+عکس فال حافظ با تفسیر روز یکشنبه 9 اردیبهشت 1403 + فیلم بیوگرافی و زندگی خصوصی مصطفی و مجتبی بلال حبشی، رحمان و رحیم سریال پایتخت+ تصاویر جذاب و دیدنی 9 اردیبهشت 1357 در ایران چه خبر بود؟ دردسرهای چغاله خوردن زیاد معشوقه سوئدی محمدرضا شاه در ایران! استایل اسپرت آیت الله هاشمی رفسنجانی در ژاپن که هرگز ندیده اید+عکس برگزاری مجدد آزمون سراسری در خراسان جنوبی دفترچه سوالات گروه علوم تجربی نوبت اول کنکور 1403 منتشر شد
منتخب روز   
نگاهی به خانه پدری استاد شهریار در روستای خشکناب شهرستان بستان آباد/ شعرهای مشهور استاد برای این روستاست +عکس عکس عروسی امیر جعفری و ریما رامین‌فر، همای سریال پایتخت فیک و تقلبی از آب درآمد / هوش مصنوعی داره وارد مراحل ترسناکی میشه! (عکس) تیپ و استایل فوق‌العاده شیک و لاکچری یاورِ سریال فاصله‌ها بعد از 14 سال در عربستان سعودی / ببینیدش نمی تونید بشناسید! فروش ویلای روف گاردن دار و استخر دار حسن جوهرچی، فرهاد سریال فاصله‌ها توسط دخترش در شمال ! / در منطقه‌ای تهرانی نشین!!! سلفی دونفره نعیمه نظام دوست با سلطان کمدی ایران که یکسال حق نداشت منتشرش کنه! / چه ست آدیداسی پوشیده مهران مدیری ... سلفی آسانسوری علیرضا نیکبخت با همسر دومش که بیشتر از جانش او را دوست دارد / کراش دهه هشتاد فوتبال ایران حالا مرد زندگی شده ... (عکس) تعجب کاربران خارجی فضای مجازی از حجاب کامل همسر ستاره لیورپول / دنیا با حجاب جای زیباتری نیست؟ (عکس) بیتابی همسر و فرزندان شهرام عبدلی، بازیگر نقش مهران در سریال فاصله‌ها، بر سر پیکر بی جان او / تو کاری با دلم کردی که فکرشم نمی کردم ... (عکس) همبازی بودن آقای بیاتی، خواستگار فهیمه در پایتخت 5 با بازیگر معروف در فیلم نوستالژیک دهه شصتی / روحش شاد ... ویدئویی باورنکردنی از مرد سومالیایی که با نصف مغزش زندگی می کند/ بیچاره چه بلایی سرش اومده