編輯導(dǎo)語：搜索功能的用戶價值在于“讓用戶快速找到所求”。對于生鮮電商類APP來說，該價值可以具體為“快速找到滿意的商品”；除滿足用戶需求外，對于商家或平臺而言，搜索功能也具有不容忽視的價值，如獲取用戶的購買需求信息，搜索行為本身的流量價值等；搜索產(chǎn)品設(shè)計的好壞，即會直接影響用戶的購物體驗，也會影響商家對于流量的利用效率。本文將詳細介紹生鮮電商APP中的搜索功能設(shè)計。

一、需求概述

對用戶來說，生鮮電商類的搜索功能通常是用來解決“快速找到滿意的商品”的問題。

“快速找到滿意的商品”中的“快速”和“滿意”是關(guān)鍵詞，但二者其實在很大程度上是矛盾的。

一方面“快速”意味著用戶的搜索操作應(yīng)盡量方便、快捷，也就是要求平臺應(yīng)當(dāng)盡量少的讓用戶交互提供信息；

但另一方面“滿意”通常又意味著平臺需要盡量多的與用戶交互，畢竟平臺上的商品數(shù)以萬計，只有更多的獲取用戶信息才能真正的明白客戶到底想買什么。

對于平臺來說，在設(shè)計過程中，還應(yīng)當(dāng)充分考慮平臺“充分利用流量號召用戶產(chǎn)生更多購買意向”的需求。

綜上，生鮮電商APP搜索產(chǎn)品的設(shè)計目標(biāo)主要可以概括為2點：

1. 提升搜索操作的效率，讓用戶能更快的找到滿意的商品；
2. 充分利用搜索流量，讓用戶產(chǎn)生更多的購買意向或行為。

用戶若想通過搜索功能滿足該用戶需求，通常的用戶路徑最多需要3步：

1. 點擊搜索框，觸發(fā)搜索功能；
2. 輸入關(guān)鍵詞并觸發(fā)搜索行為；
3. 瀏覽搜索結(jié)果，進行比較，完成選擇。

結(jié)合“快速找到滿意的商品”和“充分利用流量號召用戶產(chǎn)生更多購買意向”的根本需求，具體到上述3步中的產(chǎn)品設(shè)計目標(biāo)可以描述為：

1）用戶在需要搜索時能馬上進行搜索【用戶需求】

價值：提高將用戶產(chǎn)生搜索意向轉(zhuǎn)化為搜索行為的轉(zhuǎn)化率，從而提高交易額；

2) 搜索過程盡量高效（用戶路徑盡量短）【用戶需求】

價值：降低用戶時間成本，使用戶在相同的時間內(nèi)能瀏覽更多的商品，從而提高交易額；

3) 搜索結(jié)果盡量符合用戶的真實意向【用戶需求】

價值：提高用戶挑選商品的效率，減少用戶需要重復(fù)搜索的次數(shù)，提升展示給用戶的商品被用戶購買的可能性，從而使用戶在相同的時間內(nèi)能瀏覽更多真實需要的商品，從而提高交易額；

4) 在各個步驟充分利用搜索流量資源，刺激用戶產(chǎn)生更多的購買意向【平臺需求】

價值：通過刺激用戶產(chǎn)生更多的購買意向，從而提高交易額。

二、功能梳理

從根本上來說，產(chǎn)品的功能其實應(yīng)當(dāng)“基于對用戶需求和行為的深入思考”產(chǎn)生。

如果把這種方式稱為“正向工程”的話，那么在這里，我們就把“從成熟產(chǎn)品的功能倒推其背后的用戶需求和行為邏輯”的方式稱為“逆向工程”。

采用正向工程的方式完成生鮮電商APP內(nèi)搜索功能的設(shè)計并做到當(dāng)前的功能完整度，其難度可能會大大超出我們的想象。

因為這其中所需的對用戶行為的洞察，所需要的大量數(shù)據(jù)分析，所需要完成的一個個的細節(jié)設(shè)計，所需的一次次的假設(shè)證實或證偽，我們很難一一說清，這本身也是一個不斷迭代的長期過程。

