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

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

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

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

01 費茨定律 Fitts’s Law

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

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

單從設(shè)計上來說，該設(shè)計方式就違背了費茨定律 ，到達目標的時間和當前位置距離太大，讓用戶體驗大打折扣。

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

02 雅各布定律 Jakob’s Law

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

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

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

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

03 希克定律 Hick’s Law

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

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

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

04 伯斯塔爾法則 Postel’s Law

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

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

05 特斯勒定律 Tesler’s Law

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

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

同時針對簡單的功能點，可采用在頁面頂部Tab切換的方式展示多個功能點，該方式很好的避免了多重菜單混亂的問題。

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

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

07 多爾蒂門檻 Doherty Threshold

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

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

08 簡潔法則 Law of Pr?gnanz

間接法則是為了更方便的理解這個世界，人類會將接受到的大量信息進行過濾和簡化！

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

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

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

作者：?ella，微信公眾號：穎子懂了

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

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