編輯導(dǎo)讀：交互設(shè)計(jì)直接決定用戶使用產(chǎn)品過(guò)程中的體驗(yàn)，其重要性不言而喻。本文作者依據(jù)在數(shù)據(jù)中臺(tái)產(chǎn)品設(shè)計(jì)中的所思所想，結(jié)合案例等分享了自己對(duì)8個(gè)交互設(shè)計(jì)原則的理解和應(yīng)用，供大家一同參考和學(xué)習(xí)。

之前做了很多2C的UI&UE產(chǎn)品設(shè)計(jì)，后來(lái)轉(zhuǎn)來(lái)做中臺(tái)的產(chǎn)品，對(duì)于產(chǎn)品設(shè)計(jì)來(lái)講，差異還是比較大的，但不變的是設(shè)計(jì)師們對(duì)大量用戶行為的研究、對(duì)美學(xué)的追求。

Lawsofux的UX原則是UI&UE設(shè)計(jì)的典范，大家日常使用的大流量產(chǎn)品亦或是小眾但有設(shè)計(jì)感的產(chǎn)品都將這些原則應(yīng)用到自己的產(chǎn)品中，在設(shè)計(jì)數(shù)據(jù)中臺(tái)產(chǎn)品時(shí)，也時(shí)刻考慮到這些原則把那個(gè)應(yīng)用到工作項(xiàng)目中。

現(xiàn)分享一下在我設(shè)計(jì)數(shù)據(jù)中臺(tái)相關(guān)產(chǎn)品時(shí)對(duì)交互設(shè)計(jì)原則的理解和應(yīng)用。

01 費(fèi)茨定律 Fitts’s Law

費(fèi)茨定律是指到達(dá)目標(biāo)的時(shí)間是目標(biāo)的區(qū)域距離和大小的函數(shù)，距離越大，尺寸越小，所需要的時(shí)間就越長(zhǎng)。這個(gè)法則特別適用于設(shè)計(jì)按鈕，按鈕通常會(huì)放置在用戶上一步操作的附近，讓用戶更容易找到并進(jìn)入下一步操作。

一個(gè)特別有意思的事情，我的小區(qū)有北門、南門。門外還有一圈護(hù)欄，我的目的地是公交站，但目前的設(shè)計(jì)方式我必須要按照藍(lán)色線路走過(guò)去（如下圖），非常不方便，于是靠近南門附近的護(hù)欄總是被不明人士開(kāi)了個(gè)“小門”。

單從設(shè)計(jì)上來(lái)說(shuō)，該設(shè)計(jì)方式就違背了費(fèi)茨定律 ，到達(dá)目標(biāo)的時(shí)間和當(dāng)前位置距離太大，讓用戶體驗(yàn)大打折扣。

在設(shè)計(jì)數(shù)據(jù)中臺(tái)設(shè)計(jì)規(guī)范時(shí)，就特別明確了這一點(diǎn)，例如表單填寫頁(yè)面， “下一步”“完成”操作均放在底部，而非右上角，避免用戶找不到或者還需要花很長(zhǎng)的路徑去找，尤其是表單較長(zhǎng)時(shí)，用戶滿意度會(huì)更差。

02 雅各布定律 Jakob’s Law

該定律是指“用戶將大部分時(shí)間花在別人家的網(wǎng)站 (產(chǎn)品) 上，而不是你的”。顯而易見(jiàn)，這也意味著用戶已經(jīng)習(xí)慣于“別人家的產(chǎn)品”交互設(shè)計(jì)方式，如果你的產(chǎn)品不采用著相似的模式，就打破了用戶已培養(yǎng)的習(xí)慣，會(huì)引起用戶的不舒服感。

就好像我已經(jīng)習(xí)慣了按照A路線上班，今天由于各種原因只能走從未走過(guò)的B路線，會(huì)讓我時(shí)刻開(kāi)導(dǎo)航，擔(dān)心今天會(huì)不會(huì)遲到等等慌張感和焦慮感。

因此在設(shè)計(jì)自己的產(chǎn)品時(shí)，一定要進(jìn)行競(jìng)品或同類產(chǎn)品的調(diào)研分析，在大框架的交互上保持一定的相似性。

在進(jìn)行數(shù)據(jù)中臺(tái)門戶相關(guān)頁(yè)面設(shè)計(jì)時(shí)，也參考了業(yè)界通用的界面布局和交互方式。登錄前是數(shù)據(jù)中臺(tái)各產(chǎn)品介紹，登錄后為各產(chǎn)品功能使用。產(chǎn)品介紹頁(yè)也采用了banner+特性+功能+場(chǎng)景應(yīng)用幾大板塊設(shè)計(jì)。

03 ?？硕?Hick’s Law

?？硕芍皇菦Q策所需要花費(fèi)的時(shí)間會(huì)隨著選擇的數(shù)量和復(fù)雜性增加而增加。在設(shè)計(jì)中經(jīng)常會(huì)遇到這樣一個(gè)問(wèn)題：“我想在這個(gè)頁(yè)面承載A、B、C、D….功能”，但多不等于好，反而讓用戶失去聚焦點(diǎn)，增加了用戶的決策成本。

舉個(gè)例子，你像領(lǐng)導(dǎo)匯報(bào)你提出了五個(gè)方案，讓領(lǐng)導(dǎo)去做選擇，領(lǐng)導(dǎo)的內(nèi)心OS是會(huì)夸你“真棒”么。

