2018-7-18 資深UI設(shè)計(jì)者
如果您想訂閱本博客內(nèi)容,每天自動(dòng)發(fā)到您的郵箱中, 請(qǐng)點(diǎn)這里
列表時(shí)間排序到底應(yīng)該正序還是倒序?哪種體驗(yàn)會(huì)更好?各大知名產(chǎn)品都是如何做的?
前陣子正好做到了一個(gè)類(lèi)似“申請(qǐng)通知“的功能,因?yàn)樯婕暗搅斜?,所以要考慮列表的排序規(guī)則,那么問(wèn)題來(lái)了,要用哪種排序規(guī)則(拼音、時(shí)間…)?
當(dāng)然,這里肯定會(huì)用時(shí)間排序,那么按照時(shí)間的正序(新的通知在下面)還是倒序(新的通知在上面)?以下將進(jìn)行一個(gè)系統(tǒng)的分析,列表時(shí)間排序到底要正序還是倒序?
我們可以先看下市場(chǎng)上的產(chǎn)品都是怎么做的,在這里我將這些產(chǎn)品分成了兩類(lèi)(可能不全,這里不談評(píng)論頁(yè)面哈):
一般由產(chǎn)品推給用戶,可能是產(chǎn)品運(yùn)營(yíng)通知,也可能是其他用戶發(fā)生了一些操作等。
看了很多產(chǎn)品的例子,這里就不全部列出了,幾乎大部分的通知列表都是按照時(shí)間倒序,只有網(wǎng)易馬上辦和拼多多是正序。
內(nèi)容更新相對(duì)比較頻繁:
幾乎所有新聞資訊類(lèi)都是這種類(lèi)型的列表,采用的都是時(shí)間倒序。
提及微信大家對(duì)微信新版本的一大改動(dòng)肯定非常熟悉了,那就是訂閱號(hào)的變化,微信把用戶關(guān)注的所有訂閱號(hào)的新消息拿出來(lái)放到一個(gè)頁(yè)面——訂閱號(hào)消息,它的排序是倒序,而其他具體的訂閱號(hào)內(nèi)部歷史消息是正序,另外新的好友申請(qǐng)消息頁(yè)面是倒序。
那么微信的這些模塊為什么排序規(guī)則不一樣呢?背后的原因是什么呢?我個(gè)人認(rèn)為有幾點(diǎn)原因:
1)畢竟微信主體功能是IM,那么其他的模塊都是附屬,不是主要功能,可能騰訊新聞的根本目的就是為了給騰訊新聞APP導(dǎo)流。
2)將其他的模塊做成訂閱號(hào)模式在產(chǎn)品層面一致性和復(fù)用性很高,既保證了體驗(yàn)一致性,又減少了開(kāi)發(fā)成本。
綜上所述,微信內(nèi)部列表排序規(guī)則是根據(jù)具體場(chǎng)景和功能決定的,其實(shí)都可以講得通,不過(guò)單純就某些模塊的體驗(yàn)來(lái)講卻是有些勉強(qiáng)。感興趣的話,大家可以看看支付寶,它的內(nèi)部所有的列表高度一致,都是按照倒序,包括它的生活號(hào)(和微信的訂閱號(hào)很像),這里就不講了。
釘釘作為一款企業(yè)級(jí)IM產(chǎn)品,大家也許并不陌生,它的功能可謂相當(dāng)復(fù)雜,涵蓋了很多模塊,已然做成了一個(gè)大的平臺(tái)生態(tài)系統(tǒng),那么是不是因?yàn)楣δ艿膹?fù)雜導(dǎo)致了內(nèi)部一些列表的排序規(guī)則各不相同呢?
說(shuō)實(shí)話我是有些懵的,比如其他大部分產(chǎn)品的通知都是倒序排列,而釘釘就是正序,那如果說(shuō)釘釘有自己的產(chǎn)品規(guī)則和邏輯的話,為啥有些類(lèi)似通知的頁(yè)面排序又是倒序?
這個(gè)實(shí)在講不通,而且場(chǎng)景和功能層面這些列表其實(shí)還是比較相近的,那唯一能解釋的可能就是互聯(lián)網(wǎng)界經(jīng)常說(shuō)的——“這些模塊不是一個(gè)團(tuán)隊(duì)做的”。
綜上,大家可以看到,基本大部分產(chǎn)品都是采用時(shí)間倒序,也就是的內(nèi)容在上面,也有小部分采用正序,那么為什么會(huì)按照這樣的邏輯呢?我進(jìn)行了幾點(diǎn)分析猜測(cè):
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.88yangsc.com