Пласки́й диза́йн або пло́ский диза́йн (англ. flat design) — мінімалістичний підхід до дизайну форм, який підкреслює пласкість форм — відсутність традиційних градієнтів та відтінків, характерних тривимірним формам, відсутність спроб передачі тривимірності форм, цілеспрямоване нехтування об'ємом. Глибина чи пошаровість користувацького інтерфейсу можуть передаватись незначними тінями, які відкидає на фон одночасно вся площина. Часто використовує пастельний набір кольорів та обмежену палітру. У мережі став популярним у період 2013—2016 років, прийшовши на зміну дизайну із заокругленими випуклими скляними інтерфейсами та провокований виходом тогочасними «законодавцями» інтерфейсів — Windows 8, та концепуальним оформленням продуктів Google у стилі Material design.
Визначення та мета
Насиченість тексту і розмір шрифту визначають як естетику, так і легкість використання плаского інтерфейсу. Плаский дизайн — це дизайн, який відкидає стилістичні рішення, що створюють ілюзію трьох вимірів (наприклад, тіні, градієнти, текстури та інші інструменти, які додають глибину) і орієнтований на мінімалістичне використання простих елементів, типографії й кольору. Дизайнери надають перевагу пласкому дизайнові, бо він робить інтерфейс більш раціональним та ефективним. Легше швидко передати інформацію, яка має привабливий і доступний вигляд. Крім того, це полегшує проєктування інтерфейсу, який реагує на зміни в розмірах браузера на різних пристроях. З мінімальними елементами дизайну вебсайти можуть завантажуватися швидше й легко змінювати свій розмір, маючи однаково гарний вигляд і на великих моніторах з високою роздільною здатністю, і на мобільних пристроях з малою діагоналлю екрана. У проєктному підході він часто протиставляється скевоморфізмові та так званому «багатому дизайнові».
У 1980-х роках комп'ютерні інтерфейси були невідомі більшості користувачів. Використання елементів сквеморфізму (таких як значки, що мали вигляд листків паперу) допомогли створити візуальний зв'язок між знайомим предметом (листком паперу) і цифровим об'єктом (файлом). Проте тепер людям, які ростуть разом з цифровими пристроями, такий зв'язок більше не потрібен, тому дехто сумнівається в доцільності скевоморфізму.
Історія використання
Плаский дизайн бере своє натхнення в основному в трьох стилях мистецтва: Міжнародними типографічним стилем (також відомий як Swiss Style), мінімалізмі та стилях, що походять із Bauhaus. Міжнародний типографічний стиль має найбільш істотний вплив на плаский дизайн, його виникнення та популяризацію в 1950-х і 1960-х роках і розглядається як відправна точка плаского дизайну, хоча до поширення стилю в цифровому світі залишались десятки років.
2006 року Microsoft випустила Zune MP3-плеєр, який містив елементи плаского дизайну. Дизайн Zune був чистим і простим з акцентом на розкішну типографію нижнього регістру, логотипи в стилі силуетів і однобарвні фони. Microsoft продовжила цей стиль дизайну 2010 року з випуском Windows Phone 7, яка побудована на пласких елементах дизайну, які були запроваджені в Zune. В дизайні домінують великі і яскраві форми, що супроводжуються шрифтами без зарубок (англ. sans-serif) і пласкими зображеннями. Дуже чистий зовнішній вигляд підкреслювало те, що меню з'являлося в сіткоподібному шаблоні. Через успіх, яким користувався Windows Phone 7, Microsoft випустила свою останню операційну систему, Windows 8, з інтерфейсом Metro, що мав такий самий плаский дизайн елементів. Знову ж таки, в дизайні домінують сіткуватий вигляд, гострі краї, яскраві кольори, та підбір охайних шрифтів. Microsoft відтоді переробила свої поточні продукти на мову дизайну Metro, в тому числі Xbox 360, Microsoft Office, і сам сайт Microsoft.
2013 року Apple випустила операційну систему IOS 7, яка використовує пласкі елементи дизайну, відходячи від скевоморфічного дизайну, використовуваного раніше. Наступного року OS X Yosemite представила користувацький інтерфейс у стилі iOS 7 для операційної системи Mac OS X від Apple. Google почав впроваджувати власну мову плоского дизайну, відому як «Material Design» для Android (починаючи з Android Lollipop) та інших своїх платформ, яка базується на аркушах, схожих на картотеку, та використанні тіней для сприяння глибині та ієрархії, а також плавній анімації та переходах.
2017 року Microsoft представила Fluent Design System, новий плоский користувацький інтерфейс. Цей новий інтерфейс відрізняється від свого попередника, Metro, завдяки використанню глибини, зворотньому зв'язку інтерфейсу та новому ефекту напівпрозорості, який отримав назву «Акрил».
Майбутнє плаского дизайну
Деякі дизайнери[] вважають, що плаский дизайн є примхою, яка з часом мине. На їхню думку, відсутність тіней заважає зрозуміти, чи є кнопка клікабельною. Плаский дизайн хвалять за його пристосовність до різних цілей. Проста стилізація дозволяє цьому дизайну мати добрий вигляд у різних додатках та на різних розмірах екранів. Деякі дизайнери вважають, що розвиток плаского дизайну переросте в поєднання скевоморфізму і пласкої конструкції. Адаптивність пласкої конструкції створить простоту для користувачів і дизайнерів, в той час як найдрібніші деталі скевоморфізму дозволять приділяти більше уваги конкретним особливостям. Група Nielsen провела дослідження у 2017 році, яке показало, що використання інтерфейсів з пласким дизайном в середньому на 22 % повільніше.
Див. також
Примітки
- . interaction-design.org (англ.). Архів оригіналу за 19 січня 2021. Процитовано 15 грудня 2020.
- Lindsay Kramer. . Архів оригіналу за 19 листопада 2020. Процитовано 15 грудня 2020.
- Carrie Cousins (28 травня 2013). Flat design principles. designmodo.com.
- Clum, Luke (13 травня 2013). A Look at Flat Design and Why It's Significant. UX Magazine. Процитовано 11 квітня 2014.
- Yair Grinberg (11 вересня 2013). iOS 7, Windows 8, and flat design: In defense of skeuomorphism. VentureBeat. Процитовано 13 квітня 2014.
- Turner, Amber Leigh (19 березня 2014). The history of flat design: How efficiency and minimalism turned the digital world flat. The Next Web. Процитовано 11 квітня 2014.
- Diogo Terror (17 липня 2009). Lessons From Swiss Style Graphic Design. Smashing. Процитовано 28 березня 2014.
- A brief history of flat design. Tech Samurais. 31 липня 2013.
- Taimur Asghar (9 липня 2014). The True History of Flat Design. Web Design Ai.
- Taimur Asghar (9 липня 2014). The True History of Flat Design. Web Design Ai.
- Turner, Amber Leigh (19 березня 2014). The history of flat design: How efficiency and minimalism turned the digital world flat. The Next Web. Процитовано 11 квітня 2014.
- . The Verge. Vox Media. Архів оригіналу за 12 лютого 2012. Процитовано 28 листопада 2011.
- Seifert, Dan (10 червня 2013). Apple announces iOS 7, 'biggest change' since the introduction of the iPhone, coming this fall. The Verge (англ.). Процитовано 6 квітня 2020.
- Pavlus, John (10 червня 2013). Why Jony Ive Is Flattening iOS 7. Fast Company (амер.). Процитовано 6 квітня 2020.
- Souppouris, Aaron (11 червня 2013). Tracing iOS 7's influences: Apple remixes almost everyone in the industry. The Verge (англ.). Процитовано 6 квітня 2020.
- Hutchinson, Lee (2 червня 2014). OS X Yosemite unveiled at WWDC, features big UI overhaul. Ars Technica (en-us) . Процитовано 12 жовтня 2022.
- Google's new 'Material Design' UI coming to Android, Chrome OS and the web. Engadget (амер.). Процитовано 12 жовтня 2022.
- Chester, Brandon. Google Reveals Details About Android L at Google IO. www.anandtech.com. Процитовано 12 жовтня 2022.
- Co.Design. Fast Company (амер.). Процитовано 12 жовтня 2022.
- Savov, Vlad (25 червня 2014). Google's next big Android redesign is coming in the fall. The Verge (амер.). Процитовано 12 жовтня 2022.
- published, Zac Bowden (19 травня 2017). Microsoft shows off 'Z-depth layering' 3D feature in its Fluent Design System. Windows Central (англ.). Процитовано 12 жовтня 2022.
- Flat UI Elements Attract Less Attention and Cause Uncertainty. www.nngroup.com. Процитовано 8 травня 2018.
Вікіпедія, Українська, Україна, книга, книги, бібліотека, стаття, читати, завантажити, безкоштовно, безкоштовно завантажити, mp3, відео, mp4, 3gp, jpg, jpeg, gif, png, малюнок, музика, пісня, фільм, книга, гра, ігри, мобільний, телефон, android, ios, apple, мобільний телефон, samsung, iphone, xiomi, xiaomi, redmi, honor, oppo, nokia, sonya, mi, ПК, web, Інтернет
Plaski j diza jn abo plo skij diza jn angl flat design minimalistichnij pidhid do dizajnu form yakij pidkreslyuye plaskist form vidsutnist tradicijnih gradiyentiv ta vidtinkiv harakternih trivimirnim formam vidsutnist sprob peredachi trivimirnosti form cilespryamovane nehtuvannya ob yemom Glibina chi posharovist koristuvackogo interfejsu mozhut peredavatis neznachnimi tinyami yaki vidkidaye na fon odnochasno vsya ploshina Chasto vikoristovuye pastelnij nabir koloriv ta obmezhenu palitru U merezhi stav populyarnim u period 2013 2016 rokiv prijshovshi na zminu dizajnu iz zaokruglenimi vipuklimi sklyanimi interfejsami ta provokovanij vihodom togochasnimi zakonodavcyami interfejsiv Windows 8 ta koncepualnim oformlennyam produktiv Google u stili Material design Zrazok plaskogo dizajnuViznachennya ta metaNasichenist tekstu i rozmir shriftu viznachayut yak estetiku tak i legkist vikoristannya plaskogo interfejsu Plaskij dizajn ce dizajn yakij vidkidaye stilistichni rishennya sho stvoryuyut ilyuziyu troh vimiriv napriklad tini gradiyenti teksturi ta inshi instrumenti yaki dodayut glibinu i oriyentovanij na minimalistichne vikoristannya prostih elementiv tipografiyi j koloru Dizajneri nadayut perevagu plaskomu dizajnovi bo vin robit interfejs bilsh racionalnim ta efektivnim Legshe shvidko peredati informaciyu yaka maye privablivij i dostupnij viglyad Krim togo ce polegshuye proyektuvannya interfejsu yakij reaguye na zmini v rozmirah brauzera na riznih pristroyah Z minimalnimi elementami dizajnu vebsajti mozhut zavantazhuvatisya shvidshe j legko zminyuvati svij rozmir mayuchi odnakovo garnij viglyad i na velikih monitorah z visokoyu rozdilnoyu zdatnistyu i na mobilnih pristroyah z maloyu diagonallyu ekrana U proyektnomu pidhodi vin chasto protistavlyayetsya skevomorfizmovi ta tak zvanomu bagatomu dizajnovi U 1980 h rokah komp yuterni interfejsi buli nevidomi bilshosti koristuvachiv Vikoristannya elementiv skvemorfizmu takih yak znachki sho mali viglyad listkiv paperu dopomogli stvoriti vizualnij zv yazok mizh znajomim predmetom listkom paperu i cifrovim ob yektom fajlom Prote teper lyudyam yaki rostut razom z cifrovimi pristroyami takij zv yazok bilshe ne potriben tomu dehto sumnivayetsya v docilnosti skevomorfizmu Istoriya vikoristannyaPlaskij dizajn bere svoye nathnennya v osnovnomu v troh stilyah mistectva Mizhnarodnimi tipografichnim stilem takozh vidomij yak Swiss Style minimalizmi ta stilyah sho pohodyat iz Bauhaus Mizhnarodnij tipografichnij stil maye najbilsh istotnij vpliv na plaskij dizajn jogo viniknennya ta populyarizaciyu v 1950 h i 1960 h rokah i rozglyadayetsya yak vidpravna tochka plaskogo dizajnu hocha do poshirennya stilyu v cifrovomu sviti zalishalis desyatki rokiv 2006 roku Microsoft vipustila Zune MP3 pleyer yakij mistiv elementi plaskogo dizajnu Dizajn Zune buv chistim i prostim z akcentom na rozkishnu tipografiyu nizhnogo registru logotipi v stili siluetiv i odnobarvni foni Microsoft prodovzhila cej stil dizajnu 2010 roku z vipuskom Windows Phone 7 yaka pobudovana na plaskih elementah dizajnu yaki buli zaprovadzheni v Zune V dizajni dominuyut veliki i yaskravi formi sho suprovodzhuyutsya shriftami bez zarubok angl sans serif i plaskimi zobrazhennyami Duzhe chistij zovnishnij viglyad pidkreslyuvalo te sho menyu z yavlyalosya v sitkopodibnomu shabloni Cherez uspih yakim koristuvavsya Windows Phone 7 Microsoft vipustila svoyu ostannyu operacijnu sistemu Windows 8 z interfejsom Metro sho mav takij samij plaskij dizajn elementiv Znovu zh taki v dizajni dominuyut sitkuvatij viglyad gostri krayi yaskravi kolori ta pidbir ohajnih shriftiv Microsoft vidtodi pererobila svoyi potochni produkti na movu dizajnu Metro v tomu chisli Xbox 360 Microsoft Office i sam sajt Microsoft 2013 roku Apple vipustila operacijnu sistemu IOS 7 yaka vikoristovuye plaski elementi dizajnu vidhodyachi vid skevomorfichnogo dizajnu vikoristovuvanogo ranishe Nastupnogo roku OS X Yosemite predstavila koristuvackij interfejs u stili iOS 7 dlya operacijnoyi sistemi Mac OS X vid Apple Google pochav vprovadzhuvati vlasnu movu ploskogo dizajnu vidomu yak Material Design dlya Android pochinayuchi z Android Lollipop ta inshih svoyih platform yaka bazuyetsya na arkushah shozhih na kartoteku ta vikoristanni tinej dlya spriyannya glibini ta iyerarhiyi a takozh plavnij animaciyi ta perehodah 2017 roku Microsoft predstavila Fluent Design System novij ploskij koristuvackij interfejs Cej novij interfejs vidriznyayetsya vid svogo poperednika Metro zavdyaki vikoristannyu glibini zvorotnomu zv yazku interfejsu ta novomu efektu napivprozorosti yakij otrimav nazvu Akril Majbutnye plaskogo dizajnuDeyaki dizajneri yaki vvazhayut sho plaskij dizajn ye primhoyu yaka z chasom mine Na yihnyu dumku vidsutnist tinej zavazhaye zrozumiti chi ye knopka klikabelnoyu Plaskij dizajn hvalyat za jogo pristosovnist do riznih cilej Prosta stilizaciya dozvolyaye comu dizajnu mati dobrij viglyad u riznih dodatkah ta na riznih rozmirah ekraniv Deyaki dizajneri vvazhayut sho rozvitok plaskogo dizajnu pereroste v poyednannya skevomorfizmu i plaskoyi konstrukciyi Adaptivnist plaskoyi konstrukciyi stvorit prostotu dlya koristuvachiv i dizajneriv v toj chas yak najdribnishi detali skevomorfizmu dozvolyat pridilyati bilshe uvagi konkretnim osoblivostyam Grupa Nielsen provela doslidzhennya u 2017 roci yake pokazalo sho vikoristannya interfejsiv z plaskim dizajnom v serednomu na 22 povilnishe Div takozhFluent Design System Material designPrimitki interaction design org angl Arhiv originalu za 19 sichnya 2021 Procitovano 15 grudnya 2020 Lindsay Kramer Arhiv originalu za 19 listopada 2020 Procitovano 15 grudnya 2020 Carrie Cousins 28 travnya 2013 Flat design principles designmodo com Clum Luke 13 travnya 2013 A Look at Flat Design and Why It s Significant UX Magazine Procitovano 11 kvitnya 2014 Yair Grinberg 11 veresnya 2013 iOS 7 Windows 8 and flat design In defense of skeuomorphism VentureBeat Procitovano 13 kvitnya 2014 Turner Amber Leigh 19 bereznya 2014 The history of flat design How efficiency and minimalism turned the digital world flat The Next Web Procitovano 11 kvitnya 2014 Diogo Terror 17 lipnya 2009 Lessons From Swiss Style Graphic Design Smashing Procitovano 28 bereznya 2014 A brief history of flat design Tech Samurais 31 lipnya 2013 Taimur Asghar 9 lipnya 2014 The True History of Flat Design Web Design Ai Taimur Asghar 9 lipnya 2014 The True History of Flat Design Web Design Ai Turner Amber Leigh 19 bereznya 2014 The history of flat design How efficiency and minimalism turned the digital world flat The Next Web Procitovano 11 kvitnya 2014 The Verge Vox Media Arhiv originalu za 12 lyutogo 2012 Procitovano 28 listopada 2011 Seifert Dan 10 chervnya 2013 Apple announces iOS 7 biggest change since the introduction of the iPhone coming this fall The Verge angl Procitovano 6 kvitnya 2020 Pavlus John 10 chervnya 2013 Why Jony Ive Is Flattening iOS 7 Fast Company amer Procitovano 6 kvitnya 2020 Souppouris Aaron 11 chervnya 2013 Tracing iOS 7 s influences Apple remixes almost everyone in the industry The Verge angl Procitovano 6 kvitnya 2020 Hutchinson Lee 2 chervnya 2014 OS X Yosemite unveiled at WWDC features big UI overhaul Ars Technica en us Procitovano 12 zhovtnya 2022 Google s new Material Design UI coming to Android Chrome OS and the web Engadget amer Procitovano 12 zhovtnya 2022 Chester Brandon Google Reveals Details About Android L at Google IO www anandtech com Procitovano 12 zhovtnya 2022 Co Design Fast Company amer Procitovano 12 zhovtnya 2022 Savov Vlad 25 chervnya 2014 Google s next big Android redesign is coming in the fall The Verge amer Procitovano 12 zhovtnya 2022 published Zac Bowden 19 travnya 2017 Microsoft shows off Z depth layering 3D feature in its Fluent Design System Windows Central angl Procitovano 12 zhovtnya 2022 Flat UI Elements Attract Less Attention and Cause Uncertainty www nngroup com Procitovano 8 travnya 2018