關(guān)于交互體驗(yàn)方面的設(shè)計(jì)方法論，你知道哪些？這篇文章里，作者分享了5個(gè)“交互體驗(yàn)”維度的方法論，分別有奧卡姆剃刀原理、?？硕伞⒎来粼瓌t等，一起來看看吧，或許會對你有些幫助。

我們工作中時(shí)不時(shí)會聽到有些云里霧繞的觀點(diǎn)，讓人有一種“答案在空中飄的感覺”。為了在別人吹牛皮的時(shí)候保持清醒，從2018年開始我整理了100來?xiàng)l互聯(lián)網(wǎng)方法論。

把這些分享出來希望能幫到更多的人！

我把這些方法論總結(jié)成了六大類：視覺設(shè)計(jì)、交互體驗(yàn)、心行研究、增長模型、產(chǎn)品策略、數(shù)據(jù)衡量。

這次換換腦子，分享5個(gè)“交互體驗(yàn)”篇的方法論，包括：

• 奧卡姆剃刀原理（Occam’s Razor）
• 菲茲定律（Fitts’Law）
• ?？硕桑℉ick’s Law）
• 防呆原則
• 防止不耐煩原則

交互設(shè)計(jì)篇 01：奧卡姆剃刀原理 Occam’s Razor

1. 定義

也叫簡單有效原理，被稱為“如無必要，勿增實(shí)體“，即如果有兩個(gè)功能相等的設(shè)計(jì)，那么選擇最簡單的。這個(gè)原理要求我們在處理事情時(shí)，要把握事情的本質(zhì)，解決最根本的問題，順應(yīng)自然，不要把事情人為地復(fù)雜化。

早期的設(shè)計(jì)是人為的復(fù)雜化了，比如早期建筑設(shè)計(jì)中巴洛克風(fēng)格。那什么時(shí)候開始“如無必要，勿增實(shí)體?！钡模?/p>

大概包豪斯時(shí)期，開始了極簡設(shè)計(jì)理念，而喬布斯也延續(xù)了包豪斯理論。

“如無必要，勿增實(shí)體?！?請記住這句裝13的話，19年就有人在說，這兩年還有人在說。

2. 采取的設(shè)計(jì)方法和注意點(diǎn)

1）專注于用戶核心需求，功能上不可過于繁瑣

去除非核心不必要的功能。頁面應(yīng)該保證簡潔和工具化，保證功能上的克制。如果有兩個(gè)功能相似的設(shè)計(jì)，那么選擇最簡單易懂的。提取主要功能、重要信息，剔除不必要的干擾功能和信息。

2）只放置必要的信息

簡潔的設(shè)計(jì)最重要的一方面是只展示核心信息，其他的都收納或隱藏。這并不意味著不能提供給用戶很多的信息，可以采用“了解更多”的鏈接來實(shí)現(xiàn)這些。

3）合并多余流程高頻使用界面，保持清爽，減少點(diǎn)擊次數(shù)

讓用戶通過很少的點(diǎn)擊就能找到他們想要的東西給予更少的選項(xiàng)。

做過多的選擇也是一種壓力，減少選擇可以減少用戶的思考負(fù)擔(dān)，這樣就會使體驗(yàn)更順暢。

3. 下面舉幾個(gè)例子

【專注于用戶核心需求，功能上不可過于繁瑣】

例如：抖音的首頁布局

聚焦于核心功能上滑刷短視頻，減輕用戶認(rèn)知負(fù)擔(dān)。抖音APP的登錄界面也是如此，減少用戶的不必要的操作，快速登錄成功進(jìn)入APP。

例如：微信聊天頁面

使用頻率高的頁面，盡量少的出現(xiàn)按鈕。更多功能收納至“+”拓展。

【合并多余流程】

例如：確定支付按鈕去掉，輸入第六位密碼變成了確定。密碼有六位，每一次輸入都相當(dāng)于一次確認(rèn)。

我們從密碼支付，到指紋支付，又跨越到刷臉支付，其本質(zhì)是電商類希望用戶快速付錢，促動沖動消費(fèi)。

交互設(shè)計(jì)篇 02：菲茲定律 Fitts’Law

1. 定義

菲茲定律證明了獲取目標(biāo)的時(shí)間，和目標(biāo)的大小、距離的相關(guān)性。距離越短，目標(biāo)越大，那么光標(biāo)到達(dá)目標(biāo)就越快，時(shí)間越短越高效。

這項(xiàng)定律尤其適合按鈕等可點(diǎn)擊、可選擇、可交互的元素，其目的是：易于查找和選擇。

2. 來源

菲茲定律由心理學(xué)家Paul Fitt 于1954年提出，它是物理世界中人體運(yùn)動的數(shù)學(xué)模型。在很多領(lǐng)域都得到了應(yīng)用，在人機(jī)交互領(lǐng)域的影響尤為深遠(yuǎn)，可以說是人機(jī)交互領(lǐng)域的第一條定律，它通常被用來解釋鼠標(biāo)（PC端）和手勢（移動端）在界面中的移動規(guī)律。

