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

مقدمه ای بر طراحی تخت

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

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

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

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

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

نه تنها نوع، بلکه رنگ نیز جزء ضروری طراحی تخت است. اکثریت قریب به اتفاق پالت ها بر اساس 2-3 رنگ هستند، اگرچه، البته، استثناهایی نیز وجود دارد. معمولا رنگ های شاداب و روشن، اما خالص انتخاب می شوند. همانطور که اشاره شد، هیچ شیب یا انتقال غیر ضروری وجود ندارد.

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

صاف یا تقریبا صاف؟ به دنبال مصالحه!

در پایان، مایلم به این نکته اشاره کنم که امروزه بین طراحی مسطح و غیر مسطح هم افزایی وجود دارد. ما در مورد طراحی "تقریبا مسطح" صحبت می کنیم. این رایج ترین کاربرد مفهوم توصیف شده است، زمانی که طراحان در کنار عناصر ساده و مختصر و فضای دو بعدی، از 1-2 ترفند برای عمق و پرسپکتیو استفاده می کنند.

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

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

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

کمی تاریخ

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

اسکئومورفیسم

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

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

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

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

طراحی مسطح

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

اول، طراحی مسطح زمان بارگذاری صفحه را به میزان قابل توجهی کاهش می دهد. فقدان جزئیات اسکئومورفیک «سنگین» (فقط تصور کنید: لایه‌ها، سری‌ها، گرادیان‌ها) عناصر طراحی مسطح را «سبک‌تر» می‌کند، که به نوبه خود زمان بارگذاری را به میزان قابل توجهی افزایش می‌دهد. علاوه بر این، عناصر تخت در صفحه نمایش به همان اندازه جذاب به نظر می رسند کیفیت بالا، و کم است.

ثانیاً تصاویر سادهمی تواند ایده شما را سریعتر از تصاویر دقیق به کاربران منتقل کند: آنها طرحی هستند و بنابراین درک آنها بسیار آسان است.

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

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

نتایج تست کاربردپذیری ویندوز 8 که توسط گروه NN انجام شد، نشان داد که کاربران در تشخیص اشیاء قابل کلیک از موارد غیرقابل کلیک مشکل دارند. کاربران شکایت کرده اند که اشیایی که ثابت به نظر می رسند در واقع قابل کلیک هستند. در نتیجه، ماموریت اصلی شرکت - کمک به کاربران برای تفسیر صحیح سیستم - شکست خورد.

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

طراحی مواد

بیایید در حال حاضر واضح بگوییم: طراحی متریال بیشتر یک محصول مارکدار است تا یک روند طراحی خود به خودی که مقبولیت گسترده ای پیدا کرده است. این چیزی است که اساساً آن را از طراحی تخت متمایز می کند.

منظور من از نامیدن طراحی متریال "امضا" این است که مجموعه ای کامل از توصیه ها و اصول به وضوح تعریف شده دارد که هر طراح محترمی از آنها پیروی می کند. کاملاً واضح است که چرا Google Material Design خود را معرفی کرد: نیاز به یکپارچه سازی طراحی وجود داشت تا برنامه ها در هر یک از بسیاری از دستگاه های اندرویدی یکسان به نظر برسند.

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

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

مزایا و معایب طراحی تخت

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

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

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

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

خلاصه کنید

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

در حقیقت، طراحی تخت در سال های اخیر بسیار تکامل یافته است، از یک سبک کاملاً "مسطح" به یک سبک "نیمه تخت". اکنون امکان استفاده از لایه‌ها و سایه‌های ظریف را فراهم می‌کند تا اشیا را عمیق‌تر از آنچه قبلاً به نظر می‌رسید نشان دهد. بنابراین، ما از معاصران طراحی تخت 2.0 خوشحالیم.

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

اگر اشتباه تایپی پیدا کردید - آن را برجسته کنید و Ctrl + Enter را فشار دهید! برای ارتباط با ما می توانید از .

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

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

همه چیز با اسکئومورفیسم شروع شد

برای کسانی که نمی دانند، اسکومورفیسم یک کلمه کثیف نیست، بلکه سبک دیگری از طراحی وب است. طراحی مسطح اغلب به عنوان نقطه مقابل اسکئومورفیسم ارائه می شود که به نظر من کاملاً صحیح نیست. این بیشتر ساده‌سازی است تا تضاد.