本文我主要采用逆向工程的方式，梳理了生鮮電商APP內(nèi)的常見搜索功能，并對這些功能背后所蘊含的用戶需求及用戶行為邏輯進行了解讀。

生鮮電商APP搜索功能梳理

三、產(chǎn)品設(shè)計

1. 入口設(shè)計

在生鮮電商APP中，用戶進入APP后，通?？梢园延脩舭凑召徺I意向的明確程度分為3類：

1）購買目標(biāo)明確到具體的商品

例如“家里油用光了想買1桶花生油”，“晚上吃火鍋買點底料和羊肉片”；

2）購買目標(biāo)明確到具體的品類，但沒有明確的目標(biāo)商品

例如“要去朋友家做客買點水果”，“給孩子買點糖果和乳飲料”；

3）無明確的購買目標(biāo)，如果看到了覺得合適的商品可能會購買

例如“過幾天過年回家買點能給爸媽帶的東西”，“最近家里吃的少了，補充點各種吃的”，甚至“去逛逛生鮮超市看看有什么合適的隨便買點”。

需要注意的是，通常用戶的購買意向都是復(fù)雜的，可能同時包括不同程度的上述需求。

例如：

張三周末在家發(fā)現(xiàn)桶裝水馬上喝完了，又不想出門自己去提，就決定在盒馬上買2桶水（小明習(xí)慣喝5L裝的農(nóng)夫山泉，并且多次在盒馬購買過）吧；

同時也快中午了，計劃自己做中午飯，想了想做個青椒炒肉吧，買2個青椒買200g豬肉；

另外順便買點周末這兩天在家吃的水果，具體吃什么水果還沒想好。

這時，張三打開了盒馬APP，開始一樣一樣的購買；

點擊搜索框后，發(fā)現(xiàn)推薦關(guān)鍵詞中的“冰淇淋”三個字，突然就想確實挺熱的，再順便挑一箱冰淇淋吧。

這就是一個很典型的用戶線上購物場景。

搜索功能最具優(yōu)勢的使用場景是用戶已經(jīng)有了明確的購買目標(biāo)，此時搜索功能可以讓用戶比通過其他方式更快的找到目標(biāo)商品。

也就是說：上述三種類型的流量對于搜索功能的需求是依次減弱的。

搜索入口設(shè)計的合理性是充分發(fā)揮搜索功能的第一步，也是其中的關(guān)鍵一步。

入口設(shè)計方案應(yīng)當(dāng)能充分滿足用戶“在需要搜索時能馬上進行搜索”的需求，從而縮短用戶從產(chǎn)生搜索需求到開始搜索的操作成本，讓用戶的搜索需求更好的轉(zhuǎn)化為一次次搜索行為。

首先，針對“用戶在需要搜索時能馬上進行搜索”這一需求，我們可以看一下常見的生鮮電商APP搜索入口位置和形式的設(shè)計方案；在生鮮電商APP中，最主要的搜索入口形式有輸入框和搜索圖標(biāo)2種。

通常，搜索輸入框通常會與周圍的背景顏色形成鮮明的對比，用戶很容易看到；而搜索圖標(biāo)的視覺效果則沒有那么明顯。

同時，搜索輸入框更明顯的代價是要比搜索圖標(biāo)占用更多的頁面空間（輸入框中的缺省關(guān)鍵詞的功能在一定程度上又充分利用了該空間）。

因此，在具體的頁面中，到底采用輸入框還是圖標(biāo)，通常需根據(jù)在該頁面中用戶使用搜索功能的頻率決定。

搜索入口經(jīng)常出現(xiàn)的位置包括：首頁Tab頂部、分類Tab頂部、分類型商品列表頁頂部、搜索結(jié)果型商品列表頂部。

通常在商品詳情頁、社區(qū)模塊、內(nèi)容/活動頁面、購物車頁、訂單頁、個人中心模塊等不設(shè)置搜索框或圖表形式的搜索入口。

盒馬APP搜索入口示意

京東7Fresh APP搜索入口示意

對比盒馬和7Fresh兩個APP的搜索入口位置和形式可以看出，兩款A(yù)PP的入口位置設(shè)計基本一致；

在入口形式上，首頁Tab頂部、搜索結(jié)果商品列表頁均采用了搜索輸入框的形式，在分類型商品列表頁均采用了搜索Icon的形式，且由此空余出的頂部空間作了一級類別切換的功能。

