編輯導(dǎo)語(yǔ)：我們都知道，在設(shè)計(jì)過(guò)程中要滿(mǎn)足一定的交互設(shè)計(jì)原則，這直接決定了用戶(hù)使用你的產(chǎn)品過(guò)程中的體驗(yàn)，其重要性不言而喻。那么在我們?cè)O(shè)計(jì)交互行為方式的時(shí)候，應(yīng)該遵循什么原則呢？本文作者為大家總結(jié)出來(lái)了7條交互設(shè)計(jì)原則，歡迎大家討論交流。

產(chǎn)品交互設(shè)計(jì)在大廠(chǎng)會(huì)有專(zhuān)門(mén)崗位的同學(xué)完成，但是對(duì)于職責(zé)分工還沒(méi)有那么明確的公司來(lái)說(shuō)，這部分的工作可能就是產(chǎn)品經(jīng)理來(lái)兼職完成了，甚至也有研發(fā)來(lái)兼職完成的。

這里往往會(huì)出現(xiàn)一些問(wèn)題，非交互專(zhuān)業(yè)的人設(shè)計(jì)完產(chǎn)品之后，我們想要實(shí)現(xiàn)的功能是可以滿(mǎn)足的，但是用戶(hù)體驗(yàn)可能會(huì)大打折扣。如果設(shè)計(jì)者沒(méi)有刻意地去學(xué)習(xí)一些這方面的知識(shí)，設(shè)計(jì)出的原型可能免不了被一頓吐槽。

在閑暇時(shí)，看了一些UX的書(shū)籍，這邊總結(jié)出幾點(diǎn)原則和大家討論一下。

一、不要讓用戶(hù)思考

在之前寫(xiě)過(guò)的一篇文章說(shuō)到一個(gè)觀(guān)點(diǎn)，意志力是易耗品，思考本身就會(huì)消耗人的能量，那么用戶(hù)在用你的產(chǎn)品過(guò)程中，需要經(jīng)歷復(fù)雜的思考的話(huà)，一定體驗(yàn)不怎么樣。

這里要排除一些特殊情況，比如券商的產(chǎn)品，用戶(hù)打開(kāi)APP考慮要不要滿(mǎn)倉(cāng)買(mǎi)入，這種情況的思考不屬于產(chǎn)品層面帶來(lái)的思考。同樣的case，以券商的產(chǎn)品舉例，如果用戶(hù)下定決心今天滿(mǎn)倉(cāng)，但是發(fā)現(xiàn)使用的券商App找不到買(mǎi)入入口，花了很長(zhǎng)時(shí)間思考、摸索才完成買(mǎi)入，那這個(gè)產(chǎn)品一定會(huì)讓用戶(hù)非常嫌棄，甚至換一個(gè)券商。

我翻了翻手機(jī)里的App，選了幾個(gè)大家可以感受一下使用起來(lái)是否需要思考。

微信讀書(shū)，下廚房。啟動(dòng)App，首頁(yè)就是搜索欄，要看什么書(shū)，想做什么菜，通過(guò)搜索直接滿(mǎn)足用戶(hù)需求，整個(gè)環(huán)節(jié)不超過(guò)三步，幾乎不需要用戶(hù)去思考；抖音，更加簡(jiǎn)單粗暴的例子。毫無(wú)學(xué)習(xí)成本的App，點(diǎn)開(kāi)就開(kāi)始刷，一步到位。這種交互是非常容易觸達(dá)到用戶(hù)爽點(diǎn)的。

仔細(xì)想一下，這些和讓用戶(hù)即時(shí)滿(mǎn)足有一點(diǎn)類(lèi)似。上述舉例的產(chǎn)品功能相對(duì)簡(jiǎn)單單一，可以從功能上就做到不讓用戶(hù)思考，對(duì)于復(fù)雜一些的產(chǎn)品，會(huì)從按鈕設(shè)計(jì)，UI設(shè)計(jì)上減少用戶(hù)思考的情況。

比如SaaS產(chǎn)品的注冊(cè)頁(yè)面，是不是可以做到讓用戶(hù)盡量少填寫(xiě)內(nèi)容，提前錄入好企業(yè)用戶(hù)的信息，企業(yè)員工注冊(cè)時(shí)候，輸入工號(hào)就可以彈出員工的信息；比如頁(yè)面按鈕擺放的位置，關(guān)鍵按鈕的形狀和樣式是否突出，按鈕的提示是否明確。

