Плоский дизайн
![]() <1995 г.
|
![]() 2000
|
![]() 2019
|
Плоский дизайн — это минималистский язык дизайна или стиль дизайна, обычно используемый в графических пользовательских интерфейсах (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 ]

Android начал перенимать тенденции плоского дизайна с версией 4.0 «Ice Cream Sandwich» в 2011 году; Матиас Дуарте , вице-президент Google по дизайну, считал, что Apple от iOS слишком скевоморфна , Windows Phone выглядит как «вывеска туалета в аэропорту», и что оба интерфейса слишком жестко стандартизированы с ограниченной гибкостью для дизайнеров. Новый интерфейс платформы «Holo» был разработан так, чтобы выглядеть более упрощенным, чем предыдущие версии Android, с неоново-синими акцентами, резкими краями и тенями для глубины. [ 9 ] [ 10 ] [ 11 ] [ 12 ]
В 2013 году Apple представила iOS 7 , которая перешла на плоский дизайн пользовательского интерфейса с использованием более ярких цветов, типографики, а также размытых, полупрозрачных наложений. [ 13 ] [ 14 ] [ 15 ] В следующем году OS X Yosemite представила пользовательский интерфейс в стиле iOS 7 для Apple Mac OS X. операционной системы [ 16 ] Google начал внедрять свой собственный язык плоского дизайна, известный как « Material Design », для Android (начиная с Android Lollipop ) и других своих платформ, который основан на листах, похожих на учетные карточки , и использовании теней для увеличения глубины и иерархии. как плавная анимация и переходы. [ 17 ] [ 18 ] [ 19 ] [ 20 ]
В 2017 году Microsoft представила Fluent Design System — новый плоский пользовательский интерфейс. Этот новый интерфейс отличается от своего предшественника Metro за счет использования глубины, [ 21 ] интерфейса обратная связь и новый эффект полупрозрачности, получивший название «Акрил». [ кем? ]
Критика
[ редактировать ]Плоский дизайн подвергался критике за то, что он делает пользовательские интерфейсы неинтуитивными и менее удобными. Если сделать все элементы дизайна (меню, кнопки, ссылки и т. д.) плоскими, то различение функций, которые выполняет тот или иной элемент, может стать более сложным, например, определение того, является ли элемент кнопкой или индикатором. [ 22 ] [ 23 ] Исследования показали, что плоский дизайн более популярен среди молодежи, чем среди пожилых людей. Исследования также показали, что, хотя молодые люди кажутся быстрее ориентирующимися в плоском дизайне, у них также возникают проблемы с пониманием пользовательского интерфейса. [ 24 ] В 2013 году Якоб Нильсен , эксперт в области дизайна и удобства использования пользовательского интерфейса, назвал плоский дизайн «угрозой удобству использования планшетов». Нильсен также предложил альтернативу, а именно золотую середину между скевоморфизмом и плоским дизайном. [ 25 ] Группа Nielsen провела исследование в 2017 году, согласно которому использование интерфейсов с использованием плоского дизайна в среднем было на 22% медленнее. [ 26 ]
См. также
[ редактировать ]Ссылки
[ редактировать ]- ^ Кэрри Казинс (28 мая 2013 г.). «Принципы плоского дизайна» . designmodo.com .
- ^ Перейти обратно: а б с д и Тернер, Эмбер Ли (19 марта 2014 г.). «История плоского дизайна: как эффективность и минимализм сделали цифровой мир плоским» . Следующая сеть . Проверено 11 апреля 2014 г.
- ^ Клам, Люк (13 мая 2013 г.). «Взгляд на плоский дизайн и почему это важно» . Журнал UX . Проверено 11 апреля 2014 г.
- ^ Яир Гринберг (11 сентября 2013 г.). «iOS 7, Windows 8 и плоский дизайн: в защиту скевоморфизма» . ВенчурБит . Проверено 13 апреля 2014 г.
- ^ Диого Террор (17 июля 2009 г.). «Уроки графического дизайна в швейцарском стиле» . Сокрушительный . Проверено 28 марта 2014 г.
- ^ «Краткая история плоского дизайна» . Технологические самураи . 31 июля 2013 г.
- ^ Ксавье Бертельс (5 марта 2014 г.). «История плоского дизайна» . Ксавье Бертельс . Проверено 23 декабря 2014 г.
- ^ Перейти обратно: а б Таймур Асгар (9 июля 2014 г.). «Правдивая история плоского дизайна» . Веб-дизайн ИИ .
- ^ «Эксклюзив: Матиас Дуарте о философии Android и углубленный взгляд на сэндвич с мороженым» . Грань . Вокс Медиа . Архивировано из оригинала 12 февраля 2012 года . Проверено 28 ноября 2011 г.
- ^ Амадео, Рон (16 июня 2014 г.). «История Android: бесконечные версии мобильной ОС Google» . Арс Техника . Конде Наст . Проверено 6 июля 2014 г.
- ^ «Google требует тему Holo по умолчанию на устройствах Android 4.0 для доступа к Android Market» . Грань . Проверено 25 июля 2014 г.
- ^ «Выпущен Android 4.0 Ice Cream Sandwich SDK с новыми функциями для разработчиков» . Грань . Проверено 25 июля 2014 г.
- ^ Зайферт, Дэн (10 июня 2013 г.). «Apple анонсирует iOS 7, «самое большое изменение» с момента появления iPhone, которое выйдет этой осенью» . Грань . Проверено 6 апреля 2020 г.
- ^ Павлус, Джон (10 июня 2013 г.). «Почему Джони Айв унижает iOS 7» . Компания Фаст . Проверено 6 апреля 2020 г.
- ^ Суппурис, Аарон (11 июня 2013 г.). «Отслеживание влияния iOS 7: Apple делает ремиксы практически для всех в отрасли» . Грань . Проверено 6 апреля 2020 г.
- ^ «OS X Yosemite, представленная на WWDC, имеет кардинально измененный пользовательский интерфейс» . Арс Техника . 2 июня 2014 года. Архивировано из оригинала 3 июня 2014 года . Проверено 3 июня 2014 г.
- ^ «Новый пользовательский интерфейс Google Material Design появится на Android, Chrome OS и в Интернете» . Engadget . Проверено 26 июня 2014 г.
- ^ «Google раскрывает подробности об Android L на Google IO» . Анандтех . Проверено 26 июня 2014 г.
- ^ «Новый улучшенный Android от Google обеспечит единый язык дизайна» . Компания Дизайн . 25 июня 2014 года . Проверено 26 июня 2014 г.
- ^ «Следующий большой редизайн Android от Google состоится осенью» . Грань . Вокс Медиа. 25 июня 2014 года . Проверено 26 июня 2014 г.
- ^ «Microsoft демонстрирует 3D-функцию «наслоения Z-глубины» в своей системе Fluent Design System» . Центр Windows . Проверено 22 декабря 2017 г.
- ^ «Как UI-дизайн в 2022 году подчеркнет неоморфизм» . Лучший дизайн интерфейса — Блог . 20 января 2022 г. . Проверено 19 июля 2022 г.
- ^ «Почему тенденция плоского дизайна вредит удобству использования» . Ванделей Дизайн . 7 апреля 2015 года . Проверено 6 июля 2017 г.
- ^ «Проблема плоского дизайна по мнению UX-эксперта» . Компания Дизайн . 23 марта 2016 года . Проверено 6 июля 2017 г.
- ^ «Удобство использования планшетов: результаты исследований пользователей» . www.nngroup.com . Проверено 6 июля 2017 г.
- ^ «Плоские элементы пользовательского интерфейса привлекают меньше внимания и вызывают неопределенность» . www.nngroup.com . Проверено 8 мая 2018 г.