Design Systems 02 - 什麼是 Design Principles

上週咱們開啓了一個新的期刊系列「Design System」，第一期就收到了不少會員好評反饋。說實話有點超出了個人預期，沒想到這麼多人對這個主題感興趣，感謝你們的支持，也歡迎你們繼續給我提意見。

第一期咱們主要介紹了 Design System 的組成，以及這些概念的定義。接下來的幾周內我將繼續以這些概念展開進行詳細講解，今天咱們先從 Design Principle 開始。

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

Design Principle

Design Principle，其中文翻譯是設計原則。在上期週刊中咱們給出過定義：Principles 是一系列的規則、指導以及設計中的注意事項。它是咱們構建一套 Design System 的起點，用於解決業務、用戶體驗中的問題，引導設計往既定的方向前進。

Principle 最爲重要的目標就是確保全部參與到產品設計中的每個人有着共同、明確的目標，並以此做爲標準爲產品推動過程當中的每個決策的判斷依據。換句話說 Principle 是整個產品設計的起點，它應該被理解並融入到設計的過程當中，好比 Component、Pattern。

Principles 之間的差別

若是你也關注 Design System，應該已經看過不少相關的案例。Material Design 、Lightning、Carbon、MailChimp… 這些不一樣 Design Systems 所提出的設計原則彷佛有不少相似，但又有不少不一樣。哪個纔是正確的？哪個適合本身？

這個問題的答案其實沒有絕對，正如咱們前面所說起的 Design Principle 是爲了解決當前產品的問題而產生的。這裏有一個很重要的信息，這個產品是什麼？

一般狀況下咱們都是在考慮爲本身所服務的產品來制定相應的 Principle，因此網絡上每個 Design System 所提出的 Principle 都具有參考意義，但不必定適合本身，咱們更須要的是經過這些案例來理解的它們是如何推導以及造成的思路。

一般來講我會將 Design Principle 分爲業務型和抽象型兩類。好比 Visa、SAP 和 Material Design、Fluent。

上圖右側是 SAP 的 Fiori Design，它強調的基於角色、愉快的、一致連貫的、簡單和適應的。若是你對 SAP 的業務有一些瞭解（甚至是它的用戶），你應該不難理解這些關鍵詞對於 SAP 用戶的重要性。這些關鍵詞與 SAP 的業務特性有着很是密切的關聯，甚至說作很差這些點他們的用戶將不會願意繼續選擇他們的產品。

相比而言 Material Design 給出的 Principles 就比較抽象了，彷佛頗有道理但彷佛又什麼都沒說。做爲一款操做系統級的語言，它更多的是提供一個土壤，卻又不知道下一個新出現的產品會是什麼樣。他們更須要的是賦予整個環境一個完整的世界觀，一個經得起推敲（Material）的世界觀。

Material Design 這類 Design System 很重要，咱們須要去學習研究它，不過更可能是站在其平臺（iOS 也同樣）進行產設計。對於 Principles 的研究，咱們更應該放在這些偏業務的類型上。畢竟咱們很難（也不必定須要）建立一個世界觀，但作好一款產品是迫切須要的。

如何評判一個 Design Principles 的好壞

抽象型的 Principles 本就很少，它們大多都有着完整的世界觀，是經得起推敲的。因此咱們仍是將重點關注到業務型 Principles 上。

01.來源於業務

既然是業務型，它們就一定會存在差別性。Visa 和 SAP 都有着本身完整的 Principles，但因爲業務特性就會有着明顯的差別。

Visa（上圖右）在其新發布的 Design Systems 中提出了「Design Everywhere」的理念。做爲一個國際化的產品，如何在全球用戶的不一樣設備上快速、安全的完成支付、資金管理操做是他們最爲重要的目標和方向。而 SAP 做爲企業內部解決方案提供商則更關注於角色、操做的連貫性等目標。

