酷播亮新聞
最棒的知識補給站

後台系統:數據展示列表

後台系統:數據展示列表

產品經理入行寶典,12週特訓,22名產品大牛全程帶班,200+名企內推,100%保障就業! 了解詳情

後台數據列表設計,有哪些需要注意的點呢? 通過文章一起來看看。

在後台產品設計中,涉及到比較多的恐怕就是數據列表了。 那麼,列表應該怎樣進行設計,在設計過程中有需要考慮哪些因素呢。

首先,一個後台的數據列表頁,主要可以分為以下幾個:

在有的數據列表頁面,你可能會看到兩個列表,一個是數據詳情列表,另一個則是對所選數據某些字段的一個簡單統計。 在設計中是否需要,需要看業務需求而定。

一、搜索

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

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

二、操作

對數據列表的操作又可以分為整體操作和單條數據操作。

  1. 批量操作:在頁面設計上,整體操作按鈕都會展示在列表的最上方,比如刪除、禁用、排序、篩選等,當然,上面所講到的搜索也屬於整體操作的內容;
  2. 單條數據操作:每條數據後面的操作欄。 通常情況下,數據詳情以及數據的一些設置基本上都會放在後面的操作欄裡,如下圖中的“查看詳情”;

三、數據列表

設計數據列表時,需要注意和考慮的有以下幾點:

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

本文由 @ 姜蕁 原創發佈於人人都是產品經理。 未經許可,禁止轉載。

題圖來自PEXELS,基於CC0協議

讚賞是對原創者的最大認可

5人打賞

如有侵權請來信告知:酷播亮新聞 » 後台系統:數據展示列表