Metro (интерфейс)

Материал из Википедии — свободной энциклопедии
Перейти к: навигация, поиск
Логотип Metro
Дизайн экрана «Пуск» в Windows 8 в стиле Metro

Metro (произносится мэ́тро[1]) — внутреннее кодовое название дизайнерского языка компании Microsoft, ориентированного на типографское оформление интерфейса пользователя.

Изначально этот язык был разработан Майкрософт для использования в Windows Phone, также использовался при создании пользовательского интерфейса в Microsoft Encarta и MSN 2.0, а также Zune и Windows Media Center. Позже на основе Metro был построен интерфейс Windows Phone, веб-сайта Microsoft, Xbox 360 и Windows 8[2].

История[править | править вики-текст]

Знаки в системе перевозок King County Metro, послужившие вдохновением для создания Metro

Команда дизайнеров Microsoft считает, что в качестве вдохновения для создания Metro послужили знаки, часто встречающиеся в системах общественного транспорта — например, расположенные в системе перевозок King County Metro[3], которая обслуживает большую область Сиэтла, где расположена штаб-квартира Microsoft.

Ранние элементы стиля Metro можно увидеть в Windows Media Center для Windows XP Media Center Edition, который использует текст в качестве основной формы навигации. Этот интерфейс был также перенесён в более поздние версии Media Center. В 2006 году интерфейс Zune был обновлён с использованием этих принципов. Дизайнеры Microsoft решили перепроектировать интерфейс с бо́льшим упором на чистую типографику. Эти принципы и новый пользовательский интерфейс Zune были использованы в Windows Phone, многие решения которой были использованы в Windows 8. Плоские цветные «живые плитки» были введены в Metro на ранних стадиях разработки Windows Phone. Microsoft начала интеграцию этих элементов в другие свои продукты, с прямым влиянием, усматриваемым в более новых версиях Windows Live Messenger, Live Mesh и Windows 8[2].

Принципы[править | править вики-текст]

Стиль Metro основан на принципах дизайна швейцарского стиля. Основными принципами Metro являются акцент на хорошей типографике и крупный текст, который сразу бросается в глаза. Microsoft называет Metro «простым, чистым, современным», а также «обновлением» по сравнению с основанными на значках интерфейсами Windows, Android и iOS[4].

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

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

Microsoft составила внутренний список принципов, считающихся основой Metro[7].

Примерно одновременно с официальным выпуском Windows 8 (26 октября 2012 года), поскольку всё больше разработчиков и партнёров Microsoft начали работать над созданием новых приложений в стиле Metro, по этой теме были созданы многие веб-сайты с ресурсами, в том числе UX guidelines for Windows Store Apps от Microsoft.

Шрифт[править | править вики-текст]

Новая версия используемого в типографике Metro шрифта Segoe UI (внизу), созданная для Windows 8.

В качестве основного шрифта используются шрифты из семейства шрифтов Segoe, разработанного Стивом Мэттсоном (англ.) из Agfa Monotype и лицензированного Microsoft. Для Zune Microsoft создала специальную версию под названием Zegoe UI[8], а для Windows Phone — семейство шрифтов «Segoe WP». Для Windows 8 также была создана специальная версия с тем же названием Segoe UI.

Все эти шрифты в основном отличаются только незначительными деталями. Наиболее очевидные различия между Segoe UI и Segoe WP видны в цифровых символах. Версия Segoe UI, используемая в Windows 8, похожа на Segoe WP. Символы с заметным типографскими изменениями в этой версии включают 1, 2, 4, 5, 7, 8, а также I и Q.

Оценки[править | править вики-текст]

Ранняя реакция на Metro была в целом положительной. В обзоре Zune HD, Engadget (англ.) сказал: «Microsoft продолжает свой рывок к большой, большой типографике здесь, обеспечивая сложный, аккуратно разработанный макет, который почти настолько же функционален, насколько привлекателен»[9]. CNET похвалил Metro, говоря, «он немного более смелый и неформальный, чем жёсткие, стерильные „сетки“ из значков и похожее на картотеку меню iPhone и iPod touch»[10].

Общество промышленных дизайнеров Америки (англ. The Industrial Designers Society of America, IDEA) наградило Windows Phone, который использует Metro, золотой наградой «Народный выбор дизайна», а также премией «Лучший на выставке»[11]:

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

— Изабель Анкона, консультант по пользовательскому опыту в IDEA[12]

25 августа 2012 года, Питер Брайт (англ. Peter Bright) из Ars Technica сделал обзор предварительной версии Windows 8, посвятив первую часть обзора сопоставлению экрана «Пуск» Windows 8 (построенного с помощью Metro) и его предыдущей версии в Windows 7 и ранее. Перебирая их плюсы и минусы, Питер Брайт пришёл к выводу, что экран «Пуск», хотя и не лишён некоторых проблем, является явным победителем[13].

Отказ от использования названия Metro[править | править вики-текст]

