目錄

第二章 介面相關知識 ..........................................二—1

第一節 運用心理學的知識 ..................................................二—2

心理學的協助 .......................................................二—2

運用心理學研究的方法.........................................二—3

第二節 什麼是認知心理學？ ..............................................二—4

背景：行為主義、格式塔和認知心理學派............二—4

認知心理學 ...........................................................二—5

第一項 視覺感知(Visual perception) ...........................二—7

主題與背景 ...........................................................二—8

實務運用...............................................................二—8

讓主題浮現﹕ ................................................二—9

運用視覺深度的暗示：..................................二—9

群組、視覺架構的重組................................ 二—11

資訊的階層..................................................二—11

二:1
 教育媒體介面的應用 ...................................二—12

第二項 注意力(Attention) ..........................................二—12

實務運用.............................................................二—12

第三項 人類資訊處理................................................二—13

第四項 記憶 (Memory) .............................................二—14

感官記憶.............................................................二—15

短期記憶.............................................................二—15

長期記憶.............................................................二—16

記憶結構：基模理論(schema theory) ................二—16

實務運用.............................................................二—17

第五項 學習 (Learning) ............................................二—18

實務運用.............................................................二—19

由實作、錯誤中學習 ...................................二—19

由主動思考中學習.......................................二—19

由訂定目標與(知性的)計劃中學習...............二—19

由類比中學習 ..............................................二—20

二:2
 漸進輔助式學習(The training wheels).........二—20

第三節 諾曼的日常認知心理學.........................................二—20

誰是唐納‧諾曼（Donald A. Norman）博士？ ..二—21

第一項 心智模型、設計模型、系統印象 ...................二—22

心智模型（Mental Models）..............................二—23

心智模型的作用 ..........................................二—23

設計模式（design model）................................二—25

系統印象(system image)....................................二—25

第二項 在使用者介面中使用隱喻..............................二—26

隱喻的設計： .....................................................二—29

第三項 預設用途、使用限制(constraints) .................二—31

第四項 可見性 (visibility) ..........................................二—32

所見即所得（WYSIWYG）................................二—32

『層次』型的介面 ..............................................二—34

第五項 配對(Mapping) ..............................................二—35

自然配對.............................................................二—38

二:3
 實務運用.............................................................二—41

第六項 回饋 (feedback) ...........................................二—43

實務運用.............................................................二—44

第七項 人必犯錯 .......................................................二—46

失誤....................................................................二—46

錯誤....................................................................二—47

第二章作業：互動介面範例研究 ........................二—49

二:4
第二章 介面相關知識

本章摘要

介面設計師在進入實務設計之前，心理學的相關理論是設計的根基，是必須具備的
知識。由於工業設計與視覺傳達設計的學程對認知心理學的介紹較為片斷，希望在
本章節能夠提供較基礎與完整的探討以提供設計時的參考。

本章包括認知心理學的重要項目﹕視覺認知、注意力、人類資訊處理、記憶、學習。
由於諾曼所引介的幾個觀念對設計界影響巨大，在第三節則獨立介紹唐納‧諾曼
（Donald A. Norman）博士所宣揚、傳述的認知心理學原理：重要的觀念包括心智
模型、預設用途、使用限制、可見性、匹配、回饋、預防錯誤。在每一個項目的後
面都安排了「實務運用」的介紹，期能讓讀者對心理學原理的與設計建議方針之間
有著密切的搭配。

二—1
 第一節 運用心理學的知識
當設計師被教育要擁抱消費者、傾聽使用者的聲音時，事實上設計師
仍然缺乏對『人』的重視，以及足夠的知識。人類是善變的：人類易
於轉移注意力、改變心情、動機及情緒，人類有主見、有恐懼，人類
會犯錯、判斷錯誤。在另一方面，人類也有相當驚人的能力：人們能
對外界的刺激有所察覺並做出快速的反應，能解決複雜的問題，亦會
構想出無止境的的創意。但是在大多數的情況下，使用者只被當作是
資訊處理的個體，也就是假設使用者將會像機器中的齒輪一般，一步
步的磨合，以適應系統。然而，就像大部份的使用者所經歷的，許多
日常生活諸如此類的產品通常是難以使用的、容易造成錯誤、或有時
遭受市場的唾棄。

心理學的協助
心理學是一門研究人類行為、以及人類對環境反應的方式之科學。介
面設計之所以必須應用認知心理學的知識，即是讓設計師熟悉使用者
的心理運作，讓所設計的資訊處理的活動能夠精確的控制在使用者的
心智能力範圍內。對介面設計師而言，認知心理學提供了以下的協助1：

1. 提供關於使用者『能夠做到』與『無法做到』之事的知識。

2. 釐清使用者所遭遇到的問題之本質，並協助設計者了解其原因。

3. 提供建議的工具與設計方法以協助建立更為人性的介面。

1
Preece, Jenny. A Guide to Usability - Human Factors in Computing. Chapter 2: The Human
Element: Applying Psychology (p.21-37). Addison Wesley. 1993.

二—2
4. 提供關於組織運作架構與實際作業情況之知識2。

5. 在社會的層面(如：使用者的態度)上，對人機系統的使用進行更
深入的探討。

運用心理學研究的方法
有效的應用心理學的知識，以設計出更好的介面是相當的重要的課
題。探求心理學研究的發現與理論只是第一步，因為它提供了我們檢
視一個設計的問題之理論架構。運用心理學的研究，人機互動的專家
已經發展出一些特別的方法與工具，有以下三種方法3：

1. 處方式(Prescriptive) 研究方式：由心理學研究上的發現與理論
所得到的定理，它們被精簡轉換為整體的，符合設計者、專案管
理人員和程式設計師的須求的設計準則與標準。這是最廣泛使用
的方式，本章節提供的設計建議方針大多為此類。因此本章節在
每一個項目的後面都安排了「實務運用」的介紹，期能讓讀者對
心理學原理與設計建議方針之間有著密切的搭配。

2. 預測式(Predictive)研究方式：依據人類資訊處理的理論基礎，它
們被轉換為可用來預測使用者將如何執行不同的使用者介面使
用者模式 (user model)。

3. 實證式(Empirical)研究方式：由心理學研究所得之概念、方法及

2
例如，研究家庭群體如何上網、使用電子信箱、電子佈告欄、全球資訊網等種種人(家庭)與電腦、
網路、生活及與其他使用者的互動。

3
Preece, Jenny. A Guide to Usability - Human Factors in Computing. Chapter 2: The Human
Element: Applying Psychology (p.21-37). Addison Wesley. 1993.

二—3
 架構，而將其應用於使用者介面設計的問題解決上。這是常見的
研究方式但成本較高且較耗時。

不論是設計新產品的介面、或甚至在公司組織中建構新科技，較理想
的狀況是一開始就諮詢人機互動專家及人因工程顧問。可能的話，在
公司組織內部可靈活成立人機互動介面專家部門，或由工業設計部門
兼任。這些部門的人員會與程式設計師緊密的合作，並做為設計團隊
與使用者間的重要橋樑。

第二節 什麼是認知心理學？
背景：行為主義、格式塔和認知心理學派
最近幾十年來，心理學中關於複雜行為的理論主要有三個學派，即行
為主義學派、格式塔學派和認知心理學派 (又稱訊息處理學派)4。各個
學派都想更好地解釋人類機體是怎樣活動的，它們之間的差別主要在
於研究的重點和所用的方法並不一致。行為主義心理學著重研究行為
的產生與控制、行為與刺激之間功能性的關係，而否認內部心理活動
的存在和作用。根據行為主義的模式，行為(反應)是由外在的刺激情
境所決定的。這個模式支配了大半個世紀的美國心理學的研究方向。

格式塔心理學則強調心理現象的整體性質，他們不認為知覺只是一種
局部感覺的堆砌，而強調「全體大於各部分之和」
，因此又稱「完形學
派」
。格式塔學派的心理學家首次描述了部分感知組織的通則：人類在
最初的視覺感知下〈看到介面第一眼時〉
，獨立的的視覺元素如何被群

4朱新明，李亦菲。架設人與電腦的橋樑：西蒙的認知與管理心理學。城邦文化發行，2001。文
中引述心理學家西蒙(Herbert Simon)在1983的論述。心理學家西蒙(Herbert Simon)因為他的理
論和研究曾獲得諾貝爾經濟學獎，他的決策理論是研究人們當處於不確定的情境下時會如何從事
決定
二—4
組化而成為整體〈也就是完形〉
。藉由描述整體架構如何從更細緻的部
分元素架構中浮現出來，完形原則可以成功的解釋許多視覺設計的技
巧5。本書第三章的界面的視覺設計方針將會針對格式塔心理學作詳盡
的探討。

