日本a在线观看_久久久三区_久久99精品久久久久久国产越南_在线观看中文字幕av_国产精品久久久久久久久久东京_a免费视频

PS設(shè)計(jì)教程網(wǎng)歡迎你!

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧(2)

文章來源于 優(yōu)設(shè),感謝作者 曉吾設(shè)計(jì) 給我們帶來經(jīng)精彩的文章!
設(shè)計(jì)教程/前端設(shè)計(jì)/前端設(shè)計(jì)2019-03-31
使用搜索 從進(jìn)入搜索頁面開始,就需要查看頁面內(nèi)容,輸入搜索詞,點(diǎn)擊搜索,這是用戶使用搜索功能的完整過程。 1. 推薦內(nèi)容 從剛進(jìn)入搜索頁面,到在輸入框輸入文字這段時(shí)間是推薦最好的時(shí)機(jī),這會為目標(biāo)性不是非常

使用搜索

從進(jìn)入搜索頁面開始,就需要查看頁面內(nèi)容,輸入搜索詞,點(diǎn)擊搜索,這是用戶使用搜索功能的完整過程。

1. 推薦內(nèi)容

從剛進(jìn)入搜索頁面,到在輸入框輸入文字這段時(shí)間是推薦最好的時(shí)機(jī),這會為目標(biāo)性不是非常強(qiáng)的那部分用戶提供大量可看內(nèi)容。

上文已經(jīng)講過進(jìn)入搜索頁面的方式有3種:

在當(dāng)前頁面進(jìn)行搜索;

進(jìn)入新的頁面并拉起鍵盤;

先進(jìn)入一個(gè)推薦頁,再進(jìn)入搜索頁并拉起鍵盤。

第一種是沒有推薦內(nèi)容的。后面兩種頁面從上到下可以分為3部分:輸入框、熱搜詞、搜索歷史。

輸入框

輸入框文本一般為「請輸入搜索內(nèi)容」,進(jìn)入搜索頁面后光標(biāo)在搜索框起始位置并調(diào)用鍵盤,輸入內(nèi)容后搜索框會自動更新為輸入內(nèi)容。

還有一種方式是把「請輸入搜索內(nèi)容」替換為預(yù)設(shè)關(guān)鍵詞并定時(shí)更新,點(diǎn)擊搜索會直接搜索并展示搜索結(jié)果,這個(gè)過程也是引導(dǎo)的作用,與熱搜詞類似(如淘寶)。

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧

在此基礎(chǔ)上更進(jìn)一步,那就是在進(jìn)入搜索頁面后,直接搜索并展示輸入框關(guān)鍵詞的搜索結(jié)果,這種方式可以更快速地向用戶展示有針對性的運(yùn)營內(nèi)容,缺點(diǎn)是進(jìn)入搜索頁面即為結(jié)果顯示頁面,熱搜詞和搜索歷史等內(nèi)容就沒有空間可以顯示。

熱搜詞

熱搜詞是根據(jù)算法展示搜索次數(shù)最高的關(guān)鍵詞,對于進(jìn)入搜索頁面但沒有強(qiáng)目的的用戶來說,熱搜詞可以降低用戶思考成本,提高產(chǎn)品/內(nèi)容的查看次數(shù)。但是要注意熱搜詞的更新算法,熱搜詞本身就有引流的功能,如果單獨(dú)按照搜索次數(shù)來決定是否上熱搜,會出現(xiàn)熱搜詞榜非常穩(wěn)定的情況。

歷史搜索

歷史搜索可以方便用戶快速查找以前搜索的內(nèi)容,無需再次輸入,但是一定要注意保護(hù)用戶隱私,歷史搜索記錄需要支持刪除功能。另外搜索歷史的承載頁面通常會有兩種做法。對于第3種進(jìn)入搜索的方式,我們有兩個(gè)頁面可以用來承載搜索歷史。

再拿抖音舉例:搜索歷史后置在從搜索推薦頁再次點(diǎn)擊搜索框時(shí)出現(xiàn),也就是伴隨鍵盤出現(xiàn)。這樣比較符合正常邏輯,因?yàn)橛脩衾疰I盤目的就是進(jìn)行輸入操作,此時(shí)出現(xiàn)搜索歷史記錄一方面可以減少重復(fù)搜索的操作成本,另一方面也讓用戶有回憶連貫的感覺。畢竟它提醒了我上次用這個(gè) app 搜過什么內(nèi)容,當(dāng)時(shí)的感想是什么。

