發(fā)布時間:2024-04-13 19:58:41 瀏覽量:184次
編輯導(dǎo)語:在很多產(chǎn)品中,搜索都是其中比較基礎(chǔ)且很重要的一個功能,在很多時候我們都需要進(jìn)行搜索找到需要的東西,搜索的設(shè)計(jì)、邏輯、交互等問題也是需要特別注意的;本文作者分享了關(guān)于搜索功能的設(shè)計(jì)理解,我們一起來了解一下。
搜索功能是許多產(chǎn)品的核心,例如電商搜索、內(nèi)容搜索等等;面對如何進(jìn)行搜索功能設(shè)計(jì),確實(shí)是個看似簡單實(shí)則深奧的問題。
不管不顧,隨后畫一個條形框、正方體,他們就是搜索框和搜索圖標(biāo)就能代表一個搜索模塊;若要仔細(xì)研磨,各種用戶交互問題,各類邏輯,那他們也是一個搜索系統(tǒng);這一切都取決于你,產(chǎn)品設(shè)計(jì)師如何設(shè)計(jì)。
設(shè)計(jì)一個搜索功能我們需要從用戶體驗(yàn)和功能實(shí)現(xiàn)兩方面出發(fā):
由此我將分成搜索的設(shè)計(jì)和搜索的邏輯兩部分進(jìn)行說明。
先從可感知的樣式來說。我們按照用戶路徑地圖來理解用戶使用功能時的具體步驟:
用戶使用產(chǎn)品 – 有疑問需要搜索解決 – 看見搜索功能 – 點(diǎn)擊搜索功能(展開輸入框) – 輸入問題 – 點(diǎn)擊確認(rèn)等到結(jié)果反饋 – 翻閱搜索結(jié)果 – 選擇結(jié)果進(jìn)行查閱。
按照上述路徑,我們可以將用戶使用搜索功能的場景分為三部分:搜索前、搜索中、搜素后。同時根據(jù)應(yīng)用場景的不同,還需區(qū)分移動端和PC端。
首先,我需要申明我對于搜索核心的定義,那就是搜索功能核心在于解決用戶的疑問,給予用戶滿意的答案;因此我們在設(shè)計(jì)的時候,需要帶入場景假想我們就是用戶,我們在迫切需要解決問題的時候,我們會是什么樣的心里活,煩躁?渴望?又或是興奮?建立了同理心后才是功能的設(shè)計(jì)。
所以在搜索功能設(shè)計(jì)的時候,對面用戶迫切的心情,我們合理設(shè)計(jì)搜索功能。在用戶使用產(chǎn)品產(chǎn)生疑問的時候,我們要根據(jù)當(dāng)前場景進(jìn)行選擇放大、縮小搜索對于用戶的感官;在越容易產(chǎn)生疑問的地方選擇使用輸入框搜索作為設(shè)計(jì)方案,而在不容產(chǎn)生問題的地方還是可以選擇搜索圖標(biāo)作為解決方案。
這兩個解決方案是十分常見的,但我們需要注意,除開樣式的差異在選擇使用輸入框作為搜索樣式的時候,大多人都偏愛在輸入框上做文字引導(dǎo),這種文字引導(dǎo)有引導(dǎo)使用文案和推薦搜素文案兩種。
這樣做不是一定需要的,因?yàn)槲掖_實(shí)沒準(zhǔn)確的數(shù)據(jù)告訴你,做了和沒做在數(shù)據(jù)層次帶來的效果是什么。所以這是需要你自己自行選擇的。
用戶點(diǎn)擊搜索功能輸入問題這段時間,我們看作搜索中,在這里有兩種設(shè)計(jì)方式:分別是當(dāng)前頁面直接進(jìn)行搜索和進(jìn)入搜索獨(dú)立頁面。
其中,當(dāng)前頁面直接進(jìn)行搜索,在pc端較為常見,因?yàn)閜c頁面有大面積區(qū)域可使用,可以盡情展示內(nèi)容所以常見。
另外一種采用搜索獨(dú)立頁面在移動手機(jī)端常見,因受限于手機(jī)屏幕大小,在不跳轉(zhuǎn)頁面直接搜索的情況下我們可展示的內(nèi)容過于受限;而采用了新頁面承載搜索,那就可以提供更多的功能和內(nèi)容。
在這里我們可以通過后臺管理功能,盡情的增加熱門搜索的內(nèi)容。同時在用戶輸入內(nèi)容后,我們對輸入內(nèi)容進(jìn)行聯(lián)想展示,方便用戶選擇他想搜索的實(shí)際內(nèi)容,提高搜索的易用性和便捷性。
但是產(chǎn)品設(shè)計(jì)師們需要注意的是,聯(lián)想展示內(nèi)容不易過多,控制在7個詞條左右就行,過多詞條會干擾用戶閱讀;展示內(nèi)容需要有獨(dú)立一套邏輯支撐,需要明確告知研發(fā),為什么顯示這些內(nèi)容?這些內(nèi)容排序依據(jù)是什么等。(這里后面部分會介紹說明)
同理,從提高搜索的易用性和便捷性這個目的出發(fā),我們可以收錄用戶近期歷史搜索,以便用戶再次搜索相同問題;至于歷史記錄每次展示幾個,可參考7+-2法則控制數(shù)量。(一般人的短時記憶容量約為7個加減2個,即5–9之間,可以理解為7加減2個組塊。)
搜索結(jié)果的展示在移動端上一般是雙排和單排展示。雙排能夠展示更多的搜索結(jié)果。單排能對搜索結(jié)果展示更多的信息。
到這里基本對于搜索功能的原型就沒有問題,下面開始說說搜索功能的邏輯部分。
先說結(jié)論:看似簡單的搜索其實(shí)并不只是由簡單的sql(數(shù)據(jù)操作語言)進(jìn)行全數(shù)據(jù)庫搜索,里面還涉及對用戶搜索問題的、分詞、糾錯、預(yù)測、召回以及排序排序。
分詞很好理解,就是當(dāng)用戶輸入問題后,對輸入的文字進(jìn)行拆分,就叫分詞。分詞核心在于分詞法以及特性字詞典庫。
同時分詞也叫NLP(自然語言處理分析)算是AI人工智能的一個分支,畢竟你需要讓人工智能理解你說的是什么,學(xué)的是什么,不然就成人工智障了。那么搜索是按照什么方式進(jìn)行分詞的了?其實(shí)分詞的方式很像小時候查字典。
1)逐詞匹配
我們理解為一個人給你一句話,這時你需要將他們分成兩兩相對或三三相對的詞條,但是你并不知道如何那幾個相鄰的字能夠組成字條。那么索性你直接拿著這句話去翻新歡詞典,從頭到尾翻一次,發(fā)現(xiàn)沒有符合的時候,就刪除最后一個字,在去翻詞典。以至于將詞典中的所有詞按由長到短的順序在文章中逐字搜索,直至文章結(jié)束。
這種方式你可以想象下,如果是人是不是很崩潰。就算是電腦在進(jìn)行,因?yàn)樾枰貜?fù)的查詢,也會造成效率低下,等半天才分詞成功。
2)正向最大匹配法
最大正向匹配會按照我們的閱讀習(xí)慣,從左到右進(jìn)行匹配,而其中的最大的含義就是當(dāng)出現(xiàn)多個匹配詞條時,以字?jǐn)?shù)最多的詞條為準(zhǔn);比如匹配野生動物園這個詞條有兩個匹配,一個是野生動物圖案,另一個是動物園,那我們以野生動物園為最終匹配,按照這個思路我們再說明。
有個用戶搜索:“成都動物園在哪里”。
我們保留結(jié)果是“成都動物園”,隨后便去除“成都動物園”變成“在哪里”重新開始檢索;這樣根據(jù)我們的詞典進(jìn)行分詞,我們可以得到結(jié)果:“成都動物園”“在”“哪里”,這就是正向最大匹配
3)逆向最大匹配法
大致邏輯和正向匹配相同,唯一的區(qū)別在于它是從右到左,每次減去開頭的字。還是以“成都動物園在哪里”為例。
當(dāng)同樣的邏輯縮減到“在”后,還是沒有相對應(yīng)的詞典,那么將“在”也單獨(dú)剔出,開始檢索“成都動物園”。這樣第一次檢索就成功檢索出來,得到結(jié)果“哪里”“在”“成都動物園”這樣的分詞。因?yàn)槭欠聪蚱鋵?shí)結(jié)果和正向結(jié)果相同。
4)雙向匹配
這種匹配法是為了更加準(zhǔn)確的分詞出現(xiàn),把正向和反向兩種算法都切一遍,然后根據(jù)詞條顆粒度來進(jìn)行選擇。分詞的詞條越長越好,非詞典詞和單字詞越少越好的原則,選出這里面最合適的進(jìn)行匹配。例如:
詞意糾錯也是搜索里重要的一環(huán)節(jié),在搜索的時候,打錯字說錯話是很常見場景(語言搜索);并且因?yàn)槲淖趾驼Z言是情感交流的渠道,中文漢字會因?yàn)槁曊{(diào)的不同有著不同的含義,同時一詞多義,通假字等也是十分頭疼的事情。
這詞意糾錯也可以按照查字典來理解,只是查詢的字典是特殊字典里面的內(nèi)容包含了情感,拼音還有聲調(diào)相關(guān)的內(nèi)容。抽象點(diǎn)的描述,我們在看見“康帥傅”的時候大腦會把“康帥傅”自動糾錯成“康師傅”,這就有點(diǎn)自動糾錯的味道。
1)拼音糾錯
當(dāng)輸入的漢字存在錯誤時,系統(tǒng)需要及時聯(lián)系上下文進(jìn)行解析,可以將漢字轉(zhuǎn)換成拼音,通過同拼音進(jìn)行識別,比如“如何吧大象放入病象”,把他們未能分詞成功單獨(dú)留下的漢字轉(zhuǎn)化成拼音“如何”“ba”“大象”“放入”“bing”“xiang”在查詢字典進(jìn)行處理。
2)模型算法
這部分高于繁瑣,想了解的可自行搜索:SVM、Maxent等。
用戶使用搜索功能在于得到解答,所以我們需要理解用戶搜索內(nèi)容的含義;比如用戶搜索蘋果的時候,她搜索的是吃的蘋果還是蘋果手機(jī)了;一個吃一個用這兩個答案是風(fēng)馬牛不相及的,所以預(yù)測類目會對用戶搜索結(jié)果影響很大。
做類目預(yù)測有幾個方法:
1)人工配置
通過后端埋點(diǎn)日志搜集最近熱門的搜索詞,對這些搜索詞進(jìn)行指定配置,這樣就可以保證當(dāng)用戶搜索蘋果的時候出來的是蘋果手機(jī),而不是真的蘋果;這樣也是最簡單有效的方法,但麻煩在需要安排人長期維護(hù)。
2)類目相關(guān)性
通過對搜索詞進(jìn)行算法計(jì)算,從搜索詞的重要性、類目數(shù)、類目出現(xiàn)次數(shù)、搜索詞出現(xiàn)次數(shù)等進(jìn)行計(jì)算。
代表性tf-dc算法。
搜索結(jié)果的排序也是十分頭疼的事情,比如搜索蘋果手機(jī),出現(xiàn)的結(jié)果是10萬+條商品信息,那么誰排第一這就成了一個問題,因此我們要從權(quán)重出發(fā)進(jìn)行權(quán)重排序。(商品少也可以按照最新更新時間排序,哈哈看個人)。
作者:wcof,在努力做產(chǎn)品不做產(chǎn)品經(jīng)理的人;微信公眾號:Wcof(ID:wcofPM)
本文由 @Wcof 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)作者許可,禁止轉(zhuǎn)載
題圖來自Unsplash,基于CC0協(xié)議。
熱門資訊
1. iPhone6的UI設(shè)計(jì)尺寸規(guī)范,原來如此重要!
想要了解iPhone6界面設(shè)計(jì)的尺寸規(guī)范嗎?這里為您詳細(xì)介紹iPhone6的UI設(shè)計(jì)尺寸規(guī)范,包括界面尺寸、圖標(biāo)尺寸、可點(diǎn)擊高度規(guī)范、搜索欄高度規(guī)范以及界面元素之間的距離規(guī)范。
2. 12個絕佳的UI設(shè)計(jì)網(wǎng)站,助力你的創(chuàng)作之旅!
將為大家介紹12個絕佳的UI設(shè)計(jì)網(wǎng)站,這些網(wǎng)站不僅可以為你提供靈感,還可以幫助你學(xué)習(xí)新的技巧,助力你的創(chuàng)意之旅!dribbbleDribbble 是一個面向設(shè)計(jì)師的...
3. 移動端UI設(shè)計(jì)中常見的5種APP界面類型,你get到了嗎?
通過介紹移動端UI設(shè)計(jì)中的閃屏頁、引導(dǎo)頁、浮層引導(dǎo)頁、空白頁和首頁等5種APP界面類型,幫助大家更好地了解UI設(shè)計(jì)的基本知識
4. 10個免費(fèi)學(xué)習(xí)UI設(shè)計(jì)的網(wǎng)站 提升你的設(shè)計(jì)能力
怎樣可以提升你的UI設(shè)計(jì)能力!第一個:站酷站酷想必是設(shè)計(jì)師都知道的一個網(wǎng)站,里面不止有UI設(shè)計(jì)的資源,還有其他設(shè)計(jì)的,不如:平面設(shè)計(jì)、網(wǎng)頁設(shè)計(jì)、字體...
5. 移動端列表頁和表單頁設(shè)計(jì)秘訣:讓你的APP點(diǎn)擊率翻倍
在移動端設(shè)計(jì)中,列表頁和表單頁是不可或缺的部分。一個好的列表頁和表單頁設(shè)計(jì)能夠讓用戶輕松地獲取信息并產(chǎn)生點(diǎn)擊欲望,從而提高點(diǎn)擊率。本文將為你...
6. 推薦10本適合UI設(shè)計(jì)師看的書籍,輕松掌握技能!
對于想要提高自己的設(shè)計(jì)能力和創(chuàng)造力的小白和UI設(shè)計(jì)師來說,這本書是一個很好的選擇。4.《設(shè)計(jì)的覺醒》(IKKO TANAKA)推薦理由: 這本書是日本現(xiàn)代平面...
7. 零基礎(chǔ)學(xué)UI設(shè)計(jì)要多久?培訓(xùn)完能拿多少工資?
探索零基礎(chǔ)UI設(shè)計(jì)培訓(xùn)的時長與薪資前景。了解數(shù)字藝術(shù)教育領(lǐng)域的專業(yè)課程,以及培訓(xùn)后的職業(yè)發(fā)展機(jī)會。
8. 物聯(lián)網(wǎng)APP UI設(shè)計(jì):創(chuàng)造智能硬件領(lǐng)域的沉浸式體驗(yàn)
ui設(shè)計(jì)應(yīng)該讓用戶一目了然,能夠快速找到所需的信息和功能。在設(shè)計(jì)過程中,應(yīng)盡量使用簡潔的圖標(biāo)、文字和色彩,避免過多的視覺干擾。符合用戶習(xí)慣:ui設(shè)...
9. 武漢UI設(shè)計(jì)培訓(xùn)班費(fèi)用怎么樣?想學(xué)UI設(shè)計(jì)要多少錢?
想了解武漢UI設(shè)計(jì)培訓(xùn)班的費(fèi)用是多少嗎?不知道學(xué)UI設(shè)計(jì)要花多少錢?不妨看看這篇文章,了解UI設(shè)計(jì)培訓(xùn)班的學(xué)費(fèi)價格以及學(xué)習(xí)內(nèi)容。
10. 設(shè)計(jì)中的色彩心理學(xué):淺析中西方色彩的歷史演變與設(shè)計(jì)應(yīng)用
摘要:本文探討了色彩的歷史演變和設(shè)計(jì)應(yīng)用。通過對色彩在早期文明社會中的實(shí)用運(yùn)用、不同文化背景下色彩觀念的差異、色彩在設(shè)計(jì)中的重要性以及新興技...
最新文章
同學(xué)您好!