按鈕設(shè)計(jì)對(duì)比

給一個(gè)平時(shí)工作的例子，上面是產(chǎn)品的設(shè)計(jì)，下面是UX同學(xué)改過(guò)之后的。第一個(gè)設(shè)計(jì)，從用戶(hù)視角來(lái)看，開(kāi)關(guān)控件關(guān)閉代表的是隱藏還是不隱藏，需要用戶(hù)思考揣摩。而在第二個(gè)設(shè)計(jì)，加上了文字說(shuō)明，就可以瞬間消除用戶(hù)的疑惑，避免了用戶(hù)思考。

二、萬(wàn)不得已，讓用戶(hù)線(xiàn)性思考

我們剛聊到的一些產(chǎn)品功能相對(duì)簡(jiǎn)單，如果提升一些產(chǎn)品復(fù)雜度，可能就沒(méi)法做到不讓用戶(hù)思考了，那可以考慮讓用戶(hù)線(xiàn)性思考。線(xiàn)性思考，是指思考過(guò)程有一根主線(xiàn)，產(chǎn)品做到讓用戶(hù)線(xiàn)性思考，用戶(hù)能夠更容易理解產(chǎn)品。

其實(shí)這和我們平時(shí)用思維導(dǎo)圖的初衷一樣，如果是一個(gè)“蜘蛛網(wǎng)導(dǎo)圖”，相信你肯定腦子很混亂。而我們常用的思維導(dǎo)圖，基于一個(gè)點(diǎn)去蔓延到一條線(xiàn)，再蔓延到多條線(xiàn)，這符合人腦的思考方式，也更容易記住。我們下面看一下線(xiàn)性思考和網(wǎng)狀思考。

思維導(dǎo)圖的線(xiàn)性思考

蜘蛛網(wǎng)圖的網(wǎng)狀思考

上面兩張圖是說(shuō)一樣的內(nèi)容，但是當(dāng)你腦海里是網(wǎng)狀的認(rèn)知，你是沒(méi)辦法掌握全局的。而如果用思維導(dǎo)圖輔助思考，將網(wǎng)狀的內(nèi)容變成線(xiàn)性，由一個(gè)點(diǎn)去發(fā)散，我們就會(huì)更好的理解現(xiàn)狀，這也是思維導(dǎo)圖的作用。

回到產(chǎn)品設(shè)計(jì)，比如電商產(chǎn)品的設(shè)計(jì)，淘寶、拼多多、京東。產(chǎn)品本身的功能是相對(duì)復(fù)雜的，商城里的單品也非常多。

京東首頁(yè)，菜單欄

大家可以設(shè)想一下，假設(shè)電商產(chǎn)品菜單欄不分類(lèi)也沒(méi)有搜素會(huì)怎樣？用戶(hù)體驗(yàn)一定只有兩個(gè)字，極差。所以產(chǎn)品里的分類(lèi)引導(dǎo)，其實(shí)就是在給用戶(hù)提供用于思考的那根線(xiàn)。

三、無(wú)法做到前兩條的情況，設(shè)計(jì)教程輔助用戶(hù)思考

產(chǎn)品根據(jù)自身的屬性不同，上手難易程度也天差地別。對(duì)于上手難度很高的產(chǎn)品，免不了出現(xiàn)要用戶(hù)深度思考的情況。為了應(yīng)對(duì)這類(lèi)情況，產(chǎn)品的交互上也有解決方案。

大家第一次打開(kāi)墨刀的時(shí)候，一定會(huì)注意到有很多Tips告訴你這一步的功能是什么，下一步應(yīng)該做什么。像墨刀這類(lèi)產(chǎn)品有比較強(qiáng)的工具屬性。這類(lèi)產(chǎn)品的產(chǎn)品設(shè)計(jì)過(guò)程中，除了要提供產(chǎn)品給用戶(hù)，一定要附帶提供的就是產(chǎn)品說(shuō)明書(shū)了。

outsystems啟動(dòng)引導(dǎo)

