B端體驗細節(五):搜索的設計模式

6 評論 12956 瀏覽 51 收藏 21 分鐘

編輯導語:搜索功能的存在可以讓用戶在海量信息中檢索自己所需信息,這便利了用戶,且企業也可以利用搜索功能來提升運營活動指標。那么,應該如何做好搜索設計,優化用戶體驗,進而提升用戶轉化?本篇文章里,作者就B端產品的搜索功能設計進行了總結和梳理,一起來看一下。

搜索在知識形成和激發創意方面發揮了重要的作用。它勢必將以難以想象的方式調動我們的意識,振奮我們的精神。

——彼得?莫維里

打開淘寶,點擊頂部搜索框,輸入馬克杯,點擊搜索,一堆漂亮的馬克杯圖片展現在我們眼前。我們可以開始瀏覽并選擇自己中意的馬克杯,也可以再次精確篩選后,再進行瀏覽并挑選。

搜索——重構搜索——瀏覽——對比——下單,是我們在使用淘寶的習慣路徑,搜索拉近了淘寶與用戶的距離,搜索讓我們發現所需。

B端體驗細節(五)-搜索的設計模式

可以說,搜索對于移動端APP、B端系統、網站等來說是必備功能,缺少了搜索的產品,將會被用戶丟棄。

試想一下,如果微信沒有搜索、知乎沒有搜索、餓了么沒有搜索,我們還會不會去用它們。

今天將和大家分享搜索以及B端搜索的設計模式,一起來了解下搜索這個朋友,希望借此文給大家帶去一些搜索設計的啟發。

本文將從以下5部分展開:

  1. 什么是搜索;
  2. 搜索的意義;
  3. 搜索的構成;
  4. 設計模式;
  5. 設計原則。

一、什么是搜索

搜索就是用戶將想要查詢的信息輸入到相應的搜索器中,然后搜索引擎就會在約定的規則下將獲取到的信息反饋給用戶的過程。

搜索引擎依托于多種多樣的技術,比如爬蟲技術、檢索排序技術、自然語言處理技術等?,F今,搜索引擎的技術和算法已經相對成熟,看看淘寶、百度、谷歌我們就知道了,搜啥有啥,搜錯還會幫助用戶糾正,真的非常聰明。

搜索引擎的工作過程可以分解為三步:一是抓取原始信息,存入數據庫;二是對原始信息進行提取和組織,建立索引庫;三是當用戶輸入內容時,快速檢索并找到結果內容排序(排序規則多種),返回給用戶。

搜索結果如何排序,非常影響用戶的滿意度。例如,將幾年以前的信息,或將相關性非常弱的信息展示給用戶,用戶滿意度將會大打折扣。

二、搜索的意義

對于產品和用戶來說,搜索的意義不言而喻,主要有以下幾點:

1)在信息浩如煙海的時代,光靠人類的記憶已經無法記住如此多的信息。它們在哪里,沿著什么路徑可以去找它們,總之,已經記不住了。搜索是個好幫手,只要輸入關鍵詞,就可以得到自己需要的信息資源。

2)在搜索目標信息的同時,我們也會獲得熱門搜索、推薦結果、高相似度等信息資源,這極大地促進了銷售額、運營活動指標的提升,搜索對商業價值、KPI績效的提升也不容易忽視。

3)搜索讓信息無國界,跨時間與空間。我們用搜索可以知道當下的時事新聞,現在很多國外熱點事件,一方面是通過報道,另一方面是通過搜索發現的。

4)產品通過加入智能搜索能力,變得對用戶更友好了,產品不再是冷冰冰的系統,而是有溫度的伙伴,可以提升用戶粘性。

三、搜索的構成

對于產品經理/設計師來說,要為產品設計搜索功能,通常要思考到這4點。

1. 功能入口

功能入口是指用戶可以從哪里觸發搜索這一行為。在移動端上,功能入口有些在頂部,有些在底部,還有一些會懸浮在頁面的某個部位;PC端由于屏幕面積大,搜索通常放在產品頁頂部,如果放在其他位置,用戶幾戶注意不到。

1)移動端案例(淘寶為例)

