什麼是 Design System

由於研究 Design System，無心中發現了這本「Design Systems」。原本只是指望着看看別人的思路和想法，粗略的看了幾個章節才發現本身錯了。這本彷佛並不太火的書能夠說是目前市面上對整個 Design System、Language、Guidline 等概念思考得最爲深刻和全面的。

前段時間會員微信羣裏你們討論起了這本書，你們彷佛對這本書都很是感興趣，但對這 200 多頁的全英文又擔憂難以堅持。既然這是一本很是值得讀的設計書，而你們又這麼感興趣，我決定花一段時間的週刊來和你們基於這本書聊 Design System。但願能給你們在閱讀此書上提供一些幫助，也讓本身有機會可以更深刻的去進行學習研究。

一點聲明：本系列週刊並不是「Design Systems」的翻譯，而是基於本書結構框架的讀書筆記和經驗總結。依然推薦你們閱讀原書，週刊內容能夠做爲理解輔助。

書籍購買連接點這裏>>

十年前互聯網產品的設計大多沒有 System 的概念，純憑手工一頁頁的去作，總體的效率和一致性都難以保障。直到 Yahoo DPL（Design Pattern Library）的出現，你們才慢慢開始更多的開始關注到這個問題。

業務體量大小一樣會影響到團隊對於 System 投入力度的差別，也許你們沒有接觸到 Design System，但 Design Pattern、Design Component、Design Language、Design Guideline 等等這類詞相信你們必定不會陌生。即便對於這些概念並不太清晰，但或多或少都會在設計的過程當中受到一些影響。

若是咱們用 Google Trends 搜索一下這些關鍵詞，你會發現「Design System」的關注熱度是最高的。你們都想搞清楚 Design System 是怎麼回事，但願用它來提高本身產品的總體質量、效率。

對於 Design System 不一樣的團隊依據本身的體量和業務述求都有着本身的定義，這也是爲何咱們會發現各 System 所包含的內容有所差別。在個人理解來看既然叫作 System 它就應該是更爲完整、體系化的，因此我會將它定義爲解決數字產品生產的總體解決方案，包含設計、內容、工程等多個方面。

Google 對於 Material Design 的定義是「Material Design is a unified system that combines theory, resources, and tools for crafting digital experiences.」，正如你所看到它們官網所展現的，這是一個想法複雜的系統工程、一個完整的世界觀。固然 Material Design 由於它的系統特殊性，和咱們所須要作的 Design System 還不同，咱們會在後面詳細說明。

想要了解、建立本身的 Design System，咱們還須要先回過頭弄清楚前面說起的那些概念它們之間的關係、差別。Design System 專題的第一期，咱們將先從這些概念開始。

依照本身的理解，我將這些概念整理成了如下這張圖。但願先給你們一個概念上的全貌，而後咱們再來逐一分解。

Design Principles（設計原則）

全部的 System 的出現都是爲了解決一些列的問題，它們多是一種業務形態（好比在線購物），也多是一種操做行爲形態（好比數據管理）。它們背後有着共通的問題和述求，這也就爲 Design System 提出了明確的要求。

因此咱們能夠將 Principles 理解爲一系列的規則，它們是咱們設計開發產品的核心思想，構建一套有效的 Design System 的起點。用於解決用戶體驗中的問題，引導業務、開發以及設計向既定（正確）的方向前進。

每個公司（團隊），因爲其業務的特性將可能產出不一樣的 Principles。以 IBM 的 Carbon Design 爲例，他們的 Design Principles 是：

• Be essential （必要的）
• Be inclusive（包容的）
• Be consistent（一致的）
• Be humanistic（人文的）
• Be delightful（愉快的）

這是 IBM 對其雲產品在總體產品體驗上的定義與要求，也是它們想要傳遞給用戶的感覺。做爲設計的基本原則，它將嵌入到其產品、設計、開發、文案等一系列場景中，成爲產品的「靈魂」。

咱們能夠再來看看屢次說起的 Lightning Design System，它服務於 Salesforce 的 SaaS 服務。對於他們的產品，Lightning 也提出了本身的 Design Principles：

• Clarity （清晰的）
• EFFICIENCY（高效的）
• Consistency（一致的）
• Beauty（優美的）

很明顯，做爲一款 SaaS 平臺類產品，效率和一致性是他們產品核心競爭力之一。爲了確保平臺及第三方 ISV 可以爲客戶提供高效、高質的服務，他們將「清晰、高效、一致性」做爲了產品最核心的 Principles。

對於互聯網產品「清晰」「一致」一類的關鍵詞幾乎都會提到，這也是用戶體驗設計最爲根本的目標之一。但隨着市場對行業深度的述求不斷增強，你們對行業特性的述求也愈來愈明顯，甚至會像前面的兩個案例同樣寫入 Design Principles，成爲產品設計的理念基石。

固然，談 Design System 咱們沒法不談 Material Design 。相比較而言它的 Principles 更加的抽象，除了因爲它自有的獨特設計世界觀以外，很重要一點在於它是一套更爲底層的「服務」。

相較之下它的「業務」更爲普遍，基於 Material Design 你能夠開發一個電商應用，也能夠是一個社交、理財產品。所以它的 Principles 也須要更有「深度」。

以上是本期會員週刊的節選內容，接下來咱們將繼續分別講解 Design Component & Pattern、Language、Develop Library、Guideline，以及它們之間的差別、與 Design System 如何協做，成爲產品進步、發展的超級發動機。

Design System 是 PinDesign 週刊的一個新系列，基於「Design Systems」這本書結構框架的讀書筆記和經驗總結。但願將本身的感覺和經驗分享給你們，輔助你們的閱讀。

加入 PinDesign 會員，獲取本期主題「什麼是 Design System」的全文內容及前兩期週刊的贈送。

點擊領取 PinDesign 會員計劃 50 元優惠券