兩款A(yù)PP的入口形式區(qū)別在于分類Tab首頁，個人認為7Fresh的產(chǎn)品形式更實用主義一些，盒馬中顯示“分類”二字功能意義不大，完全可以去除將搜索Icon替換為搜索輸入框，提升搜索入口的突出程度。

生鮮電商APP搜索入口和形式設(shè)計的總體原則可以概括為：

• 用戶最可能產(chǎn)生搜索需求的頁面，設(shè)置輸入框型搜索入口；
• 用戶通過分類等形式進入具體的類別型商品列表頁，代表用戶的購買目標(biāo)逐漸明確，搜索需求也逐漸降低，因此搜索入口的突出性可以逐漸弱化，此時可以使用搜索Icon替代輸入框，從而節(jié)省出空間設(shè)置其他更有價值的功能；
• 當(dāng)用戶進入具體的商品詳情頁時，基本不會在該頁面產(chǎn)生搜索需求，因此無需設(shè)置搜索入口；但當(dāng)所瀏覽的商品無貨時，用戶通常需要進一步找替代商品，因此可以設(shè)計“找相似”功能作為一種特殊形式的、入口位置能自帶明確搜索信息的搜索入口，這通常是很有價值的；
• 在社區(qū)模塊雖然仍屬于用戶選擇商品的環(huán)節(jié)，但進入社區(qū)模塊的用戶通常是“逛街式、瀏覽式的閑逛”的狀態(tài)，此時用戶的購買目標(biāo)是非常不明確的，因此相對于搜索功能，用戶更需要的是具體的內(nèi)容和商品的推薦，此類頁面通常不設(shè)置搜索入口，及時設(shè)置搜索入口更大概率也是社區(qū)生態(tài)內(nèi)容的搜索，而不是商品的搜索。并且，在用戶進入具體的菜譜、活動頁面后，此時用戶的購買意向可能會逐步明確，似乎需要設(shè)置搜索入口，但大多數(shù)APP選擇的直接在內(nèi)容頁面中穿插所提及的商品卡片也不失為一種更精確的選擇。
• 購物車頁、訂單頁、個人中心模塊等頁面不屬于用戶使用APP的選購階段，通常無需設(shè)置搜索入口。

一句話總結(jié)：產(chǎn)生明確商品的購買意向的頻率越高的地方，越應(yīng)突出設(shè)置搜索入口。

2. 關(guān)鍵詞錄入

用戶進入搜索入口后，接下來通常需要輸入心中的搜索關(guān)鍵詞。

這看起來是一個非常簡單的操作步驟，但在實際的場景中這一簡單步驟也存在著很大的優(yōu)化空間。

要想直觀的感受這一點，你只需要拿出手機分別在盒馬鮮生和7Fresh中分別搜索“竹排”（實際上想搜索“豬排”），然后看一下搜索結(jié)果就能明白了。

關(guān)鍵詞錄入過程中用戶可能遇到的問題主要可以分為如下幾類：

• 不知道該搜索什么；
• 想搜索的關(guān)鍵詞比較長；
• 錄入出現(xiàn)偏差；
• 清除已有內(nèi)容重新錄入；
• 錄入完成后，觸發(fā)搜索行為；

下面將詳細介紹關(guān)鍵詞錄入相關(guān)的功能。

1）關(guān)鍵詞推薦

搜索框缺省詞

搜索輸入框的形式會比搜索圖標(biāo)占用更多的頁面空間，那是否能把搜索輸入框占用的頁面空間有效利用起來呢？

在搜索輸入框未激活的狀態(tài)下，這其實可以看做是頁面上的一個廣告位，把一種商品的名稱展示于此，就能像頁面上的其他元素一樣讓這種商品在用戶腦中一閃而過，這就產(chǎn)生了喚起用戶形成購買意向的可能。

這個喚醒率對于購買目標(biāo)不明確的用戶會更高，因此該功能在頁面上的搜索框的效果要比點擊頁面上的搜索Icon進入錄入激活狀態(tài)時的效果更好。

