經(jīng)驗總結(jié)！有關(guān)于設(shè)計規(guī)范的理解

設(shè)計規(guī)范的宏觀意義是統(tǒng)一

• 方便在大型體系下建立設(shè)計文化。
• 輻射與傳播設(shè)計思想（抽象的）更加容易。
• 保證多成員參與的項目保持視覺一致性。
• 設(shè)計規(guī)范的建立與規(guī)范本身的優(yōu)秀與否考驗設(shè)計團隊的實力。
• 用戶層對某產(chǎn)品的體驗一致性得到落地。
• 塑造品牌調(diào)性。
• 迭代與交接可以更加無縫。
• 減少設(shè)計出錯率。

宏觀上對內(nèi)統(tǒng)一，對外區(qū)分；簡化，優(yōu)化，糾正執(zhí)行錯誤；管理與合作變得容易。

首先我們要了解設(shè)計規(guī)范的定義基礎(chǔ)，它是圍繞在某種風(fēng)格或者大型設(shè)計文化下的，同時設(shè)計規(guī)范也分宏觀與微觀。

• 宏觀規(guī)范通常用來描述視覺感受（抽象的），由高級leader發(fā)起，由中層leader輻射給整個設(shè)計團隊。
• 微觀規(guī)范更加可視化，數(shù)據(jù)化，是針對相對獨立的體系建立的一些視覺遵守條款。

我們都不希望在使用過程中平臺各個頁面間的設(shè)計差異明顯，增加新的使用成本，而這些針對用戶層都是非常重要的體驗。

設(shè)計不應(yīng)該是變化多端，豐富的么？我們很多設(shè)計師無法理解規(guī)范的意義可能都是源于這種思考。但我們的變化與擴展應(yīng)該是基于某種基礎(chǔ)上的，這看起來是不是更有挑戰(zhàn)了？

借用前段時間非常精彩的一段內(nèi)容，可以深刻體會一下這段話。

規(guī)范不等同于標(biāo)注，它比標(biāo)注更宏觀，好的規(guī)范總是統(tǒng)一方向與基本參數(shù)，卻能預(yù)留無數(shù)的設(shè)計可能性來保證擴展性。這樣的設(shè)計規(guī)范是優(yōu)秀的。相對而言，一個優(yōu)秀的設(shè)計師，也總能在某種同樣的條件下設(shè)計更精彩的方案。

你可以這樣理解設(shè)計規(guī)范，這是一套有規(guī)則的標(biāo)準，同時提供了可變化的設(shè)計方法，方便迭代，方便其他人繼續(xù)已經(jīng)存在的設(shè)計。

你還可以想象如何管理一個幾百人的設(shè)計團隊。如果沒有規(guī)范，將如何保持用戶體驗上的統(tǒng)一，包括視覺，操作，風(fēng)格，文化等。

 

設(shè)計規(guī)范的節(jié)點

如果考慮規(guī)范的存活期，這應(yīng)該在公司達到一定規(guī)模的時候進行。在這之前，無論在戰(zhàn)略層還是執(zhí)行層，已經(jīng)開始關(guān)注獨立品牌或設(shè)計文化建設(shè)。

如果是固定的風(fēng)格規(guī)范，比如微軟的「磁貼」，NAVER的「方格」，Google的「扁平」，是完全可以書寫全局，并且時間相對長久的Type(類型)規(guī)范。這些視覺語言首先完成了獨立與區(qū)分，進而完成系統(tǒng)性與擴展性。

 

編寫者

參與規(guī)范書寫建議由全隊專業(yè)能力最強的人輔助產(chǎn)品戰(zhàn)略分析進行。專業(yè)能力代表他的執(zhí)行力，溝通力，全局能力。由他主導(dǎo)，紕漏會降到最少。這個角色應(yīng)該具備很好的協(xié)調(diào)能力，設(shè)計戰(zhàn)略觀，全局觀，配備幾名設(shè)計助手，將規(guī)范涉及的產(chǎn)品線進行統(tǒng)計?；ǜ嗟臅r間進行統(tǒng)一上可能性的分析，這能幫你確定視覺語言的可行性與擴展性，中間應(yīng)該做任何可行性嘗試，綜合產(chǎn)品戰(zhàn)略進行最終確認。好的規(guī)范能用最少的規(guī)則進行視覺風(fēng)格的統(tǒng)一，讓品牌擁有統(tǒng)一的視覺語言，產(chǎn)生競品區(qū)分，強化品牌個性，同時能保證眾多產(chǎn)品線的擴展性。統(tǒng)一與變化是規(guī)范中最難協(xié)調(diào)的部分，全局統(tǒng)一，局部區(qū)分（產(chǎn)品線個性）。最終，會形成獨特的設(shè)計個性與設(shè)計文化。

