在生活中,我們不時可以發現許多產品在使用上令人啼笑皆非的例子(比方說高鐵的售票機),不只是實體上的物品,像是網路上的介面等等,在它的文字說明與實際使用上常常有許多的衝突,常常使用者需要花費一點時間習慣,或者是需要幾次的錯誤嘗試之後,才能找到需要的東西。
以下我舉出兩個例子來說明使用者如何在實地使用上受到挫折。分別以香奈兒的脣膏及圖書館網頁為例,前者在毫無文字說明的情況下,在打開包裝上有困難;後者則比較不同大學的圖書館網頁,在版面設計上對使用者有什麼不同的效果或影響。

(如圖)這支在母親節成為最佳選擇的香奈兒口紅,名為ROUGE ALLURE,強打「香奈兒超炫燿的脣膏」,瓶身包裝是香奈兒經典的黑色,以黑漆上釉外的外殼,包裹著金色金屬管身。
然而,一開始拿到時,卻陷入了「不知道怎麼打開它」的窘境。(如圖)

(奇怪!怎麼開啊?)
一般的口紅大多是以「轉」的方式旋開外殼,或是直接「拔」開外殼的。
通常使用者的使用習慣是:
先打開外殼(此時口紅的芯便露出來了),再以拇指及食指轉動瓶身,口紅便會隨著轉軸而上升至瓶身以上,就可以讓使用者直接塗抹在嘴唇上了。
但這支口紅卻與一般的使用習慣不同,它的外殼不是用轉也不是用拔的。(如圖)

(我轉~)

(我拔~)
研究了好一會兒,才發現原來它是用「按壓式」的。
以手指按下位於前端的CHANEL logo(雙C),便可發現金色的瓶身上升了!此時,金屬瓶身便脫離了黑色的外殼,我們便可將金屬瓶身取出,順利的使用口紅了!(如圖)

(按按看~)

(跳起來了耶!)

(打開了打開了!)

(好耶!)

(名模來一張~)
(讓我們再回顧一次:就像這樣按下去喔~)(如圖)

接下來,我們來看看圖書館網頁在使用上的簡捷與不便。
以高醫圖書館的網頁為例。(如圖)

我們會上圖書館的網站,目的不外乎:找書。
由此可知,「查詢」的標示必須要非常清楚。
但是高醫圖書館網頁的功能欄只佔了網頁做上的一個小區塊。(如圖)

接下來,我們要找書。
我們從左上的區塊中,選取可能的選項。
試試看「紙本館藏資源」,接著點選「查詢紙本館藏目錄」,進入查詢頁面。(如圖)

這個查詢系統將所有的查詢格都列出來,但使用者通常只知道書名的關鍵字(頂多還有作者名),但是使用者必須依循網頁上列出的,找到第二格,這才是「最常被使用的關鍵字」,接著再輸入。
回到圖書館的首頁,我們很好奇佔去網頁大部分的是什麼?
想必是比「查詢」更重要的功能吧。

結果是展覽的訊息。它的長度、寬度甚至比左上那個功能區塊都還要來的更長、更寬。(見上圖)
那麼,我們到別的大學圖書館試試。
這是台大的圖書館網頁。(如圖)

對照前面提過的,我們可以看到它的「功能」(館藏、資料庫等等)區塊佔去了整個網頁二分之一到將近三分之二的版面。(如圖)

除此之外,可以看到「查詢」選項被列在版面的開頭,被放置在「目錄」的第一個選項,並且在版面的頁首也設了「快速搜尋」的欄位。此外,幾個常被使用的選項,也都以紅褐色字體標明,方便使用者快速知覺到。(如圖)

對比高醫圖書館以大幅的展覽訊息佔據頁首,台大則僅簡單地放置了圖書館名稱及關於圖書館的相關事項(開放時間、常問問題等等)。不僅簡潔,所用的空間也較少,使多餘的空間能分配給其他更需要的選項。(如圖)

那麼展覽訊息呢?
拉到頁尾,可以在右下角發現。(如圖)

進入台大圖書館的查詢館藏,可以發現它只簡單列出書刊名的查詢空欄。若是你需要更精確的查詢,只要往下拉,就可以使用進階的查詢。(如圖)

這其實可以類比到google的搜尋首頁,它常常被拿來當作例子。(如圖)

我們可以看到,搜尋欄放置在版面正中央,簡潔而明顯,一進去網頁,便可以非常快速的找到此欄,並在其中鍵入關鍵字。版面其他處除了必要的語言選項或是精確搜尋之外,只有大大的GOOGLE logo,其餘則是一片空白。
這是一個很好的例子,人的注意力資源是有限的,我們往往在知覺到訊息時,會首先挑選最吸引你注意的物件。而google的版面設計,便清楚的抓住了我們的注意力,把我們最需要的功能「搜尋」突顯出來。
讓我們來看看其他的入口網站。
以pchome及蕃薯藤為例。(如圖)

(pchome)

(yam)
在這兩個網頁中,我們也可以在頁面的上方找到「搜尋」欄,但我們的確是用了比在google網頁中較多的時間,這是因為,在視覺處理上,我們必須以較多的時間去尋找「搜尋」欄,必須區分顏色、廣告、字體、圖像等等,必須等我們的腦子裡面也完成一道「搜尋」的程序之後,我們才能「真正」進行搜尋。
以上兩個例子是在我們生活中處處可見的。事實上,真正設計良好的產品,必須是把「人」的因素也考慮進去的,這包括了人的使用習慣、或者認知心理學所提到的注意力資源、物件辨識等等。最理想的狀態應該是「物品」去適應「人」,而不是「人」去適應「物品」。
註:
圖片來源:
台大圖書館網頁、
高雄醫學大學網頁、
google、pchome、yam入口網站
(特別感謝):
友人收子充滿戲劇張力的演出、
keiko熱情贊助母親節禮物香奈兒唇膏、
以及一些近日來被我逼問idea的朋友們,
謝謝你們啦!
請先 登入 以發表留言。