常見設計規範與 Sketch 源文件下載集合
筆者近兩年為了給公司產品制定合理的設計規範,參考了許多國內外優秀的設計規範,趁著這次機會做一個整理,而且這些設計規範基本上都是附帶 Sketch 源文件的,非常值得大家下載學習、參考和使用。
1、Material Design
由 Google 設計團隊推出的 Material Design 一經發布就紅遍了全球設計界,多個富有突破性的設計理念,將理性與感性相結合的完美標準,使得越來越多的人基於 Material Design 製作了自己產品的設計規範。
除了谷歌官方的 Sketch 組件庫外,還有一個基於 Material Design 色板的 Sketch 源文件下載,用起來非常方便。
Material Design 官方相關源文件下載
Material Design 色板 Sketch 源文件下載
2、iOS Human Interface Guidelines
iOS 的設計規範其實並沒有 Material Design 那麼具體和細節,但作為一個 iOS 平台的設計人員還是需要把它們的設計理念爛熟於胸。
對於 iOS 平台的 Sketch 組件庫,我只推薦兩個,一個是 Facebook 推出的 iOS 10 組件庫,另外一個是由 Apple 官方推出的組件庫,同樣都有 Sketch 源文件。
iOS 官方組件庫下載地址
Facebook iOS GUI 下載地址
3、Lightning Design System
Lightning Design System 是由 Salesforce 團隊推出的一個設計規範,它們的規範文檔也是相當完整而且可參考性很強,推薦大家研究,同時它們也有 Sketch 組件庫可供下載。
Lightning Design System 官方文檔
Sketch 源文件下載地址
4、Ant Design
這是由螞蟻金服體驗技術部設計開發的一種設計語言,其中涵蓋了大量跟 UE 相關的設計理念、交互模式、視覺規範等等,具有極強的參考價值,非常適合英語不好的小朋友理解 UE 的一些理念(比如我)。
除此之外,他們還基於 Ant Design 推出了 Sketch 組件庫、Axure 元件庫等等,強烈推薦好好研究學習。
Ant Design 相關資源下載
5、Element
這是由餓了么 UED 設計開發的基於 Vue 的前端組件庫,雖然在很多交互模式和組件樣式以及設計理念上都參考了 Ant Design,但是也做了一些自己的修改和調整。
他們同樣也推出了 Axure 元件庫文件以及 Sketch 組件庫,有興趣的朋友可以參考研究一下。
Element 相關資源下載
6、Polaris
由國外 Shopify 團隊推出的 Polaris 設計規範也有比較不錯的參考價值,而且內容非常豐富完整,感興趣的朋友可以查看官方文檔好好研究一下,他們同樣提供 Sketch 組件庫。
Polaris 相關資源下載
7、WeUI
由微信團隊推出的可以用於微信小程序設計的 Sketch 組件庫,用起來也很方便,有微信端設計需求的朋友可以參考。
WeUI 相關資源下載
8、Atlassian Design
由國外知名軟體企業 Atlassian 推出的設計語言,涵蓋了品牌、營銷、產品相關的設計規範和理念,其豐富程度僅次於 Material Design,可以說給了設計師很多參考與幫助,另外還提供了非常完整詳細的 Sketch 組件庫,強烈推薦大家研究學習!
設計團隊官網
GUI Sketch 組件下載
寫在最後:
將設計規範做成 Sketch 組件庫甚至 Axure 元件庫其實任務量很大,但是這項工作做好了能夠大大提高產品、設計、開發團隊的協作效率,感謝這些團隊對設計領域做出的貢獻!
推薦閱讀:
※為什麼Win8/Win10關閉應用,需要將手指划過整個屏幕,而不像iOS那樣做?
※向 Google 學習 UX 文案如何寫
※19Fall「交互設計申請最新解析」名校項目分析+申請建議 | 大咖說
※[UX 實習記錄] Week 7: Listening Skills, book&tool recourses
※如何設計頁面布局