這篇文章的內容主要來自于上個月在uxpa大會上參加的一個騰訊的高級設計師謝奕老師的工作坊，主要內容是打造自動化平臺設計規范。

筆者在日常工作中接觸了許多企業后臺的設計，在設計規范的制定和執行層面遇到許多問題。最主要的問題就是沒有一份平臺級的設計規范，因此我所設計的子應用的后臺和其他設計師設計的后臺存在許多不統一的地方。這次能夠近距離去了解和學習一個規范從0到60再到80的一個過程，以及應該以怎么樣的一個思考方式去打造一份設計規范，非常幸運。

在工作坊之后，我發現我現在所面臨的問題在他們看來根本已經不成其為問題，并且深深地感受到危機感。

規范的種類

開篇明義。所謂規范，「不以規矩，不成方圓」。各行各業都有自己的規范，互聯網行業中的不同領域有不同的規范，如角色設計規范、品牌規范、圖表可視化規范、系統規范、平臺規范等。其中系統規范普適性最高，如谷歌和蘋果的系統規范；品牌規范適用性最低，只適用于自身的品牌應用。這篇文章主要討論的是平臺級規范的制定。

如何打造平臺設計規范

做設計規范的時候容易陷入一個誤區，那就是僅僅為了有一份規范而去做一份規范，照貓畫虎，沒有根據實際需求去制定一份適合自身團隊的設計規范。這樣做出來的規范往往在實際應用場景中會出現很多適用性的問題，因為每個平臺的特性都是不一樣的。

謝老師提供了一個思路：把一份設計規范當作一個產品來設計。按照用戶體驗要素來分析和制作規范，來確保規范的質量。

戰略層：明確用戶需求和產品目標

這是第一步也是最重要的一步，同時也是很多設計師在制定設計規范時最容易忽略的一步：制定設計規范是為了解決什么問題？誰需要這份設計規范，他們的需求是什么？

設計規范的用戶主要有三類：設計師、產品經理以及前端工程師。

設計師需要的設計規范可以快速復用，同時標準化設計團隊的設計，統一整個平臺的設計風格及操作體驗。解放生產力，讓自己有更多時間去思考用戶需求和業務目標而不是死摳界面；

產品經理需要的設計規范是可以快速搭建出一個生動形象的需求原型，而不是每次都使用競品的截圖。當然，這個頁面最好是可以進行交互操作，能直接生成前端界面更佳；

前端工程師需要的設計規范是一份詳細的樣式標注，最好是可以直接復用代碼，不需要敲代碼就可以生成的話更佳。

綜合以上用戶需求，「設計規范」的產品目標就是提升生產效率，將設計師和前端工程師從重復性勞動中解放出來，并最終取代設計師和前端工程師（其實我認為最終更有可能被取代的是產品經理，因為設計師和前端將有更多的時間去思考用戶和業務層面的問題了）。

需要注意的是以上指出的三類用戶只是一般情況，還有另外一些產品可能會有更多角色需要使用到設計規范。例如電商類產品的產品團隊中，需要使用到設計規范的除了以上三類用戶外，還會有攝影師、運營專員等。

范圍層：確定用戶的主要需求，轉化為核心功能點

針對以上三類用戶需求，設計規范需要提供什么功能來滿足他們的需求。

?結構層：將產品需要呈現給用戶的功能點按照一定的模式和順序進行組織

這一層面的設計將和設計規范最終呈現的界面布局以及導航體系強相關。因此進行分類和組織的形式將影響到用戶在使用設計規范時是否易用，用戶是否能夠在頁面中快速找到自己的目標，在頁面中是否會迷失。

分類方式有多種：可以按照用戶角色進行分類，每個用戶可以在自己的頁簽下選擇自己想要的，缺點是頁面要進行多次的跳轉，或是容易造成架構臃腫，因為其中有一些元素是共同的；普遍的做法是按照內容進行分類，一般會分為設計原則、組件、場景案例、資源下載這幾類。

這里需要注意的問題是結構層的設計還需要根據具體的產品特點來進行。還是拿電商類產品來做一個例子，設計師、攝影師、運營專員等多種角色都會使用到「圖片」，因此「圖片」相關的規定面向的用戶多、細則多、要求也多。

如果按照普遍的做法，以內容進行分類，容易造成組件中「圖片」相關的類目過于臃腫，整個設計體系不平衡，而且每個用戶角色想要找到相關的內容會比較困難。針對這種情況，可以考慮將圖片單獨作為一個分類，把和圖片相關的規范內容都放在這個分類下面，方便查找。

框架層：產品的界面、導航、內容

• 界面設計：確定框架，“按鈕、輸入框、界面控件”的領域；
• 導航設計：呈現信息；
• 信息設計：呈現有效地信息溝通。

在信息設計上，最重要的是讓用戶可以一眼找到自己想要的目標，并且可以快速使用。在設計時可以參考簡約至上中的交互設計四策略：刪除、隱藏、組織、轉移。簡約、克制，突出頁面重點。（具體可以參考ant deaign，可以說做的很好了）

表現層：重視索引、簡潔專注、多樣化統一

• 重視索引：關注用戶使用規范的主要路徑、快速定位；
• 簡潔專注：視覺設計上刪繁就簡，確保突出重點信息的表達；
• 多樣化統一：包括簡單和復雜的統一、多樣化平臺中尋求統一、文案構成具有一致性。

智能化設計規范

到這一步，設計規范已經從0做到了60分，算作是一份基本可用的設計規范，但是距離「解放生產力」的產品目標還遠遠不夠。

庸者止步于此，優者保持探索。謝老師的設計團隊在智能化平臺上進行了很多探索，包括圖標智能化、控件智能化、圖標智能化、主題智能化等等。他們所做的就是不斷探索設計規律，從而進行量化，最終寫進代碼做到自動化。由此我不禁感嘆「一切可以被量化的都是可以被代替的」。

最后的最后

雖然參加這個工作坊使我的心靈和思維都受到了震蕩，但是實際工作中我們還是很難做到像大廠一樣做一份如此高水平的設計規范。但是我們還是可以通過一些其他的工具去彌補其中的不足。以下我將結合自身經歷簡單談一談我們這個普通的設計團隊是如何進行協作的。

1. 使用sketch library建立控件庫，同步給團隊內部每一個設計師
2. 使用藍湖進行設計歸檔，實時同步最新設計稿，同時邀請產品經理、前端
3. 使用iconfont管理圖標庫，和前端進行協作

雖然一點都不智能化，但也算滿足了最低層面的協作需求。設計工具日新月異，未來會有越來越多的工具出現，解決我們日常項目中遇到的問題，替代工作中一些瑣碎的重復性工作。要懷抱對新工具的探索、學習和接納的態度。

學不可以已。

本文由 @?janedaring 原創發布于人人都是產品經理。未經許可，禁止轉載。

題圖來自unsplash，基于CC0協議