For faster navigation, this Iframe is preloading the Wikiwand page for Material Design.

Material Design

Материал из Википедии — свободной энциклопедии

Основные компоненты Material Design

Material Design (рус. Материальный дизайн) — дизайн-система для создания интерфейсов программного обеспечения и приложений, разработанная компанией Google. Впервые представлен на конференции Google I/O 25 июня 2014 года. Стиль расширяет идею «карточек», появившуюся в Google Now, более широким применением строгих макетов, вариантов анимации переходов, отступов и эффектов глубины (света и тени). По идее графических дизайнеров Google, у приложений не должно быть острых углов, карточки должны переключаться между собой плавно и практически незаметно[1].

Пример Material You
Пример Material You

Material Design, анонсированный в 2014 году, использовался в операционных системах Android с версии Lollipop и до Android 11.

Material Theme (Material Design 2)

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

В 2018 году Google кастомизировала приложения, внедрив собственные темы Material Theme (Material Design 2[2])[3]. Он подчеркивает пустое пространство, закругленные углы, красочные значки, нижние панели навигации и использует специальную оптимизированную по размеру версию фирменного шрифта Google Product Sans под названием Google Sans.

Material You (Material Design 3)

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

В мае 2021 года, вместе с Android 12, Google представила новый интерфейс «Material You» (он же «Material Design 3»)[4][5][6]. Особое внимание уделяется усиленной анимации[прояснить], более крупным кнопкам и возможности настраиваемого пользовательского интерфейса. Темы, которые будут созданы из обоев пользователя. В последующие месяцы «Material You» постепенно внедрялся в различные приложения Google на старых версиях Android, и ему было уделено основное внимание в серии смартфонов Pixel 6 и Pixel 6 Pro.

Методические рекомендации

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

Методические рекомендации по исполнению и внедрению Material Design были опубликованы Google на официальном сайте проекта в разделе «Guidelines». Раздел включает в себя рекомендации по использованию цветов, шрифтов, кнопок, иконок, анимаций, переходов и других элементов приложений и сайтов. Помимо этого, платформа предоставляет собственный инструмент для внедрения Material Design — плагин Material Theme Editor для Sketch.

Каноническое исполнение Material Design для веб-приложений называется Polymer Paper Elements. Оно содержит библиотеку Polymer, прослойку с API к веб-компонентам для браузеров, не поддерживающих стандарт Polymer, а также коллекцию Paper Elements[7].

Примечания

[править | править код]
  1. Google's new 'Material Design' UI coming to Android, Chrome OS and the web. Engadget. Дата обращения: 26 июня 2014. Архивировано 27 июня 2014 года.
  2. Hall, Stephen What exactly is this so-called 'Material Design 2,' and what will it look like? (англ.). 9to5Google (26 апреля 2018). Дата обращения: 6 сентября 2020. Архивировано 10 августа 2020 года.
  3. Material Design (англ.). Material Design. Дата обращения: 6 сентября 2020. Архивировано 16 января 2021 года.
  4. Dieter Bohn. Android 12 preview: first look at Google’s radical new design (англ.). The Verge (18 мая 2021). Дата обращения: 16 ноября 2021. Архивировано 22 мая 2021 года.
  5. Android 12's new Material You UI is partly live in the first beta (англ.). Android Police (18 мая 2021). Дата обращения: 16 ноября 2021. Архивировано 20 мая 2021 года.
  6. Константин Иванов. Material You: что такое, с чем едят и как он поменяет облик ОС Android. Mobile-Review.com (22 мая 2021). Дата обращения: 12 октября 2023. Архивировано 22 сентября 2023 года.
  7. Material design with Polymer. Google. Архивировано из оригинала 20 августа 2014 года.
В другом языковом разделе есть более полная статья Material Design (англ.). Вы можете помочь проекту, расширив текущую статью с помощью перевода
{{bottomLinkPreText}} {{bottomLinkText}}
Material Design
Listen to this article

This browser is not supported by Wikiwand :(
Wikiwand requires a browser with modern capabilities in order to provide you with the best reading experience.
Please download and use one of the following browsers:

This article was just edited, click to reload
This article has been deleted on Wikipedia (Why?)

Back to homepage

Please click Add in the dialog above
Please click Allow in the top-left corner,
then click Install Now in the dialog
Please click Open in the download dialog,
then click Install
Please click the "Downloads" icon in the Safari toolbar, open the first download in the list,
then click Install
{{::$root.activation.text}}

Install Wikiwand

Install on Chrome Install on Firefox
Don't forget to rate us

Tell your friends about Wikiwand!

Gmail Facebook Twitter Link

Enjoying Wikiwand?

Tell your friends and spread the love:
Share on Gmail Share on Facebook Share on Twitter Share on Buffer

Our magic isn't perfect

You can help our automatic cover photo selection by reporting an unsuitable photo.

This photo is visually disturbing This photo is not a good choice

Thank you for helping!


Your input will affect cover photo selection, along with input from other users.

X

Get ready for Wikiwand 2.0 🎉! the new version arrives on September 1st! Don't want to wait?