分頁加載vs無限加載,你還能想到哪些信息加載方式?
編輯導語:什么時候用分頁加載,什么時候用無限加載呢?本文作者總結了分頁加載和自動加載的區別和各自的優缺點,供大家理清思路,在做交互稿時能夠選擇更恰當的方式。推薦對交互設計感興趣的朋友們閱讀。
幾天前,我接到一個搜索相關的需求,用一句話概括就是:
用戶通過關鍵詞搜索相關文檔。
這聽起來就簡單極了,你腦海中可能都已經出現交互稿的模樣了吧。
我也是這么想的,三下五除二的便畫出了交互稿,一個搜索框,一個內容區,一個分頁,輕輕松松搞定~
當我去給老板過稿時,他問我為什么不采用自動加載的方式。
說實話,我……沒想清楚。
因此,接下來我仔細思考了兩種加載方式(分頁加載和自動加載)的區別,也是這篇文章的來由。
一、梳理思路
除了梳理兩種加載方式的區別外,也希望通過這篇文章記錄解決問題的思路,希望能夠以小見大。我通常通過競品分析、桌面調研和個人觀察來探索問題的解決方案。
搜索是一個特別常見的場景,市面上有許多成熟的產品,比如Google、Bing等瀏覽器,知乎、微博等社區產品,它們的產品細節必然經過無數次的打磨,因此,觀察這些產品便是在研究最前沿和權威的資料。
其次是桌面調研,加載方式作為一個常用組件,網上肯定存在一些調研總結,我通常會通過Google、知乎、人人都是產品經理等網站查找一些他人的總結。
個人觀察也是十分重要的,產品經理有產品sense,設計師也有設計sense,只有多看多體驗,才能真正感受到不同組件直接細微的區別。
三種方式并非獨立進行,而是互相融合、相互補充,最終得出結論。
二、不同加載方式的區別
1. 分頁加載
分頁加載便是在內容區底部放置分頁按鈕,用戶可以通過頁碼切換信息。
分頁加載有以下幾個特點:
第一,對信息的數量以及目前所處的位置一目了然。
信息有10頁還是100頁,我目前看到了第幾頁,還有多久能夠看完有很清晰的認知。
第二,方便回溯定位。
比如用戶瀏覽到后面時,突然想返回去查找前幾頁的一條信息,是可以很方便地通過分頁實現快速跳轉的。
第三,留給用戶思考時間。
我們在點擊頁碼之后是需要一定的加載時間才會出現信息的,這會打斷用戶的思路,可是也留給了用戶一定的思考時間,我能夠通過這個關鍵詞獲取到想要的信息嗎,接下來是繼續瀏覽還是離開網站呢?
我們再來看都有誰在使用分頁加載。
咱們最常見的搜索引擎,例如Google、Bing和百度等以搜索為護城河的產品,都非常默契統一地采用了分頁的模式。
再比如郵箱、B端產品似乎都傾向于采用分頁加載。
我剛開始一直想不通為什么google等搜索產品會使用分頁加載,使用無需跳轉的自動加載可以更快地達到目的啊。這時候,再回頭看一下分頁的特點,你會發現分頁給予用戶強烈的掌控感。
像Google、郵箱或者是其他B端產品,它們都偏向于工具型產品,用戶使用時帶有明確的目的,更可能用完即走,我們對于工具通常需要更強的掌控感。
2. 自動加載
自動加載無需用戶手動操作,一直下滑即可。自動加載有以下特點:
第一,無法感知內容數量,已經瀏覽到那個部分,剩余多少。
因為頁面是自動加載的,我們無法知道什么時候才能結束。通常用戶會在得到結果或者大概率無法得到結果時選擇結束。
第二,無法快速定位之前的信息。
有些人可能會說有滾動條啊,因為滾動條會隨著自動加載的次數發生變化,幾乎沒有太多價值。
第三,加載內容過多時,頁面過長。
這會導致用戶難以及時返回搜索框,切換關鍵詞,為了解決這個問題,通常有兩種方案,在右下角加一個置頂的懸浮圖標(我個人訪談了解到很少有人真正使用置頂按鈕),或者滾動時搜索框置頂。
第四,永遠看不到footer。
無法在底部添加其他信息。
第五,非常順滑。
自動加載操作簡單,只需要滾動即可,信息之間沒有明顯的界限或停頓。
總體來講,自動加載可以讓用戶用最少的操作、最短的時間找到需要的信息。
并且自動加載是一種非常沉浸式的體驗,不會打斷用戶思路,甚至沒有操作和時間的感知。
這對于以休閑娛樂為主的社交型產品是非常適用的。比如知乎、微博等平臺,都在使用無限加載的方式,這可以盡可能把用戶留在平臺上。
3. 自動加載+手動加載
分頁加載和自動加載是最基礎的加載方式,現在還出現了一些手動加載和自動加載相結合的方式。
通常是在2~3次自動加載后,便會給一個button觸發手動加載。這是一種比較折中的方式。
從用戶的角度看,我已經瀏覽到第一頁的末尾了,意味著我還想看第二頁的內容,為什么還要用分頁打斷我獲取信息。
自動加載2次后產生的信息大概在9屏左右,這對用戶來講不會是一個很長的頁面,造成心理負擔;并且如果9屏依然找不到想要的結果,要么是搜索詞不對,要么是檢索技術不行,真正去點擊手動加載的用戶就沒多少了。
比如簡書、google圖片搜索就在采用這種方式。
三、回歸需求
了解不同加載方式的區別是基礎,對于具體需求我們應該采用哪種方式,永遠都是具體問題具體分析,有時候還需要考慮技術問題。
我們的產品是一款更加偏向工具型的產品,最好像Google一樣采用分頁的方式。但是這種搜索最好能在第一頁就給到結果,我們目前的技術無法達到非常精準的結果匹配。因此綜合來看,選用了更加折中的自動加載與手動加載相結合的方式。
作者:栗子;公眾號: 栗子設計喵
本文由 @栗子設計喵 原創發布于人人都是產品經理。未經許可,禁止轉載
題圖來自Pixabay,基于 CC0 協議
學費了,謝謝作者
很詳細 ,另外,我覺得還應該考慮適用終端,手機上更適用自動加載,分頁按鈕小點擊不方便,容易出現誤操作;pc端據內容而定。。。
作者所總結分頁加載和自動加載的區別和各自的優缺點還是挺全面的,分析的也很到位~贊~
喜歡這種關于一個小點投入思考的文章,而不是各種價值需求的吹水文