В августе 2012 года начали циркулировать слухи, что один из розничных партнёров Microsoft — германская компания Metro AG — угрожала судебным иском против Microsoft за нарушение прав на товарный знак «Metro». Разработчикам и сотрудникам Microsoft была разослана памятка, призывавшая отказаться от использования термина «Metro» в связи с результатами переговоров с «важным европейским партнёром»[14][15]. Microsoft временно называет язык дизайна «Modern UI».

9 августа 2012 выяснилось, что Microsoft планирует использовать термин «Windows 8», чтобы заменить «Metro» в потребительских материалах, а термин «Modern UI» предназначен для разработчиков, которые планируют создавать программное обеспечение на основе новых принципов дизайна[16]. С сентября 2012 года в документации MSDN используется термин «язык дизайна Microsoft» (англ. Microsoft design language), когда речь идет о языке дизайна[17][18][19][20]. Кроме того, на конференции разработчиков Microsoft Build 2012 компания также использует название «язык дизайна Microsoft»[21][22].

Для обозначения созданных в стиле Metro приложений для Windows 8 употребляются термины «приложение в стиле Windows 8» (англ. Windows 8-style app), и «приложение Магазина Windows» (англ. Windows Store app).

См. также[править | править вики-текст]

Ссылки[править | править вики-текст]

Примечания[править | править вики-текст]

  1. См., например, это видео.
  2. 1 2 Windows Phone 7 Series UI Design & Interaction Guide (англ.) (18 March 2010). Проверено 9 октября 2010. Архивировано из первоисточника 16 мая 2013.
  3. Metro Design Language of Windows Phone 7 (англ.). microsoft.com. Проверено 5 октября 2012. Архивировано из первоисточника 24 мая 2013.
  4. Browse Blackboard Home. Metro - Blackboard (англ.). Businessinsider.com (25 April 2011). Проверено 3 ноября 2011. Архивировано из первоисточника 24 мая 2013.
  5. Windows Phone UI and Design Language (англ.). Проверено 9 октября 2010. Архивировано из первоисточника 24 мая 2013.
  6. «From Transportation to Pixels», Windows team blog, 2011-02-16, <http://windowsteamblog.com/windows_phone/b/wpdev/archive/2011/02/16/from-transportation-to-pixels.aspx> 
  7. Metro Design Language of Windows Phone 7 | Microsoft Design .toolbox (англ.). Microsoft.com. Проверено 8 сентября 2011. Архивировано из первоисточника 16 мая 2013.
  8. Long Zheng. “Zegoe”, the new Zune font. (англ.). istartedsomething.com (14 Novemver 2007). Проверено 15 октября 2012. Архивировано из первоисточника 25 мая 2013.
  9. Topolsky, Joshua Zune HD review (англ.). Aol (17 September 2009). Проверено 19 февраля 2013. Архивировано из первоисточника 25 мая 2013.
  10. Zune HD 64GB Review (англ.). CNET. CBS Interactive (17 September 2009). Проверено 19 февраля 2013. Архивировано из первоисточника 25 мая 2013.
  11. Warren, Tom Windows Phone wins IDEA 2011 – people’s choice design award (англ.). WinRumors (18 September 2011). Проверено 19 февраля 2013. Архивировано из первоисточника 28 мая 2013.
  12. Windows Phone 7 (англ.). Industrial Designers Society of America (8 June 2011). Проверено 3 ноября 2011. Архивировано из первоисточника 28 мая 2013.
  13. Bright, Peter Windows 8 on the desktop—an awkward hybrid (англ.). Ars Technica. Condé Nast Digital (25 April 2012). Проверено 19 февраля 2013. Архивировано из первоисточника 25 мая 2013.
  14. Microsoft вынуждена сменить название интерфейса (англ.). BBC (3 August 2012). Проверено 19 февраля 2013. Архивировано из первоисточника 10 марта 2013.
  15. Microsoft to drop 'Metro' name for Windows 8 (англ.). BBC News. Проверено 26 мая 2013. Архивировано из первоисточника 26 мая 2013.
  16. Microsoft officlally renaming Metro UI to Modern UI (англ.). The Register (1 August 2012). Проверено 26 мая 2013. Архивировано из первоисточника 26 мая 2013.
  17. Make great Windows Store apps. MSDN. Проверено 17 сентября 2012. Архивировано из первоисточника 26 мая 2013.
  18. Design case study: iPad to Windows Store app (англ.). MSDN. Проверено 1 ноября 2012. Архивировано из первоисточника 26 мая 2013.
  19. Guidelines for typography (англ.). MSDN. Проверено 1 ноября 2012. Архивировано из первоисточника 26 мая 2013.
  20. Roadmap for Windows Store apps using DirectX and C++ (англ.). MSDN. Проверено 1 ноября 2012. Архивировано из первоисточника 26 мая 2013.
  21. The Microsoft design language (англ.). Channel 9 (Microsoft). Проверено 1 ноября 2012. Архивировано из первоисточника 26 мая 2013.
  22. Mary Jo Foley. Microsoft Design Language: The newest official way to refer to 'Metro' (англ.). Проверено 1 ноября 2012. Архивировано из первоисточника 26 мая 2013.