stringtranslate.com

Метро (язык дизайна)

Центр Музыка+Видео на Windows Phone

Microsoft Design Language (или MDL ), [1] ранее известный как Metro , — язык дизайна , созданный корпорацией Microsoft . Этот язык дизайна ориентирован на типографику и упрощенные значки , отсутствие беспорядка, увеличенное соотношение контента к хрому («контент до хрома») и основные геометрические формы. Ранние примеры принципов MDL можно найти в Encarta 95 и MSN 2.0 . [2] [3] Язык дизайна развивался в Windows Media Center и Zune и был официально представлен как Metro во время презентации Windows Phone 7. С тех пор он был включен в несколько других продуктов компании, включая системное программное обеспечение Xbox 360 и системное программное обеспечение Xbox One , Windows 8 , Windows Phone и Outlook.com . [4] [5] До того, как название «язык дизайна Microsoft» стало официальным, руководитель Microsoft Ци Лу называл его современным языком дизайна пользовательского интерфейса в своей программной речи на конференции MIXX . [6] По данным Microsoft, «Metro» всегда было кодовым названием и никогда не подразумевалось как конечный продукт, но новостные сайты связывают это изменение с проблемами с товарными знаками. [4]

Язык Microsoft Design Language 2 (MDL2) был разработан вместе с Windows 10. [7] [8] В 2017 году он был расширен языком Fluent Design .

История

Язык дизайна основан на принципах дизайна классического швейцарского графического дизайна . Ранние проблески этого стиля можно было увидеть в Windows Media Center для Windows XP Media Center Edition , [9] который отдавал предпочтение тексту как основной форме навигации, а также в ранних концепциях Neptune . [10] Этот интерфейс перешел в более поздние версии Media Center. В 2006 году Zune обновил свой интерфейс, используя эти принципы. Дизайнеры Microsoft решили перепроектировать интерфейс и уделить больше внимания чистой типографике и меньшему — хромированному пользовательскому интерфейсу. [11] Эти принципы и новый пользовательский интерфейс Zune были перенесены в Windows Phone, впервые выпущенный в 2010 году (из которого многое было взято для Windows 8). Клиент Zune Desktop также был переработан с упором на типографику и чистый дизайн, который отличался от предыдущего пользовательского интерфейса на основе Portable Media Center от Zune . Плоские цветные «живые плитки» были введены в язык дизайна во время ранних исследований Windows Phone.

В интервью было объяснено, что различные подразделения Microsoft используют продукты друг друга, и расширение Metro не было общекорпоративным подходом, а вместо этого такие команды, как Xbox, полюбили Metro и адаптировали его для своих собственных продуктов. Многие подразделения Microsoft в конечном итоге приняли Metro. [12]

Microsoft Design Language 2 (MDL2) был разработан вместе с Windows 10. В этой версии был представлен новый набор виджетов , включая средства выбора даты, переключатели и переключатели, а также уменьшена толщина границ для всех элементов пользовательского интерфейса. [7] [8]

Принципы

Команда дизайнеров Microsoft ссылается на язык дизайна в качестве источника вдохновения для знаков, которые обычно встречаются в системах общественного транспорта. [13] Язык дизайна делает акцент на хорошей типографике и имеет крупный текст, который привлекает внимание. Microsoft рассматривает язык дизайна как «гладкий, быстрый, современный» и «обновляющий» интерфейсы на основе иконок Windows, Android и iOS . [14] Во всех случаях используются шрифты на основе семейства шрифтов Segoe , разработанные Стивом Мэттесоном в Agfa Monotype и лицензированные Microsoft. Для Zune Microsoft создала специальную версию под названием Zegoe UI, [15] а для Windows Phone Microsoft создала семейство шрифтов Segoe WP. Шрифты в основном отличаются только незначительными деталями. Более очевидные различия между Segoe UI и Segoe WP очевидны в их соответствующих числовых символах. Шрифт Segoe UI в Windows 8 имел очевидные различия — похожие на Segoe WP. Среди символов, претерпевших заметные типографские изменения, были 1, 2, 4, 5, 7, 8, I и Q.

Джо Бельфиоре был одним из архитекторов Metro. На Nokia World 2011 Бельфиоре объяснил, что пользовательский интерфейс стремится быть «художественным» в текстовых элементах и ​​иконографии . Он также упомянул «движение» пользовательского интерфейса, особенно в Windows Phone, живых плиток, движущихся точек и кинетической прокрутки. [16]

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

