互聯網方法論之“交互設計”篇——合集(一)

0 評論 5166 瀏覽 49 收藏 16 分鐘

關于交互體驗方面的設計方法論,你知道哪些?這篇文章里,作者分享了5個“交互體驗”維度的方法論,分別有奧卡姆剃刀原理、希克定律、防呆原則等,一起來看看吧,或許會對你有些幫助。

我們工作中時不時會聽到有些云里霧繞的觀點,讓人有一種“答案在空中飄的感覺”。為了在別人吹牛皮的時候保持清醒,從2018年開始我整理了100來條互聯網方法論。

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

我把這些方法論總結成了六大類:視覺設計、交互體驗、心行研究、增長模型、產品策略、數據衡量。

這次換換腦子,分享5個“交互體驗”篇的方法論,包括:

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

交互設計篇 01:奧卡姆剃刀原理 Occam’s Razor

1. 定義

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

早期的設計是人為的復雜化了,比如早期建筑設計中巴洛克風格。那什么時候開始“如無必要,勿增實體。”的?

大概包豪斯時期,開始了極簡設計理念,而喬布斯也延續了包豪斯理論。

“如無必要,勿增實體?!?請記住這句裝13的話,19年就有人在說,這兩年還有人在說。

2. 采取的設計方法和注意點

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

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

2)只放置必要的信息

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

3)合并多余流程高頻使用界面,保持清爽,減少點擊次數

讓用戶通過很少的點擊就能找到他們想要的東西給予更少的選項。

做過多的選擇也是一種壓力,減少選擇可以減少用戶的思考負擔,這樣就會使體驗更順暢。

3. 下面舉幾個例子

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

例如:抖音的首頁布局

聚焦于核心功能上滑刷短視頻,減輕用戶認知負擔。抖音APP的登錄界面也是如此,減少用戶的不必要的操作,快速登錄成功進入APP。

例如:微信聊天頁面

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

【合并多余流程】

例如:確定支付按鈕去掉,輸入第六位密碼變成了確定。密碼有六位,每一次輸入都相當于一次確認。

我們從密碼支付,到指紋支付,又跨越到刷臉支付,其本質是電商類希望用戶快速付錢,促動沖動消費。

交互設計篇 02:菲茲定律 Fitts’Law

1. 定義

菲茲定律證明了獲取目標的時間,和目標的大小、距離的相關性。距離越短,目標越大,那么光標到達目標就越快,時間越短越高效。

這項定律尤其適合按鈕等可點擊、可選擇、可交互的元素,其目的是:易于查找和選擇。

2. 來源

菲茲定律由心理學家Paul Fitt 于1954年提出,它是物理世界中人體運動的數學模型。在很多領域都得到了應用,在人機交互領域的影響尤為深遠,可以說是人機交互領域的第一條定律,它通常被用來解釋鼠標(PC端)和手勢(移動端)在界面中的移動規律。

指鼠標達到一個目標的時間,與當前鼠標所在位置以及目標位置的距離(D)和目標大小(W)有關。

從一個起始位置移動到一個最終目標所需要的時間由兩個參數來決定,到目標的距離和目標的大?。ㄏ聢D中的D與W)。

數學公式:T= a + b log2(1+D/W)

3. 菲茲定律三原則

1)縮短交互距離原則

例如:電腦端右鍵之后,出現的彈窗,距離鼠標當前的距離越近,用戶在進行交互的時候時間越短;APP中氣泡彈出框中活動的點擊按鈕和手的距離。

2)擴大點擊熱區原則

例如:共享單車的“掃碼用車按鈕”熱區;我們在和開發對接設計稿時,必要位置要擴大點擊熱區并標注熱區大小以提醒開發。

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

例如:消息列表中刪除操作;Mac系統軟件欄鼠標滑過放大效果(個人認為這個hover操作反饋太強了,調研后發現周圍很多人都不喜歡設置成hover放大效果);小米手機卸載軟件,拖到最頂部就可以卸載。

交互設計篇 03:希克定律 Hick’s Law

1. ??硕啥x

一個人面臨選擇(n)越多,需要做處決定的時間(T)就越長。在人機交互中界面中選項越多,意味著用戶作出決定的時間越長。

數學公式:T= a + b log2(N)

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

