UI界面設(shè)計

ui kit套件要怎么使用呢？

3277

您設(shè)計的app或者網(wǎng)站的質(zhì)量通常取決于您所使用的工具的質(zhì)量。對很多人來說，在紙上進行手繪是一個非常好的方式。但是，工期很趕，能力又不夠時，為什么不站在巨人的肩膀上進行設(shè)計呢？是的，我們要討論的就是下載UI Kit（或者稱為設(shè)計模板）進行更快速的設(shè)計。

UI Kit通常包含了非常全面的資源集合，同時也能讓您正確的規(guī)劃組織結(jié)構(gòu)，您也可以把您創(chuàng)意跟模板結(jié)合。UI Kit通常包含了各種模板和ui組件（按鈕，復選框，進度條，導航欄等），它們可以幫助設(shè)計師在有限的時間內(nèi)創(chuàng)造出出色的效果。所以，先不要花大量時間去搞清楚如何設(shè)計組件，UI Kit可以讓您更專注您擅長的事情：創(chuàng)造更好的設(shè)計。

UI Kit可以通過不同的方式幫助您優(yōu)化設(shè)計流程，不過，我們最能感受的兩種用途是：原型設(shè)計和app/網(wǎng)頁設(shè)計。

所以，我們來看看使用UI Kit的好處，以及如何將它們用于原型設(shè)計和app/網(wǎng)頁設(shè)計。

節(jié)省時間和金錢

幾乎每個設(shè)計師都遇到過這樣一個郁悶的情況：當一個小項目失控時，工作量可能增加四倍，項目的預計時間增加了一倍?？蛻粲忠驗轫椖垦悠诙涎又Ц俄椖靠睢榱私o自己留有余地，設(shè)計師經(jīng)常要告訴客戶，要估算一個網(wǎng)站或app的具體完成時間是很困難的。因為期間肯定有不同原因而進行的修改。

雖然UI Kit不會為您估算時間，但是使用UI Kit后，您可以更縮短設(shè)計周期，快速修改。本來需要一周完成的時間，可能2天就可以搞定。很多UI Kit使用嵌套元件，只需修改組件，調(diào)用到組件的頁面跟著改動。您也可以調(diào)用UI Kit中的元素重構(gòu)您所需要的頁面，然后調(diào)整這些元素匹配您的品牌形象。

UI Kit也可以幫你節(jié)約資金，很多UI Kit的設(shè)計非常棒（比如這套ui kit），您下載后，可以用于多個項目，一次消費，重復使用?；蛘吣梢韵螺d我們的打包模板，涵蓋了各類領(lǐng)域，絕對是一筆非常值得的投資。

現(xiàn)在我們已經(jīng)介紹了這些優(yōu)勢，讓我們來看看UI套件的兩種最常見的用途：原型設(shè)計和app/網(wǎng)站設(shè)計。

如何使用UI套件進行原型設(shè)計

為了獲得有效的客戶反饋或者用戶反饋，您必須讓您的設(shè)計以最好最快的方式呈現(xiàn)出來。所以，你必須將想法轉(zhuǎn)化為視覺效果，客戶或者用戶才能直觀看到。這也是原型誕生的原因。

有句老話說得好：一圖道千言。它可以呈現(xiàn)您在推出最終方案前設(shè)計和動效呈現(xiàn)的方式。讓客戶或用戶知道最終的效果會是怎么樣的。

Vitaly Rubtsov制作的低保真原型

UI Kit對于快速的原型設(shè)計非常重要，很多線框圖模板也是這樣的用途。原型能夠模擬設(shè)計的功能，設(shè)計師，客戶，領(lǐng)導還有用戶都可以進行測試，發(fā)現(xiàn)問題及時修復。

Jonathan Howell設(shè)計的低保真原型

為了節(jié)約時間，如果從0開始，原型設(shè)計通常都是低保真的。但如果有高保真的原型，為什么不用呢？它們看起來幾乎與最終產(chǎn)品相同。如果使用UI套件，高保真的原型一點也不難。您只需要拖放ui小部件就能設(shè)計出專業(yè)的高保真原型。

使用 UI Kit創(chuàng)建的高保真原型

如何使用UI Kit進行app、網(wǎng)站設(shè)計

當你搞定了原型設(shè)計中碰到的所有問題，您就得將設(shè)計變成真正的產(chǎn)品。這時候，UI Kit也能夠提供幫助。

UI Kit可以包含幾乎所有的界面元素，您可以創(chuàng)建一個可愛的用戶界面-從布局，小部件、按鈕到排版和復雜的反饋模塊。

基本上，UI kit的使用就像搭積木，在sketch里使用尤為方便和快捷。

建立自己的UI Kit

Jan Losert設(shè)計的圖示

如果是開發(fā)者或者產(chǎn)品經(jīng)理或者客戶，您可以一點都不熟悉UI Kit，但是對設(shè)計師來說，這是一個很好的工具，能夠讓您為用戶提供更快更好的產(chǎn)品設(shè)計方案。

為了控制設(shè)計輸出的品質(zhì)，UI Kit非常有用，不過，設(shè)計師通常沒有那么多時間設(shè)計一套一套的ui kit。而且對于新功能新的設(shè)計規(guī)范沒有那么快熟悉。這時候，購買一些付費的ui kit還是不錯的選擇?；蛘哌x擇下載免費的ui kit。這邊推薦我們25學堂自家的ui kit設(shè)計模板，一定可以找到您想要的模板。