設(shè)計搜索功能,注意7個交互細(xì)節(jié)
筆者將從多款成熟的產(chǎn)品中體驗(yàn)搜索功能,淺談幾點(diǎn)心得體會。
互聯(lián)網(wǎng)經(jīng)歷了從信息孤島至網(wǎng)絡(luò)發(fā)言權(quán)的解放,到現(xiàn)在解決海量信息在細(xì)化后的定向搜索和獲利機(jī)制的問題,個性化多元化的內(nèi)容成為互聯(lián)網(wǎng)的現(xiàn)狀。
搜索功能成為每個人獲取信息的交互方式,用戶對于搜索引擎的依賴逐漸增加,這是屬于搜索的時代。
本文將結(jié)合實(shí)例,介紹符合用戶體驗(yàn)的搜索功能應(yīng)具備哪些因素?未來智能化搜索功能有哪些趨勢?
以實(shí)際案例分析搜索功能,希望對你有幫助。
一、設(shè)計搜索功能的目的
獲取信息的便捷性:隨著智能手機(jī)普及和網(wǎng)絡(luò)響應(yīng)速度的提升,用戶從互聯(lián)網(wǎng)中獲取信息的途徑更加便捷。
解決搜索的低效率:完善搜索功能的目的是提高用戶獲取信息的交互效率,方便用戶從海量信息中精準(zhǔn)快速的找到相關(guān)內(nèi)容,解決用戶搜索效率低的痛點(diǎn)。
二、不合理的搜索案例
1. 案例
我打開某一個外賣APP,想找找附近有什么好吃的面食,找不到搜索功能,難道我需要從一堆米飯火鍋里找面食嗎?
我想去看電影,搜地圖的時候,搜索框太小了,點(diǎn)錯好幾次;好朋友推薦了一個視頻APP,搜索框沒有搜索提示,我搜“勵志”“愛情”的視頻類型呢?還是搜“耐克”“藍(lán)標(biāo)”公司品牌呢?
2. 問題
《設(shè)計心理學(xué)》講到:
“任何帶來不必要麻煩的東西都被冠以‘諾曼’這個名字。當(dāng)某種產(chǎn)品為‘諾曼門’,實(shí)際是承認(rèn)了該產(chǎn)品的制作者沒有關(guān)注用戶的需求,而這正是我要傳達(dá)的信息。”
雖然這些日常問題聽起來微不足道,但卻能夠影響你的心情:或者讓你心情愉悅,或是令你灰心喪氣。
三、合理的搜索具備哪些因素
1. 產(chǎn)品的需求程度與目標(biāo)用戶緊密關(guān)聯(lián)
不同的產(chǎn)品適用于不同的目標(biāo)用戶,此產(chǎn)品設(shè)計的所有功能都需要根據(jù)目標(biāo)人群定義,脫離目標(biāo)人群而設(shè)計產(chǎn)品功能相當(dāng)于閉門造車,對產(chǎn)品設(shè)計危害極大。
資深產(chǎn)品經(jīng)理梁寧講述經(jīng)典用戶畫像時,將用戶分為三種典型特征:大明、笨笨和小閑。
- 大明用戶對于自己的需求非常明確、非常清晰。比如:男人買襯衫和買3C產(chǎn)品就是典型的大明用戶,搜索需求程度最大,并要求高精準(zhǔn)度和高效率;
- 笨笨用戶的特征是——我有大概的需求,但是還沒有那么明確。比如:女生買裙子,得看和挑選。笨笨用戶需求程度中等,搜索精準(zhǔn)度要求不高;
- 小閑用戶沒有消費(fèi)需求,就是為了打發(fā)時間。比如:聊天,玩游戲或者看短視頻等。搜索需求量最小,搜索精準(zhǔn)度和效率要求最低。
2. 搜索框的位置
產(chǎn)品描述:打開產(chǎn)品首頁,搜索框位置統(tǒng)一放置在產(chǎn)品上方或右上角。
設(shè)計理由:根據(jù)目標(biāo)人群對于搜索需求程度分析,產(chǎn)品用戶搜索精準(zhǔn)度和效率需求程度高時,搜索框位置應(yīng)放置于產(chǎn)品上方,并以深色底做高反差對比,強(qiáng)調(diào)搜索框位置便于用戶使用搜索。
產(chǎn)品用戶搜索需求程度中等時,降低搜索框和底色反差對比,但搜索框的位置仍然保持在最上方,便于用戶尋找和搜索;
產(chǎn)品用戶搜索程度較低時,搜索功能弱化為icon,放置于右上角。
3. 搜索框的UI細(xì)節(jié)易于用戶理解和交互
產(chǎn)品描述:搜索框高度通常為50pt-30pt之間,同時使用“icon”替代“搜索”文字,搜索框右側(cè)放置語音或圖片識別的搜索icon;
設(shè)計理由:根據(jù)蘋果的《iPhone人機(jī)界面設(shè)計規(guī)范》,手指最小的點(diǎn)擊目標(biāo)尺寸是44 x 44像素。搜索框或搜索icon的交互區(qū)域應(yīng)大于44 x 44像素。遵循人們習(xí)慣從左到右的閱讀習(xí)慣,搜索icon放置于左側(cè),方便用戶查找。
4. 搜索框增加默認(rèn)文本
產(chǎn)品描述:美團(tuán)的默認(rèn)文本為用戶最近瀏覽或購買過的外賣飯店;高德地圖搜索框中的默認(rèn)文本是搜索框提供的主要功能;即刻搜索框的默認(rèn)文本是最近搜索熱詞。
設(shè)計理由:搜索功能默認(rèn)文本的作用是幫助產(chǎn)品為用戶解答能搜什么的問題。如果搜索框內(nèi)無提示語,那么用戶使用產(chǎn)品搜索時所產(chǎn)生的困惑和無助感極大可能使產(chǎn)品損失大量用戶。外搜索默認(rèn)文本的設(shè)計和產(chǎn)品目標(biāo)用戶應(yīng)提高關(guān)聯(lián)度,比如:
- 美團(tuán)外賣解決的痛點(diǎn)是幫助用戶又快又好的點(diǎn)外賣。每一位用戶都有自己的口味,那么通過分析用戶的使用記錄,結(jié)合大數(shù)據(jù)統(tǒng)計將搜索默認(rèn)文本展示為用戶經(jīng)常點(diǎn)擊的飯店名稱,可以提高用戶點(diǎn)餐效率;用戶又會覺得產(chǎn)品很懂自己的口味,達(dá)到提高用戶粘度的作用;
- 高德地圖解決的痛點(diǎn)是幫助用戶導(dǎo)航,到達(dá)目的地。那么搜索框的默認(rèn)文本簡單直接地提示用戶進(jìn)行搜索,功能效率最高;
- 即刻是興趣社區(qū),目標(biāo)用戶類型多為小閑用戶(使用產(chǎn)品的目的為打發(fā)時間),搜索框內(nèi)默認(rèn)文本為最近熱詞有助于用戶搜索,提高產(chǎn)品日活。
5. 搜索時留存歷史記錄和推薦搜索詞
產(chǎn)品描述:點(diǎn)擊搜索框保留歷史記錄;同時,頁面展示推薦搜索熱詞;
設(shè)計理由:點(diǎn)擊搜索框后,保留歷史記錄,幫助用戶在搜索同一內(nèi)容時快速查看,節(jié)省重復(fù)輸入的糟糕體驗(yàn);為用戶增加推薦搜索內(nèi)容,當(dāng)用戶準(zhǔn)備搜索關(guān)鍵詞時,無意中在產(chǎn)品推薦搜索內(nèi)容中找到感興趣的熱詞時,很容易激發(fā)用戶的點(diǎn)擊查看而提高產(chǎn)品相關(guān)熱詞或商品的點(diǎn)擊率和購買量。
6. 搜索提示
產(chǎn)品描述:用戶搜索時無需輸入完整內(nèi)容,搜索功能實(shí)時根據(jù)用戶搜索詞,展示相關(guān)搜索內(nèi)容供用戶選擇;
設(shè)計理由:效率為王的互聯(lián)網(wǎng)時代,為用戶節(jié)省時間可以極大的提高用戶好感度。此功能比較考驗(yàn)產(chǎn)品優(yōu)化搜索關(guān)聯(lián)的內(nèi)容,提高準(zhǔn)確率,準(zhǔn)確度越高用戶驚喜感越高。
7. 搜索容錯率
產(chǎn)品描述:搜索內(nèi)容出現(xiàn)錯別字,搜索時基本不會出現(xiàn)錯誤頁面,而是通過產(chǎn)品容錯率將用戶可能想搜索的內(nèi)容展示給用戶;
設(shè)計理由:搜索容錯率的最大作用是避免將“錯誤搜索”或“無搜索內(nèi)容”等負(fù)面狀態(tài)傳遞給用戶,造成用戶使用產(chǎn)品的挫敗,疑問甚至憤怒的負(fù)面情緒,從而流失用戶。
優(yōu)秀的搜索功能將具備搜索容錯率并提高容錯率準(zhǔn)確度,而更符合用戶體驗(yàn)的細(xì)節(jié)在于:如果用戶搜索的內(nèi)容是比較偏僻的生詞,如用戶搜索“外形人”,產(chǎn)品應(yīng)提示用戶“是否繼續(xù)搜索‘外形人’”選項(xiàng),賦予用戶選項(xiàng)的權(quán)利,可以提高用戶的好感度。
四、總結(jié)
1. 搜索功能的變化
如果你在百度搜索諸如“打雷”或是“成龍”等,就會很形象的出現(xiàn)打雷的聲音;成龍的個人簡介、興趣愛好、喜歡的顏色和相關(guān)人物推薦等等。又比如你上傳一張圖片至百度,就會自動統(tǒng)計與該圖片相關(guān)的信息或圖片來源。
2. 搜索交互的變化
用戶搜索已不僅僅局限于點(diǎn)擊搜索框、輸入文字點(diǎn)擊搜索,未來更多的趨勢已逐漸向語音,圖像甚至AR等智能化層面發(fā)展。
甚至,搜索行為會慢慢從主動變?yōu)楸粍樱寒a(chǎn)品通過去年一年的服裝購買行為數(shù)據(jù),推算出你今年同一季節(jié)可能需要購買的衣服類型,主動詢問你是否需要搜索;通過出行記錄,主動在下班時詢問你是否需要搜索交通路況;很快會出現(xiàn)和平臺無關(guān)的跨設(shè)備檢索和數(shù)據(jù)搜索方式,就像不同的手機(jī)應(yīng)用間可以同步共享聯(lián)系人信息。
3. 搜索未來的展望
無論未來智能搜索會發(fā)展到什么程度,搜索歸根到底仍然是和人交互的行為,而和人的交互就需要考慮到用戶體驗(yàn),搜索只是產(chǎn)品中很小的細(xì)節(jié),還有更多細(xì)節(jié)等待我們學(xué)習(xí)和思考。
本文由 @藍(lán)色彈珠? 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)作者許可,禁止轉(zhuǎn)載。
題圖來自 Unsplash,基于 CC0 協(xié)議
?? 請問文章怎么可以轉(zhuǎn)載呢?