反思設(shè)計的一致性

15 評論 9614 瀏覽 72 收藏 10 分鐘

規(guī)范是可變的,根據(jù)實際情況,在一致中允許有不一致,我們應當以用戶體驗為先。

我們組里大約在半年前已經(jīng)出了第一版的設(shè)計規(guī)范,包括交互和視覺兩方面(動效也略有涉及)。其中主要規(guī)定了界面布局原則、控件的形式和調(diào)用規(guī)則等。半年來,遵循著這套規(guī)范,組內(nèi)整體的工作效率確實有所提升。

但有那么幾次,碰到產(chǎn)品策劃“挑戰(zhàn)”設(shè)計規(guī)范的情況,他們認為在現(xiàn)有的規(guī)范指導下做出的某個功能/界面并不理想,想脫離開規(guī)范做一些改變。一開始我們是拒絕的,因為這無疑會加大我們的設(shè)計和維護成本。所以組內(nèi)一直在努力維護著設(shè)計規(guī)范,不為所動。

但有時我自己看著依循設(shè)計規(guī)范做出來的界面,也總覺得體驗上會欠點兒意思,總覺得……有點兒走偏了。上周末好好捋了一下,有了些眉目,整理下來與各位分享。

不過我可能要先嘚啵一點相關(guān)知識:

一. 為什么要保持一致性

一般情況主要是會對產(chǎn)品開發(fā)團隊和用戶兩方面都有好處

1. 于開發(fā)團隊而言

(1)復用資源,降低設(shè)計成本

很多不同的界面中會用到同一個資源,如果見一個重做一個,會很大程度浪費設(shè)計的人力資源

(2)產(chǎn)品風格及體驗不易出問題

因為資源的復用,能基本保證整個產(chǎn)品的風格不跑偏,而在用戶體驗上,也起碼能保持在一貫的水準

(3)新人可以快速上手

比較大型的項目中如果人員流動率較高,一致性就相當有必要了。新人先閱讀規(guī)范后更容易展開工作,根據(jù)一致性也能更快了解當前產(chǎn)品

(4)程序能提高開發(fā)速度

主要也是因為能夠復用自用資源,有些界面和控件,程序甚至無需找設(shè)計出資源,在產(chǎn)品策劃指導下可直接開發(fā)

2. 于用戶而言

(1)對界面和功能操作的認知統(tǒng)一,學習成本低

熟悉過主要界面/功能后,在其他界面/功能中能基本自由操作

比如在北京開車是靠右行駛,到上海你不用學就知道也是這樣。因為中國道路交通相關(guān)法律中對此是做了統(tǒng)一規(guī)范的。要是這一點不一致的話,到上海突然讓你靠左行駛,你肯定要適應一段時間并難免犯錯

(2)提高操作效率

在降低了認知成本后,用戶很容易就熟悉了產(chǎn)品的設(shè)計風格,那么操作起來自然也更容易上手,效率也更高

(3)加強對產(chǎn)品(品牌)辨識度

別人一看很容易辨識出:哦,這是某某某產(chǎn)品

常見的產(chǎn)品中保持一致性設(shè)計的例子非常多,相信各位天天見,我就不贅述了。

二. 有哪些地方要保持一致性

交互操作

比如彈窗的退出機制,按鈕的幾種狀態(tài)等

2. 視覺

字體、顏色、圖標、排版等

3. 多個終端

有些產(chǎn)品可能會同時有移動端和PC端產(chǎn)品,雖然是以不同的硬件設(shè)備為載體,但也要在不同的終端上保持交互和視覺一致

當然了,這里的一致不是指一樣

4. 文案

這個可能大家不太注意到,但文案風格也要和產(chǎn)品定位統(tǒng)一,各個界面出現(xiàn)的文字提示等要風格統(tǒng)一

好了,要掰扯的一致性的相關(guān)背景知識差不多了,下面是正文:

三. 一致性的變與不變

在實際的項目中我發(fā)現(xiàn) ,設(shè)計組拿到新的需求在產(chǎn)出的時候,會傾向于使用規(guī)范中既定好的控件或者規(guī)則來設(shè)計,遇到產(chǎn)品策劃的質(zhì)疑也會搬出規(guī)范來表示我們的“專一”。但慢慢我們發(fā)現(xiàn),現(xiàn)有的規(guī)范并不能適用于所有的需求,有時候遵循規(guī)范而做出來的設(shè)計,對某個需求來說,并不是一個很好的解決方式。

需求就是那個需求,需求背后的問題存在就是存在,所以問題應該不在這里。

那么,應該就是規(guī)范出了問題,或者說我們對于規(guī)范的“執(zhí)著”出了問題。

和用戶體驗的同事交流后,結(jié)合自身的體驗和觀察,我們發(fā)現(xiàn):用戶其實并不care一致性的問題

嗯,聽起來有點不好接受,但貌似事實確實如此。

我們做產(chǎn)品,做設(shè)計,都會預先把用戶假定為“忙碌的傻子”。這樣的設(shè)定使得我們一直在努力追求如何把產(chǎn)品做得更加好用易用,以及體驗更順暢更舒適。

