stringtranslate.com

Плоский дизайн

Плоский дизайн — это минималистский язык дизайна или стиль дизайна, обычно используемый в графических пользовательских интерфейсах (GUI) (таких как веб-приложения и мобильные приложения ), а также в графических материалах, таких как плакаты , рисунки, справочные документы и издательская продукция.

Определение и цель

Плоский дизайн — это стиль дизайна интерфейса, подчеркивающий минималистичное использование простых элементов, типографики и плоских цветов. [1]

Дизайнеры могут предпочесть плоский дизайн, поскольку он позволяет сделать дизайн интерфейса более рациональным и эффективным. Он позволяет быстрее передавать информацию, при этом оставаясь визуально привлекательным и доступным. [2] [3] Кроме того, он упрощает разработку интерфейса, который реагирует на изменения размера браузера на разных устройствах. С минимальными элементами дизайна веб-страницы можно загружать быстрее и легко изменять их размер, и при этом они по-прежнему будут выглядеть четко на экранах с высоким разрешением. [2] Как подход к дизайну, его часто противопоставляют скевоморфизму [4] и богатому дизайну . [2]

История

На плоский дизайн в первую очередь повлияли международный типографский стиль (также известный как швейцарский стиль ), текстовые пользовательские интерфейсы , модернизм и стили, возникшие в Баухаусе . [2] [5] [6] [7] Международный типографский стиль часто считается наиболее существенным влиянием на плоский дизайн, а его появление и популяризация в 1950-х и 1960-х годах считаются отправной точкой плоского дизайна, хотя он не появлялся в цифровом мире в течение некоторого времени после этого. [8]

В 2002 году Microsoft выпустила Windows Media Center , а в 2006 году — MP3-плеер Zune , оба из которых содержали элементы плоского дизайна. Дизайн Zune был чистым и простым, с акцентом на крупную строчную типографику, логотипы в стиле силуэта и монохромные цвета шрифтов. [8] Microsoft продолжила этот стиль дизайна с выпуском Windows Phone 7 в 2010 году , который был построен на элементах плоского дизайна, представленных в Zune, формализованных как « язык дизайна Metro ». В дизайне доминировали крупные и яркие формы, сопровождаемые типографикой без засечек из семейства шрифтов Segoe , плоскими изображениями и меню с сетчатым узором. Metro впоследствии был принят всеми линейками программного обеспечения Microsoft, включая операционную систему Windows 8 для ПК . [2]

Виджеты графического интерфейса пользователя, разработанные в стиле Material Design от Google

Android начал перенимать тенденции плоского дизайна с 4.0 «Ice Cream Sandwich» в 2011 году; Матиас Дуарте , вице-президент Google по дизайну, считал, что iOS от Apple слишком скевоморфна , Windows Phone выглядит как «вывеска туалета в аэропорту», ​​и что оба интерфейса слишком жестко стандартизированы с ограниченной гибкостью для дизайнеров. Новый интерфейс платформы «Holo» был разработан так, чтобы казаться более простым, чем предыдущие версии Android, с неоново-голубыми акцентами, жесткими краями и тенями для глубины. [9] [10] [11] [12]

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

В 2017 году Microsoft представила Fluent Design System , новый плоский пользовательский интерфейс. Этот новый интерфейс отличается от своего предшественника Metro использованием глубины, [21] обратной связи интерфейса и нового эффекта полупрозрачности, названного «Acrylic». [ кем? ]

Критика

Плоский дизайн критиковали за то, что он делает пользовательские интерфейсы неинтуитивными и менее удобными в использовании. Если сделать все элементы дизайна (меню, кнопки, ссылки и т. д.) плоскими, то может стать сложнее определить, какую функцию выполняет элемент, например, определить, является ли элемент кнопкой или индикатором. [22] [23] Исследования показали, что плоский дизайн более популярен среди молодых людей, чем среди пожилых людей. Исследования также показали, что, хотя молодые люди, по-видимому, быстрее ориентируются в плоских дизайнах, у них также возникают проблемы с пониманием пользовательского интерфейса. [24] В 2013 году Якоб Нильсен , эксперт по дизайну и удобству использования пользовательского интерфейса, назвал плоский дизайн «угрозой для удобства использования планшетов». Nielsen также предложил альтернативу, а именно золотую середину между скевоморфизмом и плоским дизайном. [25] Группа Nielsen провела исследование в 2017 году, согласно которому использование интерфейсов с плоским дизайном было в среднем на 22% медленнее. [26]

Смотрите также