在培訓(xùn)競(jìng)賽平臺(tái)的權(quán)限申請(qǐng)頁(yè)面，界面承載的功能有：權(quán)限申請(qǐng)、培訓(xùn)競(jìng)賽平臺(tái)的介紹、操作手冊(cè)等。而權(quán)限申請(qǐng)是最為核心的功能點(diǎn)，因此在設(shè)計(jì)時(shí)，按鈕并配有底色突出展示，聚焦用戶的最核心功能，而其他入口則選擇下劃線等設(shè)計(jì)方式弱化。

04 伯斯塔爾法則 Postel’s Law

該法則是說(shuō)用戶更容易記住系列中的出現(xiàn)的第一項(xiàng) (首因效應(yīng)) 和最后一項(xiàng) (近因效應(yīng))。例如在行業(yè)設(shè)計(jì)中，LOGO一般都會(huì)放在網(wǎng)站的左上角，更容易讓用戶記住。

而且點(diǎn)擊LOGO可以回到網(wǎng)站的首頁(yè)，這種固定的設(shè)計(jì)和操作模式每次都是首先出現(xiàn)在我們的視野里，并已經(jīng)儲(chǔ)存在了長(zhǎng)期記憶之中，我們能在第一時(shí)間反應(yīng)出來(lái)這里是什么東西，有什么作用。

05 特斯勒定律 Tesler’s Law

特斯勒定律（又稱為復(fù)雜性守恒定律）指出，對(duì)于任何系統(tǒng)，都存在一定程度的復(fù)雜性，無(wú)法降低。但是針對(duì)這種復(fù)雜性，我們可以相應(yīng)轉(zhuǎn)移到其他方式中，例如通過(guò)更為復(fù)雜的后端代碼設(shè)計(jì)來(lái)提升前端的交互體驗(yàn)，將復(fù)雜的功能按照優(yōu)先級(jí)展示，將功能簡(jiǎn)化，替用戶做選擇等等方式。

數(shù)據(jù)中臺(tái)的功能非常多，導(dǎo)致菜單布局混亂，為了讓整體菜單更簡(jiǎn)潔，用戶更容易找到相應(yīng)的入口，交互方式為用戶在主菜單選擇功能后，主菜單自動(dòng)收起，展開(kāi)輔菜單，并通過(guò)UI設(shè)計(jì)在視覺(jué)上保證平臺(tái)的一致性和整體性。

同時(shí)針對(duì)簡(jiǎn)單的功能點(diǎn)，可采用在頁(yè)面頂部Tab切換的方式展示多個(gè)功能點(diǎn)，該方式很好的避免了多重菜單混亂的問(wèn)題。

06 美即好用效應(yīng) Aesthetic Usability Effect

當(dāng)界面被設(shè)計(jì)得足夠美觀時(shí)，用戶往往會(huì)容忍一些較為輕微、影響較小的可用性問(wèn)題。例如在可視化大屏產(chǎn)品介紹中，我們加入了大量的圖、視頻等來(lái)說(shuō)明功能點(diǎn)，這時(shí)候頁(yè)面的邏輯布局交互就相對(duì)會(huì)弱化。

07 多爾蒂門檻 Doherty Threshold

系統(tǒng)需要在 400ms 內(nèi)對(duì)使用者的操作做出響應(yīng)，這樣才能夠讓使用者保持專注，并提高生產(chǎn)效率。

在設(shè)計(jì)權(quán)限申請(qǐng)時(shí)，在用戶提交完信息后，通過(guò)頁(yè)面的形式提示用戶權(quán)限已開(kāi)通，并在交互上執(zhí)行自動(dòng)跳轉(zhuǎn)，無(wú)需用戶任何操作即可進(jìn)入下一步。

08 簡(jiǎn)潔法則 Law of Pr?gnanz

間接法則是為了更方便的理解這個(gè)世界，人類會(huì)將接受到的大量信息進(jìn)行過(guò)濾和簡(jiǎn)化！

在設(shè)計(jì)公告列表時(shí)，默認(rèn)按照時(shí)間倒序排序，并通過(guò)UI上區(qū)別已讀公告和未讀公告，讓用戶在大量的信息列表中，快速聚焦在未讀且最新的公告中，以防用戶遺漏重要消息。

Lawsofux的UX原則還有很多，奧卡姆剃刀原則、帕金森定律、多爾蒂門檻等等，詳情可以參考https://lawsofux.com/，在產(chǎn)品設(shè)計(jì)中這些原則都發(fā)揮著潛移默化的作用，而作為設(shè)計(jì)師更應(yīng)該掌握其精髓并運(yùn)用到產(chǎn)品設(shè)計(jì)中。

在我接觸了中后臺(tái)產(chǎn)品后發(fā)現(xiàn)，中后臺(tái)項(xiàng)目會(huì)優(yōu)先考慮“能不能用”而不是“好不好用”，因此這也要求產(chǎn)品設(shè)計(jì)師要多維度去考慮，既要滿足基本的用戶體驗(yàn)，又要保證研發(fā)成本和系統(tǒng)性能，從而打造出讓用戶覺(jué)得爽、讓開(kāi)發(fā)覺(jué)得爽、讓老板覺(jué)得爽的產(chǎn)品。

作者：?ella，微信公眾號(hào)：穎子懂了

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

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