簡單、有效、輕量這些咱們常見的關鍵詞沒有錯，沒有人會質疑這些在產品設計中的通用規則，這也是每個產品都應該作到的。但一個稱職的 Principles 首先是須要服務於業務及其用戶的痛點，基於解決問題的角度出發。

02.實用可行

咱們在前面提到過，Principles 的做用是給予解決問題的實際指導，可以用於做爲產品設計決策中的依據。那麼咱們就不能只管推導產出，這把「尺」是否好用一樣很是重要。書中有一個很是形象的案例，咱們不妨再提出來分享一下。

關於「簡潔」這個關鍵詞，聽來絕對沒錯，但應該如何去定義呢？基於它咱們能夠有兩種不一樣的說法：Make it simple、No needless parts。

「Make it simple」 聽起來很不錯，沒有人能夠說它不對。簡單、易用應該是每個產品都應該努力的目標，但這彷佛不夠清晰。究竟多簡單纔是簡單？咱們如何去衡量它？

相較之下 「No needless parts」則更加的「有力度」。每個元素（從大到小）都應該有存在的目的，爲解決用戶的問題而服務。若是你解釋不了這個元素對於產品的正向做用，那麼它可能就不該該出如今這裏界面上。

「這個是否簡單」，這個問題對於每一個人均可能有不同的答案，這會讓整個判斷變得不夠客觀。相反「這個是否必須？」則更容易判斷，能夠落實到界面上的每個元素上。

咱們須要 Principles 具有指導意義，因此它不該該只是一個好聽的關鍵詞，而是須要更實際的去表達它的意義，爲設計的過程提供可操做的參考意見。

03.優先級區分

咱們所接觸到的 Principles 通常都會有 4 到 5 個關鍵詞，它們表明着產品在不一樣維度上的目標。但這些標準之間也應該有着優先級的差別。試想一下若是當某個界面上效率和美觀出現衝突時應該如何處理？ 這個時候一個好的 Principles 應該一樣也能給出答案。

最好的案例就是 Salesforce 的 Lightning Design System。Lightning 的 Principle 是清晰、高效、一致、美觀，但對於這四個關鍵詞他們定義了優先級，美觀不能超越效率和一致性、清晰甚至成爲他們絕對第一的關鍵詞。

Principles 的目標是統一思想，也是提高決策的效率，但業務的複雜度每每會帶來不少沒法預估的狀況。就像一個頁面上的核心 CTA 不宜超過 2 個同樣 Principles 也須要有優先級的差別，當出現「衝突」時最重要的那一個是須要最早被保障的。

04.易於記憶

問問團隊裏小夥伴，看看他們腦海中的 Principles 是什麼。若是沒有人能記住或是有所誤差則說明咱們的定義是有問題的。要讓你們可以牢記，首先 Principles 須要基於業務、問題來進行制定讓你們可以產生共鳴；其次還須要咱們在平常的討論、決策中常常去使用它。

Airbnb 的 Principles 是（Unified、Universal、Iconic、Conversational），這個原則深深的植入了他們每個設計中。每次涉及到新組件的設計，他們都會將這些關鍵詞帶入到設計中，看看本身的設計是否知足 Principles 的要求。

「When we design a new component, we want to make sure it addresses all four of those. If we didn’t have a set of principles it would be difficult to agree on things. We want to make sure each piece lives up to it.」

— Roy Stanfield, principal interaction designer, Airbnb

人的記憶是有限的，一般一組關鍵詞超過 4 個就會難以記憶。因此咱們須要儘量的控制在 3 到 5個，而且確保它們易於記憶。這方面 Spotify 作得頗有意思，它們的 Principles 是 TUNE（tone、usable、necessary、emotive），翻譯成中文是「曲子、曲調」，這個正好貼切與它們的業務，也很是的容易記憶。

前面咱們討論了什麼是 Principles，如何去定義它的好壞，咱們能夠嘗試着去理解、拆分你的業務或是競爭對手。在餘下的全文中咱們將繼續討論如何着手，開始建立符合本身業務的 Design Principles。

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

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

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

Design System 往期回顧：

1. 什麼是 Design System