產(chǎn)品的角色介入主要為了防止全局或局部規(guī)范無法適應(yīng)產(chǎn)品的過大變化。兩者相加，能將規(guī)范的使用時間延長很多。

設(shè)計規(guī)范通常會劃在設(shè)計的最頂層，因為是指導(dǎo)性視覺文件，制定應(yīng)該慎重。同時，規(guī)范應(yīng)該具備良好的概括性，全局性，這些特征導(dǎo)致設(shè)計規(guī)范的整理并不簡單。

我們見到的，更多都是標(biāo)注，雖然與規(guī)范之間有大量的交集，但與規(guī)范的功能還是有些區(qū)別的。規(guī)范的核心是一定的框架內(nèi)設(shè)計，標(biāo)注的核心是參數(shù)。他們雖然交叉，但意義不同，話語權(quán)不同。規(guī)范一旦制定，就有不可違反性，是設(shè)計核心可見的指導(dǎo)性文檔，能幫助更多的團隊成員形成統(tǒng)一的視覺語言。標(biāo)注更多時候是用于輔助我們進行技術(shù)開發(fā)的像素級還原。

視覺規(guī)范有了不可違反性，就一定帶來了設(shè)計擴展上的障礙，一個新需求的設(shè)計如何在大的規(guī)范體系下，保持規(guī)則又能區(qū)分。

 

Q: 請問前面提到的分析具體要如何執(zhí)行？從商業(yè)戰(zhàn)略層的內(nèi)容如何轉(zhuǎn)換到實際的設(shè)計原則或者設(shè)計規(guī)范，具體怎么操作？

這問題有點復(fù)雜，我嘗試說。就我的經(jīng)歷看，戰(zhàn)略落地到設(shè)計中大部分跟品牌傳遞相關(guān)，產(chǎn)品的受眾，產(chǎn)品核心理念傳遞，產(chǎn)品的性格，統(tǒng)一與擴展。

• 召開并發(fā)起guide必要性會議。于公司內(nèi)部傳達目前設(shè)計中存在的問題，編寫guide的原因，作用，對公司戰(zhàn)略層面的推動力等。在編寫前，務(wù)必得到各個事業(yè)部門的支持。
• 提供各事業(yè)部或部門的支持詳情，對接人，日程，確認人。
• 整理并分析已經(jīng)存在的產(chǎn)品，視覺體系，指派全局型設(shè)計人力進行第一階段的設(shè)計嘗試。
• TYPE輸出首要原則是用更大的設(shè)計寬容性滿足產(chǎn)品特點與需求，過程中應(yīng)該有意識形成視覺語言的獨立性，但絕不會因為設(shè)計上的小把戲而損失擴展性。
• 進行多產(chǎn)品線適配實驗，或單產(chǎn)品獨特設(shè)計需求的適配實驗。很多設(shè)計方法在大面積已經(jīng)完成了適配，但是無法應(yīng)用到很特別的設(shè)計需求，你需要有更多的合理設(shè)計方法，產(chǎn)生的設(shè)計變化不得影響整體規(guī)范的執(zhí)行，這是很有挑戰(zhàn)的設(shè)計工作。
• 確定并局部確認規(guī)范，與各產(chǎn)品線進行會議，展示未來的設(shè)計方法，并提供演示圖，得到產(chǎn)品線的認可或整理問題進行二次設(shè)計嘗試。
• 各產(chǎn)品線的認可為必要節(jié)點，得到認可后進行全規(guī)范的書寫，完成后共享給各個設(shè)計分支，產(chǎn)品線，并明確該規(guī)范的原則性。
• 規(guī)范的使用過程中會出現(xiàn)擴展性障礙，需要設(shè)計leader級別介入進行更正或確認，一旦產(chǎn)生新的規(guī)則，要及時更新規(guī)范。
• 為了保證規(guī)范的可行性，應(yīng)該給使用者提供更多的選擇，滿足在框架內(nèi)設(shè)計的變化可能性。