認知心理學則是近二十年來心理學研究的新方向，它用訊息處理的觀
點來說明人們心理和行為，在知覺、注意、記憶、語言、思維等方面
的研究中都做出了重要的貢獻。

認知心理學不是一個狹隘的心理學派別，而是－種新的心理學研究典
範6。它並不否認歷史上各派心理學的建樹，它一方面繼承了行為主義
的經驗主義和操作主義的方法論，另－方面又接受了格式塔心理學對
內部心理歷程的研究，因此認知心理學在自己的理論和實驗工作中廣
泛吸收了各派心理學的方法和成果。其實，在二次世界大戰中心理學
家的貢獻不小。注意力的研究、肌能學習的研究、語言辨識的研究、
自動化語言翻譯的研究、人工智慧中的敵情解碼研究等等軍事應用的
研究，建立了現代的認知心理學。

認知心理學
所謂認知是指認識事物的歷程，包括注意、思考、期望、想像、記憶，
及意識本身7。在幾百萬年的演化歷程中，人類透過對外界環境的適
應，逐漸發展了各種能力，形成了一個高度複雜的認知系統。認知心
理學家所感到興趣的問題是：人們如何根據過去的『記憶』和對未來

5
Mullet, Kevin. & Sano, Darrell. Designing Visual Interfaces. Chapter 4 Organization and
Visual Structure. Sun Microsystems, Inc. 1995.
6
朱新明，李亦菲。架設人與電腦的橋樑：西蒙的認知與管理心理學。城邦文化發行，2001。
7
Zimbardo, Philip G. 原著，游恆山編譯。Psychology and Life。心理學。中華民國77年11月
初版。
二—5
的『期望』
，來『解釋』刺激環境與『決定』自己的行為。而介面設計
師感興趣的則是：人們如何運作認知系統，與介面產生互動。

『認知心理學的目的就是要說明和解釋人在完成認知活動時是如
何進行訊息處理的，如他知覺到物體的哪些特徵;看到了事物間的
什麼關係;外界訊息是怎樣儲存到頭腦中的;他在解決課題時利用
了哪些訊息，採用了什麼樣的思維策略等』Herbert Simon8。

認知心理學將『認知』(cognition)這一概念解釋為獲取知識與應用知
識的功能，它包括以下三個基本功能：(1) 感知(資訊接收)：透過感知
活動獲取外部世界的訊息:(2) 資訊儲存：將外部訊息轉化、形成一定
的知識結構;(3) 資訊處理與決策：利用這種知識完成各種作業，如推
理、決策、問題解決、言語理解等9。此基本功能曾在第一章『人機系
統的資訊處理』論及，請參照〈圖 1-5、以及更為細節的描述：圖 2-1〉
。

8
朱新明，李亦菲。架設人與電腦的橋樑：西蒙的認知與管理心理學。城邦文化發行，2001。文
中引述Herbert Simon的論述。
9朱新明，李亦菲。架設人與電腦的橋樑：西蒙的認知與管理心理學。城邦文化發行，2001。
二—6
〈圖 2-1〉『認知』的細部過程。

在運用心理學的知識之前，我們首先要知道那些重要的心理學知識
是與人機互動相關的。本節涵蓋認知心理學的主要領域，它們是人
與系統互動之基礎。這些主要領域為視覺感知、注意力、人類資訊
處理、記憶、學習。

第一項 視覺感知(Visual perception)

感知是人類感覺到週遭環境的過程，也是一種訊息接收的步驟。在感
知過程中，我們用五官去感覺物體或事件。眼、耳以及遍佈我們全身
的神經末稍是我們與外在世界維持聯繫的主要管道。透過感覺器官，
外在的資訊得以收集，轉化成為電流脈衝，並由神經系統傳輸，進而
導引大腦一系列電流與化學的變化，而此變化結果即是人類感知到外
二—7
在的事物10。

與介面相關的是視覺感知：人類透過眼睛觀看東西時，看到的不是與
外面完全一樣的的世界，也不僅只『看到』投射在視網膜上的振動不
穩定影像，而是一個由人類的視覺系統所建構塑造的世界，此時感官
的輸入與資訊是被組織起來的。因而視覺的處理是一個動態的過程，
由環境得來的資訊以及先前存在腦中的知識都會被使用。

主題與背景
在視覺感知的過程中，
『背景』與『主題』 〈圖 2-2〉主題與背景。到底是 A

被區分開來〈圖 2-2〉。所謂主題即是： 或 I 或是小男孩？完形原則的運

用。A.I.人工智慧，華納電影公司，
我們有興趣並凝聚焦點的事物，如此我
2002。
們就可以由週遭的背景中區別物件。此
外，視覺抽取深度的暗示(visual depth
cue：亦為『視覺傳播』的基礎理論之
一)使我們能夠認知到三度空間的世
界。運用此種暗示可以使我們在二度空
間的網膜影像(圖形、圖片，影片)中，
將視覺經驗還原，而認知到三度空間的世界的物件。這種暗示法已被
用於電腦繪圖，以使得圖形變得更真實。

實務運用
介面可以用不同的方式顯示資訊：從傳統的按鈕、文字、到圖形，動
畫、影像。設計師必須確定資訊的呈現符合下列幾點需求：

10
Kemp, Jerrold E. and Smellie, Don C. 教學媒醴的企劃、製作與運用。譯自：Planning,
producing, and using instructional media, 6th ed. 中國視聽教育學會主編．民83
二—8
 讓主題浮現﹕
將要呈現的資訊與背景清楚的區別開來。近年來繪圖軟體濾鏡、特效
的風行、讓許多初試介面設計的設計師不自覺的加入大量干擾主題的
背景〈參見第三章圖 3-68，設計過度的背景：太多色系、太強烈的背
景。〉
。解決之道仍在於訓練設計師在創造力的發散過程中，如何取捨、
如何避免『設計過度（Over Design）
』。

運用視覺深度的暗示：
讓介面呈現立體化、更擬真、更易說服使用者融入介面的風格。比如
３Ｄ遊戲軟體的擬真場景：＜圖 2-3＞迷霧之島〈RIVEN〉裡真實又
虛幻的場景，不論是貼圖的材質、擬真場景的塑造、以及夢幻的氛圍，
讓使用者融入介面的所呈現的世界。另一個例子為：網頁裏立體浮現
。＜圖 2-4＞解
的按鍵、以及按鈕按下之後的回饋（按鈕陷下的感覺）
釋了如何用繪圖工具達到這樣的效果：比如 Adobe Photoshop 圖層裡
的陰影、浮雕、KPT 5.0 的 Shape Shifter、Eye Candy 的按鍵繪圖功
能。

二—9
＜圖 2-3＞迷霧之島 Riven: The Sequel to MYST ，由 Rand and
Robyn Miller 兄弟合組的 Cyan 公司製作，1997。

＜圖 2-4＞如何用繪圖工具達到立體的效果：Adobe PhotoShop 的圖
層特效。

Corel Draw 的互動式陰影。 KPT 5 的 ShapeShifter 特效。

二—10
＜圖 2-5＞群組、視覺架構的重組。利用參考線來控制視覺架構。

群組、視覺架構的重組
使用線框、底線、善用『留白』等方式來區隔類別＜圖 2-5＞，用
色彩或其它視覺技巧突顯圖像中的重點。必要時，不要吝惜使用空
白。讀者可參閱第三章的視覺傳達設計﹕組織與視覺架構。

資訊的階層
資訊的階層(Information Hierarchy)有益於介面的易讀性。Hierarchy
原意為中古世紀裡階級分明的僧侶制度，在資訊科學及介面設計裡
則強層級分明的樹形結構。將資訊階層化之後則可讓最重要的資訊
能突顯而最先映入眼簾，次要的資訊則井然有序的排列下來。此外，
對於較複雜的概念應加以分段處理，同時使用數序與文字(如『下一
個是…』或『二者之前後次序為…』)來導引訊息的先後次序，讓介
面的階層顯現出來。

二—11
 教育媒體介面的應用
