Material Design

Design language developed by Google in 2014
Material Design
Material Design 3 on Android 12
Developer(s)Google
Initial releaseJune 25, 2014; 9 years ago (2014-06-25)
Release(s)
Stable release(s) [±]
Android1.11.0[1] Edit this on Wikidata / 14 December 2023; 4 months ago (14 December 2023)
iOS124.2.0[2] Edit this on Wikidata / 26 April 2021; 2 years ago (26 April 2021)
Web14.0.0[3] Edit this on Wikidata / 28 April 2022; 23 months ago (28 April 2022)
Preview release(s) [±]
Repository
  • Web: material-components-web
  • Android: material-components-android
  • iOS: material-components-ios
  • Flutter: material-components-flutter
Written inHTML, CSS, Sass (v4), JavaScript, AngularJS, Angular, Java, Objective-C, Swift, Dart
PlatformAndroid, iOS, Web
TypeDesign language software
License
WebsiteLatest Version
  • Material Design 3

Archived Versions

  • Material Design 1
  • Material Design 2

Material Design (codenamed Quantum Paper)[4] is a design language developed by Google in 2014. Expanding on the "cards" that debuted in Google Now, Material Design uses more grid-based layouts, responsive animations and transitions, padding, and depth effects such as lighting and shadows. Google announced Material Design on June 25, 2014, at the 2014 Google I/O conference.[5]

The main purpose of Material Design is the creation of a new visual language that combines principles of good design with technical and scientific innovation. Designer Matías Duarte explained that, "unlike real paper, our digital material can expand and reform intelligently. Material has physical surfaces and edges. Seams and shadows provide meaning about what you can touch." Google states that their new design language is based on paper and ink but implementation takes place in an advanced manner.[6][7][8]

In 2018, Google detailed a revamp of the language, with a focus on providing more flexibility for designers to create custom "themes" with varying geometry, colors, and typography. In 2021, a further evolution of the design language, titled Material You, was unveiled.[9]

Implementation

Material Design was to be gradually extended throughout Google's array of web and mobile products, providing a consistent experience across all platforms and applications. Google has also released application programming interfaces (APIs) for third-party developers to incorporate the design language into their applications.[10][11][12]

The canonical open source implementation of Material Design for web application user interfaces is called Material Web.[13]

Updates

Material Design 2
Material You

Material Design 2

After the 2018 revamp, Google began redesigning most of their apps based on an updated set of principles and guidelines dubbed "Material Design 2",[14] which provided a larger focus on customization of the basic Material Design components to adapt to the branding of the products in which it is being used.[15] The updated guidelines further heavily emphasizes white space, rounded corners, colorful icons, and bottom navigation bars. Google began utilizing a special size-optimized version of their proprietary Product Sans font called Google Sans.[16]

Material Design 3 (Material You)

At Google I/O in May 2021, Google announced a new concept on Android 12 known as "Material You" (also known as "Material Design 3"[17]), emphasizing increased animation, larger buttons, and the ability for custom UI themes to be generated from the user's wallpaper.[9] Material You was gradually rolled out to various Google apps on older Android versions in the following months, and acted as a major focus on the Pixel 6 and Pixel 6 Pro smartphone series.[18][19][20]

See also

References

  1. ^ "Release 1.11.0". 14 December 2023. Retrieved 19 December 2023.
  2. ^ "Release 124.2.0". 26 April 2021. Retrieved 18 May 2021.
  3. ^ "Release 14.0.0". 28 April 2022. Retrieved 28 October 2022.
  4. ^ "Exclusive: Quantum Paper And Google's Upcoming Effort To Make Consistent UI Simple". Techcrunch. 11 June 2014. Retrieved 11 June 2014.
  5. ^ "Material design". PopArt Studio. Retrieved 10 April 2024.
  6. ^ "Google's new 'Material Design' UI coming to Android, Chrome OS and the web". Engadget. Retrieved 26 June 2014.
  7. ^ "Google's New, Improved Android Will Deliver A Unified Design Language". Co.Design. 25 June 2014. Retrieved 26 June 2014.
  8. ^ "Google Reveals Details About Android L at Google IO". Anandtech. Retrieved 26 June 2014.
  9. ^ a b Bohn, Dieter (2021-05-18). "Android 12 preview: first look at Google's radical new design". The Verge. Retrieved 2021-05-19.
  10. ^ Chris Smith (30 July 2014). "Google's Material Design is about to change the way we look at the worldwide web". BGR.
  11. ^ "We just played with Android's L Developer Preview". Engadget. AOL. Retrieved 26 June 2014.
  12. ^ "Google's next big Android redesign is coming in the fall". The Verge. Vox Media. 25 June 2014. Retrieved 26 June 2014.
  13. ^ "Web – Material Design 3". Archived from the original on 2023-09-08.
  14. ^ Hall, Stephen (2018-04-26). "What exactly is this so-called 'Material Design 2,' and what will it look like?". 9to5Google. Retrieved 2020-09-06.
  15. ^ "Material Design". Material Design. Retrieved 2020-09-06.
  16. ^ Hall, Stephen (2018-05-09). "Now we know: Google Sans is actually a size-optimized version of Product Sans". 9to5Google. Retrieved 2020-09-06.
  17. ^ Material Design [@materialdesign] (October 27, 2021). "🎊 The latest in Material Design is NOW available. With Material Design 3, our next generation of the system, we're introducing Material You — a new set of features that help make your apps more personalized. Give it a try → goo.gle/m3-material-io #AndroidDevSummit" (Tweet). Retrieved October 27, 2021 – via Twitter.
  18. ^ Warren, Tom (September 10, 2021). "Google's Material You design is coming to Gmail, Calendar, and Docs on Android". The Verge. Retrieved September 19, 2021.
  19. ^ Li, Abner (September 15, 2021). "Google Photos rolling out Material You redesign, but without Dynamic Color". 9to5Google. Retrieved September 19, 2021.
  20. ^ "Google Contacts is already getting its Material You UI makeover". Android Police. 2021-07-29. Retrieved 2021-09-19.

External links

Wikimedia Commons has media related to Material Design.
  • Official website Edit this at Wikidata
    • Material Design 1
    • Material Design 2
    • Material Design 3
  • v
  • t
  • e
Android
Software
development
Development tools
Official
Other
Integrated
development
environments (IDE)
Languages, databases
Virtual reality (VR)
Events, communities
ReleasesDerivativesDevices
Pixel
Nexus
Play edition
Custom
distributionsBooting and recoveryAPIsAlternative UIsRootingListsRelated topics
  • Category:Android development
  • Category:Mobile telecommunications
  • Software portal
  • Telecommunication portal
  • v
  • t
  • e
Company
Divisions
People
Current
Former
Real estate
Design
Events
YouTube
Projects and
initiatives
Criticism
YouTube
Operating systems
Libraries/
frameworks
Platforms
Apigee
Tools
Search algorithms
Others
File formats
Entertainment
Play
YouTube
Communication
Search
Navigation
Business
and finance
Organization
and productivity
Docs Editors
Publishing
Education
Others
Chrome
Images and
photography
Hardware
Smartphones
Laptops and tablets
Wearables
Others
  • v
  • t
  • e
Advertising
Antitrust
Intellectual property
Privacy
Other
  • Category
Terms and phrases
Documentaries
Books
Popular culture
Others