Flat design (Flat design)

Перейти к навигации Перейти к поиску
Меню «Пуск» ОС Windows 8.1 (Упрощённый вид)

Плоский дизайн (англ. flat design) — дизайн интерфейсов программ и операционных систем, представленный как противоположность реализму. По задумке, «плоский дизайн» должен подчёркивать эффект «очаровательной простоты» и утончённости[1]. Стал набирать популярность с 2010 года[2], а с 2013 становится новым стандартом в дизайнерском компьютерном направлении[2].

История

[править | править код]

Прообразом для плоского дизайна стали направления в искусстве, связанные с традицией Интернационального стиля: минимализм, баухаус[3][4][5][6] и Международный типографический стиль[7] (также известный как швейцарский стиль). Последнее оказало наибольшее влияние на формирование плоского дизайна[3][8].

Несмотря на то, что интерфейсы и сайты с элементами плоскости и минимализма создавались ещё в 2000-е годы, массовую популярность они приобрели после того, как с 2010 года Microsoft стала выпускать продукцию, выдержанную в плоском metro-стиле, тем самым противопоставляя свою дизайн-политику продукции Apple, выдержанной в стиле скевоморфизма. Однако ещё в 2006 году компанией Microsoft был выпущен mp3-плеер Zune, который содержал в себе элементы плоского дизайна[8]. В 2010 году Microsoft выпустила мобильную операционную систему Windows Phone 7 с использованием интерфейса Metro, выдержанного в стиле плоского дизайна, где также доминируют яркие цвета. После коммерческого успеха Microsoft выпускает новую операционную систему Windows 8 в стиле Metro[4]. Фактически с началом выпуска Windows Phone и Windows 8 начинается эра плоского дизайна[2].

В 2013 году компания Apple выпустила операционную систему iOS 7, дизайн которой также отказывается от скевоморфизма в пользу плоскости[8], это приводит к ещё большей популяризации плоского дизайна и делает его новым преобладающим направлением в компьютерном дизайне[2]. Вскоре после этого на плоский дизайн также перешли поисковик и приложения от Google вместе с их операционной системой Android, вышедшей в интерфейсе Material Design[9].

К 2015 году использование объёмного дизайна практически прекращено.

Замысел

[править | править код]
Изображения 6 пар иконок из IOS 6 (2012 год) и IOS 7 (2013 год) Слева иконки выполнены в классическом стиле с элементами скевоморфизма, справа — в плоском

Изначально концепция плоского дизайна заключается в отказе от реализма — иллюзии трёхмерного изображения или объекта, которая достигается путём создания отражения, текстур, теней[4] и создании так называемого плоского дизайна с использованием простейших одноцветных элементов. Согласно задумке, визуально плоский дизайн выглядит более привлекательно и изящно[10]. Также простой дизайн снимает дополнительную нагрузку на сайты или программы, благодаря которому они работают и загружаются быстрее[4]. Плоский дизайн противопоставляется так называемому «богатому дизайну» (англ. rich design), в котором значительный акцент делается на разнообразные визуальные и звуковые эффекты[4][11].

Плоский дизайн был широко распространён в 80-е годы по причине того, что уровень технологий не позволял создавать сложные текстуры, однако, и тогда впервые стали появляться простые элементы скевоморфизма, чтобы создать визуальную связь с цифровым объектом. Сегодня элементы псевдовыпуклости перестали привлекать большинство пользователей[12]. Основные принципы плоского дизайна:

  • В плоском дизайне должны использоваться визуально двухмерные объекты, исключаются любые элементы, придающие эффект глубины и объёмности, при изображении объекта используются только его контуры[1].
  • Элементы должны выглядеть максимально простыми, для чего используются односложные фигуры с чёткими контурами[1].
  • Необходимо грамотно использовать разные типы шрифтов, они должны быть простыми и не выбиваться из общего дизайна[1].
  • Плоский дизайн должен включать в себя лишь несколько основных цветов без переходов и градиентов, которые могут быть яркими[1].

Flat design и Интернациональный стиль

[править | править код]
Основная статья: Интернациональный стиль
Основная статья: Интернациональный типографический стиль
Основная статья: Швейцарский стиль (дизайн)

Различными авторами высказывается устойчивое мнение, что flat design тесно связан с художественной системой 1930—1960 годов[3][13]. Искусствовед Екатерина Васильева обращает внимание на сходство элементов flat design с принципами Интернационального и Швейцарского стиля[14] — ключевого явления в архитектуре, дизайне и графике середины и второй половины XX века[15]. «Обнаруживая общее начало с такими явлениями, как интернациональный графический стиль, flat design выступает как одно из наиболее влиятельных направлений современной визуальной системы»[16]. Исследователи считают Flat Design идеологическим продолжением Швейцарского стиля[17].

Полагают, что устойчивость flat design может быть объяснена не только его функциональным удобством (графическая простота, двухмерное изображение), но и с обращением к системе Интернационального и Швейцарского стиля[13][14], который можно рассматривать как основу современного дизайна[15]. Влиятельность flat design в современной визуальной системе может быть связана с фактом сознательного обращения flat design к художественным и структурным принципам Интернационального стиля[3]. Элементы и принцип flat design могут быть соотнесены с архитектурой и промышленным дизайном Ле Корбюзье, Людвига Мис ван дер Роэ, Фрэнка Ллойда Райта, Алвара Аалто, а также с графикой Яна Чихольда, Макса Билля, Йозефа Мюллер-Брокмана, Армина Хофмана и др.[7]

Критика

[править | править код]

