無(wú)論是網(wǎng)頁(yè)還是APP的設(shè)計(jì)，你可以完全從零開始，但是絕大多數(shù)時(shí)候，合理地運(yùn)用模板和UI Kit 是能夠讓你事半功倍的。仔細(xì)回顧一下你所做過(guò)的那么多設(shè)計(jì)項(xiàng)目，沒少做重復(fù)的工作吧？

這個(gè)時(shí)候，設(shè)計(jì)模板和UI Kit 的重要性就體現(xiàn)出來(lái)了。這些預(yù)先準(zhǔn)備好的設(shè)計(jì)套件大都是基于一些常見的需求而創(chuàng)建的，雖然它們大多不會(huì)完全匹配你的需求，但是也能在很大程度上幫你節(jié)省設(shè)計(jì)成本，降低設(shè)計(jì)的工作量。

1、幫你更快地完成設(shè)計(jì)項(xiàng)目

使用模板或者設(shè)計(jì)工具套件來(lái)完成網(wǎng)頁(yè)設(shè)計(jì)項(xiàng)目，很大程度上是出于對(duì)速度和效率的需求。相比于使用HTML、CSS和PHP從頭開始開發(fā)和設(shè)計(jì)，模板和設(shè)計(jì)工具套件能很大程度上縮減這個(gè)過(guò)程。

這個(gè)時(shí)候你所需要的所有事情，就是安裝，然后根據(jù)自己的需求進(jìn)行調(diào)整和定制。最典型的，就是Wordpress 這樣的內(nèi)容管理系統(tǒng)（CMS），對(duì)于小型的網(wǎng)站而言，它們是更好的起點(diǎn)。

時(shí)間和效率是關(guān)鍵。在這些設(shè)計(jì)工具套件和模板當(dāng)中，你能夠根據(jù)需求，不同程度地獲得你所需要的東西：配色、排版、字體、裝飾元素、控件、樣式，甚至整個(gè)頁(yè)面。如果你的項(xiàng)目亟需一個(gè)網(wǎng)站或者頁(yè)面，模板、UI Kit 、甚至CMS系統(tǒng)能夠快速地幫你搭建起基礎(chǔ)。

從設(shè)計(jì)工具套件和模板中獲取素材，調(diào)整之后應(yīng)用到自己的設(shè)計(jì)項(xiàng)目當(dāng)中，可以明顯加快整個(gè)流程。如果模板和素材挑選合理的話，用來(lái)給用戶展示之用的Demo 會(huì)更快地輸出。

2、確保一致性

用戶都是習(xí)慣性的生物。看起來(lái)用起來(lái)都很一致的設(shè)計(jì)會(huì)給予他們以掌控感，和可預(yù)期性。當(dāng)設(shè)計(jì)師們?cè)谕瓿稍O(shè)計(jì)工具套件和模板的設(shè)計(jì)的時(shí)候，他們會(huì)出于靈活性、泛用性的考慮，盡可能地將UI Kit 和模板設(shè)計(jì)得足夠一致。當(dāng)你從同一個(gè)工具套件或者模板中取用素材的時(shí)候，能夠確保你最終輸出的設(shè)計(jì)在視覺、交互和體驗(yàn)上能保證一致性。

絕大多數(shù)的模板與工具套件都確保了可定制性，這種定制性也是在總體一致的前提下提供的，這也足以讓你足夠快捷的根據(jù)自己的需求來(lái)進(jìn)行調(diào)整。

3、了解最佳實(shí)踐

事實(shí)上，許多模板和UI kit 都是經(jīng)驗(yàn)豐富的網(wǎng)頁(yè)和APP UI 設(shè)計(jì)師來(lái)設(shè)計(jì)完成的，當(dāng)他們?cè)谠O(shè)計(jì)工具和模板的時(shí)候，通常都會(huì)遵循實(shí)際的需求和行業(yè)標(biāo)準(zhǔn)來(lái)進(jìn)行的，換句話說(shuō)，在這些UI Kit 和模板當(dāng)中，我們所看到的排版布局、UI控件大都是遵循當(dāng)前的最佳實(shí)踐。

