本文作者對目前市面上4款主流產(chǎn)品的搜索界面進行了拆解分析，對其背后的設計思路和設計邏輯進行了總結。

搜索是用戶通過輸入關鍵詞，檢索到想要的信息。

搜索功能對于一個產(chǎn)品，存在的意義就是幫助用戶快速從龐大信息中找到想要的信息。

隨著搜索功能的不斷迭代，大部分產(chǎn)品在用戶搜索的過程會做一些推薦和提供歷史搜索功能，給用戶在搜索過程中提供更快觸達到想要的結果。

本節(jié)主要通過4個產(chǎn)品來看看目前市面上主流產(chǎn)品在做搜索的不同思路和設計邏輯。4個產(chǎn)品如下所示：

1. 淘寶
2. 微信
3. 知乎
4. 愛奇藝

01 淘寶

對于淘寶這樣的購物平臺而言，幾乎一半以上訂單的購買是基于搜索。

用戶使用淘寶購買的場景很多，有的是無目的閑逛，看到心儀的產(chǎn)品，完成購買，有的是基于之前的購物車和收藏完成購買。剩下的基本是基于搜索，找到便宜的店鋪完成購買。搜索前

搜索位于淘寶首頁狀態(tài)欄之下，幾乎占據(jù)淘寶首頁最核心的位置?？赡苁菫榱藦娀阉鞴δ埽钚掳姹镜奶詫?，將搜索按鈕展示出來，估計是為了強化搜索這個功能，引導用戶使用搜索，畢竟搜索太核心、太重要了。

淘寶首頁的視覺搶點太多了，首頁每個小模塊都做的特別搶眼，重視覺，這也導致首頁反而沒重點了。

搜索欄左側有掃一掃入口，搜索欄里面還有一個掃一掃的入口，兩個入口，同時里面的功能不一樣，對于小白用戶難以理解其中的邏輯和區(qū)別，應該可以整合在一個入口。用戶點擊搜索框里面的相機圖標，進入掃一掃界面，掃一掃默認識別實物，這也是目前ai技術的一個體現(xiàn)。

搜索中

當用戶激活輸入框時，新頁面浮現(xiàn)。新頁面中包含三個模塊，分別為歷史搜索、搜索發(fā)現(xiàn)和全網(wǎng)熱榜。

歷史記錄是基于搜索過的歷史關鍵詞。有時候用戶經(jīng)常去看一款產(chǎn)品，并查看價格變化。所以歷史記錄可以減少用戶的輸入，提升搜索效率。搜索發(fā)現(xiàn)是基于搜索記錄，系統(tǒng)推薦類似的產(chǎn)品，幫用戶購買做出推薦。

全網(wǎng)熱榜是將目前淘寶平臺熱賣的排榜，展示給用戶，讓用戶了解目前淘寶大家都在購買什么。

搜索中/后

搜索過程中，系統(tǒng)會針對搜索詞，做出關聯(lián)詞聯(lián)想匹配，用戶可根據(jù)匹配的關鍵詞選擇，快速達到結果頁，減少搜索時間，提升搜索效率。

用戶點擊聯(lián)想匹配項目，或點擊鍵盤上的搜索，達到結果頁。

用戶點擊取消，回到上一級頁面。

02 微信

作為全民App，微信的搜索具有參考價值。微信iOS版本，默認搜索框展示出現(xiàn)。PS：iOS原生默認搜索欄不展示，下拉展示。

激活輸入框，進入搜索頁面，鍵盤調(diào)出，用戶可直接輸入。用戶點擊取消，回到上一級頁面。

微信是為數(shù)不多的將搜索范圍前置，而其他的app大部分是將搜索范圍后置。即搜索出現(xiàn)結果，通過tab展示不同的搜索結果，例如b站。

為什么微信將搜索范圍前置呢？我在網(wǎng)上找到了比較靠譜的回答，以下是來自純銀社群Tony的回答：

針對這個問題的答案是：微信目前沒有能力去做全搜索結果的后置分類。

這里的“沒有能力”是個中性詞，因為和網(wǎng)頁這種格式化標準化的內(nèi)容組織形式不一樣，微信內(nèi)部的內(nèi)容格式高度不統(tǒng)一，難以統(tǒng)一搜索。

比如現(xiàn)在微信的搜索結果是有分類的，分類是1，最常使用；2，聯(lián)系人；3，群聊；4，公眾號；5，聊天記錄；6，收藏；7，內(nèi)容搜索（搜一搜）。其中有可能還插入一個“游戲類別”。同時前置也有分類，分別是“朋友圈”，“文章”，“表情”，“小說”，“音樂”，“表情”。

