體驗(yàn)設(shè)計(jì)中的排序問題

你是否發(fā)現(xiàn)，微信訂閱號消息列表的排序不是完全按照時(shí)間倒序顯示，而是被打亂了，甚至可以看到數(shù)天前的文章被插入到今天的消息里面。

這是為什么呢？

每時(shí)每刻，我們都會接受大量信息的“轟炸”，除了一些默認(rèn)或常見的排序方式，越來越多的掌握大量用戶數(shù)據(jù)的公司會通過對用戶習(xí)慣，進(jìn)行默認(rèn)排序，提高用戶的閱讀效率。

這也是微信公眾號消息列表閱讀效率優(yōu)化的目的所在：即消息會根據(jù)用戶閱讀喜好，對其一定時(shí)間內(nèi)接收到的訂閱號內(nèi)容進(jìn)行排序上的優(yōu)化。

那在信息排序方面，除了時(shí)間排序之外，還有哪些常見的排序類型？相對應(yīng)的，它們的使用場景、優(yōu)缺點(diǎn)又是什么？

接下來，我們詳細(xì)介紹信息排序的相關(guān)知識點(diǎn)，大家系好安全帶，發(fā)車了……

一、排序的價(jià)值

通常意義，排序并不是頁面的核心組件和功能，因此設(shè)計(jì)師與產(chǎn)品的注意力很容易將其忽略。這就造成其帶來的體驗(yàn)與商業(yè)價(jià)值也并不明顯，被湮沒在產(chǎn)品中。但隨著數(shù)據(jù)的增加以及場景的聚焦，排序的價(jià)值就會慢慢凸顯。

通常情況下，排序有如下價(jià)值：

1. 提升信息查看效率

通常我們都會對頁面的布局、權(quán)重進(jìn)行細(xì)細(xì)構(gòu)思與體現(xiàn)，但是針對數(shù)據(jù)排序卻缺少相應(yīng)的關(guān)注與設(shè)計(jì)。如何將用戶關(guān)注的數(shù)據(jù)排列在海量數(shù)據(jù)最前方，快速推薦給用戶，避免用戶的翻找，提升用戶的閱讀及查閱效率，這才是排序功能真正的核心體驗(yàn)價(jià)值。

2. 圈住用戶，增加用戶的使用時(shí)長

這類的產(chǎn)品總會把用戶關(guān)注、感興趣的信息優(yōu)先推送給用戶，讓用戶在不知不覺沉浸其中，大量擠占用戶的時(shí)間，例如抖音的內(nèi)容算法。

3. 我不給你想看的，我只給我想讓你看的

這類的產(chǎn)品，故意將用戶需要的信息掩藏在強(qiáng)推的信息里面，故意給用戶增加閱讀負(fù)擔(dān)，引導(dǎo)用戶查看被強(qiáng)推的信息，實(shí)現(xiàn)不（shi）可（ren）告（jie）人（zhi）的目的。如百度的競價(jià)排名，就是“我不給你想看的，我只給我想讓你看的”。

二、排序的原則

排序是數(shù)據(jù)展示的邏輯層，無論數(shù)據(jù)的多寡，只有用戶關(guān)注的數(shù)據(jù)才是有效數(shù)據(jù)。在此基礎(chǔ)上，排序的原則可歸納為四點(diǎn)：高效、清晰、統(tǒng)一、美觀。

作為隱性的數(shù)據(jù)展現(xiàn)要素，兩個(gè)核心的原則是高效與清晰，在實(shí)現(xiàn)數(shù)據(jù)清晰展現(xiàn)的基礎(chǔ)上，滿足用戶對數(shù)據(jù)的深層次的需求。

統(tǒng)一與美觀則作為排序的輔助原則，體現(xiàn)了設(shè)計(jì)師最后的倔強(qiáng)，而不僅僅是數(shù)據(jù)的有效展示，還有設(shè)計(jì)師對用戶、場景的思考與情緒表達(dá)。

三、排序的類型

在實(shí)現(xiàn)排序核心體驗(yàn)價(jià)值的基礎(chǔ)上，以用戶是否需要操作，排序大致上可分為兩大類主動(dòng)排序與被動(dòng)排序。所謂的主動(dòng)排序就是用戶可以根據(jù)自己的意愿來調(diào)整展示數(shù)據(jù)的順序，微調(diào)或整體改變數(shù)據(jù)的展示規(guī)則，已達(dá)到快速找到并查閱的目的。相應(yīng)的，被動(dòng)排序就是不需要用戶操作，數(shù)據(jù)默認(rèn)呈現(xiàn)給用戶的順序規(guī)則。

