谷歌公司推出的Material Design準(zhǔn)則將用戶界面設(shè)計(jì)概念提升到了新的高度，同時(shí)深入滲透到了Web與移動(dòng)應(yīng)用開發(fā)的整個(gè)流程當(dāng)中。Material Design原則允許用戶在各類面向臺(tái)式機(jī)、筆記本、平板設(shè)備乃至移動(dòng)手機(jī)的谷歌系統(tǒng)平臺(tái)之上獲得統(tǒng)一的瀏覽體驗(yàn)。此外，其在移動(dòng)應(yīng)用設(shè)計(jì)領(lǐng)域也起到了重要的指導(dǎo)作用。目前可資利用的用戶界面設(shè)計(jì)工具及教程已經(jīng)相當(dāng)豐富，足以幫助大家了解如何利用Material Design機(jī)制打造屬于自己的應(yīng)用成果。Materialize等前端設(shè)計(jì)框架及其它類似工具也擁有極為旺盛的市場需求。簡而言之，Material Design的出現(xiàn)已經(jīng)使得UI設(shè)計(jì)成為整個(gè)用戶體驗(yàn)設(shè)計(jì)及開發(fā)流程中獨(dú)特而重要的一項(xiàng)組成部分。

[[146651]]

Material Design提供多種新型方式，幫助大家通過引入新型UI元素及組件創(chuàng)建出美觀的UI設(shè)計(jì)效果，具體包括動(dòng)畫、縱深/陰影效果、漸變、圖標(biāo)以及排版等等。如此強(qiáng)大的功能使得每位UI開發(fā)者都樂于在自己的項(xiàng)目當(dāng)中運(yùn)用Material Design。Material Design的能力還能夠在CSS以及Bootstrap框架當(dāng)中發(fā)揮作用。其中提供的各類模板、圖標(biāo)字體、部件、按鈕以及其它元素亦可在其它多種平臺(tái)上順利起效。

因此，我們將在今天的文章中列舉多種UI工具、UI模板以及其它基于Material Design原則的設(shè)計(jì)組件，而且所有項(xiàng)目皆提供免費(fèi)下載。大家可以將它們引入到各類用途及場景當(dāng)中，具體包括移動(dòng)應(yīng)用程序、網(wǎng)站、社交媒體應(yīng)用乃至更多。好了，咱們閑言少敘，馬上來看這份開發(fā)人員不容錯(cuò)過的20大Material Design資源清單。

1) Designtory

這是一套面向面向Web設(shè)計(jì)及儀表板項(xiàng)目的優(yōu)秀Material Design UI工具集，其中副括了設(shè)計(jì)、模板、圖標(biāo)按鈕、日歷、可定制矢量圖形以及字體樣式等等。它支持視網(wǎng)膜高分辨率屏幕且立足于Photoshop CS6+。

下載地址

2) Sketch App Sources

這套Material Design UI工具集適用于Sketch文件，其主要作用是將Material Design風(fēng)格引入Android Web以及移動(dòng)開發(fā)工作。

下載地址

3) UI8

這是一套超酷的Material Design UI工作集，其中包含一整套支持視網(wǎng)膜屏幕的UI組件以及涵蓋七種應(yīng)用類型的現(xiàn)成模板。大家還能夠在其中找到面向個(gè)人資料頁、菜單乃至統(tǒng)計(jì)等場景的超過40種UI模板以及30多種圖標(biāo)元素。

下載地址

4) Ultralinx

Ultralinx以Material Design指南為基礎(chǔ)提供一套免費(fèi)的UI工具集。這套工具集中包含可直接使用的UI模板與組件，例如天氣部件、電子商務(wù)模板以及個(gè)人資料頁等等。

下載地址

5) UI8

這是一套現(xiàn)成可用且支持視網(wǎng)膜屏幕的Material Design UI工具集，且主要面向烹飪類應(yīng)用。此套件包含12種應(yīng)用程序類別、50套模板、圖標(biāo)以及超過100種其它UI元素。它同時(shí)提供注冊流程、信息推送、個(gè)人資料以及導(dǎo)航等設(shè)計(jì)機(jī)制。此套件需要與Adobe CS6+以及Sketch配合使用。

下載地址

#p#

6) PSDBoom

這是一套面向網(wǎng)站及移動(dòng)應(yīng)用程序開發(fā)的完整Material Design UI工具集。此工具集當(dāng)中包含大量可重復(fù)使用的UI元素及模板，具體包括音樂播放器、導(dǎo)航菜單以及相關(guān)圖形等等。

下載地址

7) L Bootstrap