Анимация играет большую роль. Microsoft рекомендует последовательное подтверждение переходов и пользовательских взаимодействий (таких как нажатия или смахивания) с помощью некоторой формы естественной анимации или движения. Это направлено на то, чтобы дать пользователю впечатление «живого» и отзывчивого пользовательского интерфейса с «дополнительным ощущением глубины». [17] [18]

Прием

На мобильном телефоне

Ранняя реакция на язык была в целом положительной. В обзоре Zune HD Engadget сказал : «Microsoft продолжает продвигать большую, большую типографику здесь, предоставляя сложную, аккуратно разработанную компоновку, которая почти так же функциональна, как и привлекательна». [19] CNET похвалил язык дизайна, сказав: «он немного более смелый и неформальный, чем узкие, стерильные сетки иконок и меню Rolodex iPhone и iPod Touch». [20]

На церемонии IDEA 2011 Общество промышленных дизайнеров Америки (IDSA) вручило Windows Phone 7, использующему пользовательский интерфейс, награды «Золотой интерактив», «Приз зрительских симпатий» и «Лучший на выставке». [21] [22] Изабель Анкона, консультант по пользовательскому опыту в IDSA, объяснила, почему победил Windows Phone: [23]

Инновация здесь заключается в текучести опыта и фокусировке на данных без использования традиционных условных обозначений пользовательского интерфейса окон и фреймов. Данные становятся визуальными элементами и элементами управления. Простые жесты и переходы ведут пользователя глубже в контент. По-настоящему элегантный и уникальный опыт.

Сообщалось, что пользовательский интерфейс был лучше принят женщинами и пользователями, впервые использующими его. [24]

Критика особенно сосредоточилась на использовании текста, набранного заглавными буквами . С ростом использования Интернета критики сравнивали это с компьютерной программой, кричащей на своего пользователя. IT-журналист Ли Хатчинсон описал использование Microsoft этой практики в версии OneNote для macOS как ужасное, заявив, что она «проклята безумными, нестандартными меню окон приложений ВСЕМИ ЗАГЛАВНЫМИ БУКВАМИ, что не столько нарушает конвенции дизайна OS X, сколько выводит их за сарай, обливает бензином и поджигает». [25]

На рабочем столе Windows 8

С появлением Windows 8 пользовательский интерфейс операционной системы и использование ею языка дизайна вызвали в целом негативные критические отклики. 25 августа 2012 года Питер Брайт из Ars Technica рассмотрел предварительную версию Windows 8, посвятив первую часть обзора сравнению дизайна меню «Пуск», используемого в Windows 8 и Windows 7. Перечисляя их плюсы и минусы, Питер Брайт пришел к выводу, что меню «Пуск» в Windows 8 (так называемый экран «Пуск»), хотя и не лишено проблем, является явным победителем. Однако он пришел к выводу, что пользовательский интерфейс Windows 8 разочаровывает и что различные аспекты пользовательского интерфейса не работают вместе. [26] Вуди Леонхард был еще более критичен, когда сказал: «С точки зрения пользователя, Windows 8 — это провал — неуклюжая мешанина, которая тянет пользователя в двух направлениях одновременно». [27]

В дополнение к изменениям в меню «Пуск», Windows 8 использует более модальный подход с использованием полноэкранных приложений, которые уходят от зависимости от интерфейса рабочего стола на основе иконок. Однако, сделав это, Microsoft сместила фокус с многозадачности и производительности бизнеса. [28]

Изменение имени

В августе 2012 года издание The Verge сообщило, что разработчикам и сотрудникам Microsoft был разослан внутренний меморандум, в котором сообщалось о решении «прекратить использование» термина «Metro» из-за «обсуждений с важным европейским партнером», и что они «работают над заменяющим термином». [29] Технологические новостные агентства Ars Technica , [30] TechRadar , [31] CNET , [32] Engadget [33] и Network World [34], а также популярная пресса Bits Blog из The New York Times Company [35] и BBC News Online [36] опубликовали информацию о том, что партнер, упомянутый в меморандуме, может быть одним из розничных партнеров Microsoft, немецкой компанией Metro AG , поскольку название потенциально может нарушать их торговую марку «Metro». Microsoft позже заявила, что причина уменьшения акцента на названии не была связана с какими-либо текущими судебными разбирательствами, и что «Metro» было всего лишь внутренним кодовым названием проекта, [37] несмотря на активное продвижение бренда среди общественности. [38] В некоторых контекстах компания начала использовать термин «Modern» или более общий модификатор «Windows 8» для обозначения нового дизайна, возможно, в качестве заполнителя. [39]