通常情況下，二者并不完全割裂，被動(dòng)排序常常作為頁面加載后的排序方式，而后，用戶在被動(dòng)排序的基礎(chǔ)上進(jìn)行調(diào)整。如to B類產(chǎn)品CRM的一些頁面，加載后通常采用時(shí)間倒序的被動(dòng)排序規(guī)則，用戶在其加載的數(shù)據(jù)基礎(chǔ)上，在進(jìn)行相應(yīng)的主動(dòng)排序。

常見的被動(dòng)排序規(guī)則有時(shí)間正序/倒序、字母順序、筆畫順序、用戶喜好、翻閱記錄等等。隨著算法的逐漸普及以及排序算法的發(fā)展，根據(jù)用戶喜好與翻閱記錄越來越成為排默認(rèn)排序的首選。

但從設(shè)計(jì)層面，默認(rèn)排序的實(shí)現(xiàn)設(shè)計(jì)師是無能為力，只能根據(jù)統(tǒng)計(jì)結(jié)果設(shè)定相應(yīng)的規(guī)則，設(shè)計(jì)技巧很難有用武之地。因此，我們在本文更多的探討主動(dòng)排序的方式的優(yōu)缺點(diǎn)。

下面就簡單分析一下，幾種常見的主動(dòng)排序方式的優(yōu)缺點(diǎn)：

1. 拖動(dòng)排序

拖動(dòng)排序是指通過手指或鼠標(biāo)長按，觸發(fā)拖動(dòng)操作，然后將目標(biāo)數(shù)據(jù)調(diào)整到相應(yīng)的位置。

如在SAP Fiori設(shè)計(jì)規(guī)范指南Tree的應(yīng)用中，就定義了拖動(dòng)排序的交互方式。

如圖：

優(yōu)點(diǎn)：

操作靈活，可滿足多形式的排序要求；

操作便捷高效，兼容性強(qiáng)，特別是少量數(shù)據(jù)時(shí)；

可視化操作，所見即所得。

缺點(diǎn)：

長表格的中，如果排序跨度較大，就比較困難，特別是PC端的跨頁面拖動(dòng)；

實(shí)現(xiàn)效果的調(diào)校需要絲滑動(dòng)效的加持。

2. 指定排序

指定排序即為每一項(xiàng)數(shù)據(jù)置頂相應(yīng)的順序編號，實(shí)現(xiàn)流動(dòng)性的排序功能實(shí)現(xiàn)。如在金蝶云的單據(jù)錄入中，有些環(huán)節(jié)對單據(jù)體的順序有嚴(yán)格的要求，希望調(diào)整單據(jù)體分錄的順序。用戶需要在自定義行號中輸入所處的編號，可實(shí)現(xiàn)以及自定義行號的升序排列。

同樣，在to G產(chǎn)品中，線上會議需要將與會領(lǐng)導(dǎo)按照一定的順序進(jìn)行排序，那么填寫順序編號就是比較經(jīng)濟(jì)和兼容性的實(shí)現(xiàn)方案。

優(yōu)點(diǎn)：

排序穩(wěn)定，指定順序的數(shù)據(jù)不會受到其他因素的影響；

操作簡便，直接輸入想要的順序數(shù)字進(jìn)行排序，特別是對長列表比較友好，如跨頁面排序。

缺點(diǎn)：

大量數(shù)據(jù)時(shí)，有可能涉及到兩種排序規(guī)則，實(shí)現(xiàn)關(guān)鍵數(shù)據(jù)的指定排序，剩余數(shù)據(jù)另外一種排序規(guī)則；

當(dāng)需要在以及完成排序的數(shù)據(jù)中插入數(shù)據(jù)時(shí)，交互上就稍顯復(fù)雜需要考慮數(shù)據(jù)的替換與插入后的后續(xù)數(shù)據(jù)的編號問題；

如果臨時(shí)插入了權(quán)重較低的內(nèi)容，操作成本較大。

3. 逐步排序

這種排序方式設(shè)計(jì)師會比較熟悉，在sketch與figma中，常常會用到將某個(gè)圖層進(jìn)行連續(xù)調(diào)整已達(dá)到相互疊加的效果，滿足視覺要求。

