用好的交互設計來管理復雜-“查看更多”

1 評論 18441 瀏覽 32 收藏 5 分鐘

“查看更多”按鈕像一個鏈接標簽的拐杖,在各類網頁及App中被通用,網站現在已經大量使用這個通用的標簽鏈接。作為一個獨立的標簽,“查看更多”按鈕,直接描述所表達的含義,用以幫助用戶從下一頁了解所期望的內容。

現在的很多網站及App設計,越來越弱化不太重要的信息內容。也就是說,標簽及按鈕描述都會選擇簡短精致的措辭,以保證用戶易于掃描,方便消化。當用戶決定他們想要更多的信息的時候,他們可以挖掘一個鏈接或展開抽屜頁面信息,從而獲得不太重要的內容。無論是點擊“查看更多”還是上拉加載都是獲得更多收起來信息的方式之一。

“查看更多”按鈕的三類變形

  • 變形1:使用描述鏈接目的地的關鍵字
  • 變形2:保留了解更多的格式并添加描述性的關鍵字
  • 變形3:將前面的段落轉換成唯一的鏈接

如下圖案例:

加載更多

由于“查看更多”會產生不確定性,用戶不知道他們會期待什么,如果他們點擊,或者所得到的內容是否會是值得等待一個新的頁面等等,這一系列不確定性的感覺會導致用戶猶豫,不確定性和認知壓力對用戶體驗產生了負面影響,并轉變成一種認知緊張狀態,有些人可能會采取常駐在頁面以評估不清楚的聯系。

在移動端,無論是App抑或是Wap,由于其移動屏幕要小得多,而列表項目將占用一個相對很大一部分的屏幕,那么通常只有兩到三個項目被顯示在列表視圖布局中,所以用戶將不得不在移動設備上進行交互(即滾動)或者點擊。

對比網頁分頁處理,App的用戶更加不愿等待頁面重新加載,所以產品設計的時候,應該盡量避免分頁。實驗證明,在移動端,無限滾動是非常有效的獲得更多內容展示的方式。較長的產品列表在App上通常通過自然的上拉行為,加載更多的數據,加載過程根據產品定位變形給類的動畫,以降低用戶等待過程中的焦慮感,提高用戶對產品的體驗認知。

如下圖:

上滑加載更多

如果加載信息模塊底部會有其他模塊展示,處理“查看更多”的行為時,最好的解決方案是在產品列表的結尾處有一個單一的大的“加載更多”按鈕,讓用戶選擇是否在當前界面展開并加載更多數據。基于移動端的屏幕小的問題,我建議在顯示“加載更多”按鈕之前,在移動設備上加載15到30條數據為最佳。

“多”并不是困難的來源,在產品設計過程中,能把“多”的內容管理好,把復雜的內容處理好,是可以完善用戶體驗的。心理學生來說,復雜的事物更容易理解,簡單的事物反倒令人困惑。適當的把復雜的東西,讓用戶操作,也是一種簡單化的產品設計方式。

系列文章:

用好的交互設計來管理復雜-“篩選器”

用好的交互設計來管理復雜-“個人中心”

用好的交互設計來管理復雜-“Tab”

 

作者:Mandy權,微信公眾號:Q產品,一名快樂的產品經理!~

本文由 @Mandy權 原創發布于人人都是產品經理。未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 最下面的“TAB”鏈接不對啊

    回復