返回

Artworks Discovery:藝術探索與搜尋系統

概覽

概覽

Artworks Discovery 是公司建立的第一個藝術內容整合總入口,旨在讓使用者能在同一個介面中,橫跨探索來自畫廊、拍賣行與成交紀錄的作品,資料庫涵蓋超過五千萬件項目。

本專案表面上是內容的水平整合,背後其實隱含三個更棘手的底層挑戰:異質來源的資料結構差異(data schema inconsistency)、市場語意彼此衝突(market semantics mismatch),以及不同類型使用者的搜尋意圖差異(search intent variance)。

有些使用者帶著明確目的尋找特定作品,也有些使用者以藝術家、風格或市場類型進行探索。因此設計範疇從單一網頁,延伸為一個同時支援多種搜尋意圖、並維持資訊一致性的探索系統。

本專案主要橫跨兩個核心介面:Discovery 列表頁(跨來源瀏覽與篩選),以及 Artwork 詳情頁(單件作品資訊整合)。

角色
產品設計師
職責
資訊架構設計、互動設計、可用性研究
時程
約 6 個月(含上線與後續迭代)
團隊
2 位設計師、內部產品團隊、外部開發合作夥伴

問題

藝術內容分散在三個系統,彼此並不一致

藝術內容分散在三個主要系統中:畫廊資料、拍賣資料、歷史成交紀錄。這些系統各自有不同的資料結構與市場語意,彼此並不一致。

在既有架構下,使用者需要在不同系統之間切換,並自行整合資訊,才能理解一件作品的完整市場脈絡。因此核心問題變成:如何讓不同來源的藝術資料,在同一個介面中被理解與比較,而不造成語意混淆?

核心挑戰

在維持市場語意清晰的前提下,建立一個可以同時整合多來源作品的探索系統。

同時必須避免一級市場(畫廊展售)與二級市場(拍賣成交)被錯誤地視為完全可直接比較的數據。

研究

可用性測試告訴我們的事

我針對四位與藝術市場相關的使用者進行可用性測試(Usability Testing):2 位資深畫廊專業人員、1 位畫廊創辦人、1 位高資產初次藏家。每場測試包含 10 分鐘訪談與 20 分鐘任務操作(跨四個情境),全程遠端進行。

雙軸模型上的三種使用者

我用「技術熟悉度」與「藝術市場熟悉度」兩個維度來分析使用者行為,整理出三種主要使用者:視覺探索者(依風格與視覺直覺瀏覽)、市場策略者(依作品名稱與市場資訊搜尋)、畫廊推廣者(關注藝術家曝光與能見度)。

整體穩定,但特定任務出現明顯落差

整體可用性表現穩定(4.5/5),但在特定任務上出現明顯落差。關鍵問題集中在「搜尋特定作品」,這是四個情境中唯一明顯斷點的任務。

核心問題是系統邊界,而不是 UI

最嚴重的問題不是互動設計,而是心智模型錯誤:使用者會誤以為 Header 的全站搜尋等於 Discovery 頁搜尋,但兩者範圍其實不同。這導致搜尋路徑錯誤、找不到預期結果、任務無法完成。

完整的研究報告依序說明了研究方法、三種 User Persona、核心洞察以及四個脈絡測試情境。

Discovery 頁可用性測試報告,第 1 頁:背景:研究目標與方法。
Discovery 頁可用性測試報告,第 2 頁:受測者組成與訪談紀錄。
Discovery 頁可用性測試報告,第 3 頁:雙軸模型上的三種 User Persona。
Discovery 頁可用性測試報告,第 4 頁:Persona 1:視覺探索者。
Discovery 頁可用性測試報告,第 5 頁:Persona 2:市場策略者。
Discovery 頁可用性測試報告,第 6 頁:Persona 3:畫廊推廣者。
Discovery 頁可用性測試報告,第 7 頁:洞察:各 Persona 的可用性評分。
Discovery 頁可用性測試報告,第 8 頁:洞察:八大痛點,依嚴重程度排序。
Discovery 頁可用性測試報告,第 9 頁:情境 1:搜尋特定作品。
Discovery 頁可用性測試報告,第 10 頁:情境 2:依多重條件進行進階搜尋。
Discovery 頁可用性測試報告,第 11 頁:情境 3:編輯與調整篩選條件。
Discovery 頁可用性測試報告,第 12 頁:情境 4:不套用篩選的自由瀏覽行為。
Discovery 頁可用性測試報告,第 13 頁:總結:五個 How Might We 與後續推進方向。

