后臺系統:數據展示列表
后臺數據列表設計,有哪些需要注意的點呢?通過文章一起來看看。
在后臺產品設計中,涉及到比較多的恐怕就是數據列表了。那么,列表應該怎樣進行設計,在設計過程中有需要考慮哪些因素呢。
首先,一個后臺的數據列表頁,主要可以分為以下幾個:
- 搜索
- 操作
- 列表
在有的數據列表頁面,你可能會看到兩個列表,一個是數據詳情列表,另一個則是對所選數據某些字段的一個簡單統計。在設計中是否需要,需要看業務需求而定。
一、搜索
上圖僅做了一個簡單的搜索作為舉例,但在設計搜索時,每個條件都需要仔細思考。主要包括以下幾個問題:
- 哪些需要作為搜索條件,哪些是重要的,哪些不重要。當搜索條件過多時,可以挑選幾個重要的或常用的展示出來,其他的可以默認隱藏起來,通過“展開”和“收起”來進行操作;
- 哪些支持多選單選,哪些僅支持多選,每個選項搜索條件的默認值是什么;
- 每一個搜索條件該如何設置,如是否支持首字母搜索、下拉選項的排序方式、哪些選項是有聯動關系的、時間需要支持單天選擇還是多天選擇、是否需要設置快捷搜索條件扥等因素都是需要考慮的;
- 不同權限的賬號登錄時,需要怎么展示,哪些人可以看到哪些搜索條件;
- 每選擇一個條件就直接響應搜索還是點擊“搜索”時才執行搜索;
- 在頁面上,還要考慮無搜索結果時,頁面該如何提示;
二、操作
對數據列表的操作又可以分為整體操作和單條數據操作。
- 批量操作:在頁面設計上,整體操作按鈕都會展示在列表的最上方,比如刪除、禁用、排序、篩選等,當然,上面所講到的搜索也屬于整體操作的內容;
- 單條數據操作:每條數據后面的操作欄。通常情況下,數據詳情以及數據的一些設置基本上都會放在后面的操作欄里,如下圖中的“查看詳情”;
三、數據列表
設計數據列表時,需要注意和考慮的有以下幾點:
- 數據信息:數據列表頁最重要的就是需要展示的字段信息,這需要在充分了解業務及需求的條件下進行設計和考量;
- 列表分頁:顧名思義,分頁則是把數據分成多頁展示,基本上后臺的數據量都會很大,不可能一頁展示完,這就需要考慮一頁展示多少數據了。分頁時,涉及到的主要有:當前頁、上一頁/下一頁、頁面總數、頁面的快捷跳轉,若有需要,還可以展示一下數據總條數以及一頁展示多少條的設置,當然,這些還要考慮研發使用何種組件以及實現的難易程度;
- 數據加載:數據的加載與列表的設計有很密切的關系。由于數據量通常都比較大,若一次性加載,則會導致速度特別慢。所以需要提前與研發溝通清楚各種情形下的數據加載方式、是否需要做本地緩存等問題。雖然這些是研發方面的問題,但若不提前溝通,勢必會出現問題;
- 若數據比較多而雜,可以就某些重點字段做一個簡單的統計表,如上圖“金額匯總”表;
- 列表展示規則:需要考慮數據的默認展示方式,如默認按照日期倒序排列等,在列表的表頭處,也可以在某些字段旁增加排序、篩選的操作;
- 特殊標記:某些異常數據在展示上需要作何區別,如用顏色、字體、圖標等進行區分,方便發現問題;
- 其他:可以考慮是否需要提供一些其他的功能,如快捷復制訂單編號等等,當然,這些就是比較細的問題了,可以根據需要添加。
本文由 @?姜蕁 原創發布于人人都是產品經理。未經許可,禁止轉載。
題圖來自PEXELS,基于CC0協議
評論
列表字段經常很多,但是又沒辦法刪減,在小屏電腦上就會向右拖很長,有沒有比較好的處理方式呢
重要數據放在前面,固定位置。后面超長的部分,使用滾動條。
1、自定義展示表格字段
2、滾動條
總結的還是比較全面的,剛做過后臺,很有感受
挺不錯的 最近在做后臺產品設計 都是查詢加上表單設計
好
最近在做電商后臺產品,請問下方便加好友交流一下嗎