指鼠標(biāo)達(dá)到一個(gè)目標(biāo)的時(shí)間，與當(dāng)前鼠標(biāo)所在位置以及目標(biāo)位置的距離（D）和目標(biāo)大?。╓）有關(guān)。

從一個(gè)起始位置移動到一個(gè)最終目標(biāo)所需要的時(shí)間由兩個(gè)參數(shù)來決定，到目標(biāo)的距離和目標(biāo)的大?。ㄏ聢D中的D與W）。

數(shù)學(xué)公式：T= a + b log2(1+D/W)

3. 菲茲定律三原則

1）縮短交互距離原則

例如：電腦端右鍵之后，出現(xiàn)的彈窗，距離鼠標(biāo)當(dāng)前的距離越近，用戶在進(jìn)行交互的時(shí)候時(shí)間越短；APP中氣泡彈出框中活動的點(diǎn)擊按鈕和手的距離。

2）擴(kuò)大點(diǎn)擊熱區(qū)原則

例如：共享單車的“掃碼用車按鈕”熱區(qū)；我們在和開發(fā)對接設(shè)計(jì)稿時(shí)，必要位置要擴(kuò)大點(diǎn)擊熱區(qū)并標(biāo)注熱區(qū)大小以提醒開發(fā)。

3）邊緣無限可被選中原則

例如：消息列表中刪除操作；Mac系統(tǒng)軟件欄鼠標(biāo)滑過放大效果（個(gè)人認(rèn)為這個(gè)hover操作反饋太強(qiáng)了，調(diào)研后發(fā)現(xiàn)周圍很多人都不喜歡設(shè)置成hover放大效果）；小米手機(jī)卸載軟件，拖到最頂部就可以卸載。

交互設(shè)計(jì)篇 03：?？硕?Hick’s Law

1. 希克定律定義

一個(gè)人面臨選擇（n）越多，需要做處決定的時(shí)間（T）就越長。在人機(jī)交互中界面中選項(xiàng)越多，意味著用戶作出決定的時(shí)間越長。

數(shù)學(xué)公式：T= a + b log2（N）

2. ?？硕善鹪?/h3>

?？硕桑ɑ蛳？撕Ｂ桑┮杂兔绹睦韺W(xué)家威廉·埃德蒙·?？撕屠住ずＢ膱F(tuán)隊(duì)命名，1952年，開始研究存在的刺激數(shù)量與個(gè)體對任何給定刺激的反應(yīng)時(shí)間之間的關(guān)系。結(jié)果顯示，可供選擇的刺激越多，用戶決定與哪一個(gè)進(jìn)行交互的時(shí)間就越長，受到選擇轟炸的用戶必須花時(shí)間來理解和決定，這相當(dāng)于加重了他們不想執(zhí)行操作。

3. ?？硕扇瓌t：需要背下來～

1. 分類選擇，提高交互效率；
2. 分步操作，專注當(dāng)前行為；
3. 低頻功能，收納或隱藏。

【分類選擇，提高交互效率】

更精細(xì)化的商品分類，能夠讓用戶在短時(shí)間內(nèi)找到自己想要的商品，提高商品分發(fā)銷量和用戶購買銷量。用戶可以更快速找到心儀商品的同時(shí)，也帶動詳情頁轉(zhuǎn)化的提升。

【分布操作，專注當(dāng)前行為】

提高交互效率，每一步只做更少的選擇。讓用戶專注于當(dāng)前的核心操作。

【低頻功能，收納或隱藏】

其本質(zhì)也是專注當(dāng)前操作，讓頁面更加清爽，減少不必要的操作選項(xiàng)。我們可以主動和產(chǎn)品溝通，結(jié)合功能的點(diǎn)擊率進(jìn)行分析，有理有據(jù)說服產(chǎn)品經(jīng)理，將低頻操作功能收納起來。這樣也有利于頁面設(shè)計(jì)的美觀度。

交互設(shè)計(jì)篇 04：防呆原則 Fool-proofing

1. 什么是防呆原則？

該原則起源于工業(yè)設(shè)計(jì)領(lǐng)域。其核心宗旨是：

不要讓用戶思考，不要認(rèn)為用戶是專家。設(shè)計(jì)要自然而然。

把交互和設(shè)計(jì)做的簡單，并且讓用戶在其他地方“學(xué)習(xí)”過。每個(gè)頁面應(yīng)強(qiáng)調(diào)一個(gè)核心的重要功能而不應(yīng)該讓用戶做選擇題。

說實(shí)話，最初我也覺得“防呆”這個(gè)詞用的什么鬼，不理解為什么成為“防呆原則/防呆設(shè)計(jì)”。————直到最近又開始學(xué)日語才意識到。