當設計教學媒體時，必須考慮學習者的經驗背景與學習情境，提供符
合期望的知覺經驗。在製作上，對於主題內容的選擇，用語遣辭的複
雜程度、例子的選擇、視聽訊息的呈現速度等因素都是影響知覺的重
要因素，須慎重處理，如此教學傳播將可更有效，學習經驗則愈增強。

實務上必須注意：訊息的呈現方式愈能符合知覺的特質，愈能在記憶、
概念形成、問題解決、創造力及態度等各認知層面上有較好的效果。
此外，編排整個教育媒體架構時，應該將相關或類似的觀念一起呈現，
幫助學習者辯識異同。使用組織綱要，如標題、次標題等，幫助學習
者將複雜的概念分段處理、階層化。

第二項 注意力(Attention)
人的注意力是很有限的：集中注意某一項事物時，對其他事物的注意
就隨之降低。雖然的感官一直受到視覺、聽覺，嗅覺等的持續刺激，
為了要使這些大量的資訊變得有意義，我們的認知處理限制了在某一
時刻我們可以注意的資訊的數量。心理學家稱這種過濾式的行為為『選
擇性的注意(selective attention) 』，而『選擇』乃依據個人的意願或
當時最能引起個體注意所作的決定。就因為如此，人們在任一時間內
要執行超過一件工作的能力是有限度的。

實務運用
由於我們的注意力是有限度的，因此在介面設計時，必須注意：

如何讓使用者將注意力集中在所需處理的資訊上(例如：如何顯示嚴重
的錯誤訊息)？此外，人們是容易分心的，如何再度獲得他們的注意力
而不讓他們遺漏任何重要的資訊呢？如何允許使用者在執行某項操作

二—12
時，可以切換執行不同的操作？

有許多技巧可以警示和導引使用者的注意力，它們包括11：

以邏輯化及有意義的結構呈現資訊(請參閱第三章) ，來幫助使用者找
到相關的資訊。比如將螢幕劃分成為分散或重疊的區域或視窗，使每
個區城自然地與特定資訊相關聯，如此使用者便可以切換執行不同的
操作。

使用各種不同的視覺上的標記(visual marker:如，閃爍，加底線，加
粗)以及聽覺上的提示(如：警告聲)以獲得使用者的注意力。

在教育媒體介面的應用方面，必須注意：因為注意力是選擇性的，故.
呈現教材時必須控制觀點的範疇，一次以呈現一個步驟為主，以免學
習者因選擇性知覺，而有所疏漏。此外，設計教材時必須首先能引起
學習者注意，並且能持續維持其興趣。

第三項 人類資訊處理
當使用者與介面互動時，即是使用者心智上進行一系列資訊處理的過
程。在認知心理學中，人類資訊處理(Human information processing)
的程序包括下述的過程〈前圖 2-1〉：

1. 解碼：使用者接收到的刺激或資訊可以看作是編碼的形式。在解碼
的過程中，由環境所獲得的資訊會被處理並改建結構以形成大腦可以
理解的格式，此過程在先前的章節裡則類似於感知的過程。然後比較

11
PsychologyPreece, Jenny. A Guide to Usability-Human Factors in Computing. Chapter 2:
The Human Element:Applying Psychology (p.21-37) . Addison Wesley. 1993.

二—13
此種格式與先前儲存在大腦中的格式。實際用於解釋介面操作時則
是：使用者操作介面的第一步，通常會瀏覽、觀察螢幕的內容，比如
檢視功能表的選項、看看工具列、所有的指令。之後使用者回憶起以
前類似軟體的操作經驗，想起以前曾經得到的結果。

2. 決策：在此步驟，使用者將所有的資訊整理起來，將不同的經驗綜
合比對，之後決定適當的反應。

3. 行動：組織一個反應以及必要的動作。執行動作、作出控制，比如
用滑鼠點選所須執行的選項，或根本選擇不行動，轉而探求其它的功
能。

第四項 記憶 (Memory)
人類所有的行動都與記憶力有關。操作產品、使用電腦都需要記憶力。
假若缺乏記憶力，我們可能無法執行某些動作，比如使用滑鼠、或如
何在網路購物裡順利結帳，因為我們無法記住上述動作的方法及程
序。然而人類記住事物的能力卻是高度變化的，特別在使用介面時：
有些操作相當直接，只要很小的努力去記憶，有些卻似乎要花一輩子
去學，並且通常是操作過後馬上就忘了。

在認知心理學家的研究中，記憶被視為是一種處理訊息的方式。記憶
可分為三個階段：解碼、貯存，和提取（請看第一章『人機系統的資
訊處理』）。人類的記憶可概分為三個分離的記憶系統，分別是感官記
憶、短期記憶，及長期記憶12＜圖 2-6＞。

12
Zimbardo, Philip G. 原著，游恆山編譯。Psychology and Life。心理學。中華民國77年11月
初版。
二—14
 感官記憶 ＜圖 2-6＞感官記憶、短期記憶，及長期記憶。

感官記憶對外界刺激進行解
碼，此能量被改變為一種神經
碼。注意力的集中和型態辨認
有助於感官訊息進入短期記憶
之中。雖然感官記憶具有頗大
的容量，但期限相當短暫，若
無法進入短期記憶之中，幾乎
在一瞬間便消失了。

短期記憶
短期記憶是對現況的記憶。記
憶的儲存很自然，提取也很容
易。短期記憶在日常生活裡扮演很重要的角色，它讓我們記得一些字、
名字、片語、和工作的一些項目。它用來做為一個臨時的、進行中的
記憶。可是這個記憶很脆弱，萬一有外界分心的干擾，這短期記憶就
13
消失掉。短期記憶的存量是很有限的(7±2 個項目) ，若沒有複誦的
14
話只能維持 20 秒左右 ，若加以練習、重複，也許可以記上 10 一 12
個項目。比如可以儲存一個五位數的郵遞區號，或一個七位數的電話
號碼(從查號到撥電話)。萬一在撥電話之前有一個外來的干擾，那麼，
那個號碼很可能就被遺忘了。

13朱新明，李亦菲。架設人與電腦的橋樑：西蒙的認知與管理心理學。城邦文化發行，2001。
西蒙認為，短期記憶的容量可能達不到七個組塊，而只有四個組塊。根據這些實驗結果和理論分
析，可以得出這樣的假設：人在短期記憶中能夠很快地記住少量的訊息，其容量只有七個(或四
個)組塊
14
Zimbardo, Philip G. 原著，游恆山編譯。Psychology and Life。心理學。中華民國77年11月
初版。
二—15
感官記憶和短期記憶中的資料都可以被轉入長期記憶中，訊息只有在
長期記憶才受到意識上的處理。

長期記憶
長期記憶構成個人對世界以及對自我的整個認識，有意義的組織與結
構是使資訊能進入長期記憶的關鍵所在。長期記憶的容量是不受限制
的，訊息若是愈為熟悉、結構若是愈為健全，則訊息的保留將會愈好。

存在長期記憶的訊息並非實際事物的正確寫照，而是根據我們對事物
的了解後，加以詮釋15。由於人類的解釋過程可能各不相同，也可能
是經過扭曲的，因此我們能從長期記憶提取一件事物的正確性，高度
受制於當初這件事物發生時我們如何加以詮釋。

另外，專業知識也保存於長期記憶之中，這些知識既包括關於某一領
域的事物和對象的知識，也包括許多與之有關的線索，這些線索使專
家能夠方便地提取有關的知識16。

關於人的記憶有數個理論，其中一個理論是我們的記憶就像相簿一
樣，一張張整整齊齊排列。這是個錯誤的理論17，人的記憶不太可能
像一套相片或線性排序的錄音帶。事實上，記憶把很多事情黏糊在一
起，使事物混亂不清，並常把單獨事件一些細節遺漏掉。

記憶結構：基模理論(schema theory)
基模理論認為記憶就像文件存檔:文件與文件之間的關係加以註明，而