تا سال 2010، اسکئومورفیسم سبک غالب در طراحی رابط بود. او عناصر را همانطور که در واقعیت به نظر می رسید به نمایش می گذاشت و به طور فعال از بافت ها، سایه ها، بازتاب ها و سایر ویژگی های یک تصویر سه بعدی استفاده می کرد. من در این زمینه بسیار تلاش کرده ام. شرکت اپل، که با دقت بیشتر اشیاء نرم افزار را از اشیاء واقعی کپی می کرد.

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

"بهترین طراحی، طراحی کمتر از حد ممکن است"

چگونه دیتر رامز به آب نگاه کرد - یک طراح صنعتی مشهور که مخالف طراحی مزاحم، جلوه های انیمیشن و غیره است. در ژوئن 2013، Apple Inc. iOS 7 انقلابی را معرفی کرد که تمام ویژگی ها را در سبک طراحی وب تخت دریافت کرد. با این حال ، هواپیما بلافاصله واقع گرایی و حجم را "شکست" نداد.

کاربران برای مدت طولانی نتوانستند جادوی استیو جابز و نمادهای "که می خواهید لیس بزنید" را فراموش کنند. حتی بسیاری با «هفت بدبخت» خداحافظی کردند و به «اندروید تابناک» روی آوردند. سوخت به آتش و تعداد زیادی باگ که در iOS 7 وجود داشت، و یک طراحی سفید و شفاف با اختلاف منظر و انیمیشن به شکل "snot" در هنگام باز کردن برنامه ها اضافه شد.

کسانی که خود را به واقعیت اجتناب ناپذیر تسلیم کردند و با سیستم عامل "سیب" ماندند، در نهایت متوجه شدند که طراحی وب تخت نه تنها جالب به نظر می رسد، بلکه نظم و یک سبک بصری واحد را برای همه برنامه ها به ارمغان می آورد.

مزایا و معایب طراحی تخت

مزایای استفاده از این سبک عبارتند از:

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

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

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

طراحی وب تخت دارای معایبی نیز می باشد:

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

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

عدم وجود قوانین ثابت مشخص

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

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

گرایش های مدرنو رویکردهای توسعه وب

الگوریتم رشد سریع را از ابتدا در ساخت وب سایت بیاموزید

بدون شیب، آیکون های سه بعدی، انتقال متحرک یا جلوه های ویژه دیگر. همه اینها سایت شما را سنگین و شلوغ می کند - آیا به آن نیاز دارید؟

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

از یک پالت رنگ روشن و آبدار استفاده کنید. اکنون روند رنگ‌های طیف خورشیدی است: زرد روشن، صورتی و سبز. نکته اصلی این است که زیاده روی نکنید - نباید بیش از 3 رنگ در صفحه وجود داشته باشد.

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

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

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

بنابراین، در طول سال‌ها، وب‌سایت‌های طراحی مسطح به استانداردی تبدیل شده‌اند که مطلقاً همه آن را پذیرفته‌اند. به اکثر سایت های مدرن نگاه کنید - آنها "تا استخوان" صاف هستند.

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

1. سایت http://dunked.com.

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

2. رابط مایکروسافت.

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

این رابط که مترو نام داشت، بعداً به آن مهاجرت کرد کامپیوترهای شخصی(ویندوز 8)، رابط Xbox 360 و موارد دیگر محصولات نرم افزاریمایکروسافت.

3. وب سایت http://www.vox.com.

خوب، آیا شما الهام گرفته اید؟ مرگ بر زیبایی شناسی سه بعدی شبه واقع گرایانه!

همین. مشترک شوید، مقالات ما را با دوستان خود به اشتراک بگذارید در شبکه های اجتماعی. تبدیل بالا برای شما!

روندها و رویکردهای مدرن در توسعه وب

الگوریتم رشد سریع را از ابتدا در ساخت وب سایت بیاموزید

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

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

میتونی پیدا کنی نمونه های خوبطراحی تخت در http://market.envato.com/. طرح‌بندی‌ها، آیکون‌ها و قالب‌های زیادی وجود دارد که به شما یک ایده واضح از ظاهر طراحی مدرن می‌دهد. .

