許多產(chǎn)品都會涉及到“分類”功能，比如在電商產(chǎn)品中，這一功能的存在更是不容忽視。那么，當(dāng)前電商產(chǎn)品的“分類”功能都是如何設(shè)計的？這篇文章里，作者從信息架構(gòu)、操作流程、用戶體驗三個維度對該功能進(jìn)行了體驗拆解，一起來看看吧。

不管是電商產(chǎn)品還是其他類型的產(chǎn)品，都會涉及到“分類”功能。信息分類不僅有利于平臺對于信息的管理，同時還有利于用戶能快速找到對應(yīng)的信息。

【資料圖】

其中電商產(chǎn)品中的分類，一直都是產(chǎn)品的核心功能，在電商產(chǎn)品設(shè)計之初就一直占據(jù)底部四個tab的其中一位。

但是隨著用戶使用習(xí)慣的改變以及業(yè)務(wù)的調(diào)整，“分類”功能也在不斷的在升級。接下來我將通過信息架構(gòu)、操作流程、用戶體驗三個維度，來帶大家分析一下當(dāng)前市面上電商產(chǎn)品的“分類”功能。

一、信息架構(gòu)

分類功能的信息架構(gòu)主要考慮兩個核心頁面，及即分類入口、分類頁。

根據(jù)不同的業(yè)務(wù)形態(tài)，分類入口的設(shè)計也有所不同，對應(yīng)的分類頁也有所差異，結(jié)合當(dāng)前市面上主流產(chǎn)品的設(shè)計，我將當(dāng)前的電商產(chǎn)品中分類功能分為了常規(guī)型、業(yè)務(wù)型、加購型三類。

1. 常規(guī)型

常規(guī)型指的是最古早的分類功能，分類頁一般分為三個商品類目，一級類目在左側(cè)，從上到下排列，二級類目在右側(cè)，每個二級類目下以九宮格形式排列三級類目，如食品酒飲-中外名酒-啤酒。

根據(jù)不同的業(yè)務(wù)特點，三個類目的劃分及名稱都有所不同，但是整體架構(gòu)大致如此。

而常規(guī)型的分類入口設(shè)計，目前市面上的差異性較大，主要歸納為以下幾種：

1）底部標(biāo)簽

一般適用于導(dǎo)購屬性強且業(yè)務(wù)相對單一的產(chǎn)品，隨著電商產(chǎn)品不斷發(fā)展，直播、社區(qū)等功能逐漸占據(jù)底部標(biāo)簽位置，且用戶在電商產(chǎn)品中通過搜索定位商品的頻率越來越高，底部標(biāo)簽也逐漸開始把分類的入口讓了出來。

2）頂部tab

頂部tab是將分類頁的一級類目用橫向tab的形式展示在頁面頂部。該方式不僅釋放了底部標(biāo)簽的位置，同時每個一級分類下的頁面可以展示對應(yīng)商品，縮短用戶觸達(dá)商品的路徑。

3）金剛區(qū)

分類入口放在金剛區(qū)還是比較少見的，金剛區(qū)一般承載大的業(yè)務(wù)入口，所以相比較下分類這種功能入口的層級就比較低，一般都放在金剛區(qū)圖標(biāo)的后面呈現(xiàn)，主要適用與強搜索、強營銷的產(chǎn)品，分類此時僅僅是一個商品類別的承載。

4）頂部標(biāo)簽

頂部標(biāo)簽一般是將分類入口以功能入口的形式放在頁面頂部，一般跟在搜索后面，此時既不占用底部標(biāo)簽及金剛區(qū)位置，又能將入口透出方便用戶點擊，分類的層級相對也沒那么重。

2. 業(yè)務(wù)型

業(yè)務(wù)型分類不同于常規(guī)型，其主要特點在于不是以商品類型劃分，而是以業(yè)務(wù)類型。

由于業(yè)務(wù)入口眾多，所以除了在首頁金剛區(qū)展示部分入口外，其他的通過相同類型做歸類，放在分類頁中，而此時頁面也區(qū)別常規(guī)的左右布局，而大多采取上下布局的形式，一方面考慮到類別一般不多，左右布局顯得類目切換底部空白太多影響頁面信息平衡，另一方面，上下布局能方便用戶自定義金剛區(qū)的業(yè)務(wù)入口，滿足用戶的個性化需求。