另一方面，如果該關(guān)鍵詞正好是用戶想要搜索的，即可省去用戶錄入關(guān)鍵詞的步驟，進一步縮短了用戶故事路徑。

搜索輸入框內(nèi)缺省詞的功能中還涉及到策略方面的產(chǎn)品設(shè)計，主要包括確定缺省關(guān)鍵詞的策略和關(guān)鍵詞的更新策略2方面。

首先，在輸入框中具體展示哪些關(guān)鍵詞，更多依賴于推薦策略產(chǎn)品的設(shè)計。常見的有熱門商品推薦、個性化猜你喜歡推薦、歷史搜索詞推薦，另外也有再次展示活動信息關(guān)鍵詞，作為活動入口之一的。

另外，關(guān)鍵詞的更新策略通常有2種形式：定時自動刷新和每次用戶觸發(fā)時刷新。定時自動刷新即定時輪換展示備選推薦詞組集合中的每個元素。用戶觸發(fā)時刷新即用戶每次退出搜索輸入框后，更新其中的缺省內(nèi)容。

搜索輸入框內(nèi)的另一方面應(yīng)用是展示搜索提示語，告訴用戶該搜索框中應(yīng)該輸入什么內(nèi)容。這在電商APP內(nèi)設(shè)計了非商品的搜索功能（如搜索訂單信息）時比較適用。

7Fresh訂單搜索

2）歷史搜索標(biāo)

歷史搜索標(biāo)簽通常出現(xiàn)在搜索錄入輔助頁（用戶點擊頁面上的搜索輸入框或搜索Icon后進入的錄入狀態(tài)的頁面），將用戶最近搜索過的關(guān)鍵詞以標(biāo)簽的形式呈現(xiàn)，當(dāng)用戶點擊時等同于輸入該關(guān)鍵詞 + 點擊搜索按鈕的效果，這在操作路徑上縮短了一步。

展示歷史搜索標(biāo)簽的業(yè)務(wù)邏輯主要是為滿足下述場景中的用戶需求：

用戶想買點菜做晚飯，于是邊想吃什么邊通過搜索功能先后進行了多次搜索，例如黃瓜、西紅柿、茄子、豆角；最終搜索到豆角并完成搜索結(jié)果的瀏覽后，通過綜合比較4種蔬菜的可選商品的價格，決定去買剛才西紅柿搜索結(jié)果中的某商品。

此時，用戶再次點擊觸發(fā)搜索錄入框，只需點擊“茄子”Lable即可快速找到想要的商品。

另外，用戶搜索過的商品通常代表了較強的購買意向，將這類商品Lable展示給用戶，也是一種具有較高喚醒率的購買意向召喚行為。

從盒馬APP的搜索輔助頁將歷史搜索放在實時熱搜和新品時令之上，也可以逆向猜測，從數(shù)據(jù)上看，推薦歷史搜索詞比推薦熱門商品、新品可能具有更高的點擊率。

另外，從圖中可以看出，歷史搜素詞推薦區(qū)同時配有一鍵清空按鈕，并且點擊后通常需要二次彈窗確認。

這能讓用戶在認為歷史搜索詞近期已經(jīng)不可能再次對歷史關(guān)鍵詞進行搜索時進行清空，從而為下方的推薦內(nèi)容騰出更好的展示空間。

更何況這種清空行為，對于一些用戶來說能帶來一種解壓的效果，是用戶所樂意做的。

盒馬-搜索輔助頁示意

3）實時熱搜標(biāo)簽

實時熱搜標(biāo)簽與歷史搜索標(biāo)簽的交互形式完全一致，不再重復(fù)。

進入搜索錄入頁的用戶不一定全部是已經(jīng)有了明確的購買目標(biāo)的用戶；用戶的購買意向和目標(biāo)明確程度通常是復(fù)雜的。

對于已經(jīng)有了明確購買目標(biāo)的用戶來說，充分利用搜索輔助頁的空間位置，將大家都在搜索的商品展示給用戶，會有一定的概率帶來額外的計劃外購買行為。

比如用戶A明確想買一箱啤酒，所有進入了搜索頁面，但這時候如果把“大家都在搜花生毛豆”的信息展示在用戶面前，是不是很可能激發(fā)用戶的一次計劃外購買行為呢。

