從第一性原理看界面設(shè)計的一致性
![](http://image.woshipm.com/wp-files/img/56.jpg)
一致性,不是形式與形式保持一致,而是形式與用戶認(rèn)知保持一致。
誰與誰一致
設(shè)計原則都是有理可循的。很多設(shè)計原則是由人對大腦和人體工程學(xué)的認(rèn)識,加上實際經(jīng)驗,總結(jié)得來的,例如7±2法則、費(fèi)茲定律等等。設(shè)計師如果不知道對這些原則追本溯源,理解它最根本是要解決什么問題,只是應(yīng)用,難免會偏離初衷,遇到問題。
下面以一致性設(shè)計原則為例,講述在應(yīng)用原則的過程中我們可能遇到的問題,以及為什么會遇到這些問題。
產(chǎn)品經(jīng)理A:“這個頁面的視覺焦點(diǎn)有點(diǎn)跳,還有優(yōu)化的空間嗎?”
設(shè)計師B:“因為其中一個模塊在其他頁面也有,為了保持統(tǒng)一和可復(fù)用性,所以產(chǎn)生了你說的問題?!?/p>
產(chǎn)品經(jīng)理A:“這三個前后頁面太像了,用戶會不會迷路?。俊?/p>
設(shè)計師B:“不會吧,這三個頁面的內(nèi)容都是關(guān)于xx的,前后保持一致,應(yīng)該更好理解吧。”
通過這些對話發(fā)現(xiàn),設(shè)計師B經(jīng)常用來闡述自己設(shè)計思路的一致性,在面對產(chǎn)品經(jīng)理A以用戶視角發(fā)起的疑問時,不能很好地解釋說明,原則似乎“不靈了”,原因出在哪里?其實,從設(shè)計師B的說辭可以分析出,他提出的一致性的出發(fā)點(diǎn)是存在偏差的。
一致性的第一性原理
如何糾偏,我將從第一性原理來重新解讀一致性。
所有設(shè)計原則的出發(fā)點(diǎn)是用戶。為了讓用戶更好地使用產(chǎn)品,我們才通過設(shè)計原則來指導(dǎo)完成好用的設(shè)計方案。它不是為了方便設(shè)計師對照原則畫界面,提高設(shè)計效率,或輸出一套遵循原則的漂亮規(guī)范,或成為與產(chǎn)品經(jīng)理爭論時的有力依據(jù)。它是為了方便用戶,讓用戶能夠理解界面中的信息時不會困難,在屏幕中操作時不會覺得麻煩。理解了這一前提,我們再更深一層看,一致性到底解決了用戶什么問題?
用戶在瀏覽界面信息時,是通過大腦處理信息,這一過程和大腦的運(yùn)行機(jī)制有關(guān):人類大腦的運(yùn)行是建立在經(jīng)驗的基礎(chǔ)上。以往的記憶和認(rèn)識會影響對當(dāng)下新事物的判斷,大腦會尋求新事物與已有經(jīng)驗的聯(lián)系,將它們關(guān)聯(lián),一視同仁地去理解,從而降低大腦的負(fù)擔(dān)。對,人類就是這么懶,一致性簡直就是人類大腦的福音。
綜上,從第一性原理解讀后的一致性原則為:與用戶已有的認(rèn)知保持一致。在此基礎(chǔ)上延伸,才有了我們常說的那些道理:“我們要讓用戶再次看到xx時能夠很快明白它的用途,才將這個元素或模塊在多處保持統(tǒng)一”;“我們通過運(yùn)用映射物理世界的方法去設(shè)計表現(xiàn)層,為的是讓用戶更容易理解xx”等等。
所以,我們常用的一致性也沒錯,只不過是核心思想落地到具體情況的具體表現(xiàn),它是多樣的,但我們不應(yīng)該將多樣的表現(xiàn)總結(jié)為規(guī)律,去遵循,而應(yīng)該探究到本質(zhì),再從本質(zhì)出發(fā),解決多樣的問題。
下面舉兩個實際工作中應(yīng)用一致性和選擇不用一致性的例子。
應(yīng)用一致性的例子:背景是顧客在餐廳就餐后,用手機(jī)掃描桌臺上美團(tuán)點(diǎn)評提供的二維碼即可查看訂單直接支付,如果商家提供會員服務(wù)且顧客還不是商家會員,即可看到申請成為會員的入口,如下左圖,如果顧客已是會員,則看到的是右圖。
這里的一致性體現(xiàn)在前后頁面會員模塊的位置上,都位于頁面的頭部,與商家信息在一塊兒。原因是,顧客從商家信息下方的申請入口完成申請流程后,重新進(jìn)入支付訂單頁時,想確認(rèn)自己是否已是會員,這時,根據(jù)之前已有的認(rèn)知,會先入為主地從頭部的商家信息附近開始尋找,故將會員標(biāo)識也與商家信息放一塊兒,與用戶的認(rèn)知保持一致。
再來看一個選擇不用一致性的例子:背景是顧客在餐廳就餐后選擇美團(tuán)智能POS機(jī)進(jìn)行支付,并且該顧客支付時使用了會員余額,剩下的零頭使用了微信支付,如下左圖是顧客完成支付后手機(jī)上的支付結(jié)果頁,右圖是商家完成收款后POS機(jī)上的收款結(jié)果頁。
這里的不一致體現(xiàn)在頁面頭部重點(diǎn)展示的金額上。大家一定會疑問,同一筆消費(fèi)的支付結(jié)果頁,為什么要展示不一樣的金額呢?同樣的金額難道不也會讓顧客和商家達(dá)成某種一致嗎?通過詢問商家的想法發(fā)現(xiàn),商家更關(guān)注訂單的總金額,因為這才是他們實際得到的收益,并且在對賬時也需要訂單總金額才能對平。反觀顧客,作為注重優(yōu)惠的消費(fèi)者自然更在意自已實際付了多少,有沒有多付或者少付,并且,顯示減去各種優(yōu)惠的實付金額,在心理感受上也有撈了大便宜的快感。由此可見,一致性在這里,并沒有認(rèn)知上的重合,也就沒有必要遵循了。
延伸思考
除了一致性原則,很多其他設(shè)計原則,甚至設(shè)計工具和設(shè)計方法都可以用第一性原理的思路去剖析:做可用性測試的本來目的是什么?用戶場景分析究竟為的是什么?HEART模型是怎么來的又可以衍生出什么?馬斯洛需求層次理論的本質(zhì)是什么?
相信通過第一性原理的層層剖析后,你會對這些平時常用的知識產(chǎn)生全新的認(rèn)識。
本文由 @王文俊 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。
題圖來自PEXELS,基于CC0協(xié)議
不能單純的用一致性去解決用戶體驗,還是要應(yīng)用到具體場景里,通過一致性的大原則,去調(diào)整具體的
很有啟示,有個小問題,當(dāng)一致性和用戶體驗發(fā)生沖突時,產(chǎn)品經(jīng)理如何說服Ui
這個前提可能就存在問題~一致性是服務(wù)于用戶體驗的,怎么會沖突呢?我能想到的可能是與業(yè)務(wù)目標(biāo)發(fā)生沖突,如果是這樣,建議體驗在可接受的范圍內(nèi)以業(yè)務(wù)為先~
顧客支付結(jié)果頁和商家收款結(jié)果頁是不寫反了
確實反了,已糾正