Некоторые дизайнеры уверены в том, что мода на плоский дизайн в его радикальном виде является лишь временным явлением и интерес к нему со временем спадёт. Один из явных недостатков плоского дизайна заключается в том, что из-за отсутствия теней сложно различить ссылки и понять, являются ли они действующими[18]. С другой стороны, плоский дизайн хвалят за его простоту и универсальность, он может подходить для самых разных приложений и размеров экрана. Дизайнеры в конечном счёте уверены, что в будущем эволюция компьютерного дизайна закончится на том, что плоский дизайн также будет сочетать в себе элементы скевоморфизма, который позволит подробнее выделять мельчайшие детали[18][19]. Некоторые считают, что повальная мода на плоский стиль является следствием того, что скевоморфизм в течение слишком длительного времени навязывался как самый «идеальный и передовой» дизайн для сайтов и программ. Сначала пользователи недоверчиво относились к новому стилю IOS 7, но быстро привыкли к нему, приняв «плоскость» за новый стандарт[20].

  • Youtube «классический»
    Youtube «классический»
  • Youtube «плоский», в 2015—2017 годах
    Youtube «плоский», в 2015—2017 годах
  • Google «классический»
    Google «классический»
  • Google «плоский», с 2015 года
    Google «плоский», с 2015 года

Примечания

[править | править код]
  1. ↑ 1 2 3 4 5 «Плоский дизайн»: с чего начать? Пять основных принципов Flat дизайна. Дата обращения: 3 декабря 2014. Архивировано 12 марта 2015 года.
  2. ↑ 1 2 3 4 The True History Of Flat Design. Дата обращения: 3 декабря 2014. Архивировано 21 июля 2014 года.
  3. ↑ 1 2 3 4 Васильева Е. В., Гарифуллина (Аристова) Ж.С. Flat-Design и система интернационального стиля: графические принципы и визуальная форма // Знак: проблемное поле медиаобразования. 2018. № 3 (29). С. 43-49
  4. ↑ 1 2 3 4 5 Turner, Amber Leigh The history of flat design: How efficiency and minimalism turned the digital world flat. The Next Web (19 марта 2014). Дата обращения: 11 апреля 2014. Архивировано 16 октября 2014 года.
  5. ↑ Diogo Terror. Lessons From Swiss Style Graphic Design. Smashing magazine (17 июля 2009). Дата обращения: 28 марта 2014. Архивировано 24 июня 2015 года.
  6. ↑ A brief history of flat design. Tech Samurais (31 июля 2013). Дата обращения: 3 декабря 2014. Архивировано 2 октября 2014 года.
  7. ↑ 1 2 Васильева Е. В., Гарифуллина (Аристова) Ж.С. Flat-Design и система интернационального стиля: графические принципы и визуальная форма // Знак: проблемное поле медиаобразования. 2018. № 3 (29). С. 45
  8. ↑ 1 2 3 Taimur Asghar. The True History of Flat Design. Web Design Ai (9 июля 2014). Дата обращения: 3 декабря 2014. Архивировано 21 июля 2014 года.
  9. ↑ 9 principles Google created for its colorful ‘Material Design’ UI refresh. The Next Web. Дата обращения: 3 декабря 2014. Архивировано 29 июня 2016 года.
  10. ↑ Carrie Cousins. Flat design principles. designmodo.com (28 мая 2013). Дата обращения: 3 декабря 2014. Архивировано 2 декабря 2014 года.
  11. ↑ Yair Grinberg. iOS 7, Windows 8, and flat design: In defense of skeuomorphism. VentureBeat (11 сентября 2013). Дата обращения: 13 апреля 2014. Архивировано 23 мая 2017 года.
  12. ↑ Kelsey Campbell-Dollaghan. What Is Flat Design? Gizmodo Australia (27 мая 2013). Дата обращения: 13 апреля 2014. Архивировано 3 марта 2016 года.
  13. ↑ 1 2 Terror D. Lessons From Swiss Style Graphic Design. Smashing magazine (17 июля 2009). Дата обращения: 14 декабря 2018. Архивировано 15 декабря 2018 года.
  14. ↑ 1 2 Васильева Е. В., Гарифуллина (Аристова) Ж.С. Flat-Design и система интернационального стиля: графические принципы и визуальная форма // Знак: проблемное поле медиаобразования. 2018. № 3 (29). С. 43-49.
  15. ↑ 1 2 Hollis, R. Swiss Graphic Design: The Origins and Growth of an International Style, 1920—1965. New Haven: Yale University Press, 2006. — 272 p.
  16. ↑ Васильева Е. В., Гарифуллина (Аристова) Ж.С. Flat-Design и система интернационального стиля: графические принципы и визуальная форма // Знак: проблемное поле медиаобразования. 2018. № 3 (29). С. 43
  17. ↑ Филиппова М. Принципы Flat-design и проблема интернационального стиля: графическая программа и её специфика. // Месмахеровские чтения — 2022. Материалы международной научно-практической конференции. Сборник научных статей. Санкт-Петербург, 2022. С. 650—656. Архивная копия от 19 августа 2023 на Wayback Machine
  18. ↑ 1 2 Kyle Stalzer and Dan Klammer. Why Flat Design Will Die. tackk (n.d.). Дата обращения: 3 декабря 2014. Архивировано из оригинала 4 ноября 2014 года.
  19. ↑ Alex Peters. Why Flat Design is Here to Stay. How Design (10 марта 2014). Дата обращения: 3 декабря 2014. Архивировано из оригинала 8 декабря 2014 года.
  20. ↑ Как и почему плоский дизайн победил скевоморфизм. macradar.ru (28 апреля 2014). Дата обращения: 3 декабря 2014. Архивировано из оригинала 29 ноября 2014 года.

Литература

[править | править код]

Ссылки

[править | править код]
Источник — https://ru.wikipedia.org/w/index.php?title=Flat_design&oldid=138994010