3. 加購型

加購型主要針對的是業(yè)務(wù)單一，商品數(shù)量有限的新零售電商產(chǎn)品。由于平臺沒有過多的延展業(yè)務(wù)模塊，所以金剛區(qū)都用不同的分類入口所占據(jù)。

進(jìn)入分類頁后，除了展示一二級分類外，還會展示該分類下對應(yīng)的商品，這樣呈現(xiàn)的原因一是因為對應(yīng)分類下的商品數(shù)量有限，用戶可以在有限的滑動操作中查看，第二點主要是因為新零售模式還是基于線下的場景，用戶僅僅通過商品名稱與價格就基本能判斷是不是自己想要的商品，而無需過多的參考評價、商品詳情等信息，所以一般會加上購物車，方便用戶直接加購商品。

二、操作流程

分類的操作流程根據(jù)不同的類型也會有所不同，我們可以結(jié)合上面提到的幾種不同的架構(gòu)逐個分析。

1. 常規(guī)型

對于常規(guī)類型而言，當(dāng)分類入口位于底部標(biāo)簽、頂部標(biāo)簽、金剛區(qū)位置時，此時用戶點擊后直接跳轉(zhuǎn)到分類頁，但是如果分類入口為頂部tab的形式，操作流程就會有所不同，此時就需要注意兩點：

第一，增加分類入口，用戶可以直接進(jìn)入分類頁進(jìn)行選擇而無需通過切換選擇某個分類，提升用戶查找分類的效率；第二，是否支持手勢滑動切換，常規(guī)的tab切換為了方便用戶操作，除了點擊切換，還支持左右滑動屏幕切換，但是此時分類tab在首頁頂部，首頁可能還有banner位、金剛區(qū)等位置可滑動切換，所以為了減少用戶的誤操作，這里最好僅支持點擊切換的形式。

另外一個操作流程就是用戶點擊某個三級類目進(jìn)入到對應(yīng)類目的商品瀑布流，此時頁面承載包括兩類，第一類就是默認(rèn)以該類目進(jìn)行搜索后展示的搜索結(jié)果頁，如葡萄酒，而另一種就是以類目tab展示，用戶可以在該頁面切換其他三級類目，如白酒、啤酒等。

該選擇哪種需要結(jié)合具體的業(yè)務(wù)去做考量，但是筆者基于自身使用習(xí)慣與場景，覺得類目tab的形式能更好的解決當(dāng)前的訴求。

2. 業(yè)務(wù)型

對于業(yè)務(wù)型而言，一般是對業(yè)務(wù)類型做分類，此時需要根據(jù)業(yè)務(wù)類型做考量，當(dāng)業(yè)務(wù)類型不是很多時，沒必要做相關(guān)分類，就不用業(yè)務(wù)分類頁去承載，用戶可以通過滑動金剛區(qū)查看更多業(yè)務(wù)入口；但是當(dāng)業(yè)務(wù)類型過多時，此時就需要將所有業(yè)務(wù)按照類型分類，并展示在分類頁中。

一般為了滿足用戶的個性化需求，都會支持用戶自定義首頁金剛區(qū)的業(yè)務(wù)入口，如支付寶、餓了么等，此時就需要補充管理首頁入口的功能與流程。

3. 加購型

對于加購型而言，由于一級分類都展示在金剛區(qū)，所以任何一個入口點擊后都會進(jìn)入到分類頁，而由于一般此類電商平臺的商品數(shù)量有限，且加購意愿強，所以區(qū)別于常規(guī)性的分類，一級分類一般放在頂部，二級分類在左側(cè)，這樣能盡可能方便用戶做挑選，同時為了減少用戶對于一級分類的滑動選擇，一般會加入展開操作，方便用戶快速選擇一級分類。

除此以外，為了方便用戶快速加購，我們在每個分類商品下都放了加購入口，為了方便用戶能快速結(jié)算，一般會在該頁面放置進(jìn)入“購物車”的入口，那么購物車的入口該放在哪里呢？