對于進入了搜索頁面但同時購買意向不太明確的用戶來說，將大家都在搜索的商品展示給用戶；

一方面可以起到給用戶一些推薦的商品，幫助用戶降低選擇困難，至少是起到一些啟發(fā)的作用；

另一方面，推薦的商品本身也會有一定的轉(zhuǎn)化率。

這時，再像盒馬APP所做的那樣，配上一個刷新Icon，讓不知道該買些什么的用戶在搜索頁也能實現(xiàn)類似瀏覽大家都在買什么的體驗就更好了。

另外，盒馬APP上一個值得注意的做的很好細節(jié)，他將“豆皮”、“卷紙”的Lable分別打上了“火熱”和“真棒”的標(biāo)簽，能實現(xiàn)給用戶提供更明確的暗示信息的作用，從而更好的刺激用戶的購買意向。

4）新品推薦標(biāo)簽

盒馬APP中的新品時令屬于新品推薦標(biāo)簽，其交互方式、業(yè)務(wù)邏輯與實時熱搜標(biāo)簽基本一致。

只是實時熱搜的功能是向用戶說“大家都在買A，B商品，你要不要也看看呢”，新品推薦告訴你“這個季節(jié)比較適合吃C，D商品，你要不要來看看呢”和“最近有E，F(xiàn)新品，要不要來看看呢”。

另外，除了上述的推薦方案，常見的還有基于你歷史瀏覽、加購、購買記錄和其他用戶畫像信息的綜合個性化推薦方案。

無論哪種搜索關(guān)鍵詞推薦方案，均應(yīng)是通過對用戶行為的深入挖掘得到的，并應(yīng)制定科學(xué)的驗證方案經(jīng)過測試證實，再此不展開贅述。

3. 關(guān)聯(lián)信息提示

關(guān)聯(lián)信息提示指用戶在搜索輸入框中錄入了關(guān)鍵詞后，下方輔助區(qū)自動出現(xiàn)關(guān)聯(lián)推薦信息的功能。

如盒馬、京東、淘寶APP（7Fresh暫無該功能）的關(guān)聯(lián)信息提示功能如圖所示。

盒馬APP的關(guān)聯(lián)信息提示功能最為單一，點擊下方推薦的標(biāo)簽直接完成搜索。

京東APP除基本功能外，將關(guān)聯(lián)商品按類進行了匯總，采用為每類商品加標(biāo)簽的形式，可實現(xiàn)一步到位的搜索功能；這樣做推薦商品展示更高效，且能展示更多的商品。

另外，京東APP還在頂部設(shè)置了“店鋪搜索”的功能（淘寶APP將店鋪搜索的功能做到了搜索結(jié)果頁的“結(jié)果分類”卡片中）。

淘寶APP與京東APP的思路有些差異，支持點擊后方的“寫入”Icon，將當(dāng)前關(guān)鍵詞補全為Icon對應(yīng)的關(guān)鍵詞，支持用戶在此基礎(chǔ)上進一步編輯，這樣可以讓用戶實現(xiàn)多級的關(guān)鍵詞補全，這可能是處于淘寶的商品種類更加豐富的考慮。同時，該方案還能減少不必要的搜索觸發(fā)次數(shù)。

另外，關(guān)聯(lián)信息提示的每個詞條后面還可以給出該關(guān)鍵詞能得到的商品數(shù)量，為用戶提供更多的信息。

盒馬、京東、淘寶關(guān)聯(lián)信息提示功能對比

關(guān)聯(lián)信息提示的功能在用戶輸入了初始關(guān)鍵詞后，把后續(xù)用戶的輸入任務(wù)從填空題變成了選擇題，這無疑能讓用戶的“答題準(zhǔn)確率”（輸入準(zhǔn)確的關(guān)鍵詞完成搜索任務(wù)）更高，從而提高用戶購買效率和轉(zhuǎn)化率。

4. 錄入糾錯

錄入糾錯指用戶在搜索輸入框中錄入的關(guān)鍵詞因為存在錯誤，導(dǎo)致所錄入的內(nèi)容不是用戶真正想要搜索的內(nèi)容，系統(tǒng)自動推理用戶的搜索目標(biāo)顯示正確的搜索結(jié)果的功能。錄入糾錯功能可以在用戶錄入錯誤時不影響用戶搜索效率，從而降低用戶搜索成本。