??硕桑ɑ蛳?撕B桑┮杂兔绹睦韺W家威廉·埃德蒙·希克和雷·海曼的團隊命名,1952年,開始研究存在的刺激數量與個體對任何給定刺激的反應時間之間的關系。結果顯示,可供選擇的刺激越多,用戶決定與哪一個進行交互的時間就越長,受到選擇轟炸的用戶必須花時間來理解和決定,這相當于加重了他們不想執行操作。

3. ??硕扇瓌t:需要背下來~

  1. 分類選擇,提高交互效率;
  2. 分步操作,專注當前行為;
  3. 低頻功能,收納或隱藏。

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

更精細化的商品分類,能夠讓用戶在短時間內找到自己想要的商品,提高商品分發銷量和用戶購買銷量。用戶可以更快速找到心儀商品的同時,也帶動詳情頁轉化的提升。

【分布操作,專注當前行為】

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

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

其本質也是專注當前操作,讓頁面更加清爽,減少不必要的操作選項。我們可以主動和產品溝通,結合功能的點擊率進行分析,有理有據說服產品經理,將低頻操作功能收納起來。這樣也有利于頁面設計的美觀度。

交互設計篇 04:防呆原則 Fool-proofing

1. 什么是防呆原則?

該原則起源于工業設計領域。其核心宗旨是:

不要讓用戶思考,不要認為用戶是專家。設計要自然而然。

把交互和設計做的簡單,并且讓用戶在其他地方“學習”過。每個頁面應強調一個核心的重要功能而不應該讓用戶做選擇題。

說實話,最初我也覺得“防呆”這個詞用的什么鬼,不理解為什么成為“防呆原則/防呆設計”?!钡阶罱珠_始學日語才意識到。

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

防呆原則是一種預防矯正的行為約束手段,運用避免產生錯誤的限制方法,讓操作者不需要花費注意力、也不需要經驗與專業知識即可直接無誤地完成正確的操作。

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

2. 不要讓我思考

有一本交互書籍叫《Dont make me think》,不要讓我思考。無論是系統級UI設計、人機交互界面、APP設計、還是web端,在知識更新換代極快的UI設計領域,這本寫于2005年的書依然值得閱讀。里面的原則可以作為“通用設計原則”考慮和自省。

“不要認為用戶是專家!”一定要把交互和設計做得簡單易懂,降低用戶的學習成本。每個頁面強調一個最核心的功能而不要讓用戶做選擇題。

防呆和不要讓我思考都講的是我們的設計要自然而然。

交互設計篇 05:防止不耐煩原則

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

用戶很容易不耐煩,如果需要用戶等待,要有一個情感化的設計提示,避免用戶產生焦慮。

為了防止用戶沒有掌控感,可以設計進度條(假的)、加載動畫、加載提示或優化數據獲取方式等。

在交互設計方法論中有一個“兩秒定律”,指的是用戶在使用產品時的等待反應時間不該超過 2 秒鐘。這兩個原則側重點不同,兩秒定律側重于優化數據獲取方式等信息渲染效率和性能的優化。而防止不耐煩原則側重于在無法縮短時長的情況下,安撫用戶情緒,緩解用戶等待焦慮。

關于加載樣式的設計,是品牌在端內滲透點之一。如果和自身產品品牌、業務結合,會起到更好的設計效果。

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

比如很多游戲產品會在進入游戲和中途,設計加載動畫、轉場動畫,其實后臺在拼命加載視頻或游戲資源包;

比如很多APP通過結合自身品牌設計的一些有趣的下拉刷新;

比如我們打開H5頁面常見的加載進度條。雖然進度條的進度是假的,但也能給予用戶適當安慰。

關于加載的例子很多,需要注意的是加載方式和加載樣式,數據獲取方式和設計視覺樣式的區分。之后會在加載文章中會詳細介紹。

總結

本次分享了5個“交互體驗”篇的方法論,包括:奧卡姆剃刀原理、菲茲定律、??硕?、防呆原則、防止不耐煩原則。

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

本文由 @胡冰茜 原創發布于人人都是產品經理。未經作者許可,禁止轉載。

題圖來自Unsplash,基于CC0協議。

該文觀點僅代表作者本人,人人都是產品經理平臺僅提供信息存儲空間服務。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發揮!