中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

本文以SaaS平臺的數據篩選及數據列表作為分析的對象，結合案例，對數據列表的設計進行了探究。

我們知道，數據列表承載著業務上的數據。針對不同場景、不同業務、不同戰略下的SaaS系統，客戶通過SaaS平臺實施業務管理，而每列每行的數據，就是業務顆粒度。每個顆粒度可能是一個訂單、一個商品、一個服務、一個潛在客戶、一條線索。如何對顆粒度進行有效管理呢？

本文采用的分析方式是通過歸納、抽象的方法，得到SaaS系統的常見的列表設計方式，并基于抽象得到的模型進行適當的擴展，提供關于SaaS平臺的列表設計創新解決方案。

一、常見的SaaS平臺列表設計及分析

本文以幾個機構的SaaS平臺為例進行說明。

他們分別是：有贊、易訂貨、校寶在線、知曉云、銷售易CRM，分別涉及到的行業是電商業務、零售業務、教育業務、數據后臺、銷售業務。

1. 有贊

有贊的管理后臺，是比較傳統一類的列表搜索模式。即采用了篩選區+列表展示區的模式。但又有一些不同的設計理念。

有贊管理后臺-訂單列表

有贊管理后臺-訂單列表

基于電商業務下，價格、交易額、利潤、商品數量、訂單狀態等業務字段較為重要，需要對用戶進行有效展示，增加可操作性。

在列表展示區，列字段增加了上下的圖標。點擊該圖標，進行升序、降序上的排列。

不同地方在于，例如圖中所示，增加了序號的排序方式。序號上可以輸入數字，客戶可基于序號的大小進行排序。

除此之外，還可以對商品進行分組排序、熱門排序（根據瀏覽量、銷量等字段設置）。這是基于電商業務層面上較個性化的地方。這是字段差異化的地方之一。

差異化地方之二：訂單

由于每個訂單顯示不同的狀態（待付款、待發貨、已發貨、已完成、已關閉、退款中）。有贊的設計方式是，并不會把訂單的狀態放到篩選區域，而是采用平鋪的多個列表，用戶分別點擊不同列表tab切換到不同狀態。

為什么要這樣做？我們認為這是基于業務流的抽象，把訂單的篩選狀態進行了釋放。

簡單來說，如果訂單中涉及到較為重要的業務流層面（例如：a->b->c->d..)，可采用平鋪（線性展示）的方式，用戶可不需再次切換篩選的方式，知道各個訂單的詳細狀態。而這部分，有贊并沒有給到升降序的排列方式。我們可以推斷，在列表顆粒度過小情況下，是可以不需要排序。

2. 易訂貨

易訂貨的列表設計，是在共性的基礎上采取了一些變化。

易訂貨管理后臺-訂單列表

易訂貨管理后臺-訂單列表-高級篩選

我們可以獲得以下的一些認識:

在訂單模塊：

1）搜索區域雖然存在，但只可以通過訂單時間、訂單號、客戶名稱這三個選項進行篩選，匯聚在一行內。所以，占據的空間并不會很大。

2）更多的篩選項，點擊【高級篩選】文案后彈出。高級篩選彈窗展示的是更多的篩選項。

針對列表區：

• 采用了傳統的列表字段展示方式；
• 部分字段可以進行升降序排列；
• 通過列表首行右側的設置圖標，可以對列字段是否顯示、列字段的排序進行設置。設置方法是勾選、點擊上下移動箭頭。

列表區內的設計，采用了部分可點擊的超文本鏈接、字色等方式。例如：客戶名稱可點擊，點擊后跳轉到該客戶信息詳情；點擊訂單狀態、跳轉到了發貨訂單列表頁。在該列表頁上也采用了簡單的排序。

易訂貨管理后臺-商品列表-篩選

經過觀察發現，易訂貨的列表設計，把更多的篩選項通過彈窗的方式進行展示。而把常用的、重要的幾個篩選項集中在一行高度展示。有效減少了篩選項對屏幕空間的占用。

3. 校寶在線

在校寶在線管理后臺，采用了多種篩選機制的列表展示。

校寶在線管理后臺-員工列表

校寶在線管理后臺-列表

主要特點：多行標簽+下拉框篩選兩種類型相結合。標簽選項可單選、多選。

列表的特點遵循了傳統的設計樣式，部分字段可升序降序、針對某行的數據可操作（編輯、刪除、結班）等。我們可以看到，這是教培業務上的點融合到設計中。

4. 知曉云

小程序開發中應用到了知曉云的數據托管，該數據后臺的列表跟前面所分析的案例也略有不同。

知曉云管理后臺-數據列表

知曉云管理后臺-數據列表-字段管理

針對篩選項，放進了【查詢】的入口里。點擊【查詢】彈窗中，即可搜索?？臻g使用效率較高。

列字段展示的特點：

• 可通過【列展示】彈窗，對列字段進行是否顯示、排序的設置；設置方法為拖動
• 展示列字段過多時，可拖動底部滾動條。無法使用鼠標滾動的方式進行滑動。

我們發現，列字段的展示先后順序，并無上述案例中所采用的箭頭移動字段的方式。而是直接通過拖動列字段的先后順序，進行展示。

5. 銷售易

銷售易的列表設計，使用到較多的列字段設置和篩選的方式，兩者結合程度較高。

銷售易CRM

銷售易CRM-向下圖標

銷售易CRM-設置-顯示列表

