列表的時間排序,應(yīng)該正序還是倒序?

2018-7-18    資深UI設(shè)計者

如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里

列表時間排序到底應(yīng)該正序還是倒序?哪種體驗會更好?各大知名產(chǎn)品都是如何做的?

背景

前陣子正好做到了一個類似“申請通知“的功能,因為涉及到列表,所以要考慮列表的排序規(guī)則,那么問題來了,要用哪種排序規(guī)則(拼音、時間…)?

當(dāng)然,這里肯定會用時間排序,那么按照時間的正序(新的通知在下面)還是倒序(新的通知在上面)?以下將進行一個系統(tǒng)的分析,列表時間排序到底要正序還是倒序?

產(chǎn)品分析

我們可以先看下市場上的產(chǎn)品都是怎么做的,在這里我將這些產(chǎn)品分成了兩類(可能不全,這里不談評論頁面哈):

1. 消息通知頁面

一般由產(chǎn)品推給用戶,可能是產(chǎn)品運營通知,也可能是其他用戶發(fā)生了一些操作等。

看了很多產(chǎn)品的例子,這里就不全部列出了,幾乎大部分的通知列表都是按照時間倒序,只有網(wǎng)易馬上辦和拼多多是正序。

2.內(nèi)容信息流頁面

內(nèi)容更新相對比較頻繁:

幾乎所有新聞資訊類都是這種類型的列表,采用的都是時間倒序。

微信和釘釘邏輯分析

1.微信

提及微信大家對微信新版本的一大改動肯定非常熟悉了,那就是訂閱號的變化,微信把用戶關(guān)注的所有訂閱號的新消息拿出來放到一個頁面——訂閱號消息,它的排序是倒序,而其他具體的訂閱號內(nèi)部歷史消息是正序,另外新的好友申請消息頁面是倒序。

那么微信的這些模塊為什么排序規(guī)則不一樣呢?背后的原因是什么呢?我個人認(rèn)為有幾點原因:

  1. 首先新的訂閱號類似新聞資訊一樣(可能微信就是想把它打造成這樣,這點我們不展開),所以按照倒序排列也講得通;
  2. 具體訂閱號中按照正序排列是因為頁面下面有操作,可以進行文字的輸入,所以這個頁面很像聊天頁面,按照正序也有道理;
  3. 騰訊新聞這個功能模塊的排序有點不太理解,明明是新聞類,排序是按照正序,和訂閱號很像,這里我也分析了兩點原因:

1)畢竟微信主體功能是IM,那么其他的模塊都是附屬,不是主要功能,可能騰訊新聞的根本目的就是為了給騰訊新聞APP導(dǎo)流。

2)將其他的模塊做成訂閱號模式在產(chǎn)品層面一致性和復(fù)用性很高,既保證了體驗一致性,又減少了開發(fā)成本。

綜上所述,微信內(nèi)部列表排序規(guī)則是根據(jù)具體場景和功能決定的,其實都可以講得通,不過單純就某些模塊的體驗來講卻是有些勉強。感興趣的話,大家可以看看支付寶,它的內(nèi)部所有的列表高度一致,都是按照倒序,包括它的生活號(和微信的訂閱號很像),這里就不講了。

2.釘釘

釘釘作為一款企業(yè)級IM產(chǎn)品,大家也許并不陌生,它的功能可謂相當(dāng)復(fù)雜,涵蓋了很多模塊,已然做成了一個大的平臺生態(tài)系統(tǒng),那么是不是因為功能的復(fù)雜導(dǎo)致了內(nèi)部一些列表的排序規(guī)則各不相同呢?

說實話我是有些懵的,比如其他大部分產(chǎn)品的通知都是倒序排列,而釘釘就是正序,那如果說釘釘有自己的產(chǎn)品規(guī)則和邏輯的話,為啥有些類似通知的頁面排序又是倒序?

這個實在講不通,而且場景和功能層面這些列表其實還是比較相近的,那唯一能解釋的可能就是互聯(lián)網(wǎng)界經(jīng)常說的——“這些模塊不是一個團隊做的”。

思考

綜上,大家可以看到,基本大部分產(chǎn)品都是采用時間倒序,也就是的內(nèi)容在上面,也有小部分采用正序,那么為什么會按照這樣的邏輯呢?我進行了幾點分析猜測:

  1. 用戶視覺流習(xí)慣從上到下,產(chǎn)品希望用戶能及時關(guān)注新的內(nèi)容,所以按照正序
  2. 列表可能有一些操作,如下拉刷新、篩選,的內(nèi)容靠近操作會更自然
  3. 列表中若有回復(fù)的功能(微信公眾號),更類似IM聊天頁面,所以正序新的內(nèi)容在下,比較合理
  4. 產(chǎn)品內(nèi)部體驗一致性,大部分產(chǎn)品內(nèi)部只采用了一種排序規(guī)則(除釘釘和微信新公眾號),這讓用戶在使用同一款產(chǎn)品時,體驗是一致的,有預(yù)期的。
  5. 技術(shù)實現(xiàn),技術(shù)實現(xiàn)的框架可能產(chǎn)品內(nèi)部采用了同一套方案,所以如果是正序都是正序,是倒序都是倒序。

藍藍設(shè)計sillybuy.com )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計  圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 平面設(shè)計服務(wù)。

 

分享本文至:

日歷

鏈接

個人資料

藍藍設(shè)計的小編 http://sillybuy.com

存檔