15
設計心理學 The Psychology of Everyday Things. Donald A. Norman著/卓耀宗博士譯
16朱新明，李亦菲。架設人與電腦的橋樑：西蒙的認知與管理心理學。城邦文化發行，2001。
文中引述Herbert Simon的論述。
17 Norman, Donald A. The Design of Everyday Things. Basic Books Inc., New York, 1988.
二—16
聯繫成一個龐大、複雜的網路。這個理論有其道理，並且也許是當今
最主要的理論18，這個理論有數個命名：基模理論(schema theory)、
框架理論(frame theory)、語意網路(semantic networks)、和命題編碼
(propositional encoding)。基模理論實質上由三個看法組成：(1)記憶
結構單位具有邏輯和次序。亦即有其綱目和框架，就像電腦的檔名與
檔案路徑。(2)人的記憶是連鎖性的，綱目與綱目之間有互相的關係、
組成網路。(3)我們推理的能力大都是應用某綱目裡面的訊息去推演另
一個綱目的特色。第三點可以用下列的例子來說明：一旦使用者知道
所有在電腦繪圖軟體的筆狀的符號都可以拿來畫出線條之後，他便了
解下一次在另一套軟體看到筆狀的符號時，可以肯定那是可以畫出線
條的工具。也就是說，使用者無須一個一個去觀察、嘗試這些筆狀符
號才會知道這個事實。認知心理學家稱這個為『自動設定值』(default
value)。除非有什麼例外，否則的話，使用者所學到的一個一般概念
應該能應用到這個概念下的每一個單獨情境。使用者也能學習一些例
外，諸如：除了鉛筆的符號工具會畫出鋸齒狀的線條外，所有的筆狀
符號畫出來的線條都是會暈開的。推論是人的記憶一個很有用、很強
大的功能。

實務運用
設計介面時，設計師有兩項原則可以遵守，可以讓使用者所需的記
憶最小化：

1. 提供選項，而非輸入。在記憶力研究中，已經確定的發現是人們由
螢幕上『認出』(recognize)資料要此不看螢幕而試著去『回憶』(recall)

18 Norman, Donald A. The Design of Everyday Things.

Chapter 7: User-Centered Design P.199. Basic Books Inc., New York, 1988.
二—17
資料要簡單的許多。使用者常常會忘記，但是電腦相反。許多系統採
用大量的指令名稱，這些指令雖然反應其系統基礎的理論或概念的意
義，然而它們卻是相當晦澀難懂的。界面不應該要求使用者打入指令，
而是應該由界面提供選項，並且讓使用者選擇，以避免使用者強記精
確的句法或拼字。實務設計時必須考量此一現象，例如，利用常見的
功能表 (menu) ：使用者不必再去學習與『回憶』晦澀的指令名稱或
指令縮寫集合，僅需要去『認出』功能表的選項並選擇它。

2. 可預知的行為模式。在與介面互動時，使用者在內心裡，形成自己
對於互動的事物的心智模型〈請參閱本章第三節第一項〉
。為了理解這
些人與物之間的互動，這個模型提供了預知的與解釋性的能力。因此，
設計師必須將介面設計的易於理解、易於讓使用者去「猜測」
、「預測」
出介面的行為。只要記得一些介面的特性和例外，使用者便能容易地
執行一些細節的操作。

第五項 學習 (Learning)
凡是個體在學習到新的知識或技能之後，改變想法、修正行為都是學
習的結果。任何人的學習歷程都是獨特的個別經驗，而學習怎樣使用
介面更是一個複雜的過程。許多設計師並不真正領悟此點，他們較在
意於美學的風格建立、而忽略了如何輔助使用者如何去學習、使用介
面。設計師常常錯誤地把使用者當作被動的學習者，期望他們能夠閱
讀使用手冊，自行吸收學習介面的操作方式。設計師必須要瞭解到，
事實上極少數的使用者能夠以如此的方式學習：那些只獲得一本厚重
使用手冊，並被告知『唸懂它你就會用了』的人通常很快就放棄了。
那些沒有放棄而堅持到底的人，經常學到沒有效率的使用方法，或僅
使用一部份可用的功能。

二—18
 實務運用
學習介面的操作需要『主動的參與 (active involvement)』
。在此階段，
使用者將會倚賴許多不同的主動的學習策略，包括：

由實作、錯誤中學習
人們較喜歡實際的操作，並看到操作的結果，而不喜歡痛苦地讀一本
使用手冊。因此編制手冊時，可以採用精簡式的使用手冊(minimal
manual)，讓手冊的內容大量的減低，並以『作業』導向式編排。此
外，由錯誤中產生的回應能幫助使用者去學習及瞭解操作。學習者亦
可由他們工作的情境與環境所獲得的資訊和提示(cues/hints)中學
習。第三章的『容錯與親和性』也將會進一步述及：介面的操作必須
容許使用者犯錯，讓使用者感到舒適的心理狀況下去學習、去操作介
面，便能帶給使用者親和感，更進一步鼓勵人們無後顧之憂地探索學
習所設計的介面。

由主動思考中學習
使用者需要去瞭解一個介面是如何運作的，並瞭解介面為何會做某種
反應。使用者藉由自行學習的解決方式，及特別的推理，來試圖去瞭
解產品。如果介面對使用者是不夠『透明的』
，使用者可能會對介面產
生誤解而導致不正確的操作。

由訂定目標與(知性的)計劃中學習
使用者在內心中有某種目標，而他們必須把此目標轉換成一種行動的
計劃。欲完成某一目標，使用者的行動必須配合介面的運作以達成所
預定的目標。經常的情況是，因為使用者的行動和介面運作無法配合，
而錯誤百出。

二—19
 由類比中學習
使用者將一個不熟悉的系統與一個先前已學習過的系統、或已熟悉的
概念相比較(例如，一個文字處理器就『像是』一個打字機)。這是一
種最普遍的學習方式，也就是運用『隱喻』(metaphor)的力量，由介
面提供使用者熟悉的隱喻。現實世界的隱喻將會帶給使用者熟悉的預
期19，如此可讓使用者能利用他們先前已有的知識於介面的使用上，
加速學習、簡化學習。由於隱喻的使用極為重要‧本章的第三節第二
項的「在使用者介面中使用隱喻」皆有專節的討論。

漸進輔助式學習(The training wheels)

Training Wheels 是指在小朋友的小腳踏車後輪旁的兩個小輪子，用以
防止摔車。一個系統的最初功能僅被限制於簡單的操作，以防止使用
者執行任何可能造成巨大且不必要的後果之行動。在編排使用手冊的
內容時，亦應考慮使用者是初學者或進階使用者，『因材施教』，而依
使用者的程度、背景提供適當的教學方式。

第三節 諾曼的日常認知心理學
本節主要的內容在於介紹唐納‧諾曼（Donald A. Norman）博士所宣
揚、傳述的認知心理學原理與設計上的應用。其實，本節所討論的各
項心理學原理應該散布於本章的各段落，但是由於諾曼所引介的幾個
觀念對設計界影響巨大，故以專節討論之。他最重要的觀念諸如心智
模型、預設用途、使用限制、可見性、匹配、回饋、預防錯誤，都是

19
在1987，蘋果公司首次發表了下列三項一般性設計原則： 1. 在電腦環境裡，現實世界的隱喻
將會帶給使用者熟悉的預期。2. 立即的回饋將會帶給使用者似乎直接操縱現實世界物體的感
覺，這也提供使用者有價值的和適時的資訊。 Apple company. Human interface guidelines:
The Apple desktop interface. MA: Addison-Wesley. 1987.
3.看到點到See-and -point (而非記憶與輸入)，可以獲得使用者的信任而相信自己的記憶。
二—20
介面設計理論與實務上不能忽視的議題。

誰是唐納‧諾曼（Donald A. Norman）博士？
諾曼教授是當代知名的心理學家與當代認知心理學應用先驅，也可說
是工業設計界公認的焦點人物之一，他除了在認知科學領域中表現傑
出之外，對工業設計師與研究者的觀念也有很重要的影響20。

諾曼教授專門鑽研人的記憶、思考、注意力和知識。他的教育背景是
電機工程與認知心理學，曾任教於賓州大學、哈佛大學，最後擔任加
州大學聖地牙哥分校認知科學系的首任系主任，並在此校講授『認知
。退休後擔任蘋果公司副總裁，１９９８年創立 Nielson Norman
工程』
Group，專事電腦使用者介面設計工作。比較重要的著作包括 Memory
and Attention〈1976〉
、User Centered System Design〈1986〉
、The
Design of Everyday Things〈1988〉
〈中譯：設計心理學，遠流出版，
2000〉
、Things That Make Us Smart〈1994〉
〈 中譯：心科技，時報
、The Invisible Computer〈1998〉。
出版，1995〉