上面是國(guó)際低代碼工具龍頭公司outSystems的產(chǎn)品，坦白說(shuō)，這個(gè)產(chǎn)品真的上手難度很高，所以可以看到他們提供了非常細(xì)致的操作引導(dǎo)，同時(shí)提供了很多公開(kāi)課教用戶(hù)如何用outSystems搭建應(yīng)用。這部分很值得國(guó)內(nèi)的一些同類(lèi)產(chǎn)品學(xué)習(xí)。

對(duì)于復(fù)雜的產(chǎn)品，用戶(hù)打開(kāi)產(chǎn)品的一刻，就像處于一個(gè)完全陌生的空間，完全失去了方向感，這種用戶(hù)體驗(yàn)本身是非常糟糕的。所以提供引導(dǎo)就像虛擬空間里的指路牌，幫助用戶(hù)逐漸清晰的找回新產(chǎn)品空間里的所在位置。

四、為掃描設(shè)計(jì)，不為閱讀設(shè)計(jì)

產(chǎn)品設(shè)計(jì)的時(shí)候也要考慮到，用戶(hù)通常非常忙。不會(huì)有時(shí)間和耐心去閱讀有大量文字的頁(yè)面。而且用戶(hù)們也默認(rèn)知道，不看完頁(yè)面所有內(nèi)容并不會(huì)有嚴(yán)重的影響，大家都學(xué)會(huì)了跳躍式的閱讀。

就像一篇論文會(huì)有標(biāo)題、小標(biāo)題、引言、摘要、正文、結(jié)尾這些組成，我們通過(guò)標(biāo)題，引言，摘要，結(jié)尾論斷就能大概知道，這篇文章所寫(xiě)的內(nèi)容是不是我需要的，應(yīng)不應(yīng)該花時(shí)間仔細(xì)閱讀。

在產(chǎn)品設(shè)計(jì)的時(shí)候也是一樣，你見(jiàn)過(guò)產(chǎn)品打開(kāi)就是滿(mǎn)頁(yè)的免責(zé)聲明的設(shè)計(jì)么？必要的大段文字是不是大部分都是很小的入口。

用戶(hù)通常是點(diǎn)開(kāi)頁(yè)面飛快的掃描關(guān)鍵信息，你可以回想一下，你刷知乎的姿勢(shì)是怎樣的？

一種方式是：目標(biāo)明確的進(jìn)去搜索。找到自己想要的答案；另一種方式是：在推薦欄里不停的滑動(dòng)，滑到有意思的標(biāo)題停下來(lái)，點(diǎn)進(jìn)去。

所以，一旦知道這個(gè)原則，再回過(guò)頭看知乎的設(shè)計(jì)。知乎的回答內(nèi)容是折疊一部分，并把標(biāo)題和回答者簡(jiǎn)介突出。在一個(gè)頁(yè)面上，你快速掃描的時(shí)候，也就能看清4到 5個(gè)標(biāo)題回答，以及各個(gè)回答的作者。

五、設(shè)計(jì)搜索框很重要

我們?cè)谥醯睦永镎f(shuō)到，用戶(hù)刷知乎的時(shí)候兩種姿勢(shì)。一種是搜索，一種是無(wú)目的滑頁(yè)面。這個(gè)映射到現(xiàn)實(shí)世界里，刷知乎就像逛商場(chǎng)。無(wú)目的滑頁(yè)面就像在商場(chǎng)里閑逛，而在知乎里搜索，就像在商場(chǎng)里找服務(wù)人員直接詢(xún)問(wèn)某個(gè)店在哪個(gè)位置。

那么如果商場(chǎng)一個(gè)服務(wù)人員都沒(méi)有的話(huà)，是不是很可能會(huì)流失一些客戶(hù)。同樣，在產(chǎn)品里，沒(méi)有搜索的話(huà)，用戶(hù)帶著明確目的打開(kāi)產(chǎn)品，會(huì)花很長(zhǎng)時(shí)間也不見(jiàn)得達(dá)到他目的。消磨用戶(hù)的時(shí)間和耐心可不是個(gè)好現(xiàn)象。

六、在已有的用戶(hù)習(xí)慣上謹(jǐn)慎創(chuàng)新

在產(chǎn)品的使用過(guò)程中，會(huì)有非常多的習(xí)慣用法。比如搜索欄的標(biāo)志是一個(gè)放大鏡，比如微軟Office的撤銷(xiāo)快捷鍵是Ctrl+Z，比如關(guān)閉按鈕一般在頁(yè)面右上角等等。

