書簽網站（案例研究）

編輯導讀：書簽是很多產品都有的功能，尤其是閱讀產品，方便人們快速找到瀏覽過的收藏過的記錄，再次閱讀。本文作者圍繞書簽的設計展開分析，希望對你有幫助。這是一個個人項目，旨在根據用戶需求進行用戶研究和解決方案。這也是我第一次從頭開始創建UI界面。一、瞭解書簽在我們的日常生活中有如此多的內容流入，我們很難瞭解自己真正想要沉浸在什麼內容中，而有多種方法可以做到這一點。方法其中之一是及時保存，以便閑暇時查看或參考，我們稱之為“書簽”。二、我所面臨的問題？Chrome中的書簽是最常見的方式，它可以很好地快速訪問最常用的網站。但對於其餘的，比如搜索你保存的東西，組織你的內容，便成瞭一項非常繁瑣的任務（這隻是在Chrome瀏覽器中）。在Chrome瀏覽器的Google搜索頁中為網站添加書簽，在Instagram上保存dance reel（舞蹈卷軸），或在Pinterest和Behance上創建mood boards(情緒板)。不同的應用程序，不同的內容，不同的保存位置，導致瞭許多困惑，並使訪問任何特定項目變得非常具有挑戰性。我想讓這個過程變得更簡便，並開始致力於創建一種能幫助人們為他們感興趣的項目添加書簽並快速訪問它們的體驗。1. 驗證和研究毫無疑問，這是我案例研究中最重要的部分，這幫助我弄清楚瞭我實際上應該解決的問題是隻需要把我喜歡的東西放在我的產品中。基本上，它向我展示瞭如何從零到成品！誰是現有的競爭對手？我收集瞭一些流行和不流行的應用程序，並仔細研究它們，記下瞭我喜歡什麼以及我面臨的問題是什麼。根據我認為與用戶相關的指標創建瞭一個分析表（該列表包括網絡和移動應用程序）：（上圖介紹瞭不同的書簽使用方式及優缺點）不同書簽應用的競爭分析：我面臨的主要問題是如何標記所有的書簽，因為這是區分所有已保存書簽的唯一方法。然而，它們中的大多數都是針對閱讀而不是視覺效果而優化的，這對我來說並不令人滿意（因為作為一名設計師，我是一個非常註重視覺效果的人）；此外，通過bookmarklet（一個簡單的擴展類型選項，隻需單擊一下即可保存內容，例如在Google Chrome中的書簽）在筆記本電腦/臺式機上保存內容非常簡單，但是在移動端上保存是一個漫長而乏味的過程。這些參數基於我的個人需求和偏見，並作為向我的用戶提出一些問題的起點。用戶研究：為瞭瞭解用戶的行為並驗證我從對比分析中收集到的點是否與用戶相關，我首先提出瞭一個Google表單，得到瞭80多人的回答。以下是我得到的統計數據：大多數用戶將內容算作”資源”（名單上的網站、軟件鏈接、GitHub鏈接）、文章、靈感（Instagram、Behance、Dribbble、Pinterest）和社交媒體內容。在用戶所面臨的問題中，主要的問題是如何在所有已保存的項目中搜索特定的一個並在應用程序外分享列表，但由於它們擠在一起，在所有保存的內容中沒有適當的間隔。在我得到一些反饋後，我問瞭一個重要的問題（上圖為根據“用戶多久返回查看一次保留的表單”所做的數據調查）由於我想對調查結果進行更深入的解釋，我根據他們對調查的回答，對7個人進行瞭用戶訪談，這表明他們在日常生活中是書簽的優秀用戶。下面我列出瞭一些他們所使用的書簽媒介，目前面臨的問題，以及他們的願望和需求。來自我采訪的4位用戶的見解沒有人真正對他們使用的現有解決方案而感到滿意。當我與他們交談時，我瞭解瞭他們的問題以及他們的願望和需求。問題：“很難快速找到我保存的書簽，因為沒有給出適當的命名，特別是當有類似類型的內容時更是如此，但我又不想浪費時間編輯細節。“獲取已保存的內容是一個非常漫長的過程，因此我更喜歡從我最初找到它的地方搜索它，而不是去保存它的地方尋找它。“我保存瞭很多東西，但忘記瞭我收藏的東西，錯過瞭很多可能重要的東西。願望：在盡可能短的時間內查找和保存書簽，幾乎毫不費力更喜歡視覺化的提示而不是文本提示，以及根據各種基礎（如添加日期等）對書簽進行排序的選項一個系統，其中書簽自動分組或標記，並將相關項目放在一起，以便於查看內容提醒他們保存的內容，但不是以侵入性的方式2. 實際問題我知道這個順序可能是錯誤的，但是當我開始這個項目時，我非常興奮——我要制作一個書簽應用程序，並且會有一些帶有圖像的東西，它會很漂亮。做這項研究讓我瞭解瞭書簽的復雜性，以及我的用戶們。和他們交談很累，但也讓人大開眼界。一開始我懷疑是否需要書簽產品，後來我意識到：更重要的是要有一個產品，它可以解決用戶面臨的幾乎所有問題，這樣他們就可以輕松地添加書簽。根據用戶的反饋，我開始構建我正在解決的問題，並將其框定如下：我們需要創建一個數據庫，用戶可以快捷地保存/添加書簽的各種內容，包括最效率的保存方式（最少時間，簡便的搜索）公開他們保存但從未記得查看的內容。我們會在移動端解決這個需求（因為用戶大多數時間都是在移動端查看，但並沒有多少產品可以在移動端高效解決這個問題）。3. 功能標準本問題陳述主要涉及3個主要部分：1）保存目前，將任何外部應用程序加入書簽的最常見方法是以下過程：書簽應用口袋顯示的案例保存一個書簽是一個漫長的過程！它在桌面上是如此之快，但在移動設備上卻非常乏味。Google Chrome仍然具有在共享選項旁邊添加上次訪問的應用程序的功能，但這僅適用於應用程序內查看。在youtube，LinkedIn，Twitter等應用程序中沒有相同的功能。由於我們保存瞭來自許多不同來源的項目，因此我們需要一個一體化的解決方案。一種方法是添加手勢，例如引入一個新手勢，激活後將自動保存要添加書簽的項目。這使得它隻有1步！2）搜索許多用戶表達瞭對搜索的擔憂——有些人記住的是封面圖像，而有些人記住的是他們的標題。在這兩種情況下，僅僅記住名字/圖像是不夠的，因為我們的大腦是通過聯想工作的假設你保存瞭一個你遇到的非常棒的作品集網站。但是當你去搜索它的時候，你忘記瞭這個作品集的創造者是誰；然而，你確實記得這是一個作品集，所以如果你搜索“作品集”，你可能會得到一些與這個詞相關的選項，從中你可以很容易地找到你想要的書簽。這可以通過使用應用中內置的AI/ML模型來解決，這些模型可以對保存的內容進行排序/間隔，並根據可能與該內容相關的一些基本關鍵字對其進行組織。想尋找帶有精美建築插圖的Behance項目嗎？隻需鍵入建築物或地方或Behance。繪圖黑客的視頻是什麼？隻需輸入繪圖或藝術。有一個有著驚人設計工作室的網站，我保存瞭，但忘記瞭它的名字。設計或工作室或網站。我推薦這兩款真正推動使用AI/ML進行書簽的產品：mymind和 Stash.aiAI/ML模型最令人興奮的事情是它們可以適應您的輸入和選擇。因此，如果UX關節對你來說是一個靈感，那麼AI模型可以學習它，並在你下次搜索”靈感”時顯示UX文章。這使得它真正個性化，並且隨著您使用產品的次數越多而更加強大。有時，當項目足夠重要時，用戶確實希望輸入一些詳細信息，這些詳細信息可能有助於他們以後記住和回憶它，因此將存在添加存在於所有書簽應用程序中的標簽的系統。3）回憶你來過這裡。保存瞭一些東西並忘記瞭所有關於它的事情，這是有道理的，因為它對你來說不是很重要，但你有時確實希望你至少有一天可以瞥一眼它，因為它將來可能會被證明是有幫助的。我引入瞭一個每日部分，該部分將顯示最近保存的，查看次數最多的內容以及從未查看過的內容。它將為用戶提供多樣性，並且還實現瞭不讓保存的項目浪費的目的。推送通知可用於將用戶帶到應用程序，增加用戶參與度，以便進一步提示他們瀏覽內容並直接或間接地被提醒。我還為用戶提供瞭創建集合的選項，這將有助於他們創建可以在pp內外共享的情緒板/組。遵循Pocket的模型，由於我引入瞭具有共享選項的集合，因此我提供瞭一個”發現”部分，用於托管該應用程序的各種用戶的集合。用戶流和信息架構：用戶界面和體驗：介紹：Laters！一個充滿活力的現代移動應用程序，可以存儲您的所有書簽，以便您隨時重新訪問它們。利用人工智能的強大功能，它可以幫助您找到您正在尋找的書簽，並引導您一路前進。創建收藏集並與您的朋友或世界分享，並通過發現部分查看其他收藏。儲蓄：探索1：還記得我是如何想到使用手勢來保存書簽會如此簡單嗎？隻需一個操作，它就被保存瞭！但是，在與用戶交談時，我瞭解到，盡管理論上它可能非常容易，但並沒有多少用戶對手勢導航感到滿意。他們中的許多人都是習慣性的生物，不習慣上下左右滑動。我便進行瞭用戶研究，以瞭解其移動導航的一般行為——他們是使用按鈕式導航還是滑動手勢類型。結果如何？贊成滑動手勢，但卻不盡人意。對98人的調查為瞭代替結果，我決定添加一個手勢保存功能作為輔助選項，如果他們想使用它，請征得用戶的同意。一種方法是搖晃手機，但即使它很簡單，用戶端也需要付出很多努力才能節省。我通過從右下角滑動來保存書簽。同樣，這不是一個非常理想的解決方案，也不適合按鈕類型的人，所以正常的收藏流程對他們來說是這樣的。探索2：如果不是手勢。另一種解決方案是在推送通知部分有一個永久性的應用欄，隻需單擊該欄，即可保存書簽。這些通知稱為持久通知，一旦在載入期間獲得用戶的許可，它們就會保留在那裡。這是一個兩步驟的過程，可以適用於任何打開的應用程序，而不僅僅是Google Chrome，所以它是一個可行的解決方案，但我還沒有機會測試它，看看它對用戶來說有多容易，所以它現在不是一個充實的解決方案。保存後怎麼辦？現在，您的書簽已在應用程序中，您還可以選擇添加標簽並添加到集合中，如下面的流程所示。此流程將在您點擊保存後出現，也就是說，您可以選擇標簽或集合，或者隻需按X按鈕/按框外的任意位置即可使其消失。書簽將被保存並上升到保留在通知欄中，提醒用戶在應用中查看它。書簽：保存的書簽首先是圖像，圖像是從保存書簽的網站中提取的。在用戶研究期間，用戶說他們也記住瞭許多網站圖標的項目，所以我也顯示瞭書簽所屬的圖標，這也是一個不錯的關聯工具。由於我們提供瞭支持AI的搜索功能，該功能具有略高的學習曲線，因此指導用戶的一種方法是提供有用的小指令，幫助他們輸入更有效的搜索詳細信息。添加新註釋：收集：制作系列是為瞭讓您創建個性化的情緒板並分享它們！共享是通過使您的集合成為私有/公共的機制來完成的。此書簽應用程序是一個非常個性化的產品，因此默認情況下，您的所有集合都是私有的。您必須將其公開，才能在發現源上可見。創建一個新書簽集合向收藏添加書簽發現：擁有發現部分的想法來自Instagram的指南功能。我覺得這是展示策劃內容的好方法，但隻對那些在他們的頁面上發佈非常具體的，與主題相關的東西的人有用，而大多數Instagram用戶的情況並非如此。它可能在Instagram上並不受歡迎，但在書簽應用程序上會非常有用，因為如果用戶進行收藏，可以提示用戶在”發現”部分發帖，以便與志同道合的人互動。為什麼人們會去發現部分而不是谷歌？答案是策劃的內容。你在網上得到的選項太多瞭，以至於它變得令人困惑，你不知道該信任誰。但在這裡，有很多人公開瞭他們的收藏，因為他們相信這可能會幫助他人，你會發現這些東西是非常原始和真實的。這是我對書簽體驗的看法，希望你覺得它很有趣！當然，有一些（許多）東西我本可以添加或更好地工作，但那是以後的事瞭。缺點和未來計劃：創建整個入職體驗，因為這個依賴於AI/ML的應用程序確實有一點學習曲線，所以最好給用戶一個演練，以便他們可以輕松掌握它。與移動應用程序無縫協作的桌面應用程序和插件，可輕松添加書簽和集中查看對手勢導航進行瞭更好的研究接觸到更廣泛的用戶，因為我隻能通過我的遠近朋友和同事收集信息，因此我可以使用特定的書簽應用程序更好地瞭解用戶。在創建應用程序後進行瞭可用性測試，以驗證我是否已達到基礎或錯過瞭花瞭一點時間開發品牌部分（感謝Flaticons在應用程序上飛濺的小插圖）原文作者：Satabdi Srichandan原文鏈接：https://bootcamp.uxdesign.cc/bookmarking-but-its-actually-useful-12a65c49034a譯者：王姝丫-Sylvie本文由人人都是產品經理團隊實習生 @王姝丫-Sylvie 翻譯發佈，未經許可，禁止轉載題圖來自 Unsplash，基於 CC0 協議