我們設(shè)計(jì)產(chǎn)品時(shí)，一個(gè)組件可能會(huì)在多個(gè)地方調(diào)用。而每個(gè)地方的使用場景都不盡相同。這個(gè)時(shí)候就會(huì)涉及到一致性的問題。那么，如何保證設(shè)計(jì)的一致性呢？

不一致的影響：

產(chǎn)品設(shè)計(jì)中一個(gè)很重要的原則就是一致性，不一致的產(chǎn)品會(huì)對(duì)用戶及自身品牌造成極其重大的影響，比如：

1，不一致會(huì)導(dǎo)致用戶學(xué)習(xí)成本變高

微信安卓app在首頁微信欄長按一個(gè)聯(lián)系人或群組時(shí)會(huì)出現(xiàn)下面的菜單

可以標(biāo)為已讀未讀/置頂/刪除聊天?？梢灾庙?，很方便的功能，對(duì)吧，于是我也想把某一個(gè)公眾號(hào)（這里指服務(wù)號(hào)）置頂，于是我長按一個(gè)顯示在微信欄的公眾號(hào)，它顯示這個(gè)：

為什么不能置頂？而且把取消關(guān)注放到了這里？邏輯是什么啊？當(dāng)我又長按訂閱號(hào)時(shí)，她又只顯示刪除該聊天：

這些列表項(xiàng)都在一個(gè)列表中，為什么長按會(huì)有不同的響應(yīng)？我當(dāng)然知道原因，可是那也是在我認(rèn)真思考之后才知道的原因，其他用戶呢？另外，還有，同樣是公眾號(hào)，為什么有的在“微信”欄，又有的折疊在了“訂閱號(hào)”里了？長得跟親兄弟似的卻相差如此之大，WTF of ‘公眾號(hào)’？對(duì)于大多數(shù)普通用戶誰管你是訂閱號(hào)還是服務(wù)號(hào)?。康任抑肋@些規(guī)則后花費(fèi)了我很長時(shí)間。

2，同一個(gè)團(tuán)隊(duì)中的產(chǎn)品設(shè)計(jì)上的一致性有利于建立自己的品牌和可信性

對(duì)于有能力的大企業(yè)，還是應(yīng)該重視設(shè)計(jì)，盡力使自己的產(chǎn)品們能遵循相同的設(shè)計(jì)語言，這一點(diǎn)騰訊互娛已經(jīng)嘗到了甜頭。

比如上面是騰訊出的幾個(gè)游戲，注意到了共同點(diǎn)了嗎？icon的右下角都有相同的logo。玩家在隨便找游戲時(shí)，多多少少會(huì)受到一些影響，看到那個(gè)logo，就知道是騰訊出的，“騰訊出品，必屬精品”（說說而已，不要打我），可能考慮下載的可能性就多了很多。反觀網(wǎng)易游戲，做的logo很好，但是并沒有發(fā)揮到極致。

一致性應(yīng)該考慮哪些方面呢？

產(chǎn)品內(nèi)部的一致性

1）視覺的一致性

一個(gè)產(chǎn)品的視覺設(shè)計(jì)應(yīng)該給用戶一種格調(diào)或者說feel，這種格調(diào)應(yīng)該伴隨著該產(chǎn)品的不同部分。比如B站app的閃屏，各個(gè)頁面?zhèn)兊脑O(shè)計(jì)，乃至icon們，都給用戶傳遞一種二次元?jiǎng)勇膄eel

2）交互行為的一致性

某個(gè)產(chǎn)品或者系統(tǒng)內(nèi)部的交互方式應(yīng)該一致，這會(huì)讓用戶對(duì)產(chǎn)品產(chǎn)生信賴感和控制感。比如我的手機(jī)系統(tǒng)主頁向右滑會(huì)返回到上一屏，向左滑會(huì)到達(dá)下一屏，那么到第一屏了再右滑會(huì)發(fā)生什么呢？這時(shí)已經(jīng)沒有上一屏了，難道應(yīng)該靜止不動(dòng)嗎？不應(yīng)該，相同的操作（向右滑）應(yīng)該有相同的結(jié)果，雖然沒有上一屏了，但還是來點(diǎn)小動(dòng)畫意思一下：

這會(huì)表明系統(tǒng)響應(yīng)了用戶的動(dòng)作，而沒有卡死。類似的，國內(nèi)很多瀏覽器都有返回到瀏覽器主頁的按鈕（一個(gè)小房子），在用戶進(jìn)入到一個(gè)比較深的頁面迷路時(shí)點(diǎn)擊那個(gè)按鈕可以達(dá)到主頁，那么在主頁時(shí)點(diǎn)擊那個(gè)按鈕應(yīng)該發(fā)生什么呢？很多瀏覽器這時(shí)都選擇靜止不動(dòng)了，好像沒有響應(yīng)一樣，這樣真的好嗎？如果不好，應(yīng)該怎么做呢？可以思考一下。

迭代產(chǎn)品的一致性

同一個(gè)產(chǎn)品在產(chǎn)品更新迭代時(shí)重要的元素應(yīng)該保持不變。比如產(chǎn)品的視覺應(yīng)該與原來維持一致，交互方式應(yīng)該一致，這樣用戶可以以原來的使用方法來使用你的產(chǎn)品，有一種熟悉感。