淘寶作為電商平臺,其商品數量大到驚人,除去打發時間漫無目的瀏覽商品的用戶,絕大多數用戶都通過搜索完成自己的交易鏈路。

因此,淘寶將搜索放到了首頁頂部最顯著的位置,且搜索框默認處于展開狀態,框內的占位文字(占位文字來自用戶最近搜索的內容)引導用戶開啟搜索旅程。淘寶的搜索功能非常豐富,不僅包含了文本搜索,還包含了圖片 、二維碼等搜索方式。

B端體驗細節(五)-搜索的設計模式

2)網站案例(知乎為例)

知乎作為問答社區,其搜索入口也位于頂部導航欄的顯著位置,引導用戶進行搜索,并且搜索框內的占位文字根據算法會間隔一段時間改變,引導用戶發現新的內容,促進用戶在知乎上的使用時長。

B端體驗細節(五)-搜索的設計模式

2. 搜索激活頁

搜索激活頁是指當用戶激活搜索框時,反饋的狀態。有些產品的數據量不大,搜索是一個非常次要的功能,那么其搜索激活頁可能就沒有。但很多產品會利用搜索激活頁做一些營銷活動,以提升用戶粘性、商品轉化率、銷售額等。

1)移動端案例(淘寶為例)

淘寶的搜索激活頁呈現給用戶歷史搜索情況、搜索發現、新趨勢熱點等推薦內容,對于沒有目的來淘寶閑逛的用戶來說,可以利用搜索激活頁的內容開啟瀏覽,說不定看著看著就下單了。而對于有目的性來淘寶購買商品的用戶來說,也可以利用淘寶預置的內容,去發現新的內容。

B端體驗細節(五)-搜索的設計模式

2)網站案例(知乎為例)

當鼠標進入知乎搜索框時,知乎搜索激活頁提供了近期熱門內容和歷史搜索,這是C端搜索激活頁常見的設計模式。

B端體驗細節(五)-搜索的設計模式

3. 搜索反饋頁

搜索反饋頁是指從用戶輸入本文這一刻起,到還沒有確認搜索的中間過程。這個過程會使用一張頁面來記錄當前搜索的反饋,這就是搜索反饋頁。

在搜索反饋頁中,反饋算法至關重要,這里細節就非常多了。例如是否需要自動糾錯、是否要拼音轉文字、是否要抹掉空格等。與此同時,還需要涉及到自動補全、最佳優先等策略。對于搜索反饋頁來說,其承載的遠不止UI呈現而已,背后的算法邏輯才是搜索是否好用的基礎。

1)移動端案例(淘寶為例)

淘寶的搜索反饋頁采用自動補全機制,協助用戶更精準地搜索,并且其可以識別拼音,從而轉換為文字。關于淘寶搜索的規則等,大家可以去網上找找。

B端體驗細節(五)-搜索的設計模式

2)網站案例(知乎為例)

知乎搜索反饋頁也是采用了自動補全機制,并且可以識別拼音。不過兩者由于產品性質、算法等不同,同樣是搜索“上衣、shangyi”,其反饋的結果也是不同的。

B端體驗細節(五)-搜索的設計模式

4. 搜索結果頁

搜索結果頁是指用戶確認當前搜索后,產品所呈現給用戶的內容頁面。在搜索結果頁上,通常會將與關鍵詞有關的內容按照一定的排序規則進行呈現,例如按照點贊量、購買量、收藏量等。

1)移動端案例(淘寶為例)

淘寶的搜索結果頁根據一定的排序規則將搜索結果呈現給用戶,同時用戶可以進一步通過精細化篩選將結果進一步縮小。

B端體驗細節(五)-搜索的設計模式

2)網站案例(知乎為例)

知乎的搜索結果頁也設計的非常豐富,與普通的問答瀏覽頁幾乎沒有差別,只是內容更聚焦了,且頂部有分類導航,右側有搜索發現。

B端體驗細節(五)-搜索的設計模式

產品由于調性不同、用戶群不同、運營目標不同等原因,應用的搜索設計模式也會不同,但產品一旦涉及到搜索,就要盡力去設計好,特別是從用戶需求出發進行設計,讓用戶感受到搜索不僅是一個功能,更是懂他們的知心朋友,幫助他們找到所需的信息。

