交互設計:10種簡單易行的提升用戶的體驗方法

6 評論 15744 瀏覽 48 收藏 15 分鐘

簡單是最終的復雜性,而這個永恒的真理就像幾個世紀以前也同樣如此。

天才達·芬奇說,“簡單是最終的復雜性,而這個永恒的真理就像幾個世紀以前也同樣如此?!?/p>

這種設計網頁和移動界面的方法,使以人為中心的產品更加愉快且容易。不要誤會,簡單不代表空,原始或單一功能。相反,他意味著清晰,直觀和有有用。真正簡單的產品不僅解決用戶的問題,而且在時間和效率方面都以最佳方式展現。

在數碼產品方面,我們并不經??紤]愛與尊重。我們可以用外觀(如美麗,優雅,有趣等)或功能(如直觀,易于使用,易混淆等)或內容(如內容豐富,一致等)來形容它們,但很少可以聽到有人稱贊一個網站或應用程序需要尊重性。但是,尊重用戶的時間和精力是設計人員應該努力實現的產品的重要目標之一,這種方法是判斷可用性和可取性的一個重要因素。

今天我想給大家分享一些能夠支持這個目標的建議和技巧。這些提示不是重新發明輪子,而是為設計結果提供有用的清單。所以,讓我們來看看設計師可以做些什么來為用戶節省時間和精力。

1.將核心數據放入標題中

談到網站,這是一個非常有用的想法,快速,方便的導航。唯一的問題是決定核心數據是什么,特別是對于擁有大量數據的網站,比如大型電子商務網站,新聞平臺或者多主題博客。標題是人們在介紹網站前幾秒鐘滾動頁面之前看到的一個引導部分。作為邀請的標志,標題應該提供關于數字產品的關鍵信息,以便用戶能夠在瞬間掃描它。

可以包含在標題中的典型內容有這些:

  • 品牌標識的基本要素:標志,品牌名稱刻字,標語或公司聲明,公司吉祥物,公司或領導人的照片,企業色彩等。
  • 復制塊設置提供的產品或服務的主題
  • 鏈接到網站內容的基本類別
  • 鏈接到最重要的社交網絡
  • 基本的聯系信息(電話號碼,電子郵件等)
  • 多語言界面的語言切換器
  • 搜索字段
  • 訂閱字段
  • 與產品交互的鏈接,如試用版,從AppStore下載等。

這也并不意味著所有提到的元素都應該包含在一個網頁標題中:在某種情況下,標題部分會被信息重載的風險很高。吸引用戶注意的對象越多,專注于關鍵的對象就越難。設計師可以與運營總監或是利益相關者一起,決定戰略上重要的選項,并從列表中選擇或添加其他選項。

為什么標題如此重要?眼動追蹤調查顯示,無論使用哪種掃描模式,掃描過程都將從網頁的頂部水平區域開始。使用它來顯示核心信息和品牌是一個雙方支持的策略:讀者快速掃描關鍵數據。這就是為什么標題設計是UI / UX設計師以及內容和運營專家討論的重中之重。

2.使品牌高度可視化

就所討論的話題而言,品牌是指通過一系列顯著特征創造出來的一種形象,促進了市場上產品或服務的意識和認知。這種形象可以通過多種多樣的方式創造 – 視覺、聽覺、觸覺等。在網絡和移動設計中,品牌推廣意味著一系列定義品牌風格的視覺元素,這些元素可以應用于標識,排版,品牌顏色等。這些方式都是創造產品的視覺可識別性和風格的有力工具。在對目標受眾和營銷/客戶研究進行分析的基礎上,意義上的品牌在產品推廣中扮演著至關重要的角色,因為大多數人的視覺感受是非常快速和容易的,比閱讀文本要容易得多,也比聽覺接受要容易得多。而且,如果品牌已經建立完善,在看到一個網站或應用程序的第一秒鐘內觀察就會提高信任度。

3.多使用數字,而不是文字

Nielsen Norman博客提供的用戶行為調查之一是一個有趣的發現:基于用戶掃描網頁時的眼動追蹤研究,數字經常會阻止瀏覽的眼睛并吸引注意力,即使它們嵌入在大量的詞匯中用戶也不能一眼瞥見。

人們下意識地將數字與事實,統計數字,大小和距離聯系在一起 ,因為這對他們來說是有用的。因此,他們迷上了復制品中包含的數字,而表示數字的文字可能在大量文本中被遺漏。甚至更多,無論數字代表什么,它們比文本變體更緊湊,這使得內容更簡潔和省時,以便瀏覽數據。

4.注意使用號召性用語(CTA)的正確性

號召性用語(Call to Action)實際上是刺激用戶以某種方式與目標互動的短語,又叫點擊動作。CTA元素是交互式控件,使用戶可以執行被調用的操作。布局中這種交互元素的常見類型是按鈕,選項卡或鏈接。在各種接口中,CTA元素是與產品有效互動的核心因素,在可用性和導航性方面起著至關重要的作用。當所有的交互和轉換路徑都是為用戶明確建立的,如果CTA元素沒有經過深思熟慮,放置或設計好的時候,用戶可能會感到困惑,需要付出額外的努力來實現他們的目標。這為轉換率不佳和一般用戶體驗設置了高風險。這就是為什么在任何界面中,這個導航元素應該引起設計師們的特別關注。