20
王鴻祥。評介唐納諾曼之認知取向設計理論。使用者認知的心智模型分類之研究。86年技術
與教學研討會論文集。明志工專。1997年。王鴻祥雖然承認諾曼的立論對於工業設計師確實有
一定的影響，卻也提出諾曼值得商榷的地方：包括他受制於強烈的實用主義傾向、對於意識形態
的冷慼、對社會心理學的漠視和對設計史的生疏等。這在一面倒的對諾曼推崇的風潮中，值得一
讀。

二—21
〈圖 2-7〉心智模型、設計模型、系統印象〈改繪自 Norman, Donald A.. 1986.〉

第一項 心智模型、設計模型、系統印象
心理模式可區分為三類：心智模型、設計模型、系統印象。＜圖 2-7
＞描述了三個模型的關係。

『心智模型』決定了使用者對系統的了解，為了理解人與物之間的互
動，這個模型提供了預知的與解釋性的能力。心智模型的產生大都由
於使用者心中認為該物「具有何種功能」
，以及「可見的構造」。事物
的可見構造則稱之為『系統印象』
。設計者必須確定他所設計的系統顯
現出適宜的系統印象，當系統印象錯亂、不適當時，使用者就很難使
用這東西。設計師內心則有一個『設計模式』
，設計師則根據設計模式
開始設計一套用、能學、能作用的系統，使用者才能獲得適宜的心智
二—22
模型，輔佐他們把意願轉變成行動，順利地與介面互動。

以下詳細介紹上述三類的心理模式：

心智模型（Mental Models）
一個簡單的應用心智模型的例子是﹕讀者試著去想想家中有幾扇窗戶
或有幾個房間。回答這個問題時，大多數的人可能藉由想像走入自己
的家門，在自己在家中走一圈、或是站在某個角落轉著眼睛，以數數
窗戶或房間的數目。這便是執行心智模型的過程。

當使用者與任何事物產生互動(不論所處的環境，或互動的對象是其他
的人們或科技產物)，使用者透過觀察、導引、以及推理，在內心會逐
步形成某種『心智模型』，又稱為『使用者模型 (User’s Models) 』。
這些模型通常並不需要是非常精確的，然而它們必須可以實際運作
的，可以提供使用者預測及解釋互動行為的基礎。藉由與系統進一步
的互動，使用者繼續修正其心智模型，以讓操作更為順利，也讓心智
模型更接近系統印象。

心智模型的作用
心智模型的作用就是讓使用者在全新的狀況下，能夠想出下一步如何
操作、預測下一個狀況可能為何。尤其當使用者操作介面遭遇困難時，
心理模式可以幫助使用者推論到底發生了什麼事？下一步應該做什麼
事。如果使用者的心智模型是錯的，那使用者對狀況的了解和預測也
會是錯的。如果介面能讓使用者形成正確的心智模型，便可以讓使用
者的學習加速，若有情況困難時，也能比較容易、正確地找出問題所
在。

二—23
舉例而言，＜圖 2-8＞是黃淑芬的網頁 ＜圖 2-8＞黃淑芬的網頁標題選項

設計，當瀏覽者首次按到豆子時，選項 設計，2002。

目錄便像發芽般長出來。幾次的互動下
來，使用者便能夠理解﹕按下豆子與選
單的關係。另一個好例子是吳昆家先生
設計的電腦輔助設計的操作介面＜圖
2-9＞。在這獨具創意的例子裡，利用
硬體的特製滑鼠旋轉與滾輪的操作，與
軟體的雙層轉盤功能表互相呼應。當使
用者多次操作下來，經由『直接操作的
直覺』與『空間的類比』的輔助，讓使
用者的心智模型逐漸成形。當使用者操

作遭遇困難時，此心智
＜圖 2-9＞電腦輔助設計的操作介面：硬體與軟體互相
模型可以輔助使用者推 呼應，形成心智模型。吳昆家，2001 年。
論原因所在，產生出可
能的解決方式。

系統反應的不一致亦會
讓使用者心智模型無法
形成。舉例來說，視窗
系統上，將檔案拖放到
『另一個』磁碟機上時，此動作代表的是『複製檔案』
。但是，把同樣
的檔案拖放到『同一個』磁碟機內的檔案夾中，此動作代表的是『搬
移檔案』
。同一動作卻有不同結果，極易令使用者混淆。因此，每當執
行這項指令時，使用者常常無法記起自己剛剛執行的是『複製檔案』
或是『搬移檔案』的動作，原因在於心智模型無法合理地建立起來。
二—24
若是執行的檔案較為重要，使用者會花雙倍的時間確認檔案到底最後
去了那裏？或原來的檔案已經被『搬走』或只是被『複製』而已。解
決之道可能是在執行的當時提供立即的回饋，比如滑鼠游標上出現複
製與搬移兩種可分辨的不同圖像，或是執完畢時，提供不同的視窗說
明，讓使用者知道剛剛做了什麼？。

設計模式（design model）
設計模式是設計者心中對產品的概念，是設計師們認為系統應該如何
運作的方式，又稱為『概念模型（conceptual model）
』。當設計師構
築介面時，必是環繞在一個概念模型之上，這個概念模型應該得以控
制整個系統的人機界面，適當的呈現設計對象，而且理當是精確而具
體的、一致性的、和完整的。理想的狀況是設計模式和使用者的心智
模型一致。

系統印象(system image)
使用者與設計者之間的溝通在於系統本身，而使用者的心智模型的建
立，主要來自於系統印象。系統印象包括與使用者介面的互動、介面
外觀、系統反應、說明文件、和使用手冊。使用者通常只能發展出系
統部份的心智模型，這心智模型通常都會被簡化、或甚至扭曲。因此
設計者必須確定該產品各方面都與適當的心理模式一致，讓系統印象
達到『透明化、一致化、支援化 (transparent、coherent、supportive)』
。

二—25
 第二項 在使用者介面中使用隱喻
設計一個能讓使用者發展出合適的心智模型是相當重要的。其中一項
重要技巧是設計出明白、清楚、合適的介面隱喻(metaphor)。當介面
缺乏具體的模式、以便讓使用者進行類比推理時，
『隱喻』也可以擔負
起引導使用者的任務＜圖 2-10＞。＜圖表 2-11＞提供了一般隱喻相關
應用的例子。例如把文字處 ＜圖 2-10＞電影『桃色機密〈Disclosure〉』裡
理軟體(比如 MS-Word)隱 的現實世界的隱喻：功能操作板。

喻成『打字機』。

設計師須要注意的是：不該
使用太難理解的隱喻，或需
要太多想像的隱喻。使用者
需要能迅速瞭解介面的架
構，開始使用它。設計師應
該使用現實世界的隱喻21：將會帶給使用者熟悉的環境，以協助使用
者建立起可以運作的心智模型〈次頁圖 2-12、圖 2-13、圖 2-14＞。

21
在1987，蘋果公司首次發表了下列三項一般性設計原則： 1. 在電腦環境裡，現實世界的隱喻
將會帶給使用者熟悉的預期。2. 立即的回饋將會帶給使用者似乎直接操縱現實世界物體的感
覺，這也提供使用者有價值的和適時的資訊。3.看到點到See-and -point (而非記憶與輸入)，可
以獲得使用者的信任而相信自己的記憶。 Apple company. Human interface guidelines: The
Apple desktop interface. Addison-Wesley. 1987.

二—26
＜圖表 2-11＞ 隱喻相關應用的例子。
應用領域 隱喻 意義
作業環境 桌面 辦公室的作業、檔案管理
文字處理軟體 打字機 打字紙張的格式
試算表 記帳簿 數值化的表格
超連結文件 疊在一起的筆記卡片 有彈性地組織結構化的文字
多媒體環境 房間(每個房間與一個不同 建築物的空間結構
的媒體或作業相關)、劇院
電腦求助系統 擬人化的代理者 知識，與社會文化相關的

適切性：如何決定何種隱喻最能配合某些操作？比如如何設計與選擇
文字編輯器中存檔、列印等圖像？其主要的決定因素在確保使用者熟
悉的領域之動作、程序及概念儘可能的與呈現於使用者介面上的應用
程式結構相契合，達到適切性。此外，讓使用者瞭解隱喻的限制也是
相當重要的。