常見的用戶錄入錯誤有2類：錯別字和拼音。

在搜索框內(nèi)輸入拼音“niupai”也能推薦出“牛排”的相關(guān)關(guān)鍵詞。

當(dāng)按“niupai”進行搜索時，自動給出“牛排”的搜索結(jié)果，并給出“仍然搜索niupai”的提示按鈕。

當(dāng)輸入了錯別字時（牛排寫成牛牌），可以看出顯示了“牛牌”的搜索結(jié)果，同時也給出了搜索“牛排”的提示。

盒馬APP錄入糾錯功能示意

5. 一鍵清除

一鍵清除功能較為簡單與常見，如上圖所示，在搜索輸入框后設(shè)置“清空”Icon，用戶點擊即可一鍵清空搜索框內(nèi)的內(nèi)容。

很多用戶不可能每次進入APP第一次使用搜索功能就找到滿意的商品，因此需要清空之前的關(guān)鍵詞重新錄入進行搜索，因此該功能在用戶通過搜索功能選購商品時幾乎是必須的，其價值無需展開贅述。

6. 搜索觸發(fā)

關(guān)鍵詞錄入完成后，需用戶給出“我已錄入完成”的信息，平臺進行搜索并返回搜索結(jié)果，我們將該動作稱為搜索觸發(fā)。

搜索觸發(fā)的形式通常有3種：

1. 點擊搜索按鈕觸發(fā)
2. 回車觸發(fā)
3. 實時觸發(fā)

從上方引用的示意圖可以看出，通常生鮮電商中會同時為用戶提供搜索按鈕觸發(fā)和回車觸發(fā)（軟鍵盤右下角搜索鍵）。

而實時觸發(fā)的功能用于觸發(fā)關(guān)聯(lián)信息提示的更新。毫無疑問，實時觸發(fā)會產(chǎn)生更多的搜索行為，給服務(wù)器帶來更大的壓力。另外，對搜索結(jié)果返回的時效性也有更高的要求。

個人認為，在搜索行為實時觸發(fā)方面，生鮮電商APP是有進一步優(yōu)化的空間的。對于生鮮電商平臺來說，與淘寶、京東等全品類電商平臺相比，商品數(shù)量要少很多，結(jié)合現(xiàn)在的搜索技術(shù)來看，實現(xiàn)搜索結(jié)果的實時更新在技術(shù)上應(yīng)該不存在問題。

之所以不采用實時顯示搜索結(jié)果商品的方式，更多是由于再用戶錄入關(guān)鍵詞的過程中，關(guān)聯(lián)信息提示比具體的商品是用戶更需要的。

但是，在一些場景中，特別是對標(biāo)準(zhǔn)化的產(chǎn)品，其實通過用戶一次性錄入的搜索關(guān)鍵詞已經(jīng)可以將用戶的購買目標(biāo)縮小到具體的1、2件商品了，此時完全可以不再給出關(guān)聯(lián)信息提示，而是給你出具體的1個或2個商品卡片。

四、結(jié)果展示

觸發(fā)搜索動作后，系統(tǒng)將向用戶返回搜索結(jié)果，供用戶從中選購商品。如何將搜索結(jié)果更好的展示在用戶面前就是在該環(huán)節(jié)產(chǎn)品經(jīng)歷需要考慮的問題。

這一部分主要的功能可以概括為4個方面：

1. 結(jié)果卡片設(shè)計
2. 篩選功能
3. 排序功能
4. 結(jié)果分類功能

該部分內(nèi)容較多，為控制篇幅，生鮮電商APP的搜索功能之結(jié)果展示相關(guān)的內(nèi)容將在下篇文章進行詳細介紹，敬請期待。

參考資料

盒馬 APP V4.21.1

7Fresh APP V3.1.7

一捆書-如何設(shè)計搜索功能的邏輯

王M崢-設(shè)計總結(jié)：實例解讀搜索功能設(shè)計

王迪-APP搜索功能詳解：搜索種類及應(yīng)用場景分析

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

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