Flat UI Design

Пласки́й диза́йн або пло́ский диза́йн (англ. flat design) — мінімалістичний підхід до дизайну форм, який підкреслює пласкість форм — відсутність традиційних градієнтів та відтінків, характерних тривимірним формам, відсутність спроб передачі тривимірності форм, цілеспрямоване нехтування об'ємом. Глибина чи пошаровість користувацького інтерфейсу можуть передаватись незначними тінями, які відкидає на фон одночасно вся площина. Часто використовує пастельний набір кольорів та обмежену палітру. У мережі став популярним у період 2013—2016 років, прийшовши на зміну дизайну із заокругленими випуклими скляними інтерфейсами та провокований виходом тогочасними «законодавцями» інтерфейсів — Windows 8, Apple's iOS 7 та концепуальним оформленням продуктів Google у стилі Material design.^[1][2]

Визначення та мета

Насиченість тексту і розмір шрифту визначають як естетику, так і легкість використання плаского інтерфейсу. Плаский дизайн — це дизайн, який відкидає стилістичні рішення, що створюють ілюзію трьох вимірів (наприклад, тіні, градієнти, текстури та інші інструменти, які додають глибину) і орієнтований на мінімалістичне використання простих елементів, типографії й кольору.^[3] Дизайнери надають перевагу пласкому дизайнові, бо він робить інтерфейс більш раціональним та ефективним. Легше швидко передати інформацію, яка має привабливий і доступний вигляд.^[4] Крім того, це полегшує проєктування інтерфейсу, який реагує на зміни в розмірах браузера на різних пристроях. З мінімальними елементами дизайну вебсайти можуть завантажуватися швидше й легко змінювати свій розмір, маючи однаково гарний вигляд і на великих моніторах з високою роздільною здатністю, і на мобільних пристроях з малою діагоналлю екрана. У проєктному підході він часто протиставляється скевоморфізмові та так званому «багатому дизайнові».

У 1980-х роках комп'ютерні інтерфейси були невідомі більшості користувачів. Використання елементів сквеморфізму (таких як значки, що мали вигляд листків паперу) допомогли створити візуальний зв'язок між знайомим предметом (листком паперу) і цифровим об'єктом (файлом). Проте тепер людям, які ростуть разом з цифровими пристроями, такий зв'язок більше не потрібен, тому дехто сумнівається в доцільності скевоморфізму.^[5]

Історія використання

Плаский дизайн бере своє натхнення в основному в трьох стилях мистецтва: Міжнародними типографічним стилем (також відомий як Swiss Style), мінімалізмі та стилях, що походять із Bauhaus.^[6][7][8] Міжнародний типографічний стиль має найбільш істотний вплив на плаский дизайн, його виникнення та популяризацію в 1950-х і 1960-х роках і розглядається як відправна точка плаского дизайну, хоча до поширення стилю в цифровому світі залишались десятки років.^[9]

2006 року Microsoft випустила Zune MP3-плеєр, який містив елементи плаского дизайну. Дизайн Zune був чистим і простим з акцентом на розкішну типографію нижнього регістру, логотипи в стилі силуетів і однобарвні фони.^[10] Microsoft продовжила цей стиль дизайну 2010 року з випуском Windows Phone 7, яка побудована на пласких елементах дизайну, які були запроваджені в Zune.^[11] В дизайні домінують великі і яскраві форми, що супроводжуються шрифтами без зарубок (англ. sans-serif) і пласкими зображеннями. Дуже чистий зовнішній вигляд підкреслювало те, що меню з'являлося в сіткоподібному шаблоні. Через успіх, яким користувався Windows Phone 7, Microsoft випустила свою останню операційну систему, Windows 8, з інтерфейсом Metro, що мав такий самий плаский дизайн елементів. Знову ж таки, в дизайні домінують сіткуватий вигляд, гострі краї, яскраві кольори, та підбір охайних шрифтів. Microsoft відтоді переробила свої поточні продукти на мову дизайну Metro, в тому числі Xbox 360, Microsoft Office, і сам сайт Microsoft.^[12]

2013 року Apple випустила операційну систему IOS 7, яка використовує пласкі елементи дизайну, відходячи від скевоморфічного дизайну, використовуваного раніше.^[13][14][15] Наступного року OS X Yosemite представила користувацький інтерфейс у стилі iOS 7 для операційної системи Mac OS X від Apple.^[16] Google почав впроваджувати власну мову плоского дизайну, відому як «Material Design» для Android (починаючи з Android Lollipop) та інших своїх платформ, яка базується на аркушах, схожих на картотеку, та використанні тіней для сприяння глибині та ієрархії, а також плавній анімації та переходах.^{[17][18][19][20]}

2017 року Microsoft представила Fluent Design System, новий плоский користувацький інтерфейс. Цей новий інтерфейс відрізняється від свого попередника, Metro,^[21] завдяки використанню глибини, зворотньому зв'язку інтерфейсу та новому ефекту напівпрозорості, який отримав назву «Акрил».

Майбутнє плаского дизайну

Деякі дизайнери^[які?] вважають, що плаский дизайн є примхою, яка з часом мине. На їхню думку, відсутність тіней заважає зрозуміти, чи є кнопка клікабельною. Плаский дизайн хвалять за його пристосовність до різних цілей. Проста стилізація дозволяє цьому дизайну мати добрий вигляд у різних додатках та на різних розмірах екранів. Деякі дизайнери вважають, що розвиток плаского дизайну переросте в поєднання скевоморфізму і пласкої конструкції. Адаптивність пласкої конструкції створить простоту для користувачів і дизайнерів, в той час як найдрібніші деталі скевоморфізму дозволять приділяти більше уваги конкретним особливостям. Група Nielsen провела дослідження у 2017 році, яке показало, що використання інтерфейсів з пласким дизайном в середньому на 22 % повільніше.^[22]

Див. також

• Fluent Design System
• Material design

Примітки

Тематичні сайти Quora · Zhihu Нормативний контроль Freebase: /m/0zgbd_v