才了解到“防呆”來源于日語“ポカヨケ“，英語是“Fool-proofing”。源自于日本圍棋與將棋的術(shù)語，后來運(yùn)用在工業(yè)管理上，基本概念應(yīng)用在日本豐田汽車的生產(chǎn)方式，由新鄉(xiāng)重夫提出。（我們后面還會提到新鄉(xiāng)重夫）

防呆原則是一種預(yù)防矯正的行為約束手段，運(yùn)用避免產(chǎn)生錯(cuò)誤的限制方法，讓操作者不需要花費(fèi)注意力、也不需要經(jīng)驗(yàn)與專業(yè)知識即可直接無誤地完成正確的操作。

在工業(yè)設(shè)計(jì)上，為了避免使用者的操作失誤造成機(jī)器或人身傷害，包括無意識的動作或下意識的誤動作或不小心的肢體動作，會有針對這些可能發(fā)生的情況來做預(yù)防措施，稱為防呆。

2. 不要讓我思考

有一本交互書籍叫《Dont make me think》，不要讓我思考。無論是系統(tǒng)級UI設(shè)計(jì)、人機(jī)交互界面、APP設(shè)計(jì)、還是web端，在知識更新?lián)Q代極快的UI設(shè)計(jì)領(lǐng)域，這本寫于2005年的書依然值得閱讀。里面的原則可以作為“通用設(shè)計(jì)原則”考慮和自省。

“不要認(rèn)為用戶是專家！”一定要把交互和設(shè)計(jì)做得簡單易懂，降低用戶的學(xué)習(xí)成本。每個(gè)頁面強(qiáng)調(diào)一個(gè)最核心的功能而不要讓用戶做選擇題。

防呆和不要讓我思考都講的是我們的設(shè)計(jì)要自然而然。

交互設(shè)計(jì)篇 05：防止不耐煩原則

1. 什么是防止不耐煩原則

用戶很容易不耐煩，如果需要用戶等待，要有一個(gè)情感化的設(shè)計(jì)提示，避免用戶產(chǎn)生焦慮。

為了防止用戶沒有掌控感，可以設(shè)計(jì)進(jìn)度條（假的）、加載動畫、加載提示或優(yōu)化數(shù)據(jù)獲取方式等。

在交互設(shè)計(jì)方法論中有一個(gè)“兩秒定律”，指的是用戶在使用產(chǎn)品時(shí)的等待反應(yīng)時(shí)間不該超過 2 秒鐘。這兩個(gè)原則側(cè)重點(diǎn)不同，兩秒定律側(cè)重于優(yōu)化數(shù)據(jù)獲取方式等信息渲染效率和性能的優(yōu)化。而防止不耐煩原則側(cè)重于在無法縮短時(shí)長的情況下，安撫用戶情緒，緩解用戶等待焦慮。

關(guān)于加載樣式的設(shè)計(jì)，是品牌在端內(nèi)滲透點(diǎn)之一。如果和自身產(chǎn)品品牌、業(yè)務(wù)結(jié)合，會起到更好的設(shè)計(jì)效果。

比如商品列表上滑加載采用的分步加載的數(shù)據(jù)獲取方式，先加載文字等較小的資源，再加載圖片、視頻等較大等資源。這樣加載的好處是：減少用戶的等待時(shí)間，以及提高信息渲染效率，同時(shí)緩解了用戶等待焦慮感。

比如很多游戲產(chǎn)品會在進(jìn)入游戲和中途，設(shè)計(jì)加載動畫、轉(zhuǎn)場動畫，其實(shí)后臺在拼命加載視頻或游戲資源包；

比如很多APP通過結(jié)合自身品牌設(shè)計(jì)的一些有趣的下拉刷新；

比如我們打開H5頁面常見的加載進(jìn)度條。雖然進(jìn)度條的進(jìn)度是假的，但也能給予用戶適當(dāng)安慰。

關(guān)于加載的例子很多，需要注意的是加載方式和加載樣式，數(shù)據(jù)獲取方式和設(shè)計(jì)視覺樣式的區(qū)分。之后會在加載文章中會詳細(xì)介紹。

總結(jié)

本次分享了5個(gè)“交互體驗(yàn)”篇的方法論，包括：奧卡姆剃刀原理、菲茲定律、希克定律、防呆原則、防止不耐煩原則。

1. 奧卡姆剃刀原理：如無必要，勿增實(shí)體。把握事情本質(zhì)，解決最根本問題，不要把事情人為復(fù)雜化。
2. 菲茲定律三原則：縮短交互距離；擴(kuò)大點(diǎn)擊熱區(qū)；邊緣無限可被選中原則。
3. ?？硕扇瓌t：分類選擇，提高交互效率；分步操作，專注當(dāng)前行為；低頻功能，收納或隱藏。
4. 防呆原則：不要讓用戶思考，不要認(rèn)為用戶是專家。設(shè)計(jì)要自然而然。
5. 防止不耐煩原則：通過情感化的設(shè)計(jì)提示，避免用戶產(chǎn)生焦慮。