原文鏈接：Lessons Learned From Analyzing Material Design Components
如果你通讀過Google的material design指南，你就會知道它寫的有多詳細悍募，它涉及的范圍有多廣贸呢。通讀過這部“指南”后，你會受益匪淺轧铁。指南中講述的課程，最出色的一點在于，它證明了我們有可能構(gòu)建復(fù)雜的視覺樣式設(shè)計規(guī)范诬留。構(gòu)建這樣的設(shè)計規(guī)范并不容易揩环，但對于復(fù)雜的Google產(chǎn)品陣列而言搔弄，這又是可能的。
如果你想要學(xué)習(xí)一些關(guān)于視覺設(shè)計的知識丰滑，你應(yīng)該仔細研讀一下material design中設(shè)計獨立視覺元素或組件的方法顾犹。指南中詳細講述了18個不同的設(shè)計元素，從按鈕到菜單（menus）褒墨，再到頁簽（tabs）炫刷。那么，分析這些元素能學(xué)到什么呢郁妈？
擁抱變化
有很多關(guān)于按鈕的設(shè)計規(guī)范浑玛。在material design中有3種按鈕類型：懸浮（floating）噩咪、浮動（raised）和扁平（flat）顾彰。在各種運用material design的用戶界面中，很少只會用到一種類型的按鈕樣式胃碾。
同樣涨享，在各種各樣的用戶界面中，也很難保證設(shè)計的一致性仆百。但是厕隧，為了做出最好的設(shè)計，material design仍舊采用了三種不同的按鈕樣式。其他設(shè)計方案則有時不那么好吁讨。
“要基于主按鈕髓迎、屏幕上容器的數(shù)量以及整體布局為你的按鈕選擇設(shè)計風(fēng)格”——如何使用按鈕。
對于按鈕的設(shè)計指導(dǎo)建丧，有的說的清晰排龄，有的則較模糊〔杈椋總的來說涣雕，指南的說明是經(jīng)過深思熟慮的。指南中闭翩，詳細描述了在使用按鈕時挣郭，哪些應(yīng)該做，哪些不應(yīng)該做疗韵，所以這對于設(shè)計師而言很好理解兑障。這就是整個設(shè)計指南最出色的地方——它能讓設(shè)計師自行決定設(shè)計方案。
注意經(jīng)常被忽視的細節(jié)
當(dāng)你設(shè)計用戶界面時蕉汪，你曾經(jīng)多少次構(gòu)思過彈出窗口或報警模塊流译？material design設(shè)計指南有一章主要講對話框的。設(shè)計師通常并不是一開始就要設(shè)計這些對話框者疤，但當(dāng)要用到時福澡，它們?nèi)耘f是界面設(shè)計的一部分，需要認真對待驹马。
關(guān)于對話框的設(shè)計指導(dǎo)很詳細革砸。其中說明了需要用哪種類型的按鈕，以及為什么要那樣用糯累。同時算利，還翔實又透徹地寫出了關(guān)于對話框的詳細設(shè)計說明。
“在每個按鈕的文本信息都沒有超過最大按鈕寬度時泳姐，推薦使用并排模式效拭。比如說最常用的 確定/取消 按鈕”——對話框。
“當(dāng)按鈕的文本超過了最大按鈕寬度時胖秒，你就可以使用豎向疊加模式來呈現(xiàn)按鈕文字信息缎患。”——對話框阎肝。
設(shè)計指南規(guī)定了對話框中需要包括的內(nèi)容類型和行為方式挤渔。這種對細節(jié)的延伸既迷人又有趣，因為這些都是通常被忽略的設(shè)計元素盗痒。這正好說明了一點，那就是為了打造一種強有力的設(shè)計規(guī)范和設(shè)計語言，任何一個元素都至關(guān)重要俯邓。
和“ 可感知性（Affordance）”有關(guān)的一切
在指南中骡楼，很多次強調(diào)了“可感知性（affordance）”（譯者注：affordance是 afford（能夠承擔(dān)）的名詞形式，在討論設(shè)計時指的是物體或?qū)ο缶哂械哪撤N操作或功能上的暗示性稽鞭，有人翻譯成可供性鸟整，但個人認為可感知性更好理解）。創(chuàng)造一種新的朦蕴、統(tǒng)一的設(shè)計語言篮条，唯一目的在于提供跨瀏覽器/平臺的可感知性。為了打造高質(zhì)量的設(shè)計指南吩抓，需要將“可感知性”包含在設(shè)計指南中涉茧。
“頁簽（tab） 用來顯示有關(guān)聯(lián)的分組內(nèi)容。tab標(biāo)簽用來簡要的描述內(nèi)容疹娶“樗ǎ”——頁簽（Tabs）
在material design設(shè)計指南中，關(guān)于頁簽（Tabs）的用法描述的很聰明雨饺。Material design并沒有將頁簽（Tabs）作為表單導(dǎo)航來用钳垮，而是用它來作為瀏覽內(nèi)容的另外一種方式。令人耳目一新的是额港，某些特定元素饺窿，比如頁簽工具條（tab bar），是有使用條件的移斩。通過元素的風(fēng)格及其功能仪搔，來了解制定material design的設(shè)計師的想法憎账，從而避免濫用，這一點很好。
如果詳細定義了不同元素的功能泼菌，這些元素就會各司其職。反過來陨亡，這樣也能幫助構(gòu)建“可感知性（affordance）”犀填。如果某個元素以各種方式重復(fù)出現(xiàn)，用戶就會一頭霧水超升，這種做法對用戶而言既不明確入宦，又不公平。
“在一款app 中室琢，頁簽（tabs） 使在不同的視圖和功能間探索和切換乾闰，以及瀏覽不同類別的數(shù)據(jù)集變得簡單∮危” ——頁簽（Tabs）
創(chuàng)造你自己的設(shè)計元素
“Snackbar 是一種針對操作的輕量級反饋機制涯肩，常以一個小的彈出框的形式轿钠，出現(xiàn)在手機屏幕下方或者桌面左下方。它們出現(xiàn)在屏幕所有層的最上方病苗，包括浮動操作按鈕疗垛。”——Snackbars和Toasts
“Toast 同 Snackbar 非常相似硫朦，但是 Toast 并不包含操作贷腕，也不能從屏幕上滑動關(guān)閉∫д梗”——Snackbars和Toasts
material design設(shè)計指南有一章很有趣泽裳，講述了叫做“Snackbars和Toasts”的組件。這是兩個你不經(jīng)常聽到的設(shè)計術(shù)語破婆，snackbars和toasts都是我們已知的設(shè)計元素涮总。如果你你看了上面的“引用”文字，并注意到下面的圖片荠割，你就會知道snackbars和toasts就是個簡單的彈出提示妹卿。
但我們這里所說的更重要。Material design包括各種彈窗類型蔑鹦。設(shè)計語言需要這么做夺克，因此material design就這么做了。Snackbars以及toasts和對話框很像嚎朽，但還是有所不同铺纽，因此，它們是獨立存在的哟忍。Material design把它們簡單地區(qū)分開狡门，因為人們需要這兩種彈窗來執(zhí)行不同的功能。就像material design的其他組件一樣锅很，snackbars和toasts都有詳細的設(shè)計指導(dǎo)——用例其馏、尺寸和顏色。
某些設(shè)計元素在一些場景下不能使用叛复，但我們通常會忽視這一點。有趣的是扔仓，一些很簡單的事褐奥，比如定義兩種不同的功能彈窗，需要花費很長時間翘簇。我們不要忘記進行設(shè)計上的創(chuàng)新撬码，包括去采納那些可能被視為過時的設(shè)計元素，或者你希望被廢除版保，但實際并仍舊存在的設(shè)計元素呜笑。在一些小事上進行創(chuàng)新非常重要夫否，因為在今后的設(shè)計道路上，它們將會發(fā)揮非常大的作用叫胁。
你和Material Design
通讀一遍material design設(shè)計指南慷吊，讓我們知道你從中學(xué)到了什么。令人驚訝的是曹抬，通過這樣一個簡單的文檔梳理可以教你這么多關(guān)于設(shè)計的知識。
