|
這篇文章是我們?cè)谠O(shè)計(jì)解決方案以及我們?cè)谠驮O(shè)計(jì)時(shí)應(yīng)該考慮的元素清單之前,，應(yīng)該回答的問題集合。
問用戶有哪些問題,？原型開發(fā)時(shí)應(yīng)該考慮什么,？什么是界面搜索設(shè)計(jì)的最佳實(shí)踐?
根據(jù)不同項(xiàng)目，搜索可能是最復(fù)雜的功能之一,。用戶雖然僅看到一個(gè)盒子，但實(shí)際上在這個(gè)盒子背后有一個(gè)復(fù)雜的系統(tǒng),，設(shè)計(jì)師和開發(fā)人員有大量的工作,。 這篇文章是我們?cè)谠O(shè)計(jì)解決方案以及我們?cè)谠驮O(shè)計(jì)時(shí)應(yīng)該考慮的元素清單之前，應(yīng)該回答的問題集合,。 第1部分 觀察并提出問題 設(shè)計(jì)師在研究階段需要回答8個(gè)問題,，了解用戶搜索的原因,，他們何時(shí)以及如何形成搜索問題。 1. 你的用戶的信息需求和意圖是什么？ 他們是否搜索到： 1) 導(dǎo)航,，查找特定網(wǎng)頁。 2) 查找具體信息（“布拉格天氣”,，“澳大利亞首都”）,。 3) 尋求建議（“如何設(shè)計(jì)搜索界面”）。 4) 查找資源,、應(yīng)用程序及文檔,。 5) 查找事實(shí)，數(shù)據(jù)（“我們網(wǎng)站上有多少活躍用戶,？”）,。 6) 收集來自不同來源的信息。 7) 數(shù)據(jù)分析,。 2. 用戶在什么時(shí)候點(diǎn)擊搜索,？
1) 他們?cè)邳c(diǎn)擊搜索之前做了什么？ 2) 他們跟誰討論過,？ 3) 在切換到搜索之前他們用了哪些應(yīng)用程序,？ 3. 用戶如何形成搜索問題？ 搜索交互是一個(gè)對(duì)話過程,。如果你知道用戶如何開始對(duì)話,，便可以給他們正確的答案。
4. 用戶是否確切地知道他們所找的東西？或者他們僅是單純地瀏覽,？ 例如,，研究關(guān)于友誼的課題，尋找任何相關(guān)的書籍,?；蛘邔ふ乙槐咎囟ǖ臅Ｎ蚁Ｍ@兩個(gè)請(qǐng)求有不同的結(jié)果,。 5. 用戶期望找到什么,？ 1) 他們是否能描述期望的搜索結(jié)果是什么？ 2) 他們還能找到這些信息嗎,？ 6. 接下來的步驟是什么,？ 1) 他們對(duì)結(jié)果會(huì)做什么？ 2) 如果沒有找到他們正在尋找的東西,，用戶會(huì)怎么做,？ 3) 如何讓搜索適應(yīng)他們的工作流程？ 7. 用戶操作是否存在模式,？ 用戶行為中的模式描述了用戶如何進(jìn)行搜索交互,，他們所期望的結(jié)果及他們接下來的步驟。在重新設(shè)計(jì)現(xiàn)有界面時(shí),，模式是非常重要的,。 在《搜索模式》和《用戶界面搜索》中，作者描述了這些常見的搜索模式和模型：
退出模式,。用戶輸入查詢>查看結(jié)果>退出,。
狹窄的格局。用戶輸入查詢>查看結(jié)果>將其縮小,。
優(yōu)先第一模式,。用戶輸入查詢>查看結(jié)果>打開第一個(gè)鏈接之一。
珍珠增長模式,。用戶輸入查詢>打開其中一個(gè)結(jié)果>打開文檔中的相關(guān)鏈接或使用文檔中的詞匯查詢,。 在Searchpatterns.org或Medium的搜索模式（查找具有示例的常見模式列表）中查找更多模式。 8. 他們會(huì)使用什么應(yīng)用程序,？ 如果你的產(chǎn)品是工作流程的一部分,，其他工具可能會(huì)影響用戶的習(xí)慣和對(duì)其用戶體驗(yàn)的期望。詳細(xì)了解他們這些工具中的搜索如何進(jìn)行交互,，以及最有效的交互方式,。
詢問并了解他們的搜索交互方式。 詢問用戶是一種可以幫助你與用戶建立聯(lián)系,，并在正確的時(shí)間直接向其提問的一種工具,。 第2部分 檢查列表：每部分的搜索考慮 搜索有更多的組件不止?jié)M足視覺,。這個(gè)檢查列表幫助原型更快，不會(huì)讓你忘記任何東西,。 *免責(zé)聲明：此列表僅包含交互元素,，不考慮算法，搜索行為,，結(jié)果的速度或質(zhì)量,。僅考慮桌面搜索界面。移動(dòng)搜索在許多方面有所不同,，需要自己的博客文章,。 結(jié)果頁面 1. 結(jié)果類型
視頻，事件,，音頻,，位置，圖表 在你的網(wǎng)站上有哪些類型的信息是可用,？哪些類型可以搜索,？如何在結(jié)果頁面上更好地顯示不同的類型？ 2. 可視化結(jié)果 1) 表單或列表
Paper.dropbox.com 2) 卡片
Pinterest.com 3) 可調(diào)節(jié)視圖
Bookmate.com 4) 分面導(dǎo)航 基于信息架構(gòu)將搜索結(jié)果劃分為邏輯組,，使瀏覽體驗(yàn)更加舒適。 “分面導(dǎo)航無疑是過去十年中最重要的搜索創(chuàng)新,?！盝effery Callender，Peter Morville Spotify
3. 頁面上的項(xiàng)目數(shù)量 用戶一次能看到多少結(jié)果,？我們能否通過提供替代視圖和排序來讓他們舒適地安排結(jié)果,？ 1) 查看設(shè)置
Ebay.com 2) 分類
Ikea.com 3) 分頁 4) 加載
Asos.com 5) 無限滾動(dòng)
無限滾動(dòng)的Duckduckgo.com 6) 組合 4. 預(yù)覽 這是一個(gè)經(jīng)過深入研究的部分界面。最佳實(shí)踐告訴我們?cè)谒阉鹘Y(jié)果中包含哪些內(nèi)容,？ 1) 預(yù)覽中要突出顯示查詢術(shù)語
iBooks 2) 幫助區(qū)分結(jié)果的文檔總結(jié)
Ataccama.com 3) 頁面預(yù)覽
Youtube.com 5. 可訪問性 確保每個(gè)用戶都可以輕松地使用我們的產(chǎn)品是我們工作,。搜索結(jié)果是否可通過文字轉(zhuǎn)語音服務(wù)進(jìn)閱讀？字體大小和對(duì)比度是否可讀,？人們能否在一個(gè)晴朗天移動(dòng)顯示屏上進(jìn)行閱讀,？所使用的顏色是否可以被所有人識(shí)別？ 6. 快捷鍵 一些公司將結(jié)果預(yù)覽展示給下一個(gè)可用性級(jí)別,，在不離開結(jié)果頁面的情況下向用戶提供必需的最少量信息和功能,。
7. 可操作的結(jié)果 我們?nèi)绾螏椭脩舾憬莸赝瓿晒ぷ鳎勘热?，讓用戶在不離開結(jié)果頁面的情況下有機(jī)會(huì)開始處理他們正在查找的項(xiàng)目,。
Spotify 這些是一些常見的行為。它們?cè)诓煌a(chǎn)品中可能會(huì)有很大差異： 1) 分享 2) 保存結(jié)果,，書簽,，添加到愿望清單 3) 添加到購物車
應(yīng)用商店 4) 評(píng)論 5) 預(yù)覽圖庫 6) 批量操作
Dropbox paper 8. 界面反饋 1) 加載圖標(biāo)或進(jìn)度指示器
Skyscanner 2) 有關(guān)搜索過程的信息（結(jié)果，時(shí)間，應(yīng)用過濾器）
Fights.yandex.com 3) 系統(tǒng)通知（例如,，如果對(duì)搜索結(jié)果的時(shí)間敏感,，用戶需要重新刷新頁面） 4) 未找到頁面
Skyscanner.net 5) 微交互 9. 歷史搜索記錄 1) 最近的查詢 2) 最受歡迎的查詢 10. 過濾和分類 過濾器有自己的博客文章。設(shè)計(jì)復(fù)雜的網(wǎng)站時(shí),，定義明確的過濾器非常重要,。他們會(huì)讓搜索體驗(yàn)更流暢。
Booking.com 1) 類別及其間隔尺寸 2) 標(biāo)簽 3) 過濾器類型 4) 布局 5) 操作（保存并編輯自定義過濾器） 6) 分類 11. 定制化服務(wù) 如果搜索是應(yīng)用程序中的關(guān)鍵功能,，并且是用戶工作流程中的重要組成部分,，那定制對(duì)他們來說非常重要?？梢栽试S用戶調(diào)整結(jié)果頁面布局,，更改字體和顏色，定義頁面上顯示的結(jié)果數(shù)量,，保存過濾器,，自定義分類參數(shù)或添加行動(dòng)號(hào)召。
谷歌搜索
Aliexpress.com 12. 個(gè)性化 用戶設(shè)置,、之前的查詢,、偏好及其他有關(guān)用戶的信息如何改善搜索體驗(yàn)。 13. 快捷鍵 一組鍵盤快捷鍵可以更輕松地瀏覽搜索結(jié)果,。 14. 相關(guān)指示器 根據(jù)內(nèi)容的類型,，結(jié)果的精確程度及結(jié)果相關(guān)性的差距，相關(guān)性指標(biāo)有助于加快決策速度,。 搜索框檢查列表 15. 可視化
1) 定位搜索框 2) 行動(dòng)號(hào)召 3) 圖標(biāo) 4) 單個(gè)或多個(gè)輸入字段 Franzen和Karlgren在2000年發(fā)現(xiàn),，向研究參與者展示更廣泛的報(bào)名表格，鼓勵(lì)他們輸入更長的查詢,。用戶搜索界面 16. 輸入類型 你支持什么類型的搜索輸入,？ 1) 文本 2) 音頻 3) 圖像 4) 標(biāo)簽 17. 幫助 1) 搜索提示。向用戶展示搜索的全部的可能性,。
Stackoverflow.com 2) 輸入字段中的默認(rèn)文本,。
Imdb.com 18. 自動(dòng)完成 自動(dòng)完成功能可以成為快速高效地進(jìn)行搜索互動(dòng)的強(qiáng)大工具。
Fullstory.com 1) 預(yù)先定義的自動(dòng)填充會(huì)提示最近或當(dāng)下流行的查詢,、過濾器,、標(biāo)簽或播放導(dǎo)航角色。 2) 結(jié)構(gòu)化建議可幫助用戶瀏覽復(fù)雜的網(wǎng)頁,。
Twitch.tv 19. 微交互 1) 加載 2) 錯(cuò)誤消息 3) 系統(tǒng)通知 4) 快速清除查詢的方法
Google驅(qū)動(dòng) 20. 高級(jí)搜索 如果有許多用于查找項(xiàng)目的參數(shù),，則可以考慮使用高級(jí)搜索選項(xiàng)和邏輯操作。 例如：我想找到住在柏林的所有客戶,，并在上個(gè)月進(jìn)行了購買,，年齡在45-60歲之間,。 我們?nèi)绾斡媒缑嬷С诌@些類型的查詢？ 1) 邏輯運(yùn)作
Confluence 2) 基于高級(jí)搜索的界面
Fullstory 設(shè)計(jì)跨渠道搜索體驗(yàn) 設(shè)計(jì)多種設(shè)備是設(shè)計(jì)過程中至關(guān)重要的一部分,。我不會(huì)在這里討論這個(gè)話題,，但你可以在Tony Russell-Rose和Tyler Tate的《設(shè)計(jì)搜索體驗(yàn)》中閱讀更多內(nèi)容。 小貼士 搜索是一個(gè)復(fù)雜且昂貴的功能,。技術(shù)限制在設(shè)計(jì)中發(fā)揮重要作用,。這就是為什么一開始涉及研發(fā)團(tuán)隊(duì)（等同于研究階段）是非常重要。該團(tuán)隊(duì)了解用戶需求并幫助你尋找最佳解決方案,。 搜索界面案例 1) Swiftype 2) Algolia 3) Jira Atlassian 4) FullStory 5) Mac OS finder 6) YouTrack 7) Skyscanner 8) Google Drive 9) Slack 10) Spotify 11) Cars.com 12) Zillow 13) LinkedIn 14) VW Model Lineup 15) AliExpress.com 16) Amazon.com 17) Goodreads 18) IMDb 19) Yandex Flights 20) Twitch |
|
|