圖中可以看到，每個列字段的篩選機制中，采用了升降序的粗略排序方法+精準排序方法的結合。

例如：針對客戶級別的排序中，則分為了A(重點客戶)B(普通客戶)C(非優先級客戶)空四種篩選方式。而緯度的精準排序，則給定了一個緯度范圍。

對比易訂貨發現，其實兩個平臺都有列字段顯示、隱藏、排序功能。但設計方法并不一樣。在操作步驟、可視化策略的使用上，兩個平臺各有差異。

根據對產品的實際過程體驗，針對其中特別功能：鎖定/非鎖定的設置方式，我們可以對此進行產品規則的倒推。

產品規則如下：

• 鎖定的列字段最多三個。
• 鎖定的列字段要排在列表字段中最前位置。
• 相同鎖定的列字段，則按照設置的先后順序進行展示）解除鎖定后，該列字段依然顯示在原來的位置。
• 該位置排序方式：根據【設置-顯示字段】的排序進行。
• 【設置-顯示字段】的非鎖定狀態字段挪動到鎖定字段前面，排序方案遵循第二點。即：先展示全部的鎖定字段，再按照非鎖定字段的先后順序排序即可。

觀察銷售易列表，我們發現許多設計亮點。例如：傳統在列表上方的篩選區域不見了，取而代之的是，把列表篩選功能巧妙的嵌入到了列字段中。

體驗上：

1）鼠標移動到了列字段旁的下拉圖標，即可展開搜索列表，使用比較順暢。

2）列表的滑動模式：如果列字段過多，一般解決方案是，在底部增加一個滑塊進行拖動。但這里會產生另外一個不好的體驗：伴隨著對列表展示數據的不同（10，20,50,100,200..），要查看那些在非可視區的列字段內容，則需要把整個列表往下滑。銷售易的解決方案是，通過鼠標滾輪的滑動，則可以對那些非鎖定狀態的字段進行左右滑動。

3）多種挪動列字段的方式：

• 用戶可以在【設置-顯示字段】里，對列字段進行排序。
• 用戶甚至可以直接在列表某字段上方，長按字段并進行拖動的方式。（這里有一個Bug:當想要把非鎖定狀態下的列字段，拖動到所有非鎖定列字段最前面時，其實是做不到的。實際拖動到的是非鎖定列字段的第二位。）
• 雙擊單個區域，可靈活編輯某個行列交叉的內容。直接編輯的顆粒度非常大。（一般的解決方案是會針對整行進行編輯）

銷售易整體上的設計所應用到了以下的抽象：

傳統的列表上方的篩選區域，由于和列字段是一一對應的關系。因此，把這兩個功能進行了聚合。把篩選列的各個功能分別融入到列字段中。

這樣的模式優點是：

1）沒有了篩選區，給列表區騰出了更多的展示空間。（我們知道，如果存在了篩選區，并且篩選區基本上是固定的，在PC端上也是把許多區域占據了。這里有非常多的解決方案，上文也進行了分析）。

2）按需搜索，無須對無關緊要的列字段進行展示了。

3）界面干凈、利于統一。

（這里有業務場景限制，只有當彼此嚴格對應是才可以使用該抽象）

其實從列表設計的方法中，我們看到了excel的影子。例如：鎖定模式和excel的凍結窗格、雙擊編輯某個列數據和excel雙擊編輯單元格、列的篩選和excel的篩選模式，以上的這些基本上是異曲同工?？梢哉f，銷售易采取的數據管理表格的思想，借鑒了excel里的一些設計方法。

為什么要這么做，這里并不進行討論。數據表格的設計涉及到業務、產品效率層面，而這個是為什么不同SaaS平臺的搜索列表模式都會或多或少區別的原因。

二、篩選及列表的抽象

根據上述的分析，我們可以得到一個基本的產品設計模型：

SaaS篩選及列表的抽象模型

圖中可以知道，數據的處理和管理，最終的目標是為了能提高客戶使用及決策的效率。

我們可描述為：用戶通過篩選和列表的展示，可以高效獲取到他們所要的內容。通過展示精細化顆粒度高的展示、實時幫助客戶處理編輯數據、提供對數據進行便捷操作體驗，并通過數據呈現、輔助決策等手段，提升客戶處理商業數據的效率。這也是優化數據列表價值的原因之一。

基于此，我們可以再進一步進行擴展：

根據篩選和列表的耦合、獨立矩陣，進行劃分不同模式的列表設計方案。例如：只為企業某項特別業務數據列表服務的篩選項，則是高度耦合于列表。以此類推。

主要模式有以下3種：純耦合模式（強、中、弱）、耦合+獨立模式、智能（獨立）模式。

如圖所示：

純耦合模式（強、中、弱）

耦合+獨立模式

智能（獨立）模式

文章所分析的各個平臺的模式，可以認為是模式一（純耦合）、模式二（耦合+獨立）的方式。

不同的SaaS列表的設計，往往是基于業務、數據、資源、操作等層面，所謂的最優選項也會在資源和成本壓力下被否決。我們可以認為，沒有最優的、只有最適合的數據列表設計方案。

#專欄作家#

阿藝師傅，微信公眾號：鋅產品，人人都是產品經理專欄作家。曾擔任國內某top知識付費平臺B端產品經理，負責過億級用戶平臺的產品設計的工作。對系統設計、系統思考等方面較感興趣。

本文原創發布于人人都是產品經理，未經許可，禁止轉載。

題圖來自 Unsplash，基于CC0協議。