[UX基石] 如何當個意義設計師,建立好的資訊架構

Mike Pan
7 min readDec 13, 2020

--

這堂 UX 基石課程則是由 Max 老師為大家介紹資訊架構,整整三個小時的過程中 Max 老師妙語如珠,大概是這整個系列課程中最具有娛樂性的一堂課了。

同時這也是最難整理成心得的一場,穿插了太多難以用文字說明的生動案例,所以也覺得如果沒有留下些什麼紀錄的話,真的太可惜了。

而 Max 老師在一開始也再介紹了一次使用者經驗的五層架構,比較少見的是這邊把一些比較常見的職缺也做了對應,我覺得這其實也是一個讓大家對這個概念更能夠理解的一個不錯的方法。

什麼是資訊架構

一言以蔽之,就是「整理分類資訊,讓大家找得到」。

這包含了像是大賣場裡面的商品分類與陳列方式、圖書館裡面藏書的編排方式、甚至你的房間或衣櫃的收納方式,其實都和資訊架構有關。

那,為什麼資訊架構很重要呢?我們就來看看實際上會有什麼影響吧。

使用者看事情的角度,跟設計者是不一樣的

Max 老師在這邊也用了大賣場的例子來進行說明。通常賣場在對成千上萬種商品進行分類時,做法可能會先把類似的東西放在一群,再幫這群東西取個名字;例如把胡椒、辣椒醬、番茄醬等等歸類在一群,再把他們命名為調味料。而這個「調味料」類別,最後可能還會被放到「食品」這個更大的類別下面。

但使用者進到賣場後,會先看到的是食品、飲料、日用品等等的這些大類別,而這時候就會嘗試去理解這些類別名稱的意義。比如說要找米酒,到底是要去飲料區、還是食品區呢,因為米酒的本質雖然是酒,但卻是拿來作為料理的用途。類似案例還有番茄到底會放在蔬菜區還是水果區,可能每個人的答案也會不同。

https://en.wikipedia.org/wiki/Supermarket#/media/File:ASDA_in_Keighley.jpg

意義的設計師

所以 Max 老師也說,這其實是在「設計意義,連結人與資訊」,的確也是非常貼切。

畢竟光是短短的這一句「整理分類資訊,讓大家找得到」,其實真的要做的夠好,也是十分不容易。像我也曾經有在賣場中找不到東西的經驗,最後當然也是直接找店員用問的,最簡單快速了XD

如何設計出好的資訊架構

在做設計與規劃的時候,需要同時考量以下三個環節:

  • 使用者 (User)
  • 需求內容 (Content)
  • 商業脈絡與情境 (Context)

我覺得其實也可以歸納成「什麼人、在什麼情境下、需要什麼資訊來完成什麼事。」而後續再看 Max 老師課堂上提到的一堆案例,其實也都可以再套回去這個架構裡面,去檢視與思考。

找書的案例——提供適合情境的分類方式

例如二手書店除了我們常看到的用主題去做分類之外 (例如財經、文學、雜誌…等等),其實還會有個用價錢來做分類的方式。

乍看之下雖然會覺得這樣真的找得到想要的書嗎,但這其實完美呼應了這些使用者的需求,也就是撿便宜。所以其實也可以看成是:「二手書店的讀者,在購買的情境下,會需要價錢這個資訊來進行決策。」所以這時候用價錢來進行分類,其實再適合不過了。

課堂中 Max 老師雖然舉的是網路二手書店的案例,但我在實體二手書店其實也看到過一樣的分類方式。

https://m.facebook.com/molliestoretc/photos/a.590640514333469/1761908457206663/

找歌的案例——手動加入 Metadata

另一個讓人印象深刻的範例則是在 Youtube 上面的 tag。

托某次市長選舉的福,現在提到「蜂蜜檸檬」這個關鍵字,可能大家還會聯想到某一首歌、歌詞裡面有「人生短短幾個秋」。但,你其實不知道這首歌的歌名,這時候要怎麼在 Youtube 上面搜尋呢?

這時候就要透過手動加入 Metadata (關於資訊的資訊) 的方式,讓這首歌與這些關鍵字產生連結,才能讓使用者能在不知道歌名的情況下,也能找到這首歌。

資訊架構要包含的範疇

前面用比較精簡的「整理分類資訊,讓大家找得到」一句話說明資訊架構,其實更精確來說,資訊架構應該要包含以下這些範疇:

  • 組織與簡化資訊
  • 設計並連結資訊空間
  • 提供方法讓人尋找資訊、並與資訊內容互動

而從上面例子其實也可以看到,在尋找資訊這塊,使用者可能會依循系統給定的分類方式來尋找資訊 (找書案例),也可能直接透過搜尋功能來尋找資訊 (找歌案例)。

所以,要先找到那個情境與使用者,去釐清需要的是什麼樣的資訊,才會有辦法去針對這個需求來進行更好的設計。

同時,也因為這本來就是依照不同情境與使用者去進行優化,所以沒有最好的、只有最適合的資訊架構;而且這個最適合,是會不斷演進與調整的,畢竟使用者的行為可能會改變、資訊內容也可能會改變。

真的不用做得很精美很漂亮

最後一個讓我很驚豔的例子就是 2013 Design of the Year 得主,gov.uk 這個網站。可以看到它的頁面很樸素單純,其實是比較難與我們既定印象中的「設計」產生連結的。

而評審對於獲獎的說明則是,它用了最簡單、最有邏輯的方式來做呈現。畢竟這些政府相關的手續、文件、流程等等,在大家印象中通常是很繁瑣、甚至難以理解的,也可以想見這花了多大的力氣來重新建立資訊架構。

所以,關鍵真的就只是「整理分類資訊,讓大家找得到」。沒有好的資訊架構,即便畫面再怎麼精美,對使用者來說都會是很難找到想要的資訊的。

總結

我覺得能夠找到這些很生活化的例子,在課堂上進行說明,其實是很棒的。除了在理解上比較不會有障礙之外,也會覺得這件事情沒有想像中的那麼困難。

然後 Max 老師在演講的最一開始,不但確認了台下的大家對於資訊架構的理解程度到哪、有沒有看過相關書籍,甚至也針對這堂課的期望進行溝通,讓大家再次了解到這真的是很入門的一堂課,覺得這其實也是蠻細心的地方。

謝謝您看到最後!
若您喜歡我的文章,歡迎留下一些留言、按下「拍手」給我支持、或是「Follow」我,讓我提供更多文章給您。

--

--

Mike Pan

偶爾兼差 UX, Researcher, Data Analyst 的科技業小 PM,喜歡觀察,並試著拆解生活中所看到的人事物