5.關注頁面的可掃描性

正如已經提到的那樣,用戶通常不會從起點讀取和觀察頁面或屏幕上的所有內容,而是從快速掃描開始,以了解它是否包含他們需要或想要的內容。這一重要的用戶研究領域得到了Nielsen Norman Group的大力支持,并為設計師和可用性專家提供了對用戶行為和交互的更好理解。收集用戶眼睛跟蹤數據的不同實驗表明,有幾種典型的模式,訪問者通常通過這些模式掃描網站。在?關于3種設計布局的??文章中,作者史蒂文·布拉德利(Steven Bradley)提到了以下常見模型:Gutenberg Diagram,Z-模式和F-模式。

Gutenberg Diagram

Z-模式

F-模式

了解這些模型后,視覺設計師和交互設計師可以在最有可能看到的點上獲得導航和重要數據,并讓用戶感興趣。經過深思熟慮的視覺層次結構將使頁面變得輕松,節省用戶的時間和精力。

6.檢查圖標的知覺

圖標是在網絡或移動界面中使用的象形圖或表意圖,以支持其可用性,并提供成功的人機交互。很難高估他們在用戶界面導航中的角色:他們使用起來更快,因為大多數用戶比文字更快地感知圖像。使用可識別和清晰的圖標對于提高可用性有很大的潛力。但是,即使是最輕微的誤解,也可能成為用戶體驗差的原因,因此應該仔細測試圖標類型的解決方案,并在需要時支持相同的復制內容。

7.加強與主題圖像和主角人物的信息

在很多情況下,一張圖片勝過千言萬語。在網絡和移動用戶界面中,它經常以這種方式工作:圖像變得高度支持和有效地設置情緒或傳遞信息。另外,圖像呈現內容的部分內容,其既是信息性的,又是情感上的吸引力。原始插圖,突出的主角人物,引人入勝的照片可以吸引多個目標。

  • 吸引用戶的注意
  • 直觀地傳遞消息
  • 支持一般的文體概念
  • 設置需要的主題,情緒或氛圍
  • 有效展示核心利益或項目。

8.嘗試用戶的語言與其交談

復制相應網站的內容,與用戶的交流起著至關重要的作用。不僅是有效的視覺呈現對于高性能而言是顯著的:樣式,結構和詞匯也應該符合用戶對頁面的期望。

在一個娛樂應用程序中讓青少年使用過于正式或類似商業的風格,相反來說,在奢侈品網站上銷售精英房地產過于不正式的風格 – 可能有數百個復制不符合業務目標以及習慣的情況目標受眾的需求。

這種內容不一致可能會造成混淆,使用戶離開網站或應用程序。用戶研究將有效地解決這個問題,看看用戶想要溝通的方式,而一個專業的撰稿人將有助于加強設計與文字的力量。

9.運用格式塔原則的力量

格式塔這個詞的含義是?形狀、形式?。它主要用于認知心理學領域,探索人們不斷從世界看起來主要是混亂的數據的有意義的認知規律的領域。

它適用于不同層次的感知,但是可視化部分似乎是設計人員創建界面最有趣的部分。它有助于更??好地理解應用程序或網站用戶的心理。當設計者了解影響視覺感知的因素時,使用戶體驗設計的過程更加精通,成功完成交互設計的速度更快,降低了用戶對此的誤解。

資源

例如,運用相似性和接近性的原則,設計者可以根據人的認知能力對布局元素進行分組??,以便用戶以最自然和方便的方式感知。

10.優化視覺內容

無論有趣,有吸引力和信息豐富的界面,有一個無形的因素,可以消除所有的好處 – 加載內容。如果應用于界面的圖像,動畫,視頻過于沉重,或者在不同的設備上表現不佳,那么在了解產品的優點之前,失去用戶的風險很高。

在競爭激烈的情況下,網站和應用程序的負載很大,可以肯定的是:即使用戶輸了很多點,用戶也不會等待,他們會選擇更方便快捷的選擇。視覺內容的優化和持續測試是尊重用戶提升互動時間少的流程的真正標志。

 

原文鏈接:https://tubikstudio.com/take-it-easy-tips-for-effort-saving-user-interfaces/

注:由于文件上傳大小要求,本片文章動效案例都經過減幀壓縮后上傳,如需查看清晰流暢的動效案例,可點擊原文閱讀。

本文由 @Lainey 翻譯發布于人人都是產品經理。未經許可,禁止轉載。

題圖由作者提供

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 您好,覺得您分享的內容很精彩。不知文章是否可以申請轉載呢?

    來自廣東 回復
    1. 可以的 標注一下原文鏈接哈

      來自浙江 回復
    2. 好的,謝謝

      來自廣東 回復
  2. 傻子萌

    來自浙江 回復
    1. ??

      來自浙江 回復
  3. 第十點有個小紕漏,即使用戶輸出了很多點,應該為即使網站或應用輸出了很多點,用戶也不會等待。

    來自浙江 回復