四、設計模式

對于B端產品來說,搜索通常不會只有全局的,而移動端、網站一般只有一個搜索入口。B端產品的搜索會出現在“全局搜索、菜單搜索、某類型內容搜索、表數據搜索”等上面。

今天要說的B端產品搜索設計模式不局限在某類型搜索,而是指涉及到搜索這一功能時,可以如何啟發思考的問題。從個人經驗以及相關資料梳理,我將B端產品搜索的設計模式總結為以下6種。

1. 自動補全

1)What 是什么

當用戶輸入內容時,系統會幫助補全內容,無需用戶全部輸入完整。例如輸入“小白鞋”,就會出現“小白鞋女、小白鞋清潔劑、小白鞋厚底”等內容。

2)When 使用場景

通常來說,用戶并不能準確的輸入完整的內容(這需要他們努力回憶,或者精心組織編排文字),即便他們會輸入完整的內容,也需要花費掉他們較久的時間。

自動補全不僅可以讓用戶搜索變得高效,讓搜索更精準,也可以發散用戶的搜索思維,這是搜索情感化的表達。好比你和朋友對話,你才說了半句,他就猜對了下半句,是不是你就會感覺這個朋友很走心。

2. 最佳優先

1)What 是什么

人們總是關注排列在靠前的內容,或者最后的內容,而不是中間那一堆。最佳優先設計模式將搜索結果中最重要、最推薦、最符合用戶預期的排列在最前面,從而讓用戶快算定位,完成搜索。

最佳優先數量建議不要過多,3個以內即可。

2)When 使用場景

用戶所輸入的就一定是最佳的嗎?答案是否定的,有時間連我們自己都不知道自己輸入的內容是否是最佳的,當我們在B端產品菜單搜索框中輸入內容時,非常期望系統能推薦自己真正所需的,所以最佳優先非常合適。

系統可以通過用戶近期點擊的菜單、停留的頁面時長來算出最佳優先。例如圖書館書籍管理系統,可以將近期借閱量高的書籍,好評率高的書籍進行最佳優先排序,保證圖書管理員可以搜索出所需的書籍,擺放在合適的書架,以至于可以被借閱者快速借閱。而不能是搜索關鍵詞,出現的是一堆非熱門、非有用的書籍。

3. 模糊輸入

1)What 是什么

模糊輸入是指用戶不用關心自己輸入了什么格式,哪怕錯了,系統也會推薦給你相對正確的,讓用戶達到預期目標。包括:繁體轉為簡體、自動糾錯(例如“群子”糾正為“裙子”)、拼音轉為文字、同義詞轉換(例如“聯想”轉為“聯想集團”)。

2)When 使用場景

用戶在輸入時,并不一定會正確輸入,有時候因為打字快,會輸入讀音相同但文本不對的內容。就像我們在聊天時候,會不小心打一串拼音出去,但由于對方是活生生的人,他的大腦會轉譯。

而對于系統來說,這要困難得多,不過也要盡力去做。不管用戶輸入什么,系統都可以糾正,會增強用戶心流;但用戶輸什么錯什么,就會讓用戶有明顯的受阻感。

4. 分面導航

1)What 是什么

分面導航又被稱為導引式導航,它讓用戶通過漸進式查找,最終找到自己需要的目標。該設計模式是小范圍到大范圍的搜索行動,不斷明確目標的過程。

2)When 使用場景

用戶對搜索的需求有時候需要多維度呈現,并不是一個維度可以呈現完成的,多維度的篩選是用戶對信息多維度感知的需求。用戶會在多個分面上輾轉,以查詢他們的所需。好比查股票,可以從漲跌幅度、行業分類、市盈率等維度展開,用戶并不只想看某個維度。

5. 高級搜索

1)What 是什么

高級搜索是指將不常用,但又可以進一步縮小內容范圍的條件整合起來,幫助用戶更精準地搜索目標內容。

2)When 使用場景

當用戶期望更精細化的內容時,需要使用。

拿B端的數據表格舉個例子,當用戶拿到一張公司成員表時,只想提取“姓黃、年齡25-30歲、男性、身高170以上”的成員時,就要使用高級搜索了,普通搜索無法滿足精細化搜索的需求。