習(xí)慣能夠成為習(xí)慣，一定有背后的邏輯。不好用的習(xí)慣可能在演進(jìn)的過(guò)程中就已經(jīng)消失了。而要改變一個(gè)積累了很久才形成的習(xí)慣，一定是要付出非常大的能量。就像衛(wèi)星在既定軌道繞地球運(yùn)轉(zhuǎn)，他是不怎么耗能的，但是如果需要他換一個(gè)對(duì)地軌道，那需要的能量可就非常大了。

你可以試想一下，一款產(chǎn)品，搜索欄標(biāo)志是一顆衛(wèi)星，撤銷(xiāo)的快捷鍵是Ctrl+V，頁(yè)面關(guān)閉的按鈕在左下角。是不是用起來(lái)會(huì)想摔電腦。

七、體系的思考增刪改查

這一點(diǎn)B端產(chǎn)品會(huì)接觸的多一些，在對(duì)表單進(jìn)行設(shè)計(jì)的時(shí)候，需要有整體考慮的思維。我們?cè)谡f(shuō)麥肯錫的互相獨(dú)立，完全窮盡的時(shí)候，會(huì)談到把功能盡可能細(xì)分，達(dá)到功能和功能之間完全獨(dú)立。

但是有拆分的能力也要有統(tǒng)一的能力，否則就會(huì)出現(xiàn)，設(shè)計(jì)了增加按鈕，但是沒(méi)設(shè)計(jì)刪除按鈕，設(shè)計(jì)了刪除按鈕，沒(méi)設(shè)計(jì)修改按鈕等等。表單里的增刪改查，在設(shè)計(jì)上其實(shí)是統(tǒng)一考慮的。

這一點(diǎn)是從研發(fā)小伙伴身上學(xué)習(xí)的，他們的視角里所有的功能都會(huì)變成一行一行的代碼實(shí)現(xiàn)，當(dāng)發(fā)現(xiàn)有一個(gè)地方代碼實(shí)現(xiàn)起來(lái)有漏洞了，他們會(huì)反推功能是不是夠完整，不夠全面。經(jīng)常會(huì)提很多Corner Case給到產(chǎn)品。

久而久之，對(duì)于一個(gè)模塊，體系地思考其功能再進(jìn)行設(shè)計(jì)，就成為了一種習(xí)慣。設(shè)計(jì)增加的時(shí)候，是不是一定會(huì)想到刪除應(yīng)該怎么刪，刪除之后現(xiàn)有表單的數(shù)據(jù)應(yīng)該怎么處理，修改數(shù)據(jù)允許改動(dòng)哪些，是改字段類(lèi)型，還是改表里的值？

產(chǎn)品交互確實(shí)是一個(gè)非常難的學(xué)問(wèn)，可能涉及到心理學(xué)，傳播學(xué)等等知識(shí)?，F(xiàn)在市場(chǎng)上產(chǎn)品設(shè)計(jì)的時(shí)候可以參考的依據(jù)是非常多的，那么在對(duì)優(yōu)秀產(chǎn)品的學(xué)習(xí)中，我們借鑒他們?cè)O(shè)計(jì)的同時(shí)，也應(yīng)該能夠知道他們?cè)O(shè)計(jì)背后的邏輯。

也許背后邏輯會(huì)映射到今天總結(jié)的一些原則里，也許有那些優(yōu)秀產(chǎn)品經(jīng)理自身更獨(dú)特的思考。但是我們要知道的是，在設(shè)計(jì)產(chǎn)品交互的時(shí)候，是能夠有一套方法論去指導(dǎo)我們?cè)O(shè)計(jì)的。這套方法論也不會(huì)違背創(chuàng)新。

斯坦福大學(xué)最受歡迎的創(chuàng)意課里提到，創(chuàng)新是可以由一套規(guī)則批量創(chuàng)造的。那在我們?nèi)粘ＴO(shè)計(jì)產(chǎn)品的之后，熟悉交互設(shè)計(jì)的方法論，相信也會(huì)在其中找到屬于自己的創(chuàng)新。

本文由 @格林不童話(huà)? 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來(lái)自Unsplash，基于CC0協(xié)議