隱喻的問題：當隱喻不適切時將會混淆使用者已建立起來的心智模
型。舉例來說，在麥金塔電腦介面的桌面(desktop)隱喻上，垃圾筒除
了當做裝置廢棄物品的容器的隱喻，同時也是執行退出磁碟片功能的
圖像。當使用者希望將磁碟片自磁碟機退出時，必須將磁碟片拖放
(drag－and－drop)到垃圾筒裏，這動作卻暗示使用者必須『丟棄』磁
碟片以便取出它。這種明顯矛盾的情況可能會引起初次使用者心智模
型無法運作的問題，因為使用者很容易的聯想到如此的操作會造成磁
碟片上的資料被刪除。

二—27
〈圖 2-12〉電影『桃色機密〈Disclosure〉』裡的數位資料庫：圖書館的隱喻。

〈圖 2-13〉電影『桃色機密〈Disclosure〉』裡的數位資料庫：權限不足的區域：使用
現實世界隱喻『深淵』。

〈圖 2-14〉Nike 網站的互動產品瀏覽器，放大鏡的隱喻。www.nike.com，2002。

二—28
 隱喻的設計：
發展出適切的隱喻是一件具有挑戰性的工作。其重點在於時間的壓力
之下，如何利用創意設計，如何排除主觀認定、以選出合適的構想。

創意設計﹕基本上，隱喻的創造過程與完整的工業設計程序無異。首
先必須了解前後的架構、介面的環境、以及使用者的背景。其次進行
隱喻的構想發展、修正。最後，對所有產生的構想進行評估，以選出
合適的構想。

構想發展時，筆者常會要求如附圖＜圖 2-11＞的格式，幫助設計師做
較深入的思考。設計過程中，設計師必須被要求提供出一定數量的構
想後才能進行評估，如此可避免設計師一開始便一廂情願的主觀認定
最初的構想已達到滿意的水準，而不願意再進一步探索其它的可能性。

＜圖 2-15＞中，隱喻的欄位裹，設計師可以使用腦力激盪的方式，快
速的想出可能使用的語意（用簡短的文字來表達）
、圖案。其它兩欄則
讓設計師把隱喻細節的描述與意圖表達的意義寫下來，有助於設計師
在心中釐清想要表達的內容。

二—29
排除主觀認定的 ＜圖 2-15＞隱喻的發想輔助表格
評估﹕在隱喻的
設計裏，主觀的成 隱喻 描述 意義
攝影棚用的攝影機 家庭自動 攝影
份佔有很大的份 ｖ８ 化的影像 監看
數位相機 監視系統
量，設計師必須充
分自覺到這一
點。不管經驗如何
豐富的設計師，在
構想提出之後，必
燈泡、日光燈 家庭自動 燈光的
須有第三者的介 化的燈光 開、關
電源控制
入幫助，才能加以
客觀的評估。不管
是否只是徵詢同
儕的意見、尋求較
‧‧‧ ‧‧‧ ‧‧‧
有經驗的介面專
家的協助、或甚至
執行澈底廣泛的
使用者介入評估調查，這一步驟是絕對不能缺少的。

二—30
 第三項 預設用途、使用限制(constraints)
介面如何引導使用者採取適當的行動？有一些重要的示意是來自物件
的『自然局限』
，這自然局限縮小了可行方法的種類。另一套示意來自
物件的『預設用途』
，這預設用途告訴使用者這物件的可能用途、可做
的行動和功能。例如，一個空箱子的預設用途是用來裝東西等等，如
果這是一個遊戲，可能代表著玩家必須在箱子裝入某些寶物才能過
關。物件的預設用途告知使用者這物件如何移動，能支持其他什麼物
件，有其他什麼東西可以放入其中，放於其上或其下，如何提拿這物
件，哪些部件能動，哪些部件下能動。預設用途示意可能性的範圍，
而自然局限限制了可行性的種類。

與介面有關的局限的方式一共有三種：物理的、意義與文化的、和邏
輯的。物理的局限(Physical constraints) 依賴物理世界的性質來決定
操作，限制了硬體介面可能的操作方法。比如一個ＵＳＢ接頭不可能
插入印表機的平行埠裏，因為大小不對〈圖 2-16〉。筆記型電腦的特
製電池只能裝入某個特定位置，因為這個位置的外框的造形只能配合
電池的大小，而無法裝入其它形
〈圖 2-16〉ＵＳＢ接頭的物理局限。
狀的硬碟盒或ＣＤ ＲＯＭ盒，
而且只能只能從一個方向裝
入，其它的方向也插不進去。假
如物理局限應用得好，容易了
解，則可能讓操作方法很有限，
至少可以把希望使用者做的動
作限制下來，減少訓練的努力。

二—31
意義與文化的局限、邏輯的局限與下一項次將會詳細介紹的『自然配
對』有關。意義與文化的局限根據一些為人接受的傳統與普遍性的知
識而限制了可行性。例如組裝玩具警車時，因為紅燈傳統上與『停』
有關，所以應裝在車子的後方。白色或黃色燈傳統上是車子前燈的顏
色，所以應裝在車子的前方。最後，警車通常在車子上方裝有藍閃燈，
所以應該裝在上方。

自然配對的功用也提供邏輯的局限，常常藉由心理上的同理心來運
作。比如兩個電燈開關，左開關控制左邊的燈，右開關控制右邊的燈，
這就有很好的自然配對。反之，如果燈的排列和開關的排列不一樣，
那麼自然配對就被破壞掉。

第四項 可見性 (visibility)

可見性是指介面必須要『一目瞭然』
。讓使用者容易、立即地看清楚操
作的方式和產品的功能，同時不費力的明白介面是處於何種狀態？使
用者可以執行哪些操作。所見即所得即是一個適當的解釋。

所見即所得（WYSIWYG）
所見即所得，這是當時蘋果電腦推出 Mac OS 介面時所聲稱的優點，
引起很大的迴響，其實這也是圖形介面一直想達到的一個目標。所見
即所得，也就是 What You See Is What You Get（WYSIWYG）
，代表
著介面將內在的所有功能呈現出來，呈現出來的外貌將會與最終所得
到的結果無異22。

22
Apple company. Human interface guidelines: The Apple desktop interface. MA:
Addison-Wesley. 1987.
二—32
＜圖 2-17＞3D 軟體 Pro/E。作者所繪，駱可公司的 WebPAD/PDA 3D Model。2002。

其中最好的例子便是當今的文書處理：使用者在螢幕所見的將是以後
印刷出來的結果。使用者可以完全控制文件的內容和格式，尤其是版
面編排及字型選擇。當使用者對文件進行變更時，介面可以迅速和直
接顯示出結果；使用者不需要在心中先模擬印刷的結果，也不必像早
期的排版軟體那樣，利用指令去控制文件的格式，直到最後文件打樣
時，才知道最終的結果。又比如目前的 3D 軟體＜圖 2-17＞，設計師
直接切、削塊體，電腦立即呈現操作的結果。視窗中所見的最終 3D
模型，大概會很接近實際生產的樣子。而不必像早期繪製三視圖，常
常設計師心中所想的，與模型廠所建出來的，甚至與機構工程師所設
計的，存有很大的差別。

二—33
 『層次』型的介面
不要在介面裡隱藏任何功能。當需要某些功能時，人們應該能看到它
23
。例如, 選單(menu)可以列出指令 ,使用者便得以從選項中做出決
定，而不必記憶住指令、用鍵盤敲入指令。

人們應該能在介面裡找到 ＜圖 2-18＞『層次』型的介面。 Corel

所有的指令。假若設計師 Draw 9。
必須隱藏某些功能，必須
提供足夠的資訊給使用
者，讓他了解是不是有其
他的選項。所謂『層次』
型的介面，會將使用者需
要的資訊一步一步有層次
地傳達出來，當使用者必
須作某些決策時，適時適
地的提供選項。＜圖 2-18
＞顯示出隱藏選項的同
時，如何也導引使用者若
按下小三角形時，將會題
示出更多的選擇。

23
Apple company. Human interface guidelines: The Apple desktop interface. MA:
Addison-Wesley. 1987.
二—34
 第五項 配對(Mapping)
配對(Mapping)意涵兩個物件(事物)之間的關係24。對介面設計而言，
這是『使用者進行控制』
、
＜圖 2-19＞配對的意義。
『機器接受控制之後的變
化』
、與『真實世界裡所產
生的結果』之間的關係。
藉由心理上的類推法(同
理心)、以及下述提及的
『空間的類比』、『物理環
境的類比』
、以及『文化線
索』
，常常可以提供立即有
效的理解。＜圖 2-19＞描
述了配對的觀念。

