1. 程式人生 > >APP介面優化設計:6種常見資料載入頁面方案

APP介面優化設計:6種常見資料載入頁面方案

當我們設計完app之後,肯定會進行多個版本多迭代更新、介面多優化等工作。今天小編就跟大家來聊聊app資料載入的6種常見方案。

同時把每一種資料載入頁面方案等優缺點分享給大家!

 

1.全屏載入

全屏載入就是整個螢幕白屏進行資料載入,一般會有菊花轉或進度條配合,常用於手機網頁的載入中,例如列表頁進入詳情頁,圖片詳情等。(可考慮融入趣味性較強的小動畫,增強愉悅感,從使用者心理上去縮短等待時間。)

優點:能保證內容的整體性,全部載入完才能夠系統化的閱讀。

缺點:有非常強烈的等待感,3s以上會產生焦躁情緒,所以在地鐵等訊號   不好的地方,使用手機網    頁獲取內容實在是比較災難的一件事情。

2.優先載入

如果一個頁面有圖片有文字,可以先把文字都加載出來,保證使用者可以有內容可讀,然後再載入比較費流量的圖片。但是活動頁什麼的,千萬不能把重要資訊全部放在圖片上,導致載入不出來。這種載入形式更加適用於內容閱讀型的APP。


優點:可以幫助使用者快速閱讀內容,瞭解資訊。

缺點:也許會丟失掉重要的關鍵資訊,無法建立資訊獲取的閉環。

3.整頁載入

噹噹前頁與下一頁是整頁切換的時候,可以考慮採用整頁載入的形式,但是要保證每個頁面的資料量不是特別的大。一般適用於宮格圖片模式、全屏圖片模式、網狀詳情頁模式。


優點:能保證每個頁面的完整性,體驗比較整體。

缺點:不好保證整頁的載入效率,且有可能影響瀏覽的流暢度。

4、自動載入 (APP資料載入方案)

可以設定規則,預設載入20條,滾動第20條的時候,自動再載入20條。用這種手法,可以營造一種無極限瀏覽的錯覺,很容易的把使用者吸引住,一直向 下滾,一直向下滾。(因為人們受多巴胺的驅動,產生尋求資訊的好奇心和熱情,不斷尋找資訊,當我們找到的資訊越容易,就越投入其中,這就是為什麼當我們看新聞、逛淘寶、刷微博時總是走不出來的原因)。適用於瀑布流、長列表、商品列表等情況。

優點:把使用者代入無盡瀏覽模式,讓使用者一直向下滾動,不需要手動點選下一頁。

缺點:沒有盡頭,容易迷失,不方便快速索引定位到某個內容。

5.智慧載入

當用戶處於WiFi下,不受限於流量和訪問速度時,可以放心載入大圖、或播放視訊,但是如果使用者處於非WiFi的模式下(消耗資料流量),則需處理 成小圖或者無圖模式,視訊和動畫直接用一個佔位符標識就好了,這種根據網路狀況,智慧調整的載入方式,叫做智慧載入。適用於有大量圖片或視訊的APP,如 電商類、新聞或線上視訊類APP。

例如今日頭條在WiFi模式下,圖片大圖展示,當處於非WiFi模式下時,展示小縮圖,當用戶覺得某張圖有足夠的吸引力時,點選小縮圖載入大圖,幫助使用者節省流量。再比如愛奇藝在非WiFi的模式下播放視訊時,會提示使用者繼續播放會產生流量費用,這類設計就比較人性化,也容易讓使用者產生好感,建戶忠誠度。(使用者知道你是在為他著想,畢竟流量還是挺貴的!)

優點:根據具體場景來控制流量和載入速度。

缺點:不一定真實有效的命中使用者需求,所以還是需要給予使用者一定的檢視詳情的入口,或者是設定項。

6.離線載入

當用戶沒網的時候,往往很多功能都不能用了,內容也無法加載出來,導致APP變得根本不可用,這時候就要考慮預載入離線快取的設計了。首先在有網 的時候把資料提前載入下來,快取到本地,當沒網的時候,直接載入已經快取下來的內容。一般會提供給使用者選擇,是否開啟有WiFi的情況下預載入功能,或者 是否開始WiFi下全部離線快取的功能。這樣便可在一定程度上減少地鐵上訊號時好時差而無法正常使用產品所帶來的困擾了。但考慮到手機空間,要設計合適的離線機制。並配合一定的清理快取的機制。適用於小說閱讀、新聞閱讀、視訊類APP。


優點:解決了沒網獲取資料的問題,且節約了流量,保證了流暢。

 缺點:佔用本地儲存空間,而且有時候預載入的內容根本沒有用到。