后臺數(shù)據(jù)列表設(shè)計，有哪些需要注意的點呢？通過文章一起來看看。

在后臺產(chǎn)品設(shè)計中，涉及到比較多的恐怕就是數(shù)據(jù)列表了。那么，列表應(yīng)該怎樣進(jìn)行設(shè)計，在設(shè)計過程中有需要考慮哪些因素呢。

首先，一個后臺的數(shù)據(jù)列表頁，主要可以分為以下幾個：

• 搜索
• 操作
• 列表

在有的數(shù)據(jù)列表頁面，你可能會看到兩個列表，一個是數(shù)據(jù)詳情列表，另一個則是對所選數(shù)據(jù)某些字段的一個簡單統(tǒng)計。在設(shè)計中是否需要，需要看業(yè)務(wù)需求而定。

一、搜索

上圖僅做了一個簡單的搜索作為舉例，但在設(shè)計搜索時，每個條件都需要仔細(xì)思考。主要包括以下幾個問題：

1. 哪些需要作為搜索條件，哪些是重要的，哪些不重要。當(dāng)搜索條件過多時，可以挑選幾個重要的或常用的展示出來，其他的可以默認(rèn)隱藏起來，通過“展開”和“收起”來進(jìn)行操作；
2. 哪些支持多選單選，哪些僅支持多選，每個選項搜索條件的默認(rèn)值是什么；
3. 每一個搜索條件該如何設(shè)置，如是否支持首字母搜索、下拉選項的排序方式、哪些選項是有聯(lián)動關(guān)系的、時間需要支持單天選擇還是多天選擇、是否需要設(shè)置快捷搜索條件扥等因素都是需要考慮的；
4. 不同權(quán)限的賬號登錄時，需要怎么展示，哪些人可以看到哪些搜索條件；
5. 每選擇一個條件就直接響應(yīng)搜索還是點擊“搜索”時才執(zhí)行搜索；
6. 在頁面上，還要考慮無搜索結(jié)果時，頁面該如何提示；

二、操作

對數(shù)據(jù)列表的操作又可以分為整體操作和單條數(shù)據(jù)操作。

1. 批量操作：在頁面設(shè)計上，整體操作按鈕都會展示在列表的最上方，比如刪除、禁用、排序、篩選等，當(dāng)然，上面所講到的搜索也屬于整體操作的內(nèi)容；
2. 單條數(shù)據(jù)操作：每條數(shù)據(jù)后面的操作欄。通常情況下，數(shù)據(jù)詳情以及數(shù)據(jù)的一些設(shè)置基本上都會放在后面的操作欄里，如下圖中的“查看詳情”；

三、數(shù)據(jù)列表

設(shè)計數(shù)據(jù)列表時，需要注意和考慮的有以下幾點：

1. 數(shù)據(jù)信息：數(shù)據(jù)列表頁最重要的就是需要展示的字段信息，這需要在充分了解業(yè)務(wù)及需求的條件下進(jìn)行設(shè)計和考量；
2. 列表分頁：顧名思義，分頁則是把數(shù)據(jù)分成多頁展示，基本上后臺的數(shù)據(jù)量都會很大，不可能一頁展示完，這就需要考慮一頁展示多少數(shù)據(jù)了。分頁時，涉及到的主要有：當(dāng)前頁、上一頁/下一頁、頁面總數(shù)、頁面的快捷跳轉(zhuǎn)，若有需要，還可以展示一下數(shù)據(jù)總條數(shù)以及一頁展示多少條的設(shè)置，當(dāng)然，這些還要考慮研發(fā)使用何種組件以及實現(xiàn)的難易程度；
3. 數(shù)據(jù)加載：數(shù)據(jù)的加載與列表的設(shè)計有很密切的關(guān)系。由于數(shù)據(jù)量通常都比較大，若一次性加載，則會導(dǎo)致速度特別慢。所以需要提前與研發(fā)溝通清楚各種情形下的數(shù)據(jù)加載方式、是否需要做本地緩存等問題。雖然這些是研發(fā)方面的問題，但若不提前溝通，勢必會出現(xiàn)問題；
4. 若數(shù)據(jù)比較多而雜，可以就某些重點字段做一個簡單的統(tǒng)計表，如上圖“金額匯總”表；
5. 列表展示規(guī)則：需要考慮數(shù)據(jù)的默認(rèn)展示方式，如默認(rèn)按照日期倒序排列等，在列表的表頭處，也可以在某些字段旁增加排序、篩選的操作；
6. 特殊標(biāo)記：某些異常數(shù)據(jù)在展示上需要作何區(qū)別，如用顏色、字體、圖標(biāo)等進(jìn)行區(qū)分，方便發(fā)現(xiàn)問題；
7. 其他：可以考慮是否需要提供一些其他的功能，如快捷復(fù)制訂單編號等等，當(dāng)然，這些就是比較細(xì)的問題了，可以根據(jù)需要添加。

本文由 @?姜蕁 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來自PEXELS，基于CC0協(xié)議