Do we need design system? 什麼是設計系統，我們需要他來做什麼？
本文章為 Awwwards Digital Thinkers Conference @ San Francisco 2019 中，Elaine Chao @ Abode XD 以及 Hayley Hughes @ Airbnb 的演講內容所整理節錄。一直以來我們所理解的設計系統就是 UI 元件的資料庫，將產品中重複出現的 UI 元素，統一規格與互動方式文件化的整理條列，使其具有一致性與邏輯性。然而，設計系統其實不單只掌管視覺元素，其代表的更是公司核心價值的體現、以及公司所欲影響與彰顯的普世人權價值。
什麼是設計系統？
Hayley 提出 Design system hierarchy of human needs （人類需求的設計系統三階層），認為設計系統主要是由以下三個面向所搭建起來的結構化管理。
● First, Product as Components
這也是我們最熟知的設計系統樣貌，文件化地管理重複使用的 UI 元件，詳盡地記錄各種狀態與互動方式，讓團隊中的每個人對每一個元件功能與功用的認知在同一條線上，也讓設計師在與工程師溝通時，可以更加精確及有效率。
另一方面，系統化的重點在於每一個元件使用背後的邏輯與規則，而這樣的邏輯的一致性除了幫助團隊內溝通，更重要的是，他是使用者與我們產品之間的橋樑，也是協助使用者可以更容易、更不費力氣來理解、使用我們的產品。
UI 元件的設計系統在建立時，有以下的優點：
- 通用性 Accessibility：
設計系統即代表著一個通用的設計決策，且適用於公司內的所有產品。因此，假使是跨國公司、或者團隊成員分散四處，設計系統可以幫助提高產品的一致性。 - 加速決策：
設計系統幫助我們快速地產出測試概念的原型，設計師與工程師不需要花太多資源與時間執著在 UI 元件上，因此，設計系統是可以正向地提高產能與幫助商業決策。 - 加速團隊合作：
也就是一開始提到的，設計系統能讓團隊中的所有職位對現有元件有一定程度的認知基模，可以快速地知道哪些元件適用於目前所欲解決的問題，加速合作的流程、提高溝通的質量。
然而， 也不全然都只有優點。
設計系統是需要被維護與不斷更新的，並不是建立之後就可以放任不管。因為產品會迭代，互動的方式會隨著時代潮流而有所不同，一旦有不在系統內的元件出現而不去管理，原先建立的設計系統被放逐的日子也不遠矣。
Design system is there to serve you, not to slave you. It’s just a tool, just the process. — Elaine Chao
另一方面，不要被設計系統所限制，如同 Elaine 說的，設計系統只是加速讓團隊合作流程更好、更快的「工具」，並非產品體驗的限制，也不該是否定創新的藉口。
因此，仍應以定義使用者情境脈絡最佳的解決方案為主，系統化為輔，在解決使用者問題的同時，思考如何讓團隊合作更為流暢。
● Second, Services as Journeys
然而，使用者並不會因為我們整理了完整的 UI 元件資料庫而愛上我們的產品，元件資料庫處理的是客觀地功能性（Objectivity serves functionalities），真正能讓使用者愛上我們的是 — 主觀性所激發的情感需求(Subjectivity invokes emotions）。
Airbnb 為人所知的故事板（Storyboards）即是在處理這樣的面向。他們將使用者分成：房東(Host）、房客（Guest），分別將其經歷的旅程以一幅幅的插畫展現出來，從訂房、Check-In、住房體驗，到最後 Check-Out 的送別，Airbnb 認為：
故事板激發的是情感，是文字無法形容的。
Storyboards inspire feelings that words can’t express.
Airbnb 將故事板放在公司每一個成員都能看見的地方，主要的目的就是希望員工們能記得自己打造的產品是給哪些人使用、要帶給使用者怎麼樣的體驗，來增加團隊的合作默契。
同時，具體化的使用者旅程圖亦可以提供關鍵經驗，找出使用者旅程服務的缺口與機會點，幫助公司決定哪些可以投資金錢與時間。可以 Zoom in 將體驗做深，也可以 Zoom out 來看產品的整體規劃與策略。
旅程系統幫助轉化人類的需求成商業機會，不再只是關注單一的功能，而是將抽象的旅程具體地視覺化，並互相連結，以提供未來投資與策略藍圖的指引。
● Last, Value as Model
企業透過產品將所欲帶給社會的價值、以及核心思想傳遞給使用者，因此使用者也是經由產品來了解企業，定位其品牌。
往往我們會認為自己在考量事物上已經想得很萬全，兼顧到所有不同的面向，但事實上，這是不可能的。
我們生來就具備著觀看事物的「角度」，而這個角度會根據你的生長環境、社經地位、以及你所經歷過的事情而有所不同。因此，當在設計產品時，你認為你有辦法「同理」你的使用者，來兼顧到不同的角度的使用經驗。
但如果是在你生命經驗以外的呢？
例如：色盲、聽障人士、不同的種族等等，這些可能外在於你的生命經驗，你無法完全地設身處地從這些人的角度出發時，產品的價值還能夠同樣地被接收與認同嗎？
我們常以「一般人」的角度出發來開發產品，然而，這個世界上仍然有很多不一樣的人會接觸我們的產品，我們該如何讓我們的產品可以容易地被理解、容易地被使用？
例如：產品中文案出現：「看見（sees）或聽見（hear）」則可能將視障、聽障的使用者排除在我們的產品之外。
去指認出產品架構中存在的偏見（bias）或歧視（discrimination），可以讓這個社會變得更美好，然而，設計師該如何發現自己的設計，可能產生偏見或歧視？
Another Lens
Airbnb 與 NewsDeeply 合作進行的 Another Lens，透過一連串的疑問句，讓設計師反思自己的設計裡，是否存在任何偏見（bias）與歧視（discrimination ）？
他是一個工具（tool），幫助設計師來檢視、平衡自己的偏見（balance your bias）、考慮到對立面（consider the opposite），並且隨時擁有一個開放心態（embrace a growth mindset）。
他們相信，為了建立更廣泛（inclusive）、通用的解決方案，設計師有揭露自己偏見的必要，時時地尋找與自己想法不同的衝突點，來擴張自己的視野。
為什麼需要這樣做？
因為即使是虛擬的軟體產品，也會對現實社會造成真實的影響。
這些社會上習以為常的運作規則，都可能因為你的產品出現而有所改變。
舉例來說，Uber 的出現，一方面增加了人們選擇交通運輸的選項，但同時也影響了道路上、大眾交通工具等運輸系統負荷量上的變化。
因此，我們必須認真想想，
我們的產品會帶給這個社會什麼樣的價值？會為我們所在的環境造成什麼樣的影響？而這樣的影響是我們預期或期望的嗎？
另一方面，我們有沒有機會、或有沒有能力影響社會上其他的系統，來對整體人類的福祉所努力呢？例如交易系統、衛生系統、階級流動⋯⋯等等。
If good design is considered to be good business, then don’t just be good. DO GOOD.
演講的最後， Hayley 帶出了一個思考：
如果把最上層的價值系統與最下層的元件系統對調呢？
在設計產品時，先思考期望影響、改變或彰顯的人權價值是什麼，並透過使用者旅程、以及使用者接觸到的介面元件來傳達這樣的價值，這個世界會不會變得更好？
If designers are free to think bigger, let’s reach for the highest of human impact and create system that produce a better world for everyone.
假使我們設計師，能夠想得更大、更遠，何不努力去對人類的社會產生一些影響力，創造一個讓世界變得更好的系統？
不單只是「好的企業」，更要成為「做好事」的企業。
最後，
當有想要建立設計系統時，請思考以下的問題：
1. What does your design system do for your organization?
你期望設計系統為你的組織做什麼事情？達成什麼樣的目標？2. Base on those needs, what does your design system look like to meet those need?
根據這些目標跟需求，你認為這個設計系統他會是什麼模樣？3. Then, choose your technology.
再來決定設計系統的形式
Ultimately, design system is a tool to help your organization work more efficiently.
話說到最底，設計系統只是一個幫助團隊合作更加有效率的工具。設計系統的樣貌與運作方式也不會只有一種形式，沒有絕對正確的答案，找出適合自己團隊設計與開發之間最順暢的合作流程，就是一種系統化的結果。
延伸閱讀
