觸屏版
全國服務(wù)熱線:0571-87205688
登錄
注冊
客戶中心
關(guān)注云客
整理規(guī)范對設(shè)計師的基本能力有很好的鍛煉作用,所以各位設(shè)計師們整理規(guī)范時不要嫌瑣碎麻煩,它可以讓我們慢慢變強!
為什么要做設(shè)計規(guī)范?(why)
如果說工作兩年我養(yǎng)成了什么習(xí)慣的話,那一定是在做任何需求之前,都先問問自己“為什么要做這件事”。整理規(guī)范也是一樣,做之前先要想清楚為什么要做規(guī)范?清楚的了解做一件事的價值有助于我們產(chǎn)生心理認同,從而更好的實施。
1. 保證平臺統(tǒng)一性
統(tǒng)一性是交互設(shè)計的一個基本原則,在一個長期迭代多人合作的項目中,不同的設(shè)計師會負責(zé)不同的模塊,每個人都有各自的思路,就有可能會對相同的元素做出了不同的方案,對于用戶來說容易造成困惑,對品牌整體形象的建設(shè)也沒有好處。所以對于較大型的產(chǎn)品,最好有設(shè)計規(guī)范來定義基本的元素,幫助眾多設(shè)計師一起做出有統(tǒng)一性的產(chǎn)品。
2. 提升團隊工作效率
對于同一個基本元素,如果沒有設(shè)計規(guī)范,交互設(shè)計師需要設(shè)計一次交互方式,視覺設(shè)計師需要設(shè)計一次外形,UI開發(fā)同學(xué)需要開發(fā)一次,每個不同的設(shè)計師遇到這個元素時都可能重新設(shè)計一遍。但如果有了設(shè)計規(guī)范,只需設(shè)計一次,團隊中任何一個設(shè)計師需要用的時候直接拿來用就可以了,也不需要再進行視覺和開發(fā),極大的提升了效率。
3. 打磨細節(jié)體驗
在整理每個元素的規(guī)范時,設(shè)計師都需要對其場景、狀態(tài)考慮清楚。在整理的過程中,經(jīng)常會發(fā)現(xiàn)一些以前沒注意到的問題,并進行優(yōu)化。把一個小元素單獨拎出來仔細考量,寫成一篇完整規(guī)范的過程,其實就是在打磨細節(jié)的過程。
什么時候做設(shè)計規(guī)范?(when)
雖說最理想的情況是在做設(shè)計前把設(shè)計準則、風(fēng)格、規(guī)范都定義清楚,但在實際項目中很少能有條件這樣做。項目初期總是小步快跑、先上再說,產(chǎn)品在不斷試錯的同時設(shè)計也是在不斷試錯,在一開始就能定義一個完全“正確”的規(guī)范其實是不太現(xiàn)實的。
通常情況下,在產(chǎn)品發(fā)展日趨平穩(wěn),產(chǎn)品定位和品牌形象都比較確定的時候;參與設(shè)計的人越來越多,統(tǒng)一性和效率的問題漸漸顯現(xiàn)出來的時候,就是需要定義和整理設(shè)計規(guī)范的時候。
什么樣的規(guī)范是好規(guī)范?(what)
規(guī)范是給人閱讀的,寫好一篇規(guī)范就像是設(shè)計好一個界面,我們也應(yīng)該確定目標用戶、用戶目標、設(shè)計目標后,再進行設(shè)計執(zhí)行。
1. 用戶目標
設(shè)計規(guī)范的目標用戶有可能只是一個團隊內(nèi)的設(shè)計師,有可能是第三方的工作人員,有可能是公開給所有人都可以查看的。不管是哪種類型的用戶,都會有一個基本一致的目標,那就是“快速的在規(guī)范中找到有效信息并獲得指導(dǎo)”。在這個一致的目標下又有所不同之處。
(1)團隊內(nèi)設(shè)計師——準確使用
團隊內(nèi)的設(shè)計師通常情況下需要盡可能的依據(jù)規(guī)范做出“準確”的設(shè)計,保證元素使用在正確的場景下,保證整個平臺的一致性。所以給團隊內(nèi)的設(shè)計師看的規(guī)范相對來說會詳細很多,以騰訊云內(nèi)部設(shè)計規(guī)范為例,需要包含實際的交互場景舉例及說明幫助交互設(shè)計師理解和判斷,需要包含視覺標注幫助視覺設(shè)計師和UI工程師查閱等。
(2)第三方團隊——快速上手
給第三方工作人員的設(shè)計規(guī)范又有所不同,他們的目標更側(cè)重在合作時快速上手,直接將團隊內(nèi)部詳細的長篇大論拿給他們看很難保證他們有耐心閱讀,因此很難保證他們遵循規(guī)范。針對這種情況,更適合整理出典型頁面,UI Kit,加之簡單易懂的說明給他們,讓他們快速了解頁面應(yīng)該怎么布局,可以用現(xiàn)成的元素進行快速拼接就可以了。
(3)公開大眾——尋求參考
公開給大眾的設(shè)計規(guī)范有非常詳細的,也有比較簡單直接的,主要還是要根據(jù)公開的目的來確定。通常情況下只是起到參考作用的公開指南,內(nèi)容會比團隊內(nèi)部的設(shè)計規(guī)范精煉的多,大都只是展示定義描述、樣式,再配以正確和錯誤示范幫助理解。而某些公開規(guī)范同時起到給合作方使用的功能時,就會包含更多詳細的內(nèi)容,詳細的描述、視覺標注、代碼等等。
2. 設(shè)計目標
確定用戶目標之后,設(shè)計目標就很清晰了,一個好的規(guī)范應(yīng)該是高效的、簡單易懂的,以內(nèi)部設(shè)計規(guī)范為例,具體執(zhí)行時,我們應(yīng)該確保分類合理、規(guī)范本身保持一致、布局排版易讀,來提升設(shè)計師查閱的效率;確保定義清晰、描述準確、場景完備,來幫助設(shè)計師理解和使用。
(1)分類合理
一整套規(guī)范的內(nèi)容通常都很多,為了能讓用戶快速查找,合理的分類必不可少。
(2)保持一致
每篇規(guī)范包含的內(nèi)容保持一致、格式保持一致可以給用戶構(gòu)建心理預(yù)期,讓他們看一篇規(guī)范就知道每篇都包含哪些部分,可以找到哪些信息。
(3)排版易讀
通過合適的字體字號、間距留白減少用戶閱讀的疲勞感,圖片與說明清晰的結(jié)合,正確和錯誤示例要能明顯區(qū)分,使用表格來組織信息。
(4)定義清晰、描述準確、場景完備
用簡單易懂的語句進行定義和描述,幫助用戶了解是什么、怎么用、哪些場景可用。(規(guī)范不可能包含所有場景,但應(yīng)該包含大多數(shù)常見場景。)
如何系統(tǒng)地整理規(guī)范?(how)
1. 制定一個計劃
整理設(shè)計規(guī)范是一個涉及廣周期長的項目,所以有一個清晰的計劃可以幫助這個項目更好的推進。制定計劃的流程如下圖所示:
(1)整理規(guī)范內(nèi)容及分類
做之前先明確我們需要整理哪些內(nèi)容,這些內(nèi)容的分類是怎樣的,下圖是我們整理騰訊云規(guī)范時列的內(nèi)容及分類,初始時列舉的內(nèi)容可能不全,但沒有關(guān)系,先把最基礎(chǔ)的分類和內(nèi)容定義好,后續(xù)發(fā)現(xiàn)有遺漏的內(nèi)容再添加進去即可。
(2)確定優(yōu)先級與分工
由上圖可以看出,一整套規(guī)范包含的內(nèi)容非常的多,所以內(nèi)容和分類整理好后,還需要確定每塊內(nèi)容的優(yōu)先級和分工。從大的模塊上說,首先應(yīng)當確定整體的設(shè)計風(fēng)格和框架,整體確定后才好確定細節(jié)的風(fēng)格;其次的優(yōu)先級最好是控件、組件、場景,因為控件組成組件,控件和組件組成場景,所以先確定小的控件后,組件和場景更容易確定。至于分工,規(guī)范的制定是整個團隊的事情,最好團隊中的設(shè)計師都能夠參與,互相分擔工作量以提高規(guī)范整理的效率,也能夠確保規(guī)范是在大家的討論下制定而成,每個人都參與過并贊同結(jié)論。
(3)確定規(guī)范展示形式及推進流程
其實確定規(guī)范展示形式也是確定規(guī)范目標用戶,要確定規(guī)范是給誰看的,展示在網(wǎng)站上還是直接用文檔承載,網(wǎng)站是否對公眾開放等問題。確定了這些問題后就可以確定規(guī)范的詳細程度、大體的展示形式。
推進流程指的是整個項目要怎么跑,涉及到每個設(shè)計師接到分工后如何輸出,何時討論,怎么輸出,交接給誰等等問題。例如我們的推進流程是每周固定時間開規(guī)范討論會,每次確定幾個要討論的內(nèi)容,負責(zé)的設(shè)計師整理問題,在會議上和大家一起討論敲定結(jié)果,經(jīng)過兩周討論后輸出最終版本,交給下一個負責(zé)人。
(4)制定規(guī)范的規(guī)范
規(guī)范本身要遵循什么規(guī)則,也是需要事先確定的,我認為包括兩個部分,一是設(shè)計原則,二是輸出物規(guī)范。
根據(jù)整個產(chǎn)品的目標用戶、用戶及產(chǎn)品目標可以確定我們的設(shè)計原則,所有的規(guī)范梳理都要遵循最基礎(chǔ)的設(shè)計原則,以滿足用戶及產(chǎn)品需求,提升整體的體驗。
之前有提到過規(guī)范自身保持一致性是提高規(guī)范閱讀效率的一部分,而且為了提升設(shè)計師輸出的效率,事先制定好規(guī)范輸出物的規(guī)范可以幫助設(shè)計師按照一個既定的格式進行輸出,同時又能保持一致性。我們的輸出物規(guī)范中包括:
規(guī)范包含的內(nèi)容,需要有描述、類型及場景、使用說明、視覺規(guī)范、補充說明、相關(guān)下載、負責(zé)設(shè)計師
規(guī)范插圖的尺寸、背景色、板式、字體及用色、正確及錯誤示例圖樣式等
2. 單個規(guī)范的整理流程
整體計劃制定好之后,就需要開始一個個整理規(guī)范內(nèi)容了。整理單個規(guī)范的內(nèi)容也是有流程可尋的,如下圖所示。下面以整理“對話框”規(guī)范為例,講解一下單個規(guī)范整理的流程。
(1)收集場景
給已經(jīng)趨于成熟的產(chǎn)品整理規(guī)范,第一步就是要先收集場景。以對話框為例,對話框可能出現(xiàn)的地方很多,類型也各有不同,在沒有規(guī)范之前,產(chǎn)品中可能會有各種各樣的對話框,每個設(shè)計師做的可能都有些差別,所以第一步,是把產(chǎn)品中所有出現(xiàn)過的對話框都收集起來。
(2)歸納分類
場景收集完后,就要對收集到的所有場景進行歸類,例如對話框按照樣式不同可以分為“模態(tài)對話框”和“非模態(tài)對話框”,在模態(tài)對話框中按照功能不同又可以分成“確認類對話框”、“反饋&警示類對話框”、“表單類對話框”。歸納分類的作用在于,可以把眾多的場景收攏成幾個典型的種類,只對典型種類進行定義和詳細描述就可以很好的給用戶起到指導(dǎo)作用;同時歸類之后減少了規(guī)范對象的種類,更好的保證產(chǎn)品的一致性。
(3)給出定義
分類確定好后就可以開始給出定義了,首先給出整個規(guī)范對象的定義,例如對話框是什么,什么情況下適合用對話框等。除了整體的定義外,每個類型也需要有定義,幫助用戶理解每種類型有何差別,什么場景選用哪種類別等。
(4)優(yōu)化方案
分類和定義都確定后,需要對各類型進行優(yōu)化輸出最終的規(guī)則,對于這些細節(jié)規(guī)則,無法確定的時候可以尋找一些優(yōu)秀案例來參考,例如優(yōu)秀的產(chǎn)品、有名的設(shè)計指南等。同時可以根據(jù)實際場景輸出多種優(yōu)劣不同的方案,和大家一起討論對比。
(5)宣講討論
規(guī)范整理出后可以在討論會議上同步給大家,最好事先把所有需要大家一起討論確定的問題列出來,把對比方案都做好,提高討論的效率,和大家一起來敲定最終的方案,同時也讓每個設(shè)計師都了解規(guī)范的細節(jié)。
(6)最終輸出
所有問題都敲定后即可按照輸出物規(guī)范進行輸出,輸出后交接給視覺設(shè)計師。
規(guī)范整理完之后還有什么工作?
如所有的設(shè)計工作一樣,輸出并不代表完結(jié)。
設(shè)計稿輸出后還需要確保還原度、保證其正常上線、收集反饋意見不斷進行優(yōu)化。設(shè)計規(guī)范也一樣,做完規(guī)范后也要確保還原度,推動新的規(guī)范落地;不斷收集遺漏的部分補充進規(guī)范中,發(fā)現(xiàn)問題并不斷優(yōu)化,持續(xù)的維護更新規(guī)范文檔。
有了完善的規(guī)范如何進行創(chuàng)新?
規(guī)范和創(chuàng)新從來都不是對立的。
1. 規(guī)范不可能囊括所有場景,即不可能所有場景都需要100%遵循規(guī)范
對于一些規(guī)范中沒有包含的場景,或者不適合遵循規(guī)范的場景,例如一些特殊的運營活動,一些特別的功能點,還是有可以創(chuàng)新的余地的。
2. 體驗好是第一要義
遵循規(guī)范是為了保證一致性從而保證體驗,如果在某些場景下不遵循規(guī)范也不會因為影響一致性而影響體驗,反而對特定場景有更好的效果時,不遵循規(guī)范也沒什么關(guān)系。
3. 規(guī)范不是永恒不變的,還有優(yōu)化的空間
規(guī)范也需要不斷的優(yōu)化、迭代更新,優(yōu)化規(guī)范本身也是創(chuàng)新的過程。例如樣式風(fēng)格隨著時間的變化需要更新,例如交互方式也有可能會有新的場景需要補充等等。
整理規(guī)范可以鍛煉哪些能力?
寫一篇分類簡單合理,場景、細節(jié)考慮完備,展示清晰易讀的規(guī)范,也不能算是一件很簡單的事情,需要用到設(shè)計師的很多基礎(chǔ)能力,例如:
1. 收集信息的能力
在整理規(guī)范時,收集場景、收集定義、收集優(yōu)秀案例都可以鍛煉到我們的收集信息能力,這個基本能力在日常工作中也經(jīng)常需要用到,例如做需求前需要先收集需求背景相關(guān)信息,了解清楚是什么、為什么、怎么做的問題。
2. 歸納總結(jié)的能力
將收集到的信息進行歸納整理,得出簡單合理的分類的過程,就是鍛煉我們歸納總結(jié)能力的過程。在設(shè)計時,大到信息架構(gòu)的設(shè)計,小到表單信息分類展示,都需要此能力幫助我們更好的處理信息,更好的將信息展示給用戶。
3. 全面思考的能力
我一直認為,全面思考的能力是交互設(shè)計師最重要的能力。在整理規(guī)范時,既需要對全局全面思考,例如什么情況適合用對話框,什么情況不適用,不同類型的對話框應(yīng)該在哪些場景用等等;也需要對細節(jié)全面思考,例如對話框中需要放幾個按鈕、按鈕順序應(yīng)該怎么定、按鈕文案怎么才好理解等等。在日常工作中也是一樣,既要思考全局的問題,例如用戶目標、產(chǎn)品目標、整體使用流程等,也要思考細節(jié)的問題,例如異常情況怎么辦、極限情況有哪些等。
4. 清晰表述的能力
在整理過程中和大家討論,可以鍛煉自己的表達能力和說服對方的能力;在輸出規(guī)范時,又能鍛煉清晰的描述能力,幫助用戶快速抓住重點。表述能力也是交互設(shè)計師的必備能力之一,因為日常工作中經(jīng)常需要和上下游各類同事溝通、PK,清晰的表述能力可以幫助設(shè)計師把全面思考的結(jié)果告知他人,并說服他人,推動工作更好的進展下去。
最后
再來回顧一下全文的主要內(nèi)容:
在產(chǎn)品發(fā)展到穩(wěn)定階段、參與的人越來越多時,還是十分有必要整理設(shè)計規(guī)范的,因為它可以幫助我們提升產(chǎn)品統(tǒng)一性、團隊工作效率以及細節(jié)體驗。
好的設(shè)計規(guī)范應(yīng)該是能讓用戶高效獲取到有效信息的,但針對不同的受眾,規(guī)范本身也會有不同的側(cè)重點。
規(guī)范的制定最好能有系統(tǒng)的組織、遵循一定的流程來完成,以確保規(guī)范有條不紊的整理和推進。
規(guī)范輸出后并不代表完成,還需要推動落地、迭代優(yōu)化、維護更新。
有了規(guī)范也不代表設(shè)計師就沒有創(chuàng)新的空間了,規(guī)范和創(chuàng)新從來都不是對立的。
整理規(guī)范對設(shè)計師的基本能力有很好的鍛煉作用,所以各位設(shè)計師們整理規(guī)范時不要嫌瑣碎麻煩,它可以讓我們慢慢變強!
評論(0人參與,0條評論)
發(fā)布評論
最新評論