不過還有一個(gè)地方可以放,那就是第一次拉起的推薦頁,具體如何選擇也要看具體內(nèi)容。JOOX選擇放在這個(gè)頁面,這樣做的原因和好處在于真實(shí)的用戶數(shù)據(jù)進(jìn)入推薦頁的用戶一多半都是進(jìn)行點(diǎn)擊歷史記錄操作,放在第一個(gè)頁面無疑縮短了用戶重復(fù)搜索的路徑,提高了效率。

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧

2. 搜索方式

在輸入搜索內(nèi)容時(shí)關(guān)鍵詞匹配有兩種處理方式:一個(gè)是輸入過程匹配;另外一個(gè)是輸入完成匹配。

輸入過程匹配

在輸入時(shí),每輸入一個(gè)字符,就進(jìn)行一次匹配,同時(shí)更新頁面信息。這里更新的信息,可以是針對輸入內(nèi)容進(jìn)行推薦的信息,也可以是搜索結(jié)果。這種方式可以對搜索結(jié)果做出即時(shí)反饋,引導(dǎo)性強(qiáng),效率非常高,但是輸入過程匹配對于計(jì)算能力要求比較高,可以根據(jù)自己的產(chǎn)品和實(shí)際情況考慮是否需要此功能,否則需要加載等待,影響體驗(yàn)。

輸入完成匹配

僅在輸入完成后,點(diǎn)擊「搜索」按鈕時(shí),才開始進(jìn)行搜索、匹配,直接展示搜索結(jié)果。這種方式省去了對輸入時(shí)實(shí)時(shí)分析、引導(dǎo)的過程,適用于對搜索功能要求不高的情況。類似的產(chǎn)品如產(chǎn)品經(jīng)理App,輸入關(guān)鍵詞后不會做出反饋,需要執(zhí)行搜索才會展示相關(guān)內(nèi)容。

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧

很多產(chǎn)品采用組合的方式,即時(shí)匹配關(guān)鍵詞并展示出來,點(diǎn)擊關(guān)鍵詞或者「搜索」按鈕后再展示搜索內(nèi)容。類似的產(chǎn)品可以查看京東、天貓等電商App,除了對輸入內(nèi)容做聯(lián)想,還會展示出與關(guān)鍵詞相關(guān)的維度,自動補(bǔ)全關(guān)鍵詞,增加用戶的選擇。

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧

3. 搜索/取消按鈕

取消搜索的方式一般有點(diǎn)擊「取消」按鈕或者點(diǎn)擊「返回」按鈕。如果輸入框已經(jīng)輸入字符,需要重新輸入新的搜索詞時(shí),往往需要點(diǎn)擊鍵盤上的刪除按鈕回刪。當(dāng)輸入的內(nèi)容較長時(shí)這個(gè)過程的體驗(yàn)就非常差,所以現(xiàn)在有很多產(chǎn)品都在輸入框尾部提供了刪除功能,一鍵刪除輸入的字符。這種功能在搜索頁面需要進(jìn)行二次搜索或者輸入錯(cuò)誤時(shí),可以提供很好的體驗(yàn)。

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧

如果你細(xì)心研究不同的App,會發(fā)現(xiàn)搜索/取消按鈕大致分為兩種:一種是保留搜索按鈕;另一種是頁面上取消搜索按鈕,轉(zhuǎn)而使用鍵盤的搜索按鈕。

頁面保留搜索按鈕

搜索按鈕一般放置在搜索框的右側(cè),那么左側(cè)就一定會保留返回icon,這樣才能正常實(shí)現(xiàn)App的跳轉(zhuǎn)路徑。這種方式雖然比較規(guī)矩,同時(shí)減少輸入框可顯示的字符長度,但是用戶識別成本會降低很多,返回和搜索按鈕非常明確。

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧

頁面不保留搜索按鈕

頁面上沒有搜索按鈕,左側(cè)的返回按鈕也同時(shí)取消,點(diǎn)擊「取消」按鈕會返回上一個(gè)層級的頁面。

這種方式一般會使用即時(shí)匹配(過程匹配)的搜索方式,需要進(jìn)行搜索時(shí),通過鍵盤的搜索按鈕執(zhí)行搜索操作。好處在于搜索按鈕在右下角,符合手的操作習(xí)慣且在舒適操作區(qū)域,可以更快速地執(zhí)行搜索操作,但是取消按鈕無法明確返回邏輯,當(dāng)用戶需要退出搜索返回上一層級時(shí)需要進(jìn)行嘗試性地點(diǎn)擊「取消」按鈕。

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧

