搜索框是一個常見的交互控件,在各種網站上,在各種App上都會有一個搜索框,或者放大鏡的圖標提示著用戶,我們的產品給大家提供了搜索功能,大家可以輸入關鍵字來找到自己想要的信息。
最近小編在公司參與了一款產品的搜索功能設計,在參與過程中也學到了一些關于搜索功能的知識,在這里想給大家分享一下我的學習成果,和大家交流一下搜索功能設計的相關知識
用戶在使用搜索功能時,大致會按照以下行為路徑:發現入口——進入——使用——得到結果。接下來的整篇文章都會圍繞這行為路徑來進行分享。
目錄
1、搜索用戶畫像
2、搜索框入口
3、進入搜索
4、使用搜索
5、搜索結果呈現
6、總結
一、搜索用戶畫像
搜索功能的用戶大致可以分為三種
第一種:有明確的需求,并且知道自己想要什么;比如小明是一名比較理性的消費者,平時有需要的時候才會打開京東買自己想要添置的電子產品,這時候當他打開京東時,就會很明確的知道自己這次想要購買的是一臺電腦,然后他就會在搜索框中輸入電腦然后點擊搜索,此時他的搜索需求大,搜索結果精確度也高
第二種:需求并不怎么明確,知道自己大概想要什么,比如小泉是一名互聯網公司的產品助理,每到中午晚上的時候他都會點開餓了么或者美團等外賣App來訂餐,今天想要吃清淡點時會在搜索框輸入清淡,得到的結果可能是粥店,粉店等;想要吃辣時就會輸入麻辣關鍵詞,得到的結果可能是麻辣香鍋,麻辣小龍蝦等各種麻辣的菜。此時小泉的搜索需求還是有的,只不過比第一種的小明會低一點,準確度也會沒有那么高,因為清淡和麻辣包含的范圍比較大。
第三種:需求不明確,并不知道自己想要什么,只是進來隨便逛逛。小華是一名大二的學生,平時無聊的時候會打開淘寶來看看,如果看到合適的就會購買,沒有合適的也沒有關系,因為她只是進來打發時間的,此時小華的搜索需求可以說是沒有,進入淘寶后可能會隨便點。
二、搜索的入口
搜索框的位置對于內容搜索高頻的App來說十分重要,比如外賣的美團,餓了么;購物的淘寶,京東這種電商類似App,用戶對于搜索功能的依賴性會比較高,所以搜索的位置一般會放在首頁的頂部,如果手機屏幕往下滑,搜索框的位置會常置頂,這樣會方便用戶想搜索的時候就能隨時找到搜索框,一定程度上會提高搜索的效率和增加訂單交易的成功率。
從上面的4張截圖可以看出,搜索框的位置都是放在首頁的頂部,但是京東和淘寶的搜索框由于底色與搜索框的色差較大,所以比餓了么和大眾點評要顯眼得多。之前有看過一些關于搜索框設計的文章,其中有提到根據用戶搜索需求強度得不同,可以把背景與搜索框的色差變大,或者變小。我覺得這個觀點有一定的道理,但是也有可能是因為App的設計風格剛好是淺色,所以沒有與搜索框形成較為明顯的色差,但是他的用戶需求程度也是比較高的。
除了搜索框為發現入口以外,還有一些App的搜索入口是以放大鏡icon在右上角表示搜索頁面的入口,這時就弱化了搜索搜索功能為icon,這種入口搜索效率會比常置頂首頁的低一點,也沒有前者顯眼。
三、進入搜索
在使用搜索功能之前,按照正常的路徑應該是發現,然后點擊進入搜索功能。目前小編發現進入搜索功能的方法主要分為兩種,第一種是在當前的頁面進行搜索輸入的操作,這只情況小編發現出現pc網站的情況會比較多,另外一種則是進入一個新的頁面進行搜索,進入新頁面的時候會拉起手機鍵盤或者再次點擊搜索框再拉起鍵盤。
四、使用搜索功能
1、進入搜索頁面時鍵盤拉起
由上圖可以看出,在人人視頻App中,當我們進入搜索頁的時候,鍵盤是沒有自動拉起的,而飛豬和百果園則會自動的拉起手機鍵盤給我們使用。
首先我們來看看自動拉起鍵盤,當我們進入首頁時,鍵盤自動拉起會減少用戶進行搜索的操作步驟,一定程度上提高了搜索的效率和用戶的體驗。另外我們也可以手動把鍵盤收起,收起的時候會發現屏幕的留白會比較多,所有就算鍵盤被自動拉起了也不會有很大的影響。
那么我們再來說鍵盤需要手動點擊搜索框才出現的情況,我們在人人視頻的截圖中可以看到,人人視頻中搜索頁面的信息比較多,大致如下:頂部banner的廣告位+搜索框+熱門搜索+歷史搜索+推薦。當鍵盤拉起時會擋住歷史搜索,部門熱門搜索的關鍵詞,一定程度上會影響用戶的操作體驗,以及會減少相關視頻的點擊率。更重要的是,在這種情況下用戶可以看到系統推薦的視頻,如果一進入搜索頁面就拉起鍵盤,那么大多數的用戶會不知道有推薦存在,可能搜索完之后就只看搜索結果,從而忽視了相關視頻的推薦,大大的降低了點擊率和播放量。
所以對于是否要主動拉起手機鍵盤,關鍵還是要看產品想在搜索頁面引導用戶去干什么,要具體問題具體分析,是單純的進來搜索還是搜索之余點擊相關的推薦信息來增加搜索量和點擊率。
2、搜索框內默認文本
相信大家在使用搜索功能的時候都都會發現在搜索框內會有默認的搜索關鍵字,有的可能是關鍵詞提示,有的可能是最近搜索量大的關鍵詞。那么這樣做會有什么好處呢,下面我們來看一下。
從上圖我們可以看出,騰訊視頻在影片類搜索框里提示用戶輸入片名、主演或者導演,這樣在一定程度會減少用戶使用這款產品的疑惑,因為如果沒有這些直接的關鍵詞提示,用戶可能會不知道原來輸入導演也可以找到自己要看的電視劇或電影,這樣的提示不僅提高了搜索的效率,還提高了搜索的準確度。
接下來我們再看看美團,美團的輸入框內的默認搜索詞會不斷的改變,當我們刷新頁面時,默認關鍵詞就會改變,這樣不斷更換熱度高的商品搜索詞一方面可以提高該商品的銷量,另一方也會起到宣傳的作用,假如我打開美團想要點個外賣,但跟很多人一樣不知道要吃什么,看到搜索框內提示的黃燜雞好像不錯,那為就會直接點擊搜索,然后訂黃燜雞的外賣。那么我這個訂單一定程度上是由關鍵詞的默認提示促成的,也發揮了美團外賣幫助用戶快速地點到外賣的作用,提高了產品的用戶粘性,解決了用戶的需求。、
總的來說,在搜索框內增加默認的文案提示,可以幫助需求用戶知道如何可以快速的找到自己
想要的結果,同時也告訴了用戶該產品能搜索到什么。如果在輸入框內缺少了這些默認的關鍵詞,那么有的用戶在搜索時就會產生迷惑,不知道輸入什么才會精準而快速的找到自己要看的電影,美食等,下一步就是因為功能交互體驗不佳而導致用戶流失,用戶留存率就會減少。外賣訂單的促成的幾率減少,商家的利潤也隨著下降。
3、歷史記錄和搜索詞推薦
由上圖可以看到,在搜索頁面內會有歷史搜索關鍵詞和熱門搜索關鍵詞,這兩種功能設計都可以幫助用戶快速進行搜索,減少重復輸入關鍵詞的步驟。另外,當用戶在熱門搜索中對了某個關鍵詞感興趣,就會點擊直接進行搜索,這樣就會很容易促成商品交易成功,或者提高視頻點擊播放率。從另外一個角度上看也給用戶提供了較好的用戶體驗,提高了產品的粘性。
4、搜索聯動提示
當我們有目的進行搜索時,會想用最少的操作就能找到目標。而聯動提示就是可以滿足這一需求的功能。我們首先來看看QQ瀏覽器,我在搜索框內輸入火影兩個字的時候,就已經觸發了搜索的操作,在下面會給我展現相關的搜索內容。第二個是一款叫nice的社交軟件,我在輸入框內輸入穿搭時,會有相關搜索詞提示給我,幫助我更準確的去進行搜索。當我在第三款產品的輸入框中輸入菜字,下面就給我提供了一系列的搜索關鍵詞。
以上三款產品在輸入關鍵詞后的交互設計無疑都給用戶節省了許多的時間,但是這個交互設計有需要注意的地方就是,提示給用戶的內容需要準確,比如說我輸入火影其實是想找火影人物介紹,輸入穿搭是想了解本季的穿搭。如果在提示上沒有做到用戶想要的結果時就不會給用戶帶來較好的用戶體驗,也不會給用戶有眼前一亮的感覺。所以做這個功能時,要盡量提高內容的關聯程度和內容準確度,提高用戶體驗和粘性。
五、搜索結果呈現
搜索結果呈現給用戶的方式有很多種,要考慮的因素也有很多。
比如外賣搜索,要考慮結果與用戶當前定位距離不能相差太遠,結果按距離近到遠排列,還有其他人氣,食物評價等次要考慮因素;
再比如電商類的搜索,假如用戶搜索某個商品時存在錯別字,那么是不是就返回無當前商品就呢,結果是否定的,就是用戶搜索詞有誤,無法匹配到任何商品,商家們也不能錯過任何能促成訂單的機會,那么這時候就會有兩種處理方法。
第一種就是增加容錯率,當用戶輸入的關鍵詞有錯別時,系統可以自動識別并且主動更正,然后再進行下一步的搜索。如下圖所示:
淘寶容錯搜索
當我在淘寶搜索框內輸入“庫子”時,系統會提示褲子的搜索結果,但是如果還是想要用回“庫子”進行搜索時,就可以點擊“庫子”進行搜索。這個容錯的功能可以防止出現暫無搜索結果的情況出現,因為有時候找不到搜索結果是因為用戶的操作有誤,當沒有什么耐心的用戶看到無結果時就會停止索,訂單的成交率就會下降。如果搜索的容錯率提高,自動幫用戶糾正個別可能是錯誤的詞語,然后再得出搜索結果,這樣會給用戶帶來一定的好感之余還能降低用戶的搜索成本。對于商家而言也能提高商品的點擊率和訂單量。
第二種就是提示用戶暫無結果,但是會推薦一些商品給用戶瀏覽。如下圖所示:
如果在搜索上沒有很好好容錯處理,那么在搜索結果頁中給用戶推薦商品頁是一個不錯的選擇
可以給用戶推薦人氣熱銷,新款商品等,當然如果是視頻類的App,可以給用戶推薦人氣視頻或者根據用戶近期的搜索路徑給用戶推薦結果。這樣也可以使用戶在找不到相關結果的頁面中得到可以瀏覽的東西,如果用戶對系統推薦的結果感興趣,那么就可以提高點擊率,用戶的搜索失敗心理也會得到緩和。如果頁面只是返回暫無搜索結果幾個字,那么用戶很可能會覺得當前App的商品/視頻存量太少而放棄使用,用戶體驗會變差,用戶粘性也會降低。到最后也會影響用戶的留存率。
六、總結
以上就是小編最近對搜索功能學習的內容,要做一個功能的交互設計需要考慮的地方特別多,作為一名產品白的我還有很多細節的地方需要繼續學習。比如拍照片識別,語音輸入搜索方式。
上就是主要內容,如有不足的地方請多多指教,也歡迎大家一起來討論。未經同意,禁止轉載!