可以看到這些分類對應的內(nèi)容可能是通訊錄的聯(lián)系人，可能是群聊名稱，也可能是公眾號名稱等等。這些格式不統(tǒng)一的內(nèi)容之間，缺乏一種像網(wǎng)頁pagerank，社交媒體feed的edgerank的排名算法，這在技術上就形成了很大的挑戰(zhàn)，微信很可能“沒有能力”。因為內(nèi)容形式不統(tǒng)一，就很難用同一個標準算法衡量每種內(nèi)容的權重，即使是淘寶的商品，因為統(tǒng)一是商品，所以基于“好評”“購買量”“價格”等特征來做rank的技術挑戰(zhàn)也比微信要在“聯(lián)系人”“群聊”“公眾號”“朋友圈”“表情”這些紛雜的內(nèi)容形態(tài)之間做rank要簡單的多。

簡單說，如果只搜聯(lián)系人，微信能做排名；只搜朋友圈，微信也能做排名；但是揉在一起，微信就不知道怎么做排名了：聯(lián)系人應該排第一欄還是朋友圈內(nèi)容應該排第一欄，或者說是表情包應該排第一欄？這個結論如何得出？

因為微信沒有能力做這些不同格式內(nèi)容的搜索排名，或者說控制不了把多種不同格式內(nèi)容糅合在一起進行搜索的用戶體驗。他只能采取“后置分類傾向于IM產(chǎn)品的應用內(nèi)搜索，如聯(lián)系人，群聊，公眾號”，“前置分類傾向于內(nèi)容分類搜索，如表情，小說，音樂”。來達到一個雖然不如google百度這樣流暢自然，但足夠可控的，比較穩(wěn)定的搜索體驗。

微信搜索過程中，因為搜索內(nèi)容都是本地，所以采用即時搜索機制，這一過程中體驗很好，用戶不需要點擊鍵盤上的搜索按鈕，因為當前頁即代表結果頁。

微信搜索結果排序邏輯很復雜，以后可以單獨拿出一期來講微信搜索匹配邏輯。

03 知乎

作為一個信息流產(chǎn)品。使用知乎產(chǎn)品的大部分用戶是直接瀏覽知乎推薦的內(nèi)容。剩下的部分是通過知乎搜索找到想要的答案內(nèi)容。

知乎的搜索位置和其他產(chǎn)品一樣，位于首頁的狀態(tài)欄之下。

知乎和其他產(chǎn)品有些不同的是，直接將熱搜內(nèi)容顯示在搜索框中，通過輸入框的內(nèi)容吸引用戶，讓用戶產(chǎn)生興趣并激活輸入框進行搜索。但是激活搜索框之后，之前的信息提示語消失了，這點做的不夠好。

當激活搜索框時，進入新浮層頁面時，知乎依舊在強推熱搜內(nèi)容。搜索歷史放在了第二個模塊的位置。熱搜利用tab切換的方式來展示更多內(nèi)容。用戶通過點擊熱搜內(nèi)容時，搜索框將熱搜內(nèi)容的核心關鍵詞帶入搜索框進行搜索。

在搜索過程中，知乎會優(yōu)先展示匹配的話題。用戶點擊鍵盤上的搜索，會進入結果頁列表。結果頁列表也是以tab的形式展示不同的結果范圍。

04 愛奇藝

愛奇藝支持語音搜索，輸入框會置于搜索發(fā)現(xiàn)的資源詞，吸引用戶點擊搜索。進入搜索頁面，頁面展示含有兩塊內(nèi)容，一塊是搜索歷史，另一塊是搜索發(fā)現(xiàn)。愛奇藝的搜索設計和知乎很像。只是在側重點上有所區(qū)別，愛奇藝強化搜索歷史。

點擊搜索范圍，出現(xiàn)下拉選項，有三種篩選緯度。

搜索過程中出現(xiàn)聯(lián)想匹配。搜索結果按照電影或者電視劇的排序展示，并且包含主角百科、相關搜索、焦點資訊等。

總結

通過以上4個產(chǎn)品的對比，可以看出。如果想強化搜索功能，則可以像淘寶搜索那樣通過強化按鈕視覺去讓用戶知道，這里含有搜索功能。

進入搜索界面，可根據(jù)具體情況是否需要歷史搜索和推薦搜索，并根據(jù)產(chǎn)品的業(yè)務訴求，合理設計其布局。

結果頁可采用tab的形式進行搜索結果的篩選。

以上就是關于搜索的簡單解析。希望這篇文章可以對你有所幫助。

#專欄作家#

UX，人人都是產(chǎn)品經(jīng)理專欄作家。前美團點評高級交互設計師。微信公眾號：Echo的設計筆記，歡迎關注

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

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