如果頁面上使用「搜索」按鈕,則一定要保留返回的功能。使用「取消」按鈕則會取消「返回」按鈕,否則功能冗余。

得到結(jié)果

搜索完成后,結(jié)果頁面會根據(jù)算法展示出相匹配的內(nèi)容,結(jié)果展示也有多種方式。對于繁雜的內(nèi)容,做好分類是很有必要的。一般來說,每個(gè)產(chǎn)品都有自己的分類方式,但歸結(jié)為兩大類:先分類再搜索和先搜索再分類。

1. 先分類再搜索

先分類再搜索有個(gè)很明顯的特征就是搜索目的明確,用戶已經(jīng)知道自己想要查找什么樣的內(nèi)容。

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧

比如:安居客這款產(chǎn)品,用戶在使用搜索功能時(shí),會非常明確的知道自己想要搜索的信息維度,所以先分類再搜索可以提高搜索準(zhǔn)確率,減少用戶搜索后篩選的成本。

2. 先搜索再分類

先搜索再分類則可以減少用戶使用搜索功能的成本,但是會增加對結(jié)果篩選的難度。一般的操作是系統(tǒng)根據(jù)搜索詞進(jìn)行算法匹配,把所有結(jié)果都展示出來,然后提供分類篩選的功能。

這種方式對于用戶無目的搜索的體驗(yàn)會更好,一般多見于電商、知識類等信息和分類明確的產(chǎn)品中。

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧

比如:知乎的搜索邏輯,就是先根據(jù)搜索詞匹配結(jié)果,展示所有信息,提供用戶、話題、私家課、Live等分類搜索切換。

搜索功能的其他思考

本文主要探討的是基于文字的搜索。除此之外其實(shí)還有,例如:語音搜索、圖片搜索、掃碼搜索,拍照搜索,拍照翻譯搜索等等。最近幾年,隨著語音技術(shù)的不斷成熟,語音搜索功能在音樂類APP上應(yīng)用越來越多,通過識別音樂來搜索音樂的相關(guān)內(nèi)容,部分音樂類app 還針對一些場合做了些語音搜索上的優(yōu)化,比如聽歌識曲、哼歌識曲,提高了用戶搜索內(nèi)容的效率。

如今,我們看到搜索的效率、體驗(yàn)設(shè)計(jì)都在不斷發(fā)生著變化,隨著AI技術(shù)的應(yīng)用,搜索答案的準(zhǔn)確性和相關(guān)性必將得到大幅提升。搜索互動性、個(gè)性化也會得到逐步提高。

歡迎關(guān)注作者的微信公眾號:「曉吾設(shè)計(jì)」

詳細(xì)解析UI設(shè)計(jì)中搜索欄設(shè)計(jì)的技巧

版權(quán)所有PS設(shè)計(jì)教程網(wǎng)公安備案:蘇公網(wǎng)安備 32058302001023號工信部備案:滬ICP備09005587號
aaa
主站蜘蛛池模板: 成人爱爱电影 | 国产精选久久 | 欧美 日韩 国产 成人 | 91看片成人 | 天堂在线资源av | 国产午夜精品在线 | 99综合视频 | 亚洲性在线视频 | 精品少妇v888av | 精国品产一区二区三区有限公司 | 毛片在线播放视频 | 精品国内视频 | 欧美人一级淫片a免费播放 久久久久久久久91 国产99久久久久久免费看 | 九九热在线视频免费观看 | 九九视频精品在线观看 | 欧美日韩专区国产精品 | 久久久久久久免费视频 | 欧美一级黄色片免费观看 | 久久亚洲精选 | 欧美日韩免费观看视频 | av最新在线 | 欧美精品一区二区中文字幕 | 色a综合 | 久久国产成人午夜av浪潮 | 深夜视频在线 | 久久最新网址 | 精品久久久久久久久久久久久 | 国产真实孩交 | 国产午夜精品理论片a级探花 | 国产精品美女久久久久久不卡 | 中文字幕在线永久视频 | 亚洲成人第一页 | 国产精品久久久久久久久久iiiii | 日本中文字幕电影在线观看 | 少妇的肉体的满足毛片 | 欧美一级高潮片免费的 | 久草手机视频在线观看 | 国产免费观看视频 | 看免费的毛片 | 国产乱淫av | 久久99国产精品免费网站 |