<kbd id="afajh"><form id="afajh"></form></kbd>
<strong id="afajh"><dl id="afajh"></dl></strong>
    <del id="afajh"><form id="afajh"></form></del>
        1. <th id="afajh"><progress id="afajh"></progress></th>
          <b id="afajh"><abbr id="afajh"></abbr></b>
          <th id="afajh"><progress id="afajh"></progress></th>

          一文秒會(huì)|搜索功能模塊設(shè)計(jì)

          共 3088字,需瀏覽 7分鐘

           ·

          2021-05-17 22:47




          這是Kevin的第 848 
          原創(chuàng),
          持續(xù)日更,做產(chǎn)品經(jīng)理的創(chuàng)業(yè)斜杠青年。




          用戶(hù)使用產(chǎn)品,享受功能服務(wù)前首先要學(xué)會(huì)在產(chǎn)品里學(xué)會(huì)如何獲取信息,而信息的獲取入口是搜索。新用戶(hù)是簡(jiǎn)單瀏覽和消費(fèi)內(nèi)容,而老用戶(hù)對(duì)搜索的需求會(huì)越來(lái)越高。

          一個(gè)用戶(hù)從剛接觸產(chǎn)品到頻繁的使用產(chǎn)品最終成為忠實(shí)用戶(hù)

          一個(gè)搜索功能分為前后端,復(fù)雜的搜索功能還有算法介入。由于搜索是用戶(hù)的集中必經(jīng)路徑,不少產(chǎn)品經(jīng)理都會(huì)把搜索當(dāng)作一個(gè)廣告轉(zhuǎn)化入口落地頁(yè)。

          如下是搜索功能背后的邏輯和用戶(hù)路徑。


            搜索功能邏輯 



          可以通過(guò)上圖看到,在不同的產(chǎn)品形態(tài)上,用戶(hù)在搜索功能展示的結(jié)果沒(méi)有區(qū)別。但操作、邏輯、功能復(fù)雜度是有區(qū)別。比如app和pc展示的信息數(shù)量就有非常大的區(qū)別,用戶(hù)操作也是十分不同,手指與移動(dòng)端的交互需要更加寬度區(qū)域,而鼠標(biāo)則可以進(jìn)入到區(qū)域小的面積進(jìn)行操作。

          拋開(kāi)產(chǎn)品形態(tài),產(chǎn)品經(jīng)理還需要抓住用戶(hù)搜索下的場(chǎng)景列舉,這里我會(huì)分4個(gè)部分來(lái)講解。只要一個(gè)搜索功能滿(mǎn)足了這4部分就算以一個(gè)簡(jiǎn)簡(jiǎn)單且實(shí)用的搜索功能。

          搜索功能的場(chǎng)景:

          用戶(hù)在搜索功能的使用中,會(huì)出現(xiàn)3個(gè)場(chǎng)景,搜索前、搜索中、搜索結(jié)果頁(yè)、搜索數(shù)據(jù)記錄4個(gè)緯度。分別對(duì)應(yīng)的是:提問(wèn)題、找答案、閱讀答案、系統(tǒng)記錄。


            搜索下的用戶(hù)場(chǎng)景 






          app、PC端的搜索前端設(shè)計(jì)




          以下在各個(gè)形態(tài)下如何完成簡(jiǎn)易設(shè)計(jì)。

          APP的前端設(shè)計(jì):

          在app里一個(gè)搜索也會(huì)有前面的3個(gè)場(chǎng)景。

          1.搜索前

          這個(gè)場(chǎng)景是解決用戶(hù)如何高效提問(wèn)、解決問(wèn)題的場(chǎng)景
          搜索入口是用戶(hù)訪問(wèn)搜索的關(guān)鍵,同時(shí)適當(dāng)給予用戶(hù)提供搜索關(guān)鍵詞引導(dǎo)。

          搜索入口分為:直接展示、功能布店、獨(dú)立tab、特殊類(lèi)型

          以下圖中 Amazon 為例。搜索功能以輸入框的形式直接展示在屏幕中。這是最為常見(jiàn)的一種設(shè)計(jì)方式,也是大型電商類(lèi)應(yīng)用通常會(huì)采用的形式。

          功能布點(diǎn),以下圖蝦米音樂(lè)為例。它與功能外露型類(lèi)似,只不過(guò)是將搜索功能弱化成了一個(gè) icon,點(diǎn)擊后才會(huì)展成搜索框。


          獨(dú)立 Tab,以下圖 Snapguide 為例。它是將搜索功能放得最重的一種形式,很多應(yīng)用會(huì)把它命名為 Discover 或 Explore。這個(gè) tab 除了包含基礎(chǔ)的搜索功能,還增加了很多運(yùn)營(yíng)的內(nèi)容在里面。


          特殊類(lèi)型,以下圖中 Airbnb 為例。搜索功能會(huì)作為一個(gè) icon 放在頁(yè)面中間,在 Android 的設(shè)計(jì)中經(jīng)常會(huì)作為 FAB 出現(xiàn)在屏幕右下角。



            4種搜索入口 




          如下案例在搜索功能直接提供了引導(dǎo)版塊,面對(duì)新用戶(hù)在搜索頁(yè)面可以增加toast引導(dǎo),或直接增加固定搜索導(dǎo)航欄,完成引導(dǎo)。


            搜索引導(dǎo)導(dǎo)航欄版塊 



            微博的搜索前引導(dǎo) 

          如果用戶(hù)有過(guò)歷史數(shù)據(jù),還能基于數(shù)據(jù)維度提供搜索引導(dǎo),增加用戶(hù)搜索轉(zhuǎn)化?;蛘哌\(yùn)營(yíng)推進(jìn)相關(guān)搜索關(guān)鍵詞

            基于用戶(hù)習(xí)慣的搜索關(guān)鍵詞 




          2.搜索中

          這個(gè)過(guò)程是為用戶(hù)快速匹配想要的具體內(nèi)容,減少用戶(hù)輸入的痛點(diǎn)


          搜索中是用戶(hù)正在輸入內(nèi)容場(chǎng)景,有的產(chǎn)品會(huì)提前在用戶(hù)輸入中場(chǎng)景下可以提前給與搜索結(jié)果展示。比如在百度搜索中,提前判斷出用戶(hù)需要的搜索結(jié)果,可以減少用戶(hù)查找內(nèi)容的時(shí)間成本,同時(shí)快速匹配系統(tǒng)中最合適搜索的答案。

          基于用戶(hù)實(shí)時(shí)輸入提供搜索結(jié)果,需要有數(shù)據(jù)、系統(tǒng)架構(gòu)支撐,不僅是產(chǎn)品經(jīng)理做產(chǎn)品設(shè)計(jì)的問(wèn)題,還有業(yè)務(wù)需要、用戶(hù)規(guī)模的要求。

            輸入中的用戶(hù)引導(dǎo) 



          在app里,有先天然的系統(tǒng)體驗(yàn)優(yōu)勢(shì),所以可以為用戶(hù)提供選擇單獨(dú)的搜索內(nèi)容輸入頁(yè)面;但搜索中到底是單獨(dú)切換一個(gè)頁(yè)面、還是直接在搜索輸入框中展示,實(shí)際上還是產(chǎn)品經(jīng)理需要根據(jù)用戶(hù)畫(huà)像、用戶(hù)需求來(lái)定。但在簡(jiǎn)易設(shè)計(jì)中,我建議不要糾結(jié),任意選一個(gè)方案就可以了,因?yàn)橹攸c(diǎn)是提供內(nèi)容查找的入口。


            搜索頁(yè)面和搜索輸入框 



          在搜索框輸入適合短的內(nèi)容搜索,在單獨(dú)的搜索頁(yè)面適合長(zhǎng)內(nèi)容搜索。

          3.搜索結(jié)果頁(yè)

          內(nèi)容篩選、重要信息展示成為這一環(huán)節(jié)產(chǎn)品設(shè)計(jì)的重中之重。比如搜索結(jié)果的排序、關(guān)鍵詞的匹配、同時(shí)搜索的內(nèi)容類(lèi)型分類(lèi)也是相當(dāng)重要的。

            搜索結(jié)果頁(yè)面 



          比如在搜狗、頭條app的搜索結(jié)果頁(yè)首先展示內(nèi)容分類(lèi)、再展示結(jié)果順序。同時(shí)結(jié)果里突出了匹配關(guān)鍵詞,方便用戶(hù)方便篩選搜搜索結(jié)果。

          搜索結(jié)果也要因?yàn)閮?nèi)容類(lèi)型做單獨(dú)設(shè)計(jì),比如視頻類(lèi)的搜索結(jié)果,如抖音的搜索結(jié)果頁(yè),會(huì)直接播放短視頻;在簡(jiǎn)書(shū)、知乎上的搜索結(jié)果頁(yè),基于文本內(nèi)容特點(diǎn)做搜索關(guān)鍵詞的匹配,再匹配內(nèi)容類(lèi)型。默認(rèn)優(yōu)先匹配全部?jī)?nèi)容類(lèi)型。

            視頻類(lèi)內(nèi)容搜索結(jié)果頁(yè) 



            簡(jiǎn)書(shū)、PMTalk搜索結(jié)果頁(yè) 





          在web端形態(tài)設(shè)計(jì)




          在web端搜索由于PC屏幕較大,在同樣搜索前、搜索中、搜索后3個(gè)場(chǎng)景下相比app就會(huì)有較大的不同。

          1.搜索前

          和app一樣,同樣目的是要增加搜索的點(diǎn)擊、轉(zhuǎn)化率,因此常見(jiàn)的產(chǎn)品設(shè)計(jì)方法是增加搜索引導(dǎo)。


            圖搜索引導(dǎo)設(shè)計(jì) 


          文案引導(dǎo)可以增加活動(dòng)文案、以及曝光搜索內(nèi)容優(yōu)勢(shì),來(lái)顯示活動(dòng)。

          2.搜索中

          PC端有足夠大的操作展示區(qū)域,可以在搜索框直接展示搜索內(nèi)容的答案即可。如果有數(shù)據(jù)、系統(tǒng)架構(gòu)支持可以展示實(shí)時(shí)結(jié)果。

          和app一樣,搜索需要突出搜索中的交互狀態(tài),包括按鈕點(diǎn)擊、內(nèi)容輸入、內(nèi)容為空的狀態(tài)。

          3.搜索結(jié)果頁(yè)

          搜索結(jié)果頁(yè)仍然是以展示重要內(nèi)容、信息篩選快速、內(nèi)容展示簡(jiǎn)單。PC因?yàn)槊娣e大,可以展示的結(jié)果數(shù)量相比app多;但沒(méi)有結(jié)果時(shí)候頁(yè)面體驗(yàn)也要更差,需要產(chǎn)品經(jīng)理設(shè)計(jì)。

          4.數(shù)據(jù)采集

          做搜索功能還是要做埋點(diǎn),方便做搜索的數(shù)據(jù)迭代需求。同時(shí)我建議在產(chǎn)品邏輯上,建立每一次搜索都要采集用戶(hù)數(shù)據(jù)ID的機(jī)制,比如要在搜索前建立用戶(hù)登錄注冊(cè)條件判斷,用戶(hù)登錄后才能使用搜索功能


            搜索背后的數(shù)據(jù)關(guān)聯(lián)設(shè)計(jì) 



          搜索系統(tǒng)有詞典和內(nèi)容索引庫(kù)(數(shù)據(jù)庫(kù)),詞典里的詞關(guān)聯(lián)匹配內(nèi)容索引庫(kù)。當(dāng)用戶(hù)輸入關(guān)鍵詞后,如果詞典里有這個(gè)詞,線上會(huì)快速召回內(nèi)容文檔。如果詞典里沒(méi)有這個(gè)詞,那這次的搜索行為就沒(méi)有結(jié)果。
          假設(shè)內(nèi)容索引庫(kù)一共只有3個(gè)內(nèi)容文檔,分別是:
          • doc1:站內(nèi)搜索從0到1全流程設(shè)計(jì)

          • doc2:搜索應(yīng)該怎么設(shè)計(jì)才是對(duì)的

          • doc3:產(chǎn)品小白怎么入門(mén)站內(nèi)搜索設(shè)計(jì)

          用戶(hù)輸入關(guān)鍵詞“怎么設(shè)計(jì)站內(nèi)的搜索”,經(jīng)過(guò)分詞后,詞典里有這個(gè)詞,系統(tǒng)會(huì)召回對(duì)應(yīng)的索引文檔。索引庫(kù)如下圖所示。


            搜索結(jié)果背后的數(shù)據(jù) 



          同時(shí)用戶(hù)每次輸入的關(guān)鍵詞做高頻詞記錄,詞語(yǔ)范圍、違規(guī)詞處理都是可以利用后臺(tái)來(lái)采集。

          搜索頁(yè)面的點(diǎn)擊、停留時(shí)間、訪問(wèn)次數(shù),同時(shí)需要統(tǒng)計(jì),如果在搜索中增加了第三方廣告位那么搜索還需要打通業(yè)務(wù)轉(zhuǎn)化。

          漏斗圖、時(shí)間柱狀圖展示數(shù)據(jù)可視化,觀察用戶(hù)使用搜索功能的規(guī)律以及喜好再優(yōu)化搜索功能。

          以上就是今天的分享。





          每天體驗(yàn)1款app知識(shí)星球




          我創(chuàng)建了一個(gè)《每天體驗(yàn)1款app》知識(shí)星球,有超過(guò)20個(gè)行業(yè)嘉賓在圈子里。加入后365天,每天體驗(yàn)一款A(yù)PP。提升產(chǎn)品設(shè)計(jì)能力,同時(shí)有1500份體驗(yàn)報(bào)告幫助你找到競(jìng)品。



          平均1天1塊錢(qián),掃碼購(gòu)買(mǎi)即可加入


          連續(xù)體驗(yàn)90款應(yīng)用,通過(guò)后原路退回






          瀏覽 41
          點(diǎn)贊
          評(píng)論
          收藏
          分享

          手機(jī)掃一掃分享

          分享
          舉報(bào)
          評(píng)論
          圖片
          表情
          推薦
          點(diǎn)贊
          評(píng)論
          收藏
          分享

          手機(jī)掃一掃分享

          分享
          舉報(bào)
          <kbd id="afajh"><form id="afajh"></form></kbd>
          <strong id="afajh"><dl id="afajh"></dl></strong>
            <del id="afajh"><form id="afajh"></form></del>
                1. <th id="afajh"><progress id="afajh"></progress></th>
                  <b id="afajh"><abbr id="afajh"></abbr></b>
                  <th id="afajh"><progress id="afajh"></progress></th>
                  99热这里有精品 | 天天爽夜夜爽一区二区三区 | 91美女在线观看 | 伊人五月在线 | 九九九成人 |