逐步排序比較適合頁面中數(shù)據(jù)的微調(diào)，操作較為精細(xì)。

如在一些產(chǎn)品的屬性配置中，一般情況下數(shù)量有限，但有時(shí)候需要對屬性的順序進(jìn)行微調(diào)，往往會采用這種精細(xì)度較高的交互方式。

優(yōu)點(diǎn)：

符合用戶心智；

操作穩(wěn)定性高，不會出現(xiàn)錯(cuò)誤排序；

操作精細(xì)、適用于微調(diào)。

缺點(diǎn)：

不適合長距離的數(shù)據(jù)移動(dòng)排序。

如果數(shù)據(jù)調(diào)整到的目的地比較遠(yuǎn)，一次點(diǎn)擊很難完成目標(biāo)，所以需要頻繁的操作，同時(shí)隨著數(shù)據(jù)的位置移動(dòng)，鼠標(biāo)位置也要相應(yīng)的微調(diào)，然后進(jìn)行下一次的移動(dòng)操作，因此需要不斷重復(fù)“點(diǎn)擊-移動(dòng)-點(diǎn)擊”的操作。

4. 置頂/置底排序

這種排序方式設(shè)計(jì)師也會比較熟悉，在sketch與figma中，常常會用到將某個(gè)圖層進(jìn)行置頂、置底操作。用戶可以對選中的數(shù)據(jù)，一鍵顯示在最頂部或最底部。

優(yōu)點(diǎn)：

如果需要將某一內(nèi)容優(yōu)先展示，操作很方便。

缺點(diǎn)：

批量數(shù)據(jù)的排序就比較復(fù)雜；

如果僅僅是數(shù)據(jù)的排序，而不是單純的將某一內(nèi)容優(yōu)先展示，操作起來就會比較復(fù)雜。

5. 條件排序

條件排序即通過設(shè)置某種規(guī)則，實(shí)現(xiàn)需求數(shù)據(jù)的整體排序，在某種意義上來說，條件排序的規(guī)則也可以作為被動(dòng)排序的排序規(guī)則。除了之前提到時(shí)間正序/倒序、字母順序、筆畫順序規(guī)則外，常見的還有電腦桌面的文件排序規(guī)則，如文件名稱、文件類型、創(chuàng)建時(shí)間，數(shù)據(jù)的升序與降序，如距離的正序等。

優(yōu)點(diǎn)：

適合數(shù)據(jù)的整體排序，一鍵完成；

使用范圍比較廣，可以是數(shù)據(jù)類型，也可以用戶的查看頻率，如閱讀數(shù)量等；

可以實(shí)現(xiàn)多條件的交叉排序。

缺點(diǎn)：

不能指定某個(gè)數(shù)據(jù)的特異化顯示。

6. 其他

除此之外，也存在一些類似排序的交互方式，例如跨組織架構(gòu)的人員的移動(dòng)、跨文件結(jié)構(gòu)的文件的調(diào)整，通常會采用拖動(dòng)或移動(dòng)到的方式進(jìn)行調(diào)整，他們的排序是對所處結(jié)構(gòu)的“排序”調(diào)整。

從嚴(yán)格意義上來說，這種移動(dòng)并不是排序，而是所屬結(jié)構(gòu)的變更。但在組織結(jié)構(gòu)的調(diào)整中，如果允許節(jié)點(diǎn)之下子節(jié)點(diǎn)的拖動(dòng)排序，就可以看作是組織結(jié)構(gòu)的排序。

排序是交互組件、交互規(guī)范中的小透明，常常被湮沒在下拉選擇等組件中。同時(shí)，排序后的交互與視覺效果并沒有明顯的差異，僅對展示的內(nèi)容屬性有關(guān)。

相較于用戶，設(shè)計(jì)師對展示內(nèi)容的屬性的關(guān)注度遠(yuǎn)沒有用戶高，這就造成設(shè)計(jì)師對實(shí)時(shí)數(shù)據(jù)展示的忽略。

數(shù)據(jù)并僅僅是數(shù)據(jù)，如果不滿足用戶的需求將毫無價(jià)值。

因此，數(shù)據(jù)的呈現(xiàn)規(guī)則以及交互方式，需要設(shè)計(jì)師根據(jù)用戶的需求，提供妥善的解決方案。