不容錯過的UI設計素材大合集

標籤：des   android   blog   http   io   os   使用   ar   for   

免費PSD素材TETHR by InVision

這是出自InVision的8款PSD檔案，其中包含了100個模板和超過500個UI控制項。來自InVision和UI8的設計師一同協作完成了這套UI Kit，非常漂亮。

Designer-naut UI Kit

這是一套簡約整飭的UI Kit，內建了40款向量的小外掛程式。這套UI Kit 為視網膜螢幕而生，基於16欄的960柵格系統，目前限時免費。

Wire Kit

這是一套解析度為840 x 8600的 UI Kit，是一套為視網膜螢幕而生的素材，內建2組不同風格的控制項，每組都有60個不同的控制項。

iPhone Wireframe Kit

這是一套頗為方便的 iPhone 線框圖 UI Kit ，整體採用的低傳真的色調，所以它適合用來設計簡約外觀的UI。

免費Sketch資源Yosemite UI Kit

這是一套完全免費的用於Sketch平台的Yosemite UI Kit，整套UI Kit 覆蓋面非常廣，非常實用。

Sketch Android UI Kit

如果你是一位喜歡使用Sketch的Android APP UI設計師，那麼這套UI Kit絕對值得收入囊中，完整的UI控制項支援絕對讓你省心。

Bootstrap 3 UI for Sketch

這套 UI Kit包含了Twitter Bootstrap 3全套UI控制項，完備而實用。

進階Sketch UI Kit素材Bolt Kit

Bolt Kit 是一套非常漂亮非常現代的視覺套件，你可以在Bolt Kit的協助下，非常快捷的排列群組控制項設計出你心目中的介面。

Flat UI Kit for Sketch

扁平化依然是目前的主流，這套扁平UI Kit中的的各種UI控制項都非常簡約，可以非常快捷地設計出漂亮的介面。整套UI Kit包含超過50個獨特的UI元素，覆蓋網站、移動端和響應式設計。

Wireframe Kit V2

這套UI Kit包含175個模板和超過500個UI元素，可以用於網頁、平板和手機介面，使用這套工具可以讓你的UX Workflow提速。這套UI Kit 是AI格式的，現在也有了Sketch的版本。

Illustrator UI KitWireframe & UI Kit by C. Rowe

處於對傳統線框圖的失望，設計師C.Rowe決定自己動手豐衣足食，按照自己的想法設計出一套更加完善的線框圖 UI Kit，當然，它是免費的。

Awesome Kit

這套炫酷的UI Kit包含了26套AI線框圖模板、兩套筆刷，由設計師George Vasyagin設計完成，實用且免費。

實用iPad應用

可能最終的設計你還是需要藉助PS、AI和Sketch，但是在設計過程中，這些實用的iPad APP可以幫你實現一些最初的想法，快速成型，輸出成可以處理的格式，幫你設計提速。

Adobe Sketch

Sketch是Adobe進軍移動端的重要APP，它不僅可以讓設計師更容易表達自己的設計和想法，還可以串連社區，瞭解其他設計師的設計，尋求靈感。

Paper by FiftyThree

Paper是真正為觸控螢幕設計的繪圖應用，靈活的筆刷和極富創意的手勢操作令這款APP別具一格，流暢的操作和無按鈕設計可以讓設計師充分發揮。配合FiftyThree所推出的Paper Pencil，體驗非常贊。

Adobe Ideas

這是一款用來抓住靈感的絕佳APP，可以靈活控制向量素材、圖層和色彩主題，設計作品最終可以輸出到AI中進行後期處理。

免費表徵圖素材The Noun Project

這套表徵圖素材非常值得收入囊中，其中所包含的數千個表徵圖源自不同的藝術家，其中部分表徵圖是免費的，部分是收費的。

80 mini icons

這是一組簡潔明快的小表徵圖合集，可以在很多項目中靈活使用。

144 Social Icons

這套表徵圖都是各大社交品牌的表徵圖，包含了4種不同的樣式、色彩。每個表徵圖都是在PS中建立的向量圖形，可以輕鬆編輯。

進階表徵圖素材Streamline

Streamline 應該是最豐富最強大的表徵圖合集，設計師們已經不遺餘力地為你搜集每一款有價值的表徵圖。

Symbolicons- Icon Font

Symbolicons是一款表徵圖字型，這使得你可以更加方便地控製圖標的大小、顏色，你完全不用單獨開啟一個PSD檔案或者AI檔案然後來回拖拽每一個表徵圖。

免費圖片資源Unsplash

Unsplash提供的圖片全都是高解析度的素材，每10天更新10張新圖片，這麼慢的更新，當然保質保量啦~

New Old Stock

這個網站搜集的是各種複古的照片，絕對有範兒。

Death to the stock photo: Free & Premium Options

這個網站圖片品質也相當不錯，可以商用，也可以放到個人部落格、社交媒體以及放到自己的視覺稿中。如果你覺得免費使用者不夠暢快的話，還可以購買進階使用者。

Public Domain Archive

這裡提供的照片都是免費共用的，並且會每周更新，盡情地使用吧！

裝置素材3 Free Flat Device Mockups from InVision!

這是三款來自InVision的裝置視覺稿素材，當你設計好UI之後，可以結合這三款素材製作成高保真的視覺稿。

iPhone 5s Template from Mockuuups

這是一款iPhone 5s的視覺稿素材，你可以輕鬆修改螢幕內容和背景圖片，製作屬於你的。

iPhone 5s & 5c Mockups

同上一款一樣，這一款iPhone 5s和5c的素材也是免費的，可以輕鬆定製內容。

3 Free Presentation Mock Ups

這3款視覺稿模板可以幫你輕鬆建立逼真的簡報。

Photorealistic Macbook Mockups

這一Macbook視覺稿素材是基於真實而專業的照片製作而成，絕贊。

Free iPhone & iPad Mock Ups

主流的iOS裝置都是相容iPhone和iPad的，當你展示iOS APP的時候，不妨直接使用這款高解析度的iPhone/iPad素材。PSD檔案中，螢幕都是單獨的智能對象，可以替換。除此之外，背景還包含了5張不同的圖片可供替換。

Placeit.net

Placeit 是一個免費的視覺稿產生工具，上傳照片，網站會幫你處理成，並產生一個單獨的網址，開啟網站就可以看到最終結果。

帶柵格的PSDiPhone 5 Grid

設計師Eddie Lobanovskiy製作的10列柵格的iPhone 5 柵格系統，在這套柵格系統下，你設計的UI會更加整潔。

Bootstrap 3 Grid System

這套Bootstrap 3柵格系統是PSD格式的，方便你在PS中設計基於Bootstrap的UI。

A better Photoshop grid for responsive web design

來自Typekit的設計師Elliot Jay所製作的一款寬度約為1000px的響應式柵格系統，你可以在他的部落格中下載這套柵格系統。

靈感

當你靈感閃現的時候，想要很快進入設計階段然後實現它，並不容易。好在有許多技巧和方法可以幫你快速推進，迅速地將靈感轉為為實際可見的作品，節省大量的時間。

A shorthand for designing UI flows

來自Basecamp的設計師Ryan Singer設計了一套快速高效推進UI設計流程的Outlines，遵循這套工具，你可以在5分鐘內看到一套清晰而簡約的設計稿。

Storyboards

在InVision，我們通常使用低傳真的故事板來快速推進設計流程，通過故事板，我們可以快速地將腦中的概念同直觀的視覺效果結合到一起，甚至可以試圖將最終的UI介面具現化，在這個過程中無需花費大量時間進行像素級的打磨。

不容錯過的UI設計素材大合集