而用戶在實際使用產(chǎn)品的時候,卻根本不會想那么多。更多想的是下一步要怎么做,甚至有些常見操作已經(jīng)變成了肌肉的機械運動,可以不用過大腦。你可以試驗一下,這會你想瀏覽朋友圈,你從拿起手機到瀏覽這一過程中,都主要在想下一步怎么做,而當你點開微信,點開“朋友圈”的時候,這種點擊操作你是不去思考的,瀏覽朋友圈上下滑動的時候,你也不會去思考。除非你想點贊,你會動用一丟丟腦部資源,想想該去找那個“更多”圖標,然后點“贊”。

也就是說,用戶在意的,的自己在完成某個目標的時候,這一路上不要出什么岔子,能更快更舒適地完成目標才是重點。

而我們做設(shè)計規(guī)范,保持一致性,是用一種最保險的方式來保證用戶的這種使用體驗。

那一致性的最主要的目的也就出來了,就是保證或者提升用戶體驗。

那么一致性本身其實并不重要,我們所堅持的一致性是否能夠完成它的目的才是最重要的。那么反思一下,當我們的設(shè)計規(guī)范,和用戶體驗沖突的時候,我們保大還是保小,哦不,是保證規(guī)范的一致性不受影響,還是用戶體驗?

答案很明顯。

設(shè)計的一致性,是工具,而不是目的。我們不該為了一致而一致,那樣是在本末倒置。規(guī)范本身也應該變得靈活一些,而不該成為我們“墨守”的成規(guī)。

規(guī)范可以增加擴充,可以刪減,也可以修改調(diào)整,是動態(tài)變化的。我們應該是“堅持用規(guī)范做設(shè)計”,而不是堅持規(guī)范本身。規(guī)范可以改變,但只是不能被打破,不然很容易對用戶體驗有負面影響。

而我們產(chǎn)品中的一致性,本身也該像優(yōu)秀的交互一樣,讓用戶感知不到。用戶能很順溜地使用完就是很好的狀態(tài)。

我們可愛的用戶并不會去思考一致不一致,適當?shù)牟灰恢氯绻茏層脩趔w驗變好,那何樂不為?

綜上,我想說的是,規(guī)范是可變的,根據(jù)實際情況,在一致中允許有不一致,我們應當以用戶體驗為先。

一致中有不一致,emmmm,可以這么理解,就好比兩個控件,雖然長得不一樣,但是你一看,就知道它們是一家人。

 

作者:Vicol, 微信公眾號:略設(shè)小計

本文由 @Vicol 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自 Pexels,基于 CC0 協(xié)議

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 打破規(guī)范的部分,深有體會,前幾天設(shè)計一個上傳照片底部要不要加標題的,有的只能限制一張,就需要小標題,如身份證正面;有的可以上傳多張,就沒限制標題,而不一定要一致性~讓用戶更好用才是重點。

    來自福建 回復
    1. 哈哈是的。

      另外,是“改變”不是“打破”哦,打破的話就容易亂,我只是在講“變”而不是“破”

      來自廣東 回復
  2. 規(guī)范可以有原則和建議,原則是必須遵守的,建議是作為參考,如果有更好的解決方案可以放棄建議,對于同樣的場景,解決方案可能會隨著時間而不斷變化,堅持最基本的,給設(shè)計師留下空間

    來自四川 回復
    1. 是的,守其宗,應其變

      來自廣東 回復
  3. 讓我想起了安卓那套 material design 的規(guī)范 …

    回復
    1. emm,MD用得少,不太get到..

      來自廣東 回復
    2. 之前我是做安卓開發(fā),開發(fā)了一款海外app,因為google play 要給我首頁推薦所以完全按照MD規(guī)范開發(fā)的,這套規(guī)范相當詳盡,如果一個產(chǎn)品能有一套類似的規(guī)范指導開發(fā),對程序員來說簡直是大幸。。

      來自新加坡 回復
    3. 哈哈是的,大廠的規(guī)范還是相當完善的。

      來自廣東 回復
  4. 彈窗有X 減少用戶思考,點X就可以關(guān)閉,不用思考點什么返回上一界面

    來自上海 回復
    1. 這個也分情況說。如果彈窗出現(xiàn)時背景有半透明遮罩,有X沒X都可以。有X的話,會減少思考,但因為其位置固定,視覺尋找和手指移動需要一定的時間,而沒X時點空白處相對來說操作會更快捷些。如果彈窗出現(xiàn)時無半透明遮罩,最好還是帶X好些。

      來自廣東 回復
    2. 費心了。

      來自上海 回復
  5. 贊,請教對于打破規(guī)范的部分,是否可以多一些的實例,比如文中案例的規(guī)范打破方案是什么?規(guī)范打破后部分違和感與用戶體驗提升效果的對比呢?

    來自廣東 回復
    1. 是“改變”不是“打破”,打破的話就容易亂,我只是在講“變”而不是“破”~
      這個本想舉例的,但因為公司的法務(wù)問題,一些未完成品無法對外公布。不過這也是這篇文章的一點缺失。

      來自廣東 回復
    2. 感謝回復,期待新分享~

      來自廣東 回復