1. طراحی تخت چیست؟

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

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

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

2. کمی تاریخ

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

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

در سال 2010 مایکروسافت منتشر کرد تلفن ویندوز 7 که از طراحی مسطح با لبه های تیز و گرافیک ساده به ارث رسیده از یکی از محصولات اولیه استفاده می کرد.مایکروسافت (Zune). بعداً با الهام از موفقیت، مایکروسافت منتشر کرد سیستم عاملویندوز 8 بر اساس همان سبک مسطح مترو.

به هر حال، طراحی تخت در سال 2013 با عرضه اپل به اوج خود رسید iOS 7 به طور اساسی نشان می دهد طراحی جدیدبا عناصر رابط کاربری کاملاً بازطراحی شده، از جمله آیکون ها و فونت ها. اپل ایجاد کرد اصول بصری UI و طراحی آیکون .

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

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

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

طراحی مترو مایکروسافت

طراحی اپل iOS 7

طراحی متریال گوگل

3. نظافت را به خاطر بسپارید

ظاهراً به دلیل فقدان عناصر سه بعدی و جلوه های واقع گرایانه مانند گرادیان ها، بافت ها، هایلایت ها، رنگ های میانی، سایه ها، طراحی مسطح «مسطح» نامیده می شود. به یاد داشته باشید، سبک مسطح یک روش دو بعدی (مسطح) برای به تصویر کشیدن اشیا است.

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

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

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

4. عالی

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

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

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

روزی روزگاری، Adobe Illustrator برنامه مناسبی برای ایجاد گرافیک پیکسلی کامل نبود. خبر خوب این است که آخرین نسخه هاایلوستریتور به ابزاری عالی برای ایجاد گرافیک خوب تبدیل شده است.

باید اینو بگم گرافیک برداریعمدتاً شامل کار با اشکال ساده و مسطح، رنگ‌های یکدست و شبکه‌ها می‌شود. Adobe Illustrator بسیار انعطاف‌پذیر است و به شما امکان می‌دهد شبکه را با نیازهای خود تطبیق دهید، اشیاء را تراز کنید و استفاده کنید. انواع متفاوتچفت شدن این باعث می‌شود طراحی کاملی ایجاد کنید که در هر صفحه نمایشی تمیز و شیک به نظر برسد. اگر می خواهید یاد بگیرید که چگونه گرافیک عالی ایجاد کنید، پس باید مقاله را بخوانید: چگونه با استفاده از Adobe Illustrator اثر هنری کامل پیکسلی ایجاد کنیم .

5. رنگ

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

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

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

برخی از آنها برای انواع طرح ها و تصویرسازی ها مناسب هستند، نه فقط طرح های تخت. به عنوان مثال، Adobe Color CC که بیشتر به عنوان Cooler شناخته می شود. امروزه دسترسی به آن هم از طریق وب سایت و هم مستقیماً از طریق محصولات Adobe وجود دارد. خنک کننده ابزار بسیار انعطاف پذیری است که به شما امکان می دهد پالت رنگ خود را ایجاد کنید یا از بین پالت های سفارشی از کتابخانه انتخاب کنید.

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

چندین سرویس مشابه دیگر با پالت های سفارشی وجود دارد که می تواند مفید باشد. با این حال، یک ابزار به طور خاص برای طراحی تخت ساخته شده است. FlatUIColors.com توسط Designmodo یک سرویس با مجموعه ای از رنگ های "مسطح" است که کار با آن بسیار راحت است. این سایت در بین طراحانی که به دنبال انتخاب رنگ مناسب برای طرح های عالی هستند بسیار محبوب شده است. آن را امتحان کنید!

و شما می توانید تنوع رنگ ها و پالت های بیشتری را در آن پیدا کنید راهنمای طراحی متریال گوگل.

6. سایه های بلند

همانطور که در بالا ذکر شد، طراحی مسطح با سادگی، فضای خالی زیاد مشخص می شود - به همین دلیل است که فلت استفاده از هر گونه افکت را رد می کند. با این حال، یک اثر وجود دارد که مخصوص طراحی تخت است. این اثر تبدیل به یک روند و ویژگی مشخصهتخت.

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

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

