58到家是一款互聯(lián)網(wǎng)家政服務(wù)的平臺,有著嚴(yán)謹(jǐn)?shù)囊曈X和交互規(guī)范,同時為滿足平臺和用戶的訴求,我們在對APP進(jìn)行不斷的優(yōu)化和打磨;
在APP不斷升級和頁面的變化中,我們打造平臺統(tǒng)一的設(shè)計語言和規(guī)范,那么如何保證規(guī)范有效的落地呢?
1、不適合業(yè)務(wù)場景的,都不是好規(guī)范
設(shè)計規(guī)范需要能切實落地才能發(fā)揮它應(yīng)有的作用,從設(shè)計規(guī)范的范圍和形態(tài)上來說并沒有絕對的對與錯,不是范圍越廣越細(xì)致的規(guī)范就越好,能適應(yīng)當(dāng)前項目和團(tuán)隊、滿足業(yè)務(wù)訴求的就是「合適的」設(shè)計規(guī)范。
在業(yè)務(wù)快速上升的時期,相比一次性建立規(guī)范,根據(jù)優(yōu)先級來單點解決可能是更好的辦法。
在規(guī)范建立初期,我們通過走查等方式確立了規(guī)范目標(biāo),主要是對現(xiàn)有頁面的問題解決和對之后的設(shè)計指引。
2、“達(dá)成共識”,遵循設(shè)計指南
到家是多業(yè)務(wù)場景,很多業(yè)務(wù)和設(shè)計環(huán)境一直是在變的,所以我們更愿意對現(xiàn)有規(guī)范命名“設(shè)計指南”,可以代表著是一種動態(tài)的設(shè)計趨勢,時刻保持更新。
往往同樣一個功能在不同業(yè)務(wù)下是近似而又有差異化,這時候就需要主設(shè)計師進(jìn)行方案的整合,統(tǒng)一化設(shè)計,經(jīng)過歸納總結(jié)后形成通用性的方案,之后需要和設(shè)計小組達(dá)成共識,共同遵守通用性方案,保證統(tǒng)一組件不同頁面的一致性。
設(shè)計的一致性主要體現(xiàn)在頁面體驗的一致性,頁面體驗的直觀感受在于設(shè)計師產(chǎn)出的一致性;多人協(xié)作的團(tuán)隊中,如何保證產(chǎn)出的一致性?
如何易用?
首先,需要設(shè)計師自覺遵守沿用設(shè)計規(guī)范,其次,高效的協(xié)作工具同樣必不可少;核心:提升設(shè)計規(guī)范本身的質(zhì)量(好產(chǎn)品),簡化設(shè)計規(guī)范應(yīng)用的流程(易使用),加強(qiáng)使用者對規(guī)范的認(rèn)同感(強(qiáng)營銷)
讓每個人的設(shè)計產(chǎn)出一致1、建立主設(shè)計師與業(yè)務(wù)設(shè)計師的協(xié)同主設(shè)負(fù)責(zé)維護(hù)規(guī)范文檔,圍繞專家團(tuán)評審?fù)ㄟ^的設(shè)計理念和概念設(shè)計,完善風(fēng)格和體系化的基礎(chǔ)規(guī)范,組織設(shè)計師進(jìn)行宣講,也在這一過程中綜合、跨業(yè)務(wù)地了解和考量不同情況,聽取各業(yè)務(wù)設(shè)計師的問題建議、與各業(yè)務(wù)設(shè)計師一起共建落地。
2、同時主設(shè)計師要負(fù)責(zé)平時對規(guī)范的反饋和答疑;再遇到問題時,要做到最優(yōu)平衡:不同系統(tǒng)/業(yè)務(wù)處理,最優(yōu)呈現(xiàn)決策
比如iOS系統(tǒng)可以做毛玻璃效果,可應(yīng)用在界面里做最好的視覺呈現(xiàn)。而Android系統(tǒng)不能做毛玻璃效果則變通設(shè)計手段,降低透明度,去掉導(dǎo)航分割線,平衡各種細(xì)節(jié),盡量達(dá)到同樣期望通透柔和的效果。
3、主設(shè)與業(yè)務(wù)設(shè)計師協(xié)作分工
主設(shè)計師需要:1、清晰設(shè)計語言,設(shè)計風(fēng)格體系;2、對于設(shè)計頁面的把控,那些是需要把握的,那些是可以由業(yè)務(wù)設(shè)計師決策;3、保證宣講理念的到位,保證業(yè)務(wù)設(shè)計師和你的共建能力;4、具有全局觀,實時跟進(jìn)業(yè)務(wù)的整體方向。
業(yè)務(wù)設(shè)計師需要:1、作為直接負(fù)責(zé)各具體業(yè)務(wù)線的設(shè)計師,需要仔細(xì)理解規(guī)范和理念,認(rèn)同設(shè)計規(guī)范的價值;2、積極配合主設(shè)走查,主動提出問題,輔助主設(shè)完善設(shè)計規(guī)范,并驅(qū)動自己業(yè)務(wù)、技術(shù)落地。
主設(shè)協(xié)同組內(nèi)設(shè)計師,不斷協(xié)同完善,進(jìn)行規(guī)范的更新或者問題的剔除。
4、規(guī)范的驗證與問題收集
給大家推薦設(shè)計度量標(biāo)準(zhǔn),結(jié)合我們設(shè)計系統(tǒng)的目標(biāo),將度量體系聚焦五大維度:
通用性:是否能全面覆蓋商業(yè)業(yè)務(wù)需求;并適應(yīng)不同業(yè)務(wù)的變化,靈活可拓展易用性:在使用設(shè)計系統(tǒng)時,設(shè)計系統(tǒng)是否容易被理解和使用
效 ?率:通過使用設(shè)計系統(tǒng),是否能提升工作效率
可靠性:系統(tǒng)是否安全可靠、有人維護(hù)的
滿意度:對使用設(shè)計系統(tǒng)的滿意程度
在不同維度下,依照GSM模型的方法具體推導(dǎo)出指標(biāo)和度量方法。具體實施的過程是:羅列出度量內(nèi)容在維度上所期望的目標(biāo),以及表現(xiàn)出的信號,來推到出具體指標(biāo)。
一致性和創(chuàng)意的平衡
像58到家產(chǎn)品多業(yè)務(wù)線的情況,規(guī)范的制定上一致性與獨(dú)特性是共存的,例如基礎(chǔ)的控組件需要強(qiáng)制約,而一些新品類需要弱制約,新品類更需要創(chuàng)新的活力和方式去上線探索成功率;簡單來說,就是需要設(shè)定規(guī)范管轄的顆粒度。把顆粒度聚焦在最基礎(chǔ)的元素上,而不去做框架層面的束縛,從而讓協(xié)同的設(shè)計師都有發(fā)揮的余地。
比如動效規(guī)范定義了詳細(xì)的骨骼和時間區(qū)間,業(yè)務(wù)設(shè)計師可以在此基礎(chǔ)上去創(chuàng)作。
再比如,整個UI的配色和字體可能需要保持統(tǒng)一,但在一些圖形,動效上可以做出亮點,讓用戶在整個使用體驗中既是沉浸的又能有些小驚喜,規(guī)范的打破與重建一定是需要一個動態(tài)平衡的過程。如下圖:QQ音樂和美團(tuán)的創(chuàng)意加載場景。
組件化設(shè)計思維
從需求出發(fā):將組件視為一個獨(dú)立的產(chǎn)品,從多維度,多場景輸出組件的方案和組合標(biāo)準(zhǔn)。
設(shè)計規(guī)范的統(tǒng)一極大縮短了設(shè)計和前端開發(fā)溝通所需的時間,開發(fā)根據(jù)成熟規(guī)范建立組件庫,為后面的項目爭取了空間,同時協(xié)作更加流暢,極大減少走查問題的處理時間。
設(shè)計規(guī)范也要像具體的產(chǎn)品一樣,需要進(jìn)行迭代和維護(hù),而不是在項目做完后把設(shè)計規(guī)范整理完就扔在那落灰,然后再等到每次設(shè)計改版時全部重做,這樣成本高收益低,并且?guī)缀跗鸩坏剿鼘嶋H應(yīng)有的作用,所以我們要不斷的對規(guī)范進(jìn)行落地和驗證。
規(guī)范的迭代落地可以很好保證整個設(shè)計系統(tǒng)的秩序,讓我們的設(shè)計系統(tǒng)更具有秩序的美感。