目前市面上大部分購物車入口都放在右上角，展示對應(yīng)的加購數(shù)量，用戶加購商品后會有視覺引導(dǎo)用戶到購物車入口，但是由于用戶加購操作大部分發(fā)生在屏幕中部，所以右上角的位置不方便用戶點擊；那如果以懸浮窗形式放在屏幕下半?yún)^(qū)，雖然方便用戶進(jìn)入購物車頁面結(jié)算，但是懸浮窗會影響一部分操作。

我們可以從業(yè)務(wù)目的與用戶使用路徑考量，加購的目的最終是為了結(jié)算，那如果我們在該頁面的下方展示加購數(shù)量以及當(dāng)前的金額，用戶可以直接喚起結(jié)算，是不是就不用跳轉(zhuǎn)到購物車頁面了呢？

三、用戶體驗

用戶使用分類功能，就是希望通過不同類型的劃分，找到對應(yīng)的類型，瀏覽或者選購對應(yīng)的商品，所以分類功能的用戶體驗，就需要聚焦在提升用戶查找品類與商品的效率上來。

1. 內(nèi)容適配

用戶進(jìn)入分類頁的目的是想瀏覽對應(yīng)類目下的商品，所以提升用戶目標(biāo)商品的曝光意味著能帶來更高的商品轉(zhuǎn)化。內(nèi)容適配則是根據(jù)用戶過往的行為數(shù)據(jù)，通過一組規(guī)則推薦用戶商品，這套邏輯適用于電商產(chǎn)品的各個模塊與路徑，分類功能也不例外。

在常規(guī)型的分類功能中，一級分類有時候按照默認(rèn)排序，而有時候則根據(jù)用戶行為動態(tài)排序，比如京東，分類tab則會根據(jù)你的行為數(shù)據(jù)動態(tài)調(diào)整；而對于默認(rèn)排序的產(chǎn)品，一般也會在一級類目上加上“精選”，用來挑選出與用戶適配度高的分類，方便用戶觸達(dá)。

而內(nèi)容適配的另一種形式則不是根據(jù)用戶行為數(shù)據(jù)，而是根據(jù)商品屬性推薦。比如在加購型分類中，大多是新零售商超產(chǎn)品，此時當(dāng)用戶在加購某個商品時，會根據(jù)其屬性推薦相關(guān)商品。如當(dāng)加購羊肉卷，系統(tǒng)判斷用戶目的是“吃火鍋”，此時推薦你相關(guān)的火鍋食材，減少用戶加購路徑，提升商品轉(zhuǎn)化。

2. 場景劃分

分類是電商產(chǎn)品針對自身商品做的劃分與歸類，但是可以根據(jù)業(yè)務(wù)屬性增加相關(guān)分類的劃分場景，比如大部分電商產(chǎn)品根據(jù)人群分為了男生、女生，以區(qū)分不同性別帶來的不同分類訴求，而另一些產(chǎn)品如宜家，則是根據(jù)自身業(yè)務(wù)還區(qū)分了房間、設(shè)計工具，用來滿足不同業(yè)務(wù)屬性下的分類需求。

3. 操作連續(xù)

用戶在使用產(chǎn)品時，操作遇到的阻力越小，停留的時間越長，比如抖音的切換視頻方式，采用上滑下滑的方式就比點擊更方便。在常規(guī)分類頁中，用戶在查看對應(yīng)一級類目下的子分類時，當(dāng)滑到最后，目前市面上有幾種處理方式：第一，阻斷操作，用戶滑到最底部就無法再進(jìn)一步上滑操作；第二，默認(rèn)跳轉(zhuǎn)，用戶滑到最底部再上滑操作，直接跳轉(zhuǎn)到下一個一級類目下；第三，給與提示，告知用戶上滑跳轉(zhuǎn)到下個類目。

阻斷操作影響了用戶的操作連貫性，一般不可取，比起直接跳轉(zhuǎn)，給予對應(yīng)提示后跳轉(zhuǎn)能給用戶有個操作預(yù)期，體驗上會更加友好。

四、總結(jié)

以上，就是筆者根據(jù)電商產(chǎn)品的使用感受，分享的一篇關(guān)于分類功能體驗分析的文章，經(jīng)驗有限，歡迎大家批評指正與交流。

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

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