1/13 背景:研究目標與方法。

解法

打破來源壁壘,但維持市場語意邊界

我重新設計兩個核心介面:Discovery 列表頁負責跨來源整合、瀏覽與篩選;Artwork 詳情頁負責呈現單件作品的脈絡。以下分開說明。

Artworks Discovery 在筆電與手機上的畫面:Browse Artworks 頁面,含來源篩選與來自畫廊、拍賣、成交紀錄的作品列表。
Artworks Discovery 跨桌機與行動裝置的實際響應式網頁畫面。

介面 01 — Discovery 列表頁

一個聚合型總入口,讓畫廊、拍賣與成交歷史並陳在同一份可流暢瀏覽的清單中。

統一卡片結構,但保留來源差異

所有作品使用同一套卡片設計,但保留各自的市場語意:畫廊作品標示「Price on Request」、進行中的拍賣顯示「Live Now」與估價、已成交作品顯示「Results Available」。用同一套排版包容不同的市場狀態,而不把它們抹平。

四張共用同一套版型的作品卡:標示「Live now」與估價的 Artnet Auctions 拍品、外部拍賣行拍品、標示「Price on Request」的畫廊作品,以及標示「Results Available」的已成交作品。

來源導向的篩選系統,與跨裝置一致的版型

篩選依資料來源與狀態切分:Available Now、Artnet Auctions、Galleries、Auction Houses 與 Ending Soon,用來梳理超過五千萬件作品。同一套版型從手機延伸到桌機,作品的閱讀結構不會因螢幕尺寸而位移。

Browse Artworks 頁在手機、平板與桌機上的呈現,篩選分為 Available Now、Artnet Auctions、Galleries、Auction Houses 與 Ending Soon。

介面 02 — Artwork 詳情頁

單件作品的詳情頁,依各自的市場來源清楚承載脈絡。

重新組織資訊層級

改版後把來源資訊、市場數據與推薦作品分區呈現,避免混在同一層級互相干擾。

作品詳情頁改版前後對照,含淺色與深色版本,呈現來源、市場資料與相關作品更清楚的資訊層級。

畫廊與拍賣的欄位與市場意義不同,因此詳情頁在共用同一套 layout hierarchy 的前提下,依來源調整版型:畫廊作品偏重展覽與背景脈絡,拍賣作品偏重成交與估價資訊,避免視覺碎裂。

畫廊作品詳情頁版型,含淺色與深色。
Artnet Auctions 與合作拍品的詳情頁版型,含淺色與深色。

畫廊作品:展覽與背景脈絡。

從研究到設計優先順序

可用性測試顯示,問題核心不在操作,而在對系統邊界的理解錯誤。因此優先順序定為:

  1. 修正全站搜尋與 Discovery 頁搜尋之間的心智模型。
  2. 優化搜尋與篩選的互動。
  3. 微調視覺細節。
有人在筆電上瀏覽 Artworks Discovery 的作品清單,在實際工作情境中查看篩選後的作品。
實際使用情境:在真實工作場景中瀏覽篩選後的作品列表。

成果

瀏覽與探索行為的早期變化

由於本專案是新建的 Discovery 入口,以下屬於 early signals(早期行為觀察),並非嚴格的前後對照。初步觀察是:平均瀏覽深度約提升至 1.6×,使用者更常從單一查找轉向連續瀏覽,跨來源切換的次數也下降。

1.6×

瀏覽深度

平均瀏覽深度約提升至 1.6×,使用者更常從單一查找轉向連續瀏覽。

約 30%

月回訪率(早期數據)

用於觀察「一站式探索」是否開始形成使用習慣,而非代表最終成長。

4.5/5

可用性評分

更重要的是:心智模型問題被清楚定位、搜尋與篩選的優先順序被重排、跨來源的理解成本下降。

學習收穫

結論的適用邊界,比結論本身更重要

樣本偏向畫廊端,結論有其邊界

四位受測者偏向畫廊端使用者,因此結果更適合描述特定專業族群的行為,不代表整體市場。研究的價值,在於清楚界定結論適用的範圍,而不是追求面面俱到的代表性。

最大的問題不是 UI,而是心智模型

最嚴重的問題不在某個控制元件或外觀,而是使用者對搜尋範圍的理解,與系統實際設計不一致。

跨來源的系統設計,本質上是在設計「使用者如何理解資訊來源」,以及它在不同市場語境中代表的意義。