В сентябре 2012 года «язык дизайна Microsoft» был принят в качестве официального названия стиля дизайна. [1] [40] Термин использовался в документации Microsoft Developer Network [41] [42] [43] [44] и на конференции Microsoft Build 2012 года для обозначения языка дизайна. [1] [45]

В рамках связанного с этим изменения Microsoft отказалась от использования фразы « приложения в стиле Metro » для обозначения мобильных приложений, распространяемых через Магазин Windows . [40]

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

Ссылки

  1. ^ abc Foley, Mary Jo (29 октября 2012 г.). «Microsoft Design Language: новейший официальный способ обозначения „Metro“». ZDNet . CBS Interactive .
  2. ↑ Грин, Джей (8 февраля 2012 г.). «Почему Metro теперь правит в Microsoft». CNET . CBS Interactive .
  3. ^ Massey, Stephane (15 февраля 2012 г.). «Принципы проектирования Metro Ui [sic]». stephanemassey.com . Самостоятельно опубликовано . Архивировано из оригинала 2 августа 2018 г. . Получено 17 февраля 2012 г. .
  4. ^ ab Chang, Alexandra (8 августа 2012 г.). «Microsoft не нужно имя для своего пользовательского интерфейса». Wired . Condé Nast .
  5. ^ Крузениски, Майк (11 апреля 2011 г.). «Как печатный дизайн — будущее взаимодействия». Kruzeniski.com . Самостоятельно опубликовано . Архивировано из оригинала 14 марта 2012 г. Получено 27 августа 2011 г.
  6. ^ Лу, Ци (1 октября 2012 г.). «Ци Лу: Основной доклад конференции IAB MIXX». Центр новостей . Майкрософт.
  7. ^ ab Сэмс, Брэд (21 апреля 2015 г.). «От Metro к Microsoft Design Language 2: сравнение бок о бок». Neowin .
  8. ^ ab Rubino, Daniel (21 апреля 2015 г.). «Что нового в Microsoft Design Language 2 для Windows 10». Windows Central . Mobile Nations.
  9. ^ Lefevers, Jason (15 сентября 2013 г.). "A Walkthrough the History of the Metro UI". Windows Phone Metro . Самостоятельно опубликовано . Архивировано из оригинала 22 мая 2013 г. . Получено 15 сентября 2013 г. .
  10. ^ "SuperSite Flashback: Neptune". 6 августа 2013 г.
  11. ^ "Windows Phone Design System: Codenamed 'Metro'" (PDF) . Архивировано из оригинала (PDF) 15 ноября 2010 г. . Получено 9 октября 2010 г. .
  12. ^ «Иногда Microsoft разрабатывает великолепные вещи. Вот почему это никогда не имеет значения». 25 января 2014 г.
  13. ^ "Design Language of Windows Phone 7". .toolbox . Microsoft . Архивировано из оригинала 9 октября 2012 . Получено 5 октября 2012 .
  14. ^ Гамбургер, Эллис (27 апреля 2011 г.). "Метро". Business Insider . Архивировано из оригинала 23 апреля 2013 г.
  15. ^ Чжэн, Лонг (14 ноября 2007 г.). ""Zegoe", новый шрифт Zune". Я начал что-то . Самостоятельно издал .
  16. ^ «Создание другого типа пользовательского интерфейса».
  17. ^ Робертс, Чад; Шум, Альберт; Смуга, Майкл (15 марта 2010 г.). «Пользовательский интерфейс Windows Phone и язык дизайна». MIX 2010 . Microsoft .
  18. ^ Крузениски, Майк (17 февраля 2011 г.). «От транспорта до пикселей». Блог разработчиков Windows Phone . Microsoft . Архивировано из оригинала 18 февраля 2011 г.
  19. ↑ Топольски, Джошуа (17 сентября 2009 г.). "Обзор Zune HD". Engadget . AOL .
  20. ^ "Обзор Zune HD 64GB". CNET . CBS Interactive . 17 сентября 2009 г.
  21. ↑ Уоррен, Том (18 сентября 2011 г.). «Windows Phone выигрывает IDEA 2011 – награду за дизайн в номинации «Выбор народа»». WinRumors . Архивировано из оригинала 3 марта 2012 г.
  22. ^ "IDEA 2011 Best in Show". Общество промышленных дизайнеров Америки . idsa.org. 23 сентября 2011 г. Архивировано из оригинала 25 февраля 2014 г.
  23. ^ "Windows Phone 7". Industrial Designers Society of America . idsa.org. 8 июня 2011 г. Архивировано из оригинала 15 мая 2013 г. Получено 20 сентября 2011 г.
  24. ^ «Создание другого типа пользовательского интерфейса».
  25. ^ Хатчинсон, Ли (12 июля 2014 г.). «Тенденции в разработке программного обеспечения, которые мы любим ненавидеть». Ars Technica . Condé Nast .
  26. ↑ Брайт, Питер (25 апреля 2012 г.). «Windows 8 на рабочем столе — неуклюжий гибрид». Ars Technica . Condé Nast Digital . С. 1–5.
  27. ^ Леонхард, Вуди (15 августа 2012 г.). «Обзор Windows 8: Да, он настолько плох». InfoWorld . IDG .
  28. ↑ Барни, Дуг (17 августа 2012 г.). «Windows 8 уже позади, пора беспокоиться». Redmond Magazine . 1105 Media.
  29. ↑ Уоррен, Том (2 августа 2013 г.). «Эксклюзив: брендинг Metro от Microsoft будет заменен «на этой неделе» согласно внутренней записке». The Verge . Vox Media .
  30. ↑ Брайт, Питер (3 августа 2012 г.). «Microsoft: «Metro» больше нет, «Windows 8-style UI» больше нет, на фоне слухов о споре о торговой марке». Ars Technica . Condé Nast .
  31. ^ Смит, Крис (3 августа 2012 г.). «Microsoft отказывается от названия «Metro» для Windows 8 из-за опасений по поводу торговой марки». TechRadar . Получено 24 сентября 2013 г.
  32. ^ Уитни, Лэнс (10 августа 2012 г.). «Почему Microsoft убрала название „Metro“?». CNET . CBS Interactive .
  33. ^ Fingas, Jon (2 августа 2012 г.). «Microsoft преуменьшает значение названия дизайна Metro, может столкнуться с судебным иском из-за всего этого уличного жаргона». Engadget . AOL .
  34. ^ Патрицио, Энди (6 августа 2012 г.). «Источник подтверждает, что Microsoft отказалась от Metro из-за оплошности с торговой маркой». Network World . IDG .
  35. ^ Вингфилд, Ник (3 августа 2012 г.). «Microsoft отказывается от названия Metro ради нового образа продукта». Блог Bits . The New York Times Company .
  36. ^ "Microsoft откажется от названия 'Metro' для Windows". BBC News Online . BBC . 3 августа 2012 г.
  37. ^ Фоли, Мэри Джо (2 августа 2012 г.). «Метро теперь запрещённое слово в Microsoft?». ZDNet . CBS Interactive .
  38. ^ Хамфрис, Мэтью (3 августа 2012 г.). «Microsoft прекращает использование имени Metro». Geek.com . Архивировано из оригинала 16 июня 2015 г. Получено 13 июня 2015 г.
  39. ^ Кайзер, Грегг (10 августа 2012 г.). «Microsoft заменяет «Metro» на «Windows 8» и «Modern» ярлыки». Computerworld . Получено 30 января 2020 г. .
  40. ^ ab "Microsoft наконец-то призналась в своих планах по наименованию после Metro". ZDNet . CBS Interactive . 12 сентября 2012 г.
  41. ^ "Создание отличных приложений для Магазина Windows". MSDN . Microsoft . Получено 5 августа 2017 г. .
  42. ^ "Исследование случая проектирования: приложение для iPad в Windows Store". MSDN . Microsoft . Получено 28 мая 2013 г. .
  43. ^ "Руководство по типографике". MSDN . Microsoft . Получено 28 мая 2013 г. .
  44. ^ "План разработки приложений для Магазина Windows с использованием DirectX и C++". MSDN . Microsoft . Получено 28 мая 2013 г. .
  45. ^ Tschumy, Will (16 ноября 2012 г.). «Язык дизайна Microsoft». Channel 9 . Microsoft .

Внешние ссылки