電商ToB產品篩選功能設計心得

10 評論 11114 瀏覽 85 收藏 9 分鐘

最近在做一個供內部使用的語料分析工具,主要針對電商交易流程中的客服聊天記錄和交易評價。 踩了不少坑,記錄一些心得,分享給大家。

ToB電商客服聊天產品

開啟一個新產品,首先當然是定位你的產品,形成產品的感性認知。講解ToC與ToB產品差別、不同行業ToB產品差別的文章汗牛充棟。

這里只再強調一遍:務必深刻理解你的產品服務的業務的整個邏輯,不僅熟記軀干,還要親身體驗到每一個枝節。(有無數人強調,也有無數人犯錯,這里面的教訓可以再寫一篇文章了。)

對于電商產品的篩選功能來說,ToC,是決定用戶體驗的核心功能之一,篩選漏斗做的越好,用戶觸達目標商品的可能性就越大;ToB,則是最不能犯錯的模塊,數據的精準篩選是一切分析的前提。篩選功能看似簡單,卻也有好些坑要填。

篩選的需求

要做好篩選,第一部當然是確定好篩選的需求。

電商客服聊天ToB產品——篩選功能

篩選需求一定要詳細了解到枝節

篩選需求的搜集,不是了解清楚有哪些篩選項就完了,結合數據庫數據,對每一個篩選項預期數量級、單項字節長度范圍、是否可以標簽化、是否需要多選,都應當清楚。這里前期的業務邏輯調研就發揮了巨大的作用。

最后綜合全部需求特征,構筑你的目標場景。

篩選模塊的功能設計

有了篩選需求,就開始為篩選模塊設計功能。

常見的篩選功能:篩選-復選與全選、全局搜索與欄目搜索、篩選記錄與快捷清除。

  • 復選與全選功能取決于業務使用需求。
  • 全局搜索一般用于單條搜索,在業務路徑清晰的ToB產品中不多見,欄目搜索的需要取決于當前篩選欄內的條目數量,一般來說條目數量>20當前篩選欄就得有搜索了。
  • 篩選記錄與快捷清除功能主要看篩選行為的頻次,如果在一次完整的分析流程中需要多次篩選,那么篩選記錄與快捷清除是一個收益很大的功能,否則這個功能就沒有什么必要。

由于我的產品的篩選功能是一個低頻功能,故沒有為產品規劃篩選記錄與快捷清除模塊,而對于聊天記錄的集合分析也用不上全局搜索,所以我重點規劃了復選與欄目搜索功能。

電商客服聊天ToB產品——篩選功能

根據需求建立場景設計功能

篩選模塊的交互樣式設計

整體展現:平鋪還是彈出

要對篩選模塊進行交互樣式設計,除了掌握條數字段等基本信息,我們還需要掌握用戶對篩選功能的使用頻次,C端產品需要大量的用戶調研確定用戶層次,而B端還是對業務現狀的理解。

電商客服聊天ToB產品——篩選功能

淘寶網篩選

平鋪是指將篩選項完全羅列在當前頁面內,我們熟知的淘寶網就是采用這種模式,對于淘寶網來說,篩選是個常用功能。

這樣展現的好處是篩選更為直觀,操作便捷,篩選效率更高??梢钥吹竭@種展現樣式有一定的限制,那就是展現條目本身是標簽或者可以標簽化,要么條目的最大字節長度在較低的水平,總體數量可要控制在一個合理的區間,如果篩選條目數量多到一屏放不下,則需要考慮彈出式篩選,甚至是將將篩選獨立成頁。

電商客服聊天ToB產品——篩選功能

百度高級篩選

彈出式的代表是下拉列表,百度的高級篩選正是這種樣式,對于百度搜索,搜索條件篩選依附于全局搜索,是專家用戶才會使用的功能,并且一次搜索一般只需一次篩選,所以設計采用下拉列表,并隱藏在高級篩選中。