7. کار با فونت

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

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

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

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

8. مزایا و معایب طراحی تخت

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

طرفداران

محبوبیت

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

سادگی

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

روشنایی

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

ایرادات

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

عدم پاسخگویی

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

مشکلات تایپوگرافی

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

بصری ضعیف

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

9. روندهای آینده طراحی تخت

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

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

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

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

نتیجه گیری

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

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

بالاخره چه چیز دیگری در مورد طراحی تخت باید ذکر شود؟

اگر واقعاً تخت را با لبه‌های تیز، رنگ‌های شاداب و فونت‌های واضح، تمیزی و مینیمالیسم آن دوست دارید، آن را دنبال کنید!

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

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

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

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

برای اولین بار، مردم شروع به صحبت در مورد طراحی تخت در سال 2012-2013 کردند، زمانی که این سبک برای اولین بار ظاهر شد. این روند بسیار قابل توجه بود و سر و صدای زیادی به پا کرد، زیرا یکی از اولین کسانی که شروع به توسعه این جهت کرد مایکروسافت بود. انتشار ویندوز 8 با یک رابط جدید برای همیشه طراحی را تغییر داد و تا حد زیادی بردار توسعه وب، حداقل جزء بصری آن را از پیش تعیین کرد.

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

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

این کاملا ممکن است که یکی از غالب برای چند سالهای اخیرگرایش به سمت ساده سازی شدید با چیز دیگری جایگزین خواهد شد. برخی از پیش نیازها برای این وجود دارد - به عنوان مثال، جهت طراحی مواد، که توسط طراحان شرکت گوگل ایجاد شده است.

سازگار با طراحی تطبیقی

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

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

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

یکی از مزایای اصلی طراحی تخت، مقیاس پذیری آن است. عناصر مسطح بدون توجه به اندازه خوب به نظر می رسند و کار کردن با آنها بسیار ساده تر از طرح های پیکسلی عالی است.

پلتفرم انعطاف پذیر

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

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

تایپوگرافی قابل خواندن

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

طراحی مسطح تمایل زیادی به استفاده گسترده از sans-serif دارد، با این حال، این akisome نیست و سری‌ها نیز می‌توانند هنگام جفت شدن با عناصر تخت خوب به نظر برسند. اگر تایپوگرافی وحدت ترکیبی را نقض نکند، فونت های Serif به عنوان یک عنوان کاملاً مناسب هستند و می توانند در متن بدنه نیز استفاده شوند.

منفی ها

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

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

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

از دست دادن فردیت

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

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

گاهی مضحک می شود. با نگاه کردن به این تصاویر، ممکن است فکر کنید که ما بخش های مختلفی از یک برنامه داریم. اما نه، طراحان مارکو لامانتیا و سیمون لیپولیس به طور مستقل کار کردند. اشکال هندسی پایه و فونت سفید sans-serif به عنوان عناصر اصلی طراحی استفاده می شود - راه حل بیش از حد منطقی است. اما نتیجه اسفناک است - همان طرح رنگی طراحی را کاملاً از منحصر به فرد محروم کرد. و از این قبیل موارد زیاد است.

تعقیب مد

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

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

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

انتخاب فونت ضعیف

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

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

FLAT 2.0

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

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

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

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

نتیجه

امروزه Flat 2.0 در مراحل ابتدایی خود قرار دارد، اما جهتی که این سبک در آن توسعه خواهد یافت کاملاً قابل تشخیص است. تغییرات قابل توجهی انتظار نمی رود - پیشروان گوگل، اپل و مایکروسافت قرار نیست این آپارتمان را رها کنند. اگر تغییراتی وجود داشته باشد، آنها جزئی خواهند بود - رویکردهای جدیدی ظاهر می شود، کسی با یک "تراشه" جالب می آید، تلاش ها برای استفاده از بهترین شکل ظاهری ادامه می یابد. اما در یک مفهوم جهانی، نباید انتظار چیز جدیدی را داشت - طراحی مسطح یک روند طولانی مدت است و تنها سبکی که به بهترین وجه با فناوری‌های جدیدی که هنوز وجود ندارند، می‌تواند آن را از موقعیت‌های برنده خود تغییر دهد.