UI設(shè)計中如何設(shè)計出良好的搜索體驗

　　UI設(shè)計中如何設(shè)計出良好的搜索體驗?良好的搜索體驗可以改變或提升用戶的體驗。這是導(dǎo)航的重要部分，尤其是在內(nèi)容較多的網(wǎng)站和移動應(yīng)用中。但這是很好的設(shè)計如何不可見的一個很好的例子。盡管用戶希望搜索效果理想，但除非失敗，否則通常不會引起注意。下面AAA教育胡老師將會在本文中揭示有助于獲得良好搜索體驗的一些關(guān)鍵設(shè)計決策。
 

　　搜索從用戶開始查找項目開始，到找到所需內(nèi)容后結(jié)束。設(shè)計人員需要在考慮到所呈現(xiàn)內(nèi)容的類型以及用戶對此的需求的基礎(chǔ)上，盡可能高效，輕松地引導(dǎo)用戶完成每個步驟。
 

　　在本文中，將搜索流程分為以下4個主要步驟，并介紹了每個步驟的一些最佳做法和注意事項。
 

　　1. 啟動搜索
 

　　2. 輸入搜索輸入(關(guān)鍵字)
 

　　3. 查看搜索結(jié)果列表
 

　　4. 查看單個項目頁面
 

　　1.啟動搜索
 

　　作為用戶，可能感覺每個搜索欄都是相同的，但并不是那么簡單。設(shè)計師必須考慮搜索如何適合網(wǎng)站的更大導(dǎo)航體驗。盡管搜索無處不在，但它并不總是用戶瀏覽給定網(wǎng)站或應(yīng)用程序上內(nèi)容的最佳方式。例如，用戶經(jīng)常出現(xiàn)在諸如淘寶之類的電子商務(wù)網(wǎng)站上，以查找特定項目或項目類型。搜索是他們找到所需內(nèi)容的一種非常有效的方法。但是，在新聞?wù)军c上，用戶通常希望更不可預(yù)測地瀏覽內(nèi)容。這些用戶仍然可以使用搜索功能，但是設(shè)計人員可以引導(dǎo)他們采用更加適合網(wǎng)站內(nèi)容的大量瀏覽方法。搜索欄的突出位置應(yīng)引導(dǎo)用戶朝內(nèi)容的適當(dāng)導(dǎo)航風(fēng)格發(fā)展。
 

　　如何使搜索欄或多或少突出?研究表明，搜索欄的位置，對比度和大小均有助于頁面上搜索欄的突出。使搜索在整個應(yīng)用中(而不是僅在特定頁面上)可用是提高或降低其配置文件的另一種方法。第三個考慮因素，尤其是在移動設(shè)備上，是要顯示完整的搜索欄，還是僅顯示在點擊時會擴(kuò)展為搜索欄的搜索圖標(biāo)。所有這些決定都應(yīng)經(jīng)過精心設(shè)計，以匹配產(chǎn)品的內(nèi)容和用戶對如何導(dǎo)航的期望。
 

　　2.輸入搜索輸入
 

　　用戶啟動搜索后，設(shè)計人員需要幫助他們充分利用搜索條件。自動完成功能可以成為幫助用戶改善搜索關(guān)鍵字的強(qiáng)大工具。但是就像啟動搜索一樣，自動完成的設(shè)計要比實際需要多得多。自動完成建議通常分為三種類型：普通關(guān)鍵字，來自搜索歷史的關(guān)鍵字和范圍內(nèi)的搜索。范圍搜索是指您在初始搜索中應(yīng)用過濾器(或范圍)以將結(jié)果限制到網(wǎng)站的特定部分時。
 

　　研究表明，人們誤解了范圍搜索。他們很少意識到從一開始就將結(jié)果限制在特定類別上，因此，如果他們看不到所要查找的內(nèi)容，他們會認(rèn)為結(jié)果不在那兒。尼爾森·諾曼小組(Nielsen Norman Group)的研究還表明，“回想起來，與初次嘗試相比，用戶更可能更改搜索范圍”，因此應(yīng)將作用域和篩選推遲到以后。不過，自動完成功能應(yīng)包括建議的關(guān)鍵字和搜索歷史記錄，這些內(nèi)容可以引導(dǎo)用戶選擇更容易找到所需內(nèi)容的更好的搜索字詞。
 

　　只要有可能，自動完成建議還應(yīng)使用視覺提示來區(qū)分建議。例如，來自搜索歷史記錄的建議可以使用圖標(biāo)或文本來顯示，而粗體字體可以吸引人們注意建議的關(guān)鍵字之間的差異。任何包含的范圍或過濾器都應(yīng)通過使用對比的字體顏色，字體樣式或清晰的標(biāo)簽作為視覺提示來強(qiáng)調(diào)。
 

　　3.查看搜索結(jié)果
 

　　搜索結(jié)果頁面不僅需要向用戶顯示搜索結(jié)果，而且還允許他們根據(jù)需要輕松優(yōu)化搜索。一種簡便的方法是在結(jié)果頁頂部顯示帶有用戶搜索詞的搜索欄。這不僅使用戶想起了他們當(dāng)前的搜索，而且使輕松地快速運(yùn)行新搜索變得容易。
 

　　現(xiàn)在是時候讓示波器和過濾器大放異彩了。在此階段，過濾器為用戶提供了所需的控件，以準(zhǔn)確找到所需的內(nèi)容。搜索過濾器或過濾器圖標(biāo)應(yīng)突出顯示，并且過濾器應(yīng)與用戶需求相關(guān)。選擇后，應(yīng)用的過濾器應(yīng)始終可見并且易于取消或更改。
 

　　在移動搜索中，針對每個搜索過濾器的輸入法尤為重要。與任何時候用戶在移動設(shè)備上輸入數(shù)據(jù)一樣，為每個項目選擇最合適的輸入控件很重要。使用價格范圍的滑塊，切換兩個互斥的選項以及“選擇所有適用項”選項的復(fù)選框?qū)⑹勾诉^程盡可能的順利。預(yù)先填寫您可以使用的任何信息(例如位置信息)，也可以節(jié)省用戶的時間和精力。
 

　　4.查看項目頁面
 

　　用戶獲得一組相關(guān)的搜索結(jié)果后，他們可以深入研究每個結(jié)果以獲取更多信息。在此階段，他們的主要目標(biāo)是進(jìn)行比較和評估。
 

　　眾所周知，比較蘋果和橙子很困難，因此商品頁面需要具有一致的信息。無論是產(chǎn)品頁面，用戶個人資料，視頻內(nèi)容還是其他內(nèi)容，商品頁面上的信息都必須在所有商品之間保持一致。如果有些頁面沒有顯示成分和價格，而另一些頁面沒有顯示，您如何決定購買哪個呢?然而，Baymard Institute的這項研究表明，超過60%的電子商務(wù)網(wǎng)站并未在所有產(chǎn)品頁面上都列出相同的基本信息，這使用戶很難比較這些產(chǎn)品。
 

　　出于相同的原因，項目頁面應(yīng)該顯示相關(guān)信息，而減少關(guān)鍵信息。盡管有些用戶可能希望查看產(chǎn)品的完整規(guī)格表或有關(guān)電影的非常詳細(xì)的元數(shù)據(jù)，但大多數(shù)用戶都需要一些關(guān)鍵細(xì)節(jié)。以易于掃描的格式顯示最常需要的信息，使用戶可以快速評估項目的相關(guān)性，以便他們繼續(xù)前進(jìn)或繼續(xù)尋找。先進(jìn)的比較工具可以并排顯示幾個項目的關(guān)鍵信息，使查找合適的項目變得更加容易。