L Bootstrap是一款以Android Lollipop樣式為基礎(chǔ)，包含一系列Bootstrap 3.2 UI元素及組件的UI工具集。此工具集提供28個(gè)完整的布局PSD文件、按鈕下拉菜單、提醒、按鈕以及痕跡導(dǎo)航等等。

下載地址

8) UXPin

這是一套Android Lollipop UI設(shè)計(jì)工具集，其中包含面向各類應(yīng)用程序類別的45種UI元素，例如鍵盤、主要設(shè)置以及個(gè)人資料等等。此工具集適用于Sketch、Photoshop以及UXPin。大家需要訪問其網(wǎng)頁并輸入自己的電子郵箱地址，在按照提示進(jìn)行操作后，該免費(fèi)UI工具集將被發(fā)送到各位的郵箱當(dāng)中。

9) Android Lollipop GUI Kit

這是一套面向面向Android Lollipop的GUI工具集，其中提供了實(shí)現(xiàn)Material Design所必需的一切強(qiáng)大功能與設(shè)計(jì)特性。此工具集具備的功能包括獨(dú)立呼叫響應(yīng)屏幕、收件箱屏幕、通知屏幕以及啟動(dòng)畫面等等。

 下載地址

10) Instagram Material Design

這套UI工具集所提供的模板及元素能夠幫助大家創(chuàng)建出一款符合Material Design風(fēng)格要求的Instagram應(yīng)用。此應(yīng)用將包含各項(xiàng)Material Design功能，例如導(dǎo)航圖標(biāo)、導(dǎo)航抽屜、相機(jī)按鈕以及個(gè)人資料頁等等。

下載地址
#p#

11) Twitter Profile using Material Design

這套UI工具集允許大家利用Material Design功能在Android平臺(tái)上開發(fā)出面向Twitter的用戶資料應(yīng)用。

下載地址

12) Android Lollipop Date and Time Pickers

這套工具集主要以Material Design原則為基礎(chǔ)提供面向時(shí)間與日期選擇器的UI元素。值得一提的是，其專門針對谷歌Nexus 5進(jìn)行了優(yōu)化。

下載地址

13) Material Design Audio Player

這套UI工具集旨在利用Material Design風(fēng)格設(shè)計(jì)音頻播放器界面。

下載地址

14) Material Design Backgrounds

其中包含30套Material Design背景素材，包括高分辨率PNG以及Illustrator文件。

下載地址

15) Pillows

這套Material Design UI工具集中包含超過30種UI元素及模塊。大家可以從中找到用于登錄頁面、日歷以及模態(tài)窗口等部件。在它的幫助下，我們能夠根據(jù)最新UI設(shè)計(jì)趨勢對網(wǎng)站的外觀及使用感受進(jìn)行設(shè)計(jì)。

下載地址

#p#

16)  Material Design Widgets

這套Material Design UI工具集中了一系列功能部件，包括音樂播放器、日程表、視頻播放器以及天氣情況顯示部件等。

下載地址

17)  Material Design Icons

這套Material Design資源集中包含超過1000款圖形，且分為20多個(gè)具體類別。此資源集還提供7000多個(gè)按七類分辨率進(jìn)行劃分的PNG文件。它的圖形分類包括交通、餐飲、天氣、情感、購物以及藝術(shù)等。

下載地址

18) Android Lollipop Icon Pack

Here is a complete set of icons for Android Lollipop covering all the major categories. You can avail a free download deal once you have registered your e-mail address with them. This one will prove to be of great interest for icon designers.

19) Blogger Template

這是一套免費(fèi)博客主題方案，且基于最新Material Design特性及原則。其名為“The Linck”的模板提供強(qiáng)大的支持能力，具體包括動(dòng)態(tài)視圖、多色彩選項(xiàng)以及各類表單設(shè)計(jì)。

下載地址

20) Sports News Website Template

這套網(wǎng)站模板基于Material Design特性，主要用于設(shè)計(jì)體育新聞?lì)惥W(wǎng)站。

下載地址

總結(jié)陳詞:

就目前來看，可供我們選擇的、用于創(chuàng)建特定網(wǎng)站及移動(dòng)應(yīng)用程序的配套用戶界面的Material Design資源已經(jīng)相當(dāng)豐富。此類用戶界面工具集中往往包含一系列實(shí)用性UI元素，例如模板、圖標(biāo)、字體、功能部件以及色彩模式等等。在上面這份清單中，我們還看到了一部分面向獨(dú)立應(yīng)用程序的UI工具，包括音樂播放器以及博客平臺(tái)等。如果大家在實(shí)際工作中也積累到了出色的設(shè)計(jì)資源，請別藏私，在評論欄中與更多朋友分享吧。不過請注意，要符合Material Design風(fēng)格才算數(shù)哦。

原文標(biāo)題：20 Material Design Resources for Web Designers and Developers