Ссылки

  1. ↑ Кэрри Казинс (28 мая 2013 г.). «Принципы плоского дизайна». designmodo.com .
  2. ^ abcde Тернер, Эмбер Ли (19 марта 2014 г.). «История плоского дизайна: как эффективность и минимализм сделали цифровой мир плоским». The Next Web . Получено 11 апреля 2014 г.
  3. ^ Клам, Люк (13 мая 2013 г.). «Взгляд на плоский дизайн и почему он важен». UX Magazine . Получено 11 апреля 2014 г.
  4. ↑ Яир Гринберг (11 сентября 2013 г.). «iOS 7, Windows 8 и плоский дизайн: в защиту скевоморфизма». VentureBeat . Получено 13 апреля 2014 г.
  5. ^ Диого Террор (17 июля 2009 г.). «Уроки швейцарского стиля графического дизайна». Smashing . Получено 28 марта 2014 г.
  6. ^ "Краткая история плоского дизайна". Tech Samurais . 31 июля 2013 г.
  7. ^ Xavier Bertels (5 марта 2014 г.). «История плоского дизайна». Xavier Bertels . Получено 23 декабря 2014 г. .
  8. ^ ab Taimur Asghar (9 июля 2014 г.). «Истинная история плоского дизайна». Web Design Ai .
  9. ^ "Эксклюзив: Матиас Дуарте о философии Android и углубленный взгляд на Ice Cream Sandwich". The Verge . Vox Media . Архивировано из оригинала 12 февраля 2012 г. Получено 28 ноября 2011 г.
  10. ^ Амадео, Рон (16 июня 2014 г.). «История Android: бесконечные итерации мобильной ОС Google». Ars Technica . Condé Nast . Получено 6 июля 2014 г. .
  11. ^ "Google требует тему по умолчанию 'Holo' на устройствах Android 4.0 для доступа к Android Market". The Verge . Получено 25 июля 2014 г.
  12. ^ "Android 4.0 Ice Cream Sandwich SDK выпущен с новыми функциями для разработчиков". The Verge . Получено 25 июля 2014 г. .
  13. ^ Сейферт, Дэн (10 июня 2013 г.). «Apple анонсирует iOS 7, «крупнейшее изменение» с момента появления iPhone, которое выйдет этой осенью». The Verge . Получено 6 апреля 2020 г. .
  14. ^ Павлус, Джон (10 июня 2013 г.). «Почему Джони Айв сглаживает iOS 7». Fast Company . Получено 6 апреля 2020 г.
  15. ^ Суппурис, Аарон (11 июня 2013 г.). «Отслеживание влияний iOS 7: Apple делает ремиксы почти для всех в отрасли». The Verge . Получено 6 апреля 2020 г. .
  16. ^ "OS X Yosemite представлена ​​на WWDC, имеет большой переделанный пользовательский интерфейс". Ars Technica . 2 июня 2014 г. Архивировано из оригинала 3 июня 2014 г. Получено 3 июня 2014 г.
  17. ^ "Новый пользовательский интерфейс Google 'Material Design' появится на Android, Chrome OS и в Интернете". Engadget . Получено 26 июня 2014 г.
  18. ^ "Google раскрывает подробности об Android L на Google IO". Anandtech . Получено 26 июня 2014 г. .
  19. ^ "Новый, улучшенный Android от Google предоставит унифицированный язык дизайна". Co.Design . 25 июня 2014 г. Получено 26 июня 2014 г.
  20. ^ «Следующий большой редизайн Android от Google состоится осенью». The Verge . Vox Media. 25 июня 2014 г. Получено 26 июня 2014 г.
  21. ^ "Microsoft демонстрирует 3D-функцию 'Z-depth layering' в своей системе Fluent Design System". Windows Central . Получено 22 декабря 2017 г.
  22. ^ "Как UI Design в 2022 году выделит неоморфизм". Лучший дизайн опыта - Блог . 20 января 2022 г. Получено 19 июля 2022 г.
  23. ^ «Почему тенденция плоского дизайна вредит удобству использования». Vandelay Design . 7 апреля 2015 г. Получено 6 июля 2017 г.
  24. ^ «Проблема плоского дизайна по мнению эксперта по UX». Co.Design . 23 марта 2016 г. Получено 6 июля 2017 г.
  25. ^ «Удобство использования планшетов: результаты исследования пользователей». www.nngroup.com . Получено 6 июля 2017 г. .
  26. ^ «Плоские элементы пользовательского интерфейса привлекают меньше внимания и вызывают неопределенность». www.nngroup.com . Получено 8 мая 2018 г.