6. 歷史搜索

1)What 是什么

歷史搜索顧名思義就是將用戶曾經搜索過的內容進行展現,方便用戶再次搜索,無需重復輸入。

2)When 使用場景

用戶并不喜歡同樣的內容重復輸入,系統記不住用戶近期的輸入,而要讓用戶不斷從0-1輸入,這會讓用戶覺得系統很傻。

歷史搜索在B端也非常常用,特別是面對經常搜索的菜單,很多系統都會給上歷史搜索,來幫助用戶快速定位目標。

歷史搜索在一定程度上參考了表單的設計思維。在疫情剛開始那時候,我們需要每天上報同樣的信息,我記得一段時間后,很多字段已經帶上默認值了,用戶就省去了每次填寫同樣內容的麻煩。B端搜索的設計模式相對較為嚴謹,這與產品的性質、用戶對象、數據性質等有關系;而C端搜索的設計模式比較豐富,還會涉及到個性化、展現豐富性、熱門搜索等。

五、設計原則

關于搜索,幾乎沒有人不知道,哪怕是不從事產品的人,他們也知道。同時每一個產品,隨著規模變大,搜索一定必不可少。

那么如何設計好搜索呢?有哪些原則可以借鑒,本文總結了4個方面。

1. 漸進呈現

在我們設計搜索時,可以考慮漸進呈現的方式。這是指搜索結果不要一股腦兒都塞給用戶,而是使用逐步擴大的方式,讓用戶慢慢進入目標。

但這里要注意,漸進的層級不要太深,漸進的內容要做到足夠為用戶著想。

2. 結構化

結構化是指搜索結果呈現的形式要有歸納和整理的意圖,不能反饋給用戶的是沒有層次的內容。簡單來說,分類就是結構化呈現的體現,內容結構化后用戶查找和定位才會更快速。

3. 可操作

對于搜索結果,我們可以給予操作選擇,例如收藏、分享等,這將會大大提升用戶與搜索結果之間的后續聯系。

可操作性是最佳優先的好伙伴。同時給搜索結果添加使用類操作,這會讓用戶專注于目標。例如搜索音樂后,音樂可以直接播放。

4. 可保存

不輪搜索任何內容,用戶都有權保存自己常用的搜索結果,保證用戶后續無需重復搜索。這點上已經有很多C端產品做的很好了,我們B端也可以考慮起來。

六、總結

搜索不會是個過時的功能,相反,搜索會長盛不衰。就如彼得?莫維里說的:“搜索在知識形成和激發創意方面發揮了重要的作用。它勢必將以難以想象的方式調動我們的意識,振奮我們的精神?!?/p>

現在,搜索已經不僅限于文字,還有圖片、語音、音樂等的搜索方式,未來還會不會有更多的呢?答案是肯定的。

前些日子,我忽然想吃肯德基,但是我又不想打開手機去搜索,我對著手機喊了一下“hi,Siri,肯德基?!彼苯痈嬖V我最近的肯德基店在哪里。但僅此而已,沒有下文了,如果我還能說購買一個全家桶,然后完成整個交易,那不簡直太美好了。

我們可以暢享下搜索,振奮一下我們的精神~

#專欄作家#

知果,公眾號:知果日記,人人都是產品經理專欄作家。浙江工商大學品牌設計專業碩士,《B端思維-產品經理的自我修煉》作者。在產品設計流程、產品設計原則、產品設計方法、產品設計規范方面均有豐富經驗。

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

題圖來自Unsplash,基于CC0協議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 講B端,里面都是C端案例,沒細看

    來自河北 回復
  2. 通篇廢話,充滿業余感,培訓班氣質十足,而且你真的知道什么是B端嗎就起這標題

    來自北京 回復
  3. 和B端毛關系,騙子,掛羊頭賣狗肉,麻煩審核員認真點

    來自廣東 回復
  4. 騙子,掛羊頭賣狗肉

    來自廣東 回復
  5. (⊙o⊙)…跟B端沒什么關系

    來自上海 回復
  6. 你這個不是C端分析么,怎么標題是B端的呢

    來自廣東 回復