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

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

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

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

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

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

01 淘寶

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

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

搜索位于淘寶首頁狀態欄之下，幾乎占據淘寶首頁最核心的位置?？赡苁菫榱藦娀阉鞴δ?，最新版本的淘寶，將搜索按鈕展示出來，估計是為了強化搜索這個功能，引導用戶使用搜索，畢竟搜索太核心、太重要了。

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

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

搜索中

當用戶激活輸入框時，新頁面浮現。新頁面中包含三個模塊，分別為歷史搜索、搜索發現和全網熱榜。

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

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

搜索中/后

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

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

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

02 微信

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

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

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

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

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

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

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

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

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

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

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

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

03 知乎

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

知乎的搜索位置和其他產品一樣，位于首頁的狀態欄之下。

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

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

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

04 愛奇藝

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

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

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

總結

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

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

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

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

#專欄作家#

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

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

題圖來自 Unsplash，基于 CC0 協議