谷歌設計系統 Material Design 改版成 Material You 後，變化有多大？

現在進去 Material Design，會發現他們已經大更新了。

不但單獨搞了一個網站，並且取名為 Material You。

Google 的 Material Design 和 Apple 的 Human Interface Guidelines 並列為移動端兩大規範。

雖然國內很多公司以 iOS 為基準做設計，但是要論設計規範的 細緻嚴謹 ，還是 Material Design 更給力。

所以對於初中級設計師來說，多看 Material Design 對 學習提升 是很有幫助的。

為了幫助中文設計師們學習最新的 Material 設計體系，我們知識星球裡的 30+ 個小夥伴耗時兩週時間，整理出來了一份 中文翻譯 版 免費 送給大家： Material Design 3 中文版 · 語雀

如果你想先快速瞭解一下 Material Design 的 更新內容 ，可以繼續往下讀～

改了成什麼樣了？

畢竟 Android 和 Material Deisgn 都是同屬 Google 旗下，所以看看 Android 的官方視訊就很能 get 到了：

整體來說……不知道這句話對不對……我覺得是更像 iOS 了

其實 Material Design 之前就經常被說不好看，被評價時也經常用「嚴謹」、「技術」、「科學」之類的詞。

我記得之前發過一篇 Material Design 和 iOS 的對比文章，評論區就有人說更喜歡前者（iOS）： iOS 規範與 Material Design 哪裡不同？官網總結了這幾點

可能是 Material Design 的設計團隊終於想通，也要認真搞一搞視覺了？

因為新版的 Material Design 顏值真的有明顯提升啊！

顏色變柔和了

只要是去過 Material Design 老版官網的人，肯定對那個紫色的標題欄記憶猶新：

雖說這個顏色理論上是可以自定義的，但是從現如今的審美，這個亮紫色真的不太好看了。

而且我如果想要在官網圖示裡，找幾個有代表性的案例，都很難調出順眼的：

但是現在，官方給的圖示變成了這樣：

尤其是那種鮮豔的標題欄去掉了，原來的純灰色裡也增加了一點色調：

以前顏色設定只需要幾種，而且很多都是黑白：

現在搞得更有層次了，但也複雜多了，而且還可以多搞一套深色主題：

圓角變大了

之前 Material Design 給人的感覺是比較鋒利的，卡片大多沒有圓角，按鈕大多是小圓角：

而現在，圓角都變大了，甚至圖片都加上圓角了：

不過，也不是所有圓角都簡單地加大尺碼了。

Material Design 原本標誌性的懸浮按鈕，反而從圓形變成了圓角矩形：

而標籤，反而把圓角縮小了：

字型常規化了

以前 Material Design 的大標題很醒目：

現在字型變細，最大尺寸也變小了。

而且單獨一行時，會佔用左上角圖表的那一列位置，更節約空間。

這樣把所有文字樣式拿出來對比一下，還挺明顯的：

適配更強大了

Material Design 一開始就是用一套規範來同時適配 PC端、平板端和手機端，這就挺不容易的：

新版的 Material You，適配能力更上一層樓：

更厲害的是，他們居然也為摺疊屏做了適配，可謂是緊跟時代潮流了：

最近刷到好幾款摺疊屏手機的新聞，產品設計對摺疊屏適配真的越來越重要了。

資料奉上

這是老版和新版的官網，有條件的可以去看看：

Material Design: http:// material.io

Material You: http://m3.material.io

下面是我們整理出來的中文翻譯版，歡迎閱讀（有素材包）：

最後感謝一下參與此次編譯的小夥伴們 :heart:

小王是酸菜魚、WKL.、FredMac、王巨集遠、fa fa、jenny.、yuan媛媛、Loby、1792、Jojo、ellaw、荔灣、Yishan、siyuan、H姓小鮮肉、江文靜、米飯飯熙、餵魚、粵粵、我愛吃魚、韓三能、春天、大進、可樂瓶、Brian、大胖、大亭子、雪糕