起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識從1到0，組件庫防癌指南
編輯導語：對于設計師來說，很多人都會接觸到組件庫，但是不同的人的使用方法卻大不相同。今天，在本篇文章中，作者為我們分享了他關于組件庫的幾個問題以及相關的思考，快來看看你對組件庫的使用還要哪些應該改進的地方吧。
年中的時候作為評委參加了公司設計通道晉升評審，完整的聽了10位同學的工作匯報和個人總結，果然不出所料，每個同學匯報里都或多或少涉及到“設計規范”或 “組件庫” 的這么一個模塊。
本想著平靜的聽完打個醬油就完事了，但還是沒忍住問了其中一個同學：“你們平時是怎么用組件庫協作的？”
具體答案記不清了，我轉譯一下，大概的意思是他會約束幾個元素，比如按鈕 / 圓角 / 字體字號規范設計稿，其余的地方需要就自由發揮。
顯然這個答案我是不買單的，反而帶來了關于組件庫的幾個問題和思考：
01 低微顆粒度下的設計失衡
設計管理是門學問（對設計工作的管理，不是對人的管理哈），一定程度上細節是不影響大局的，這就好比地球上的人分白種人 / 黃種人 / 黑種人。
盡管每一個白種人的長相各不相同，但放在亞洲的任何一個國家你都能第一時間分辨出來種族的不同，他們的特征是膚色（品牌色），身材（造型）跟 發型 / 手飾 是否統一基本沒有關系；可不要拿了芝麻丟了西瓜。
02 面面俱到反而無從下手
大多數同學都有患得患失的心理，認為準備足夠多的組件就可以應對所有問題，像樂高的零件一樣可以快速拼完成各類需求同時保證了一致性。
但理想終歸是理想，試想一下家里是否堆砌了各種看似有用實則沒卵用的東西以備不時之需？
以我自己為例，家里的購物袋堆滿了一個櫥柜，我對這些袋子的規劃有2方面；一部用途是裝垃圾，另外一部分用途是外出裝些雜物。
結局跟你想的一樣，購物袋占據了我家2平方米的位置，也就是說我用價值10w的體積容納了不足20塊錢的垃圾…
這件事情讓我明白一個道理，具備再生或持續發展能力的事或物，不要留戀。畢竟不是稀有資源，囤積真沒必要，該清理就清理，組件庫也是這樣。
進入正題前，容我再啰嗦一下基本規范，UI設計本質無非就是?對信息的編排，只需要弄想清楚“信息”和“編排“，整個UI的規則也能明確很多，所以試著去拆解下這兩個key word：
信息這塊不需要廢話了，重點說下排布中的間距。間距的設置往往是囤余的引子，大毛病從來都是小事積累出來的，要想治標還得治下本，如下圖：
通常的間距是按照線性增長的方式，遵循N*X的公式（N為最小單元），坦誠地講線性增長的方式有點像溫水煮青蛙，遞進的元素太小，所以感覺加一個就加一個了，讓人滋生了無所謂的念頭。
打消這個念頭的方式就是用指數增長去取代線性增長，合理的控制間距梯度，一定程度上會節制屯余。
另外，要運用好design token （設計編碼 / 密鑰）的方式去幫助我們管理元素。這個概念是2014年Salesforce提出來的，token已經成為了許多設計系統中必不可少的部分。
常用的方式就是按照衣服號去編碼，通過“S”“L”“M”的代號賦予界面呼吸感。同理，其他的小微組件也同樣可以用編碼的方式去管理。
不用擔心不夠用，畢竟這些尺碼滿足著全球70億人的穿衣需求，你的間距還能多過70億人的身材么？
基礎說完了，開始進入正題，如果你也遇到了上述類似的問題，那么可以帶著審視的目光來看待組件庫，我建議可以從以下兩個方面重新思考：
03 增加倉庫類型，強化臨時倉庫
像 Ant Design / Salesforce 這種重量級的組件庫一般是開放通用型組件，不一定完全貼合我們自身業務，所以做好組件庫的分類是對基礎的夯實。
區分這三個類型非常的簡單，只要你玩過王者榮耀就可以輕而易舉的明白：
這個圖應該都用不著我在解釋了哈哈哈哈，重點說下臨時型組件分類吧，這種組件定位是針對突發狀況的應對策略，屬于定制型組件，只針對你當前遇到場景，未必是可以有復用價值。
所以這種組件雖然價值不低，但恰恰是組件庫的癌細胞，特殊場景永遠不會少，如果草率的歸類到業務型組件，會越積越多，越積越龐大，嚴重的時候甚至會影響整個組件庫的迭代升級，放在臨時型分類里有需求再召喚也不失是一種辦法。
04 封裝workflow，降低操作精度
組件顆粒度太細會導致操作的精度無限度的加大，提高效率的同時又在折損效率，莫不如精進一步，把封裝組件變成封裝工作流（workflow）。
從另一個角度來看是從交互設計的思路去做UI設計組件，這種做法會極大的解放生產力，特別是針對多端設備做設計的時候，可真是一鍵適配iOS / android / 小程序 / H5等等。
上圖是以登錄為例，同樣的流程封裝可以用在電商應用的“賬號管理”、“地址管理”、“城市選擇” 、社交應用的“評論回復”等等場景里。
這塊我推薦體驗下蘋果的“捷徑”，workflow的歷史也很久了，可以通過這款APP去再次理解一下極致的生產力。
封裝workflow的做法也是避免微觀管理的措施之一，還是那個觀點分的太細很容易造成精力不聚焦，手忙腳亂的去拼每一個細節，稍微宏觀的東西反而被擱置了。
05 總結一下
丘吉爾曾經說過，“改變就是改善”，而“完美就是經常改變”。如果我們過于嚴格的一致性實施“非一既二”可能會導致更大的麻煩，甚至會讓我們將停止創新。
組件庫也是相同的道理，定制化組件沒有類別就沒必要硬塞到通用或者業務里面，單獨拎出來放著讓需求證明價值也是一個辦法。
本文由 @負能量補給站 原創發布于人人都是產品經理，未經許可，禁止轉載
題圖來自?Unsplash，基于 CC0 協議
- 目前還沒評論，等你發揮！