以駕駛汽車為例，駕駛意圖右轉時，便將方向盤向右順時針旋轉（使
用者進行控制）。由於駕駛者看到了前方景物的變化（回饋），確認汽
車己經向右轉（機器接受控制之後的變化）
。這其中存在著『空間的類
比(spatial analogy)』的關係﹕「順時針旋轉方向盤」與「右轉」有關。
這個配對代表著使用者（駕駛）知道﹕「想要的」與「得到的結果」
有著密切的關係＜圖 2-20＞。

又以移動滑鼠為例，使用者意圖將游標右移時，便將滑鼠向右推（使
用者進行控制）。由於使用者看到了游標的移動（回饋），確認游標己
經向移（機器接受控制之後的變化）
。操作者瞭解這其中的配對便是﹕

24
Norman, Donald A.. The Design of Everyday Things. Basic Books Inc., New York, 1988.
二—35
「滑鼠向右推」與「游標右移」有關（也是一種空間的類比）
。這種配
對關係可以清楚理解，很容易學習，介面提供立即的回饋，而且不易
遺忘＜圖 2-20＞。

＜圖 2-20＞自然與不自然的配對。

配對是指每一個操作動作都直接匹配到想要達到的功能，除了必須考
慮到上例的『空間的類比』之外，另外需考慮的則是『物理環境的類
比』與『文化線索』
：

二—36
物理環境的類比﹕有些自 ＜圖 2-21＞筆記型電腦的可充式電池
然的配對在不同的社會裡 的電量指示燈。
仍然一樣。比如說：昇高表
示增加，降低表示減少。音
量大表示聲音大。音量、重
量、長度和亮度部屬於持續
可增性的變數，其調整程度
可以一步步不間斷地增
加。比如＜圖 2-21＞的筆記
型電腦的可充式電池的電量指示燈，當剩餘電量越多，燈號則一一往
上昇高。然而，聲音的頻率和量之間卻無同樣的關係。頻率高並不表
示某變項多或少。頻率、味覺、色彩
＜圖 2-22＞家庭自動化介面：利用室
和 位 置 都 屬 於 替 代 性 的 變 項 內透視圖與自動化控制配對。沈敬
(substitutive dimensions)：替代一個 于，2002。

值來做改變。

空間的類比﹕嚴格來說，其實空間的
類比屬於物理環境的類比之下。此類
比要件是：
「控制」和「它所控制的對
象」之間有一個空間上對等的關係。
同樣的，控制移動的方向，也應與它
所控制的部件的移動方向一致、或至
少是類似的。假若無法把控制部分直
接安排在被操作的系統之上，至少應
該把兩者安排成具有類比的關係＜圖
2-22 ＞ 。 設 計 者 可 以 利 用 空 間 的 類

二—37
比：把控制器往上移表示把 ＜圖 2-23＞的汽車座椅控制鈕。利用空間的類
比。
物件也往上移，比如＜圖
2-23＞的汽車座椅控制鈕。
或是為了控制一排燈的開
關，可以把開關排列成和燈
的排列一樣。

文 化 線 索 ﹕ 即 是 Cultural
Cue ， 或 稱 文 化 的 準 則
(cultural standards)，例如按
下電源開關表示打開電燈，交通號誌的「紅燈停，綠燈行」。

自然配對
自然配對就是把配對關係設計得合宜、正確。下面列出了五個項目，
每個項目各包含前後兩件事物。設計師設計介面時，必須輔佐使用者
能了解、並決定下列前後兩件事物之間的關係連結：

1. 使用者意圖 / 可能的行動

2. 行動 / 行動對系統的影響

3. 實際的系統狀態 / 被視覺、聲音、感覺感知的系統狀態

二—38
4. 被感知的系統狀態 / 使用者的需要、意圖、期望25

25 Norman, Donald A. The Design of Everyday Things. Chapter 7: User-Centered Design

P.199. Basic Books Inc., New York, 1988.
二—39
美國住家廚房裡的電爐或瓦斯爐 ＜圖 2-24＞自然配對不良的爐具。

和控制開關的排列，是自然配對很
好的例子，可以用來說明自然配對
如何大大減少訊息存於腦中的需
要。如果自然配對不良，使用者就
不能馬上決定哪一個開關控制哪
一個爐利用空間類比來減少記憶
的負荷，＜圖 2-24＞顯示了如此
的情況，由於使用者無法將之配對
起來，只好在旋鈕下方加上文字標 ＜圖 2-25＞自然配對。

示。

如果一個設計要靠文字標示，可能
就是項錯誤的設計。標示固然重要
且有時是必要的，可是如果適當地
應用自然配對原理，就可大大減少
使用標示的必要。當設計師考慮要
用標明時，想想是否有其他設計的
方法，比如＜圖 2-25＞就是自然
配對很好的例子，並不須要加以文
字標示使用者便能理解。

二—40
 實務運用
＜圖 2-26＞為筆記型電腦的可 ＜圖 2-26＞配對相反的可充式電池電量指示
燈：電量充足的顯示是由上而下，與習慣不
充式電池的電量指示燈，是配
符。
對相反的例子；因為電量充足
的顯示是由上而下，與習慣的
由下往上不符。當時這項設計
一直沒有引起任何注意，因為
LED 的配置是硬體部門，亮燈
的方式由軟體部門控制，而機
構部門則負責設計圖的發出，
ID 部門則負責印刷稿的製作。
直到生產前一刻，ID 檢視所有設計細節時（也在此時才有機會將各部
，才由 ID 單位發現，並緊急修正＜修正後如前圖 2-21＞。
件組裝起來）
由於各部門的分工，介面的設計品質不易掌控，因而理想的設計控制
程序應該是﹕

1. 在專案開始之初，由專案負責人訂定詳細的 LED 顯示燈的配置方

式。此時應有介面專家的加入，或 ID 部門的參與。若硬體或軟體部門
有任何設計上的問題時，應跨部門協調，找出折衷方案。

2. 介面評估應列入標準設計評估的項目之中。當評估模型試裝時，必
須檢視所有介面的問題。

3. 正式生產之後，仍須搜集客戶的所有反應，以在下一版本的產品中
作修正。

二—41
二—42
第六項 回饋 (feedback) 家庭音響的可用性問題

回饋的概念來自神經機械學，並
Mike Jones 對於使用者界面提出了下列
應用於機器、動物和人類之間的 評斷可用性的準則：

溝通。在控制科學和資訊理論的
1) 使用者能夠知道機器在做什麼嗎？
領域裡，回饋原則(The principle
2) 界面是否提供清楚層次的操作分類，
of feedback) 是 一 個 基 礎 的 概 從常用操作到罕用操作？

念。回饋即是：把訊息送回原來 3) 使用者能夠確定如何執行任務？操作
機器？和確認他們已經做了什麼？
輸出來源的過程，也就是介面中
的使用者獲知自己行為的結果的 根據上面的標準，家用影音設備存在著下

訊息。回饋能幫助發送訊息的一 述三個問題：

方監視訊息的接收、據此作出必
1) 層次問題：目前的產品無法提供從常
要的修正。也就是說，當執行某 用操作到罕用操作的清楚層次。結果當使

一個功能時，必須讓使用者知道 用者必須歷經複雜透的動作以完成常用
的操作，而常感挫折。
他們剛剛做了什麼操作，這個操
2) 心智地圖問題：當使用者與一個設計
作是否已經確定執行完畢了、得
良好的界面互動時，一個類似地理地圖的
到了什麼樣的結果、或是根本沒 心智地圖形成了。心智地圖包含了操作的

有執行成功。比如作者一直以來 順序和界面中操作的路徑。使用者通常會
"迷失" 在目前的家用影音設備界面中，
雖然熟悉使用網路轉帳，卻有一
無法知道下一步該作什麼，和已經做了什
次當所有步驟輸入完畢時，按下
麼。
『轉帳執行』鈕，結果發現沒有 3) 回饋問題：現有家用影音設備界面不

任何回應〈事後回想原因是當時 提供即時的回饋，結果使用者無法在錯誤
的操作之後立即作出回應。例如，使用者
網路突然塞機〉
，於是再按兩次才
做了預約錄畫電視節目的動作，通常必須
出現轉帳成功的頁面。原以為沒
等到錄畫時間過了之後，才能知道到底做
什麼問題，結果三天後發現另一 對或做錯，而這時候已經來不及了。