如果發(fā)生較大的更新這些都不得不改變時(shí)，也應(yīng)該重點(diǎn)突出來提醒用戶哪里發(fā)生了變化，讓用戶有心理準(zhǔn)備接受那些變化。否則當(dāng)用戶以原來的方式與軟件交流時(shí)卻沒有效果，用戶就會(huì)受挫。

同一個(gè)團(tuán)隊(duì)的產(chǎn)品線的一致性

當(dāng)一些產(chǎn)品是由某一個(gè)相同的公司或團(tuán)隊(duì)來制作的話，這些產(chǎn)品應(yīng)該使用一致的設(shè)計(jì)語言。

比如上文提到的騰訊游戲部門的幾個(gè)游戲icon中右下角都有一個(gè)相同的logo，這樣有利于用戶辨識(shí)你的產(chǎn)品，降低學(xué)習(xí)成本；另外，也有利于建立自己的品牌。當(dāng)然，一些公司的產(chǎn)品非常多，這樣的一致性很難實(shí)現(xiàn)；比如讓游戲和軟件有一致性這就沒有必要了。類似于云盤，日歷，地圖，搜索等這些工具還是有必要建立一致性的，比如谷歌的這些產(chǎn)品所使用相同的設(shè)計(jì)語言。

如果不看名字你能知道這些產(chǎn)品是一家公司的嗎？

與產(chǎn)品所在平臺(tái)的一致性

ios平臺(tái)上的應(yīng)用應(yīng)該有一致的設(shè)計(jì)語言，安卓平臺(tái)的應(yīng)用應(yīng)該有一致的設(shè)計(jì)語言；這樣可以減少用戶的學(xué)習(xí)成本和認(rèn)知成本，用戶在使用軟件時(shí)都能很快學(xué)會(huì)。

比如windows操作系統(tǒng)的確認(rèn)按鈕在左邊，mac系統(tǒng)的確認(rèn)按鈕在右邊，這時(shí)候討論確認(rèn)按鈕應(yīng)該放哪邊已經(jīng)沒有意義了，因?yàn)榧词乖俨缓?，用戶也已?jīng)習(xí)慣了那樣的布局，你不能把一種平臺(tái)的設(shè)計(jì)方法帶到另一個(gè)平臺(tái)上讓用戶犯錯(cuò)。

與你的競品的一致性

請(qǐng)不要誤會(huì)：我不是讓大家去抄襲你的競品，你確實(shí)應(yīng)該與你的競品有不同的地方，有你自己的特色，這樣你的產(chǎn)品才能在市場上生存下來贏得競爭。但是對(duì)于某些特定的產(chǎn)品使用方法，你應(yīng)該遵循友商們已經(jīng)默認(rèn)的設(shè)計(jì)策略，用戶也已經(jīng)習(xí)慣了，即使你的設(shè)計(jì)策略比友商們的好，用戶也很難在極短的時(shí)間去適應(yīng)。

比如下拉操作就應(yīng)該讓她刷新，鍵盤的布局就應(yīng)該按照QAZ的布局方式，即使那樣布局的原因現(xiàn)在已經(jīng)不適合。你突如其來的一些創(chuàng)新只會(huì)讓用戶覺得“方”。

一致性的終極目標(biāo)是為了不一致

這樣說大家可能會(huì)覺得繞口，但確實(shí)就是這樣。一樣的東西就應(yīng)該讓他看起來一致，交互方式也應(yīng)該一致，但是不一樣的東西你就不要讓他一致了。如果一致，反倒會(huì)讓用戶覺得困惑。

360云盤右上角有四個(gè)菜單，當(dāng)點(diǎn)擊“首頁”，“會(huì)員”，“下載”時(shí)，都會(huì)在當(dāng)前頁面打開新的內(nèi)容，但是點(diǎn)擊“論壇”，當(dāng)前頁面不變，卻是在新的頁面打開內(nèi)容。這倆個(gè)菜單項(xiàng)有不同的行為，但是卻又有相同的外觀，讓用戶迷惑。而inbox做的很好，在這幾個(gè)菜單項(xiàng)中，“草稿”“已發(fā)郵件”“提醒”“回收站”“垃圾郵件”這五個(gè)菜單項(xiàng)點(diǎn)擊后在當(dāng)前頁面變化，hover狀態(tài)時(shí)只是改變了背景，

而“通訊錄”和“Gmail”這倆個(gè)菜單項(xiàng)點(diǎn)擊后是在新頁面打開的，因此hover狀態(tài)后旁邊有一個(gè)小icon。

總結(jié)：

一致性對(duì)于產(chǎn)品設(shè)計(jì)有很大的影響，擁有一致性的產(chǎn)品能把用戶的學(xué)習(xí)成本降到最低，用戶能很容易使用你的產(chǎn)品。為了實(shí)現(xiàn)產(chǎn)品的一致性，你可以注意文中提到的一些方面：

1. 產(chǎn)品內(nèi)部的一致性（視覺層面，交互層面)；
2. 迭代產(chǎn)品的一致性；
3. 產(chǎn)品線產(chǎn)品的一致性；
4. 平臺(tái)的一致性；
5. 競品的一致性；
6. 不一致性。

#專欄作家#

法海，微信公眾號(hào)：uxd_design。人人都是產(chǎn)品經(jīng)理專欄作家。熱愛交互設(shè)計(jì)，熱愛用戶體驗(yàn)。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，不得轉(zhuǎn)載。