當篩選條目數量較多時,一個額外的空間更為友好。而如果篩選功能的使用頻次較低,將它隱藏在下一個層級,為關鍵信息預留更多位置也是很合理的。

欄目搜索的樣式

由于篩選條目數>20,故我們為產品篩選添加搜索。

欄目搜索既可以放置在下拉列表頂端,也可以與篩選框整合。

電商客服聊天ToB產品——篩選功能

搜索位于下拉列表頂端

電商客服聊天ToB產品——篩選功能

搜索位于篩選框內

下拉列表頂端使搜索功能更加明顯,但是要多占一行位置;與篩選框整合的話,在篩選框內閃動光標也可以提示搜索功能的存在(以目前的用戶教育水平,光標閃動交互提示完全足夠)。

我個人傾向于使用第二種,無論哪種,注意保持整體交互風格的一致性便好。

如此長的商品名——古老的復選框

在實際設計商品篩選時,超長的商品名配上復選需求讓商品篩選十分麻煩。淘寶寶貝名長達40~50字,而且由于重要信息一般在整個名字的中部,所以簡單省略是不可取。

可如果檢點做成下拉篩選框,這里就有一個交互體驗問題,單條名稱如此之長,商品篩選又通常是個集合,以至于用戶選到后面完全忘記自己選擇了什么

一番思考后,我搬出了常用于上個時代的雙篩選欄,配合搜索使用。

電商客服聊天ToB產品——篩選功能

雙篩選欄

這個雙篩選欄常見于一些大型分析軟件(SPSS、ArcGIS等)中,它很好地解決了忘記自己選擇了什么、是否選擇完全的尷尬。

商品篩選——隱藏的商品編號

需求中提到,需要用商品編號(ID)定位商品,但是放置一串串相似的數字在篩選框中,這個用戶體驗可太差了(長數字的可讀性太低)。

電商客服聊天ToB產品——篩選功能

你猜用戶會不會瘋掉?

為了解決這個問題,我與前端小伙伴商量了一下。最后的解決方案是商品ID在篩選框中不顯示,但可以通過搜索匹配出來。

電商客服聊天ToB產品——篩選功能

數字匹配名稱

總結

ToB產品的篩選相對于ToC來說通用性要弱很多,比起用戶體驗從有到優的優化,很多時候是在解決從無到有的過程。

情況越是復雜多面,就要注重前期的調研和信息搜集,盡可能考慮好每一個問題。

 

作者:汪知浩,TP公司成長期產品經理、交互設計師。熱衷微交互,探索魔鬼細節。

本文由@汪知浩 原創發布于人人都是產品經理。未經許可,禁止轉載

題圖來自Unsplash,基于CC0協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 想問問圖中思維導圖是用什么軟件做的?

    來自廣東 回復
    1. Xmind Zen

      來自浙江 回復
  2. 不是很明白,你在設計什么產品 ??

    來自山東 回復
    1. 這篇文章主要是在講篩選這個功能,沒有特別強調產品。現在設計的是電商客服聊天記錄語義分析產品,是電商顧客意見采集和選品決策的工具型產品。

      來自浙江 回復
    2. 我去,看字面意思不是很明白,語義分析有什么用嗎,比如說我打情人節三個字,系統自動推薦我買套套嗎? ?

      來自山東 回復
    3. 你說的打情人節推薦買套套是一套“推薦算法”,系統通過語義識別情人節,2月14日,女朋友等文本,結合其他數據比如發言時間、發言場景等,將你說的話和數據模型匹配,根據匹配度算出你是一個有“性用品”潛在消費意向的用戶,然后向你推薦“套套”。而語義分析就是這整個推薦能成功準確達到目標的一環。

      來自浙江 回復
    4. 666 ??

      來自山東 回復
    5. 提這種問題,證明你還是小白啊

      來自四川 回復
    6. 打你屁股 ?

      來自山東 回復
    7. ??

      來自四川 回復