先從宏觀上規(guī)劃出設(shè)計規(guī)范的大致方向，涉及到色彩情緒，視覺符號，剛硬或者柔和，嚴肅或活潑等，這部分應(yīng)該有全局型規(guī)范做指導(dǎo)。比如干凈，清晰，便捷，這就給我們提供了一個方向。

規(guī)范在輸出前，需要做的確認工作較多，當(dāng)色彩，語言特點（形式感），情緒等有了方向，應(yīng)該完成了第一步工作。接下來要進行type輸出，召集設(shè)計會議，確定方向及細化內(nèi)容。

中間是最費時間的部分，如果涉及到更多的產(chǎn)品線，應(yīng)該整理他們之間可能的共性，或者制造一個共性讓眾多產(chǎn)品可以遵守。難點在于協(xié)調(diào)他們的共性與產(chǎn)品個性，這屬于guide的擴展性部分。設(shè)計guide不同于獨立標(biāo)注，標(biāo)注通常集中在參數(shù)上，也未必考慮其他的使用場景。guide卻是更高層級的規(guī)則設(shè)計，不但有方法，規(guī)則指導(dǎo)，擴展性尤其重要，要考慮很多其他場景的可用性，不可能局限于單一需求。

接下來我們要對前面的方向進行一次盡量嚴謹?shù)穆涞貙嶒灒瑢嶒炦^程配備更多的設(shè)計資源，將已經(jīng)形成的核心視覺語言嵌套給各個可能產(chǎn)生問題的位置進行可行性實驗。當(dāng)大部分實驗都成功時，這個體系已經(jīng)算初步成型。對于涉及產(chǎn)品眾多的大型guide，人力要更多用于實驗，規(guī)范制定后的可用性，擴展性，以及使用后的統(tǒng)一性都是考核項。最后就對每個可拆分的控件進行細化與規(guī)范書寫。如果有必要，也可以對分支可行性進行確認，召集相關(guān)產(chǎn)品參與可行性分析確認。

產(chǎn)品線性格差異很大難以在細節(jié)統(tǒng)一時，就引入項目型或小型guide，配合全局guide保持公司層級的視覺一致性。沒有具體的guide內(nèi)容擴展描述時，一定要注明沖突或者特殊情況的審核者，必定只有設(shè)計中心才是guide制作部門。只有得到這些部門確認，這次guide修改或沖突才可以面向受眾露出。

內(nèi)容的整理應(yīng)該盡可能的提供參考案例，簡單的距離設(shè)計，都應(yīng)該清楚注明他們的基本規(guī)則，參數(shù)，以及特殊情況的擴展原則。例如：30px如果是我們的標(biāo)準間距，它在什么時候必須遵守，什么特殊情況我可以進行改變，旁邊要有詳盡的案例說明，或者給他們更多的可選項與設(shè)計樣式。拿到guide的其他使用者，應(yīng)該能迅速知道該如何設(shè)計。又或者我們有一套獨立的比例計算公式來確定間距，這些整理對guide使用者是非常友善的，具備核心價值。

guide就是一套可指導(dǎo)，可延續(xù)，可擴展，可統(tǒng)一，可區(qū)分的視覺指引手冊，是統(tǒng)一自己并區(qū)分其他品牌的根本。它是一種設(shè)計方法（具象的），一種設(shè)計思考模型（抽象的），指導(dǎo)相關(guān)設(shè)計結(jié)構(gòu)完成統(tǒng)一性與對外區(qū)分性。

guide在縱向管理的設(shè)計體系發(fā)揮作用很大，配合中層設(shè)計leader的審核，能有效完成抽象確認的部分。比如guide里提到簡潔（抽象的），什么是簡潔在很多人理解上就不同，縱向管理是點式散發(fā)，所有的中層都要執(zhí)行「點」的輻射，同時匯報給「點」，出現(xiàn)的偏差也當(dāng)然由「點」進行判斷對錯，所以容易落地，容易統(tǒng)一。

橫向管理的設(shè)計團隊很難完成這種深度輻射的抽象共性，leader不同，能力不同，理解不同，各自為營，guide很快就會淪為一種設(shè)計政績或產(chǎn)品政績。

對大部分公司來說，我們首先難以完成的是產(chǎn)生一套既獨立創(chuàng)新又可以形成系統(tǒng)的視覺語言，像微軟的磁貼，或是Google的扁平。設(shè)計規(guī)范一旦存在，在設(shè)計上，給我們帶來的創(chuàng)新壓力必然更大，這非常有挑戰(zhàn)性。