個銀行帳目暴增，經過繁複的查

二—43
證過程，才發現原來 ＜圖 2-27＞台育證券股票下單系統。在關鍵步驟時，顯示
立即的回饋以確認剛才的操作內容。
當時沒有立即的回
饋，以致使用者〈作
者自己〉重複轉帳了
三次。其實假如按下
『轉帳執行』鈕之後
立即顯示小方框告
知使用者『傳送中，
請稍待…』的訊息，
如此情況就可避免。

實務運用
回饋的呈現方式包
括：聲音、圖像的變化、或跳出型訊息。具體的範例有：數位相機雖
然已沒有了機械快門，可是當按下拍照鈕時，仍有數位的傳統機械快
門的聲音，已告知使用者已按下快門，以避免使用者重複按鈕、或半
按快門誤為已拍照而錯失良機。又比如網頁按鈕按下之後陷下的感
覺、或執行大量的檔案複製時，視窗跳出的動畫。

網路金融、購物、或股票下單等有嚴重後果的操作必須提供立即的回
饋。尤其是在關鍵步驟時，應該有立即的訊息顯示＜圖 2-27＞，或告
知剛才的操作是甚麼，進行的時間需要多久，購物或轉帳的手續是否
真正完成。假如因頻寬或電腦反應太慢，仍應在第一時間提供簡短又
不佔系統資源的回饋，若有需要，在第二時間提供進一步之訊息。

回饋應該提供使用者預期的資訊，而且必須以容易理解的方式呈現出
來。有些設計不佳的介面忽略了呈現適切易見的操作結果，或雖然提
二—44
 〈圖 2-28〉電影『桃色機密〈Disclosure〉』裡的數位資料庫：立即、適當的回饋。當
使用者選擇檔案時，文件檔名立即亮起〈立即的回饋，提供給使用者確認結果是否正
確〉。使用者『拿取』檔案時，文件立即『粘住』感應手套〈適當的回饋〉。

供了系統狀態的資訊，但卻難以理解。讓事情易於理解的最容易的方
法為使用圖像與圖片，但設計師卻常忽略了這個事實。

回饋用之於電腦輔助教學時，若學習者在學習過程中的不同的階段能
知道自己的進步狀況，將使學習更為有效。當學習者有好的表現時，
回饋可以給予他學習成功的肯定，比如掌聲、或叫好歡呼聲；而表現
差強人意時，適時的提供修正建議將使學習者知所改進，並讓學習者
持續學習動機26。回饋用之於電腦遊戲設計時，也應當提供玩家所有

26
Kemp, Jerrold E. and Smellie, Don C. 教學媒醴的企劃、製作與運用。譯自：Planning,
producing, and using instructional media, 6th ed. 中國視聽教育學會主編．民83

二—45
戰利品的資訊，讓玩家了解自己的級數。或在過關時，提供獎勵或關
卡動畫，以讓參與者有持續下去的動力。當玩家表現不佳時，應提供
協助的指引，或立即修正的回饋，以激勵參與者。

第七項 人必犯錯
一個可能發生的錯誤，就會有人去犯它。在介面設計時應該設法降低
錯誤發生的機率，或發生之後減低其嚴重性。讓使用者容易地、快速
地發現錯誤，並得以改正錯誤。

27
過失有好幾種。兩種基本類型是：失誤(slips)和錯誤(mistakes) 。

失誤
失誤是因習慣行為引起，是下意識的行為，本來想做某件事卻中途出
問題。失誤大部分是在做很熟練的動作時發生，部分原因是因為注意
力不集中。當我們正在學習不熟悉的介面時，失誤反而很少發生。比
如在辦公室中，一邊講電話，一邊不小心的把 Pro-E 的 prt 檔在未存
檔的狀況下跳出〈注意！一套半百萬的高階軟體竟然不會警告你這樣
做有何問題，請參考第三章『容錯與親和性』
〉。

由於目標和結果之間有一個明顯的差距，所以使用者要覺察出失誤並
不是一件難事。但是要讓使用者覺察出失誤，端賴訊息回饋。如果動
作的結果看不到，就無法看出動作失誤。有時甚至已經出現與預期相
反的結果，使用者仍不相信失誤的確發生。如果動作發生前後，順序
的資料都加以保留，將有助益〈參考第三章『容錯與親和性』的歷史
紀錄〉
。

27 Norman, Donald A. The Design of Everyday Things. Basic Books Inc., New York, 1988.
二—46
當介面無法完全避免使用者的失誤，此較適當的方法是讓使用者能有
機會改正他錯誤的決定。舉例說，電腦把剛剛刪除的文件暫時存於『資
源回收筒』
，萬一使用者發覺行動錯誤後，仍可回去取回文件。另外，
Undo 的指令能夠取消最接近的最後一個動作;如果使用者刪除一個文
件之後馬上察覺到錯誤，可立即按 UNDO 的指令來取消剛剛的刪除指
令。比如 Adobe PhotoShop 的第五版之後，也新增了「歷史」的功
能，讓使用者可以回溯到前一任何狀態。

錯誤
失誤是下意識的行為，錯誤則是意識的行為。意識的行為讓我們具有
創造性和領悟性，使我們從看似無關的事物中看出它們的關係，也使
我們根據部分的正確證據，或者甚至錯誤的線索而很快地做出不當或
適當的結論。相反地，意識的行為也使我們導致過失。我們從少量的
訊息推演的這種能力能大大的幫助我們適應新的情境，可是有時候我
們概化(generalization)得太快，並把新的情境認為與舊的情境相似，
因此，沒注意到兩者之間的顯著差異。這一類錯誤的概化要檢視出來
都不容易。

二—47
比如作者剛購入麥金塔電腦 錯誤的嚴重後果

Ｐ０ＷＥＲ ＭＡＣ ６１０

〈取材自 Norman, Donald A. The Design of
０時，當時前面板的軟碟機
Everyday Things.卓耀宗譯，設計心理學，遠流
的右下角安置了電源鈕。根 出版，2000〉

据以前使用ＩＢＭ相容電腦
美國三哩島核電廠的工作人員按鈕關閉一個水
的經驗，這個位置常常放的
管的開關片。這開關片事前即適當地開著好讓多
是軟碟磁片的彈出鍵。結果 餘的水能從爐心(nuclear core)流出。事實上，

常常因為為了把磁片退出， 那開關片有毛病，所以關不緊。可是控制板上的
燈顯示那開關片已關好。這燈事實上並不真正監
而不自主的按下電源鈕，導
控開關片，只是監控控制開關片的電流。工作人
致系統直接關機，資料的遺
員知曉這情況。那麼，工作人員懷疑有問題？工
失。這個問題在當時引起很 作人員是查看了從開關片來的水溫，發現水溫很

廣泛的討論。甚至知道了這 高，表示有些熱水經由沒關緊的開關片流出來。
事前工作人員也知道這開關片不能關緊，只知遺
個問題之後，仍然有時會犯
漏並不多所以應不會影響整體運作。後來發現他
下同樣的錯誤。
們的想法是錯的。從關不緊的開關片溢流出來的
水量相當可觀，是造成三哩島核能災變的明顯原
要避免上述的錯誤，設計師
因。我認為工作人員的判斷是合理的，錯誤是在
首重建立使用者的心智模 燈的設計和給予不確實的開關片狀況的設備 。

型。心智模型雖然不需要是
精確的，但是必須是正確
的、可以實際運作的，以防止使用者的錯誤預測。設計師可以透過第
四章的設計程序，製作原型，評估測試，仔細檢驗使用者的心智模型
是否是正確無誤。

二—48
 第二章作業：互動介面範例研究
讀完這一章，學生應該己吸收初步的知識、足以尋找出目前市面上產
品的介面設計缺點，並能評論之。

題目： 自選適合分析、研討之互動介面作為範例。

內容： 分析、研討此範例，並反映本章所述之心理學相關知識，與自
己之心得。

格式: 網路發表：800X600 網路頁面，最少兩頁，視同繳交報告。

課堂發表：設計簡短發表（每人五分鐘）
，互相觀摩，檢討。

評分標準：

表達(明瞭、活潑、創意、圖示化)：20%

是否了解本章之知識，是否正確引用本次授課之心理學相關知識：50%

自己之心得(深度、創見)：30%

範例請見〈圖 2-29〉。

二—49
〈圖 2-29〉互動介面範例研究，台灣科技大學，黃賜濱。

二—50