當(dāng)你在使用這些工具套件和模板來(lái)為自己的客戶設(shè)計(jì)的時(shí)候，這些PSD和模板當(dāng)中的UI設(shè)計(jì)模式和最佳實(shí)踐，能夠作為參考，拿來(lái)復(fù)用。

實(shí)際上，許多設(shè)計(jì)師也正是通過(guò)拆分和研究這些模板、UI Kit 來(lái)學(xué)習(xí)最佳實(shí)踐和設(shè)計(jì)套路的。

4、內(nèi)置功能

許多設(shè)計(jì)工具套件和模板當(dāng)中所包含的不僅僅是 PSD、AI、Sketch 格式的設(shè)計(jì)文檔，還具一些可用的功能。對(duì)于開發(fā)并不專精的設(shè)計(jì)師，可以從這些工具套件/模板當(dāng)中直接借用其中內(nèi)置的功能，諸如 SEO，CMS編輯組件，等等。

許多模板當(dāng)中的內(nèi)置組件對(duì)于用戶是非常友好的，甚至是專門為初學(xué)者所準(zhǔn)備的。許多模塊對(duì)于并不專精于開發(fā)的用戶而言，并不難上手，如果身為設(shè)計(jì)師的你能夠合理地運(yùn)用到這些功能，對(duì)于整個(gè)項(xiàng)目而言，能夠節(jié)省不少開支。

通常，這樣的模板和工具套件當(dāng)中，會(huì)包含相應(yīng)的說(shuō)明文檔，你可以通過(guò)閱讀這些文檔來(lái)獲取使用方法和技術(shù)支持。

另一方面，許多工具套件和模板還包含自動(dòng)更新功能，這樣你就不用為后續(xù)的功能支持來(lái)操心了。這一點(diǎn)無(wú)論是對(duì)于身為設(shè)計(jì)師的你，還是你的客戶而言，都是相對(duì)而言更為省心的選擇。

5、更合理的價(jià)格

相比于直接購(gòu)買整套的設(shè)計(jì)服務(wù)，UI Kit 和模板無(wú)疑是性價(jià)比更高的服務(wù)，如果利用得當(dāng)?shù)脑挕o(wú)論是設(shè)計(jì)模板還是UI Kit，它們的價(jià)格通常不會(huì)太昂貴，即使是最強(qiáng)大最貴的 WordPress 模板授權(quán)也不會(huì)超過(guò)100美元，而許多獨(dú)立的模板或者單獨(dú)的功能也就10美元左右。

如果你有計(jì)劃有意識(shí)地下載、購(gòu)買 UI Kit 或者模板，它們給你帶來(lái)的價(jià)值是不可估量的。它們能夠極大地降低你的時(shí)間成本。購(gòu)買25學(xué)堂的會(huì)員，可以免費(fèi)下載所有的ui kit。

6、更清晰的代碼

如果你所找到的模板供應(yīng)商足夠有經(jīng)驗(yàn)和信譽(yù)的話，他們?yōu)槟闼峁┑拇a通常是干凈和輕量級(jí)的。在許多的開發(fā)者眼里，清晰干凈、可維護(hù)性強(qiáng)的代碼，也算是一種“藝術(shù)”。

挑選評(píng)價(jià)高、下載量大的模板，這樣有足夠的保障。同時(shí)，你還可以同其他的用戶互動(dòng)、討論，交流使用經(jīng)驗(yàn)，更好地使用。

7、拓展

最后，這些設(shè)計(jì)工具套件和模板還讓你具備了創(chuàng)造屬于自己的模板和工具套件的可能性。你可以在這些模板或者 UI Kit 的基礎(chǔ)上，根據(jù)自己的需求和經(jīng)驗(yàn)，吸收別人的經(jīng)驗(yàn)，在已有的模板和設(shè)計(jì)元素的基礎(chǔ)上，加入你自己所設(shè)計(jì)的控件、元素甚至交互方式。這樣不僅能夠促進(jìn)設(shè)計(jì)師和開發(fā)者的協(xié)同，而且能夠更好地分享經(jīng)驗(yàn)。

更多設(shè)計(jì)模板請(qǐng)?jiān)L問：http://itlnk.cn/works/apppsd2?

原文地址：webdesignerdepot

原文作者：Carrie Cousins

優(yōu)設(shè)譯文：@陳子木