如果你讀過Google的Material設計文檔，你就會發(fā)現(xiàn)其對細節(jié)和深度的注重。在文檔中你能學到很多東西。其中最為重要的一項，就是其證明了編寫復雜視覺風格指南是完全可能的。盡管可能困難重重，但還是可能的。特別是對于Google復雜多樣的產品組合來說。
如果你想學習視覺設計，就應該認真研究一下Material設計是如何處理不同元素或要素的。Google的文檔詳細介紹了18種不同的設計元素，從按鈕到菜單再到標簽等等等等。那么，通過分析這些設計元素能給我們帶來哪些收獲呢？
接受變體
文檔中僅按鈕就有很多不同的規(guī)則?！端夭脑O計》中介紹了三種不同的按鈕類型：浮動、突起和扁平。在《素材設計》所介紹的各種不同界面中要只使用單一的一種按鈕類型是非常困難的。
同時，要保證各種不同界面之間的一致性也不容易。然而，為了保證最佳設計效果，Material設計采用了三種不同的按鈕類型。其所采用的方法就是將設計改造成有時看似不太好的模式。
“為主要按鈕選擇按鈕類型要取決于按鈕的重要地位、屏幕上的框架數(shù)量以及屏幕整體布局情況。”
按鈕方面的部分指南比較具體，還有一部分比較模糊。總而言之，指南思考的非常透徹。指南中就如何使用以及何時不使用按鈕有非常詳盡的說明，以方便設計師開展工作。而這正是這份指南的美妙之處，其將設計的決定權交給了設計師。
注意容易被遺忘的要素
你在設計界面時是否會經?？紤]彈窗或提醒模塊？Material設計文檔中有專門介紹對話框的一節(jié)。通常來說設計師不會從對話框入手進行設計。但在使用對話框時，它們同樣屬于設計的一個組成部分，需要相應的處理。
指南中有關對話框的部分非常詳盡。其介紹了需要在其中使用的按鈕類型以及相應原因。另外，指南還對對話框的架構進行了解釋，其內容詳實并且透徹。
“如果每個標簽上的文字不超出最大按鈕寬度（例如常用的確定/取消按鈕），那么推薦使用并排按鈕?！?“如果文字標簽超出了最大按鈕寬度，則可以使用層疊按鈕容納文字。”
指南中對對話框中應包含哪些類型的內容和操作進行了詳細說明。這部分的介紹非常有趣，同時這也是經常被忽視的一個部分。其介紹道：為了創(chuàng)造出有力的樣式指南和設計語言，所有設計要素沒有大小之分，都非常重要。
一切為了可供性
文檔用很大篇幅強調了可供性。從新創(chuàng)建并統(tǒng)一設計語言的唯一目的，就是為了實現(xiàn)跨瀏覽器/設備的可供性。一份高質量的樣式指南應當將可供性融入設計語言，以求創(chuàng)造出高質量的設計指南。
“標簽的可供性就是顯示相關的內容組。標簽的說明應當簡潔的介紹標簽相關的內容祖?！?Material設計文檔中介紹標簽所使用的方式非常精彩。其并不是把標簽視為導航工具的一種形式，而是作為另一種瀏覽內容的方式。標簽欄等特定元素也存在著局限這種觀點非常新穎。顯然，編寫Material設計文檔的設計師不僅考慮到了樣式，還考慮到了元素的功能性，以免其被誤用。
如果不同元素的功能得到了清楚明確的界定，那么這些元素的使用方式必然也就會被局限。反過來說，這樣將有助于提高可供性。如果某個元素能夠以不同的方式反復使用，就會給用戶造成誤解。
“標簽可以方便探索和切換應用中不同的視圖或功能區(qū)域，或用于瀏覽不同種類的數(shù)據(jù)集?！?
打造你自己的元素
“浮窗能夠在移動平臺屏幕底部以及臺式機左下角以彈窗的形式提供有關操作的少量反饋信息。在屏幕上，他們會覆蓋所有元素，包括浮動的操作按鈕?！?“提示欄和浮窗類似，但其中不包含操作內容，因此無法滑出屏幕?！?Material設計文檔中有一個很有趣的部分叫做“浮窗和提示欄”。這個設計名詞可能不太常聽見；浮窗和提示欄是我們已經知道的設計元素。如果你讀了下面的注解再看一下下方的圖片，就能夠理解浮窗和提示欄其實就是簡單的彈窗通知。
但文檔里面的介紹卻非常細致。Materila設計文檔對彈窗進行了分類。這是其設計語言的需要。浮窗和提示欄類似于對話框但實際卻不同；因此他們是兩個分離的概念。Materila設計文檔將它們區(qū)分開的原因是其需要它們執(zhí)行不同的功能。創(chuàng)建新元素是沒問題的。和Materila設計文檔中其他部分一樣，浮窗和提示欄也有專門的指南——使用、案例、度量和顏色。
通常，我們會忘記這些元素不能以多種或新方式使用。有時候，區(qū)分彈窗的兩種不同功能這種簡單的問題也能講出很深的道理，著實有趣。另外，不要忘了你可以加入可能被視為過時的元素，或者你自以為存在實則不然的元素，并以這種方式來革新你的設計。對小玩意的革新能夠給未來的設計帶來巨大的改變。
你和Material
親自讀一下Material設計文檔，給我們講講你的心得體會吧。這套簡單明了的文檔能夠給你帶來設計方面的大量信息。
翻譯：蔣燦
原文地址：designmodo
翻譯地址：網秦uec
轉載請注明：
靈智飛揚 » 從
UI設計中得到的感悟
登錄收藏
學UI就上靈智飛揚！越努力，越幸運！
“靈智飛揚www.lingzhifeiyang.com?”最值得關注的UI學習平臺！ 每天發(fā)布高質量的設計教程和分享設計經驗，服務于20萬UI設計師,幫助初學者快速轉型。 ，給大家提供更多免費學習的機會。想成為設計師的你快來關注吧！
【特色推薦】
“
APP截圖站www.lingzhifeiyang.com”??海量
APP截圖，讓你靈感爆發(fā)！國內最好的APP截圖站。
“國內最棒的UI設計導航站” 專為UI設計學習者打造的資源＋學習，雙用途的網址導航站。親愛的，你收藏了嗎？
【靈智飛揚 原創(chuàng)文章 ，也可以找各個群的管理】
給靈智飛揚打氣，加油 ?猛點這里?>>
本文來源：未知
