第八章人機(jī)交互設(shè)計(jì)軟件工程(第三版)

齊治昌譚慶平寧洪2012年8月第八章人機(jī)交互設(shè)計(jì)8.1以用戶為中心的設(shè)計(jì)

8.2用戶界面設(shè)計(jì)的基本原則

8.3用戶界面設(shè)計(jì)模型的表示

8.4用戶界面設(shè)計(jì)的過程模型

8.5用戶及任務(wù)分析

8.6用戶界面的概念設(shè)計(jì)

8.7用戶界面流設(shè)計(jì)

8.8用戶界面的精化

2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院2第八章人機(jī)交互設(shè)計(jì)人機(jī)交互學(xué)（Human-ComputerInteraction，HCI）是專門研究如何設(shè)計(jì)和評(píng)估計(jì)算機(jī)系統(tǒng)以方便用戶使用的學(xué)科。任何產(chǎn)品，包括軟件產(chǎn)品在內(nèi)，其成敗最終取決于用戶的滿意程度。人機(jī)交互設(shè)計(jì)對(duì)于軟件項(xiàng)目的意義重大。用戶的因素在人機(jī)交互設(shè)計(jì)中占有核心地位。本章首先介紹以用戶為中心的設(shè)計(jì)的基本理念和方法。雖然人機(jī)交互設(shè)計(jì)與軟件開發(fā)過程中的多數(shù)活動(dòng)有關(guān)，但用戶界面（也稱人機(jī)界面）設(shè)計(jì)是人機(jī)交互設(shè)計(jì)的主要部分。本章的其余部分圍繞用戶界面設(shè)計(jì)展開：首先介紹界面設(shè)計(jì)必須遵循的基本原則及界面設(shè)計(jì)模型的表示方法，接下來討論用戶界面設(shè)計(jì)的過程模型，最后依次介紹實(shí)施該過程模型中每項(xiàng)設(shè)計(jì)活動(dòng)的技術(shù)和方法。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院38.1以用戶為中心的設(shè)計(jì)本節(jié)首先討論以用戶為中心的設(shè)計(jì)的基本理念，然后概述其理論基礎(chǔ)――人類信息處理模型，最后宏觀地闡述以用戶為中心的設(shè)計(jì)方法。8.1.1以用戶為中心的設(shè)計(jì)理念用戶是指直接使用目標(biāo)軟件產(chǎn)品的人群。以用戶為中心的設(shè)計(jì)基本理念可歸納如下：⑴對(duì)用戶特征的研究和理解應(yīng)該作為軟件開發(fā)過程中各種決策的主要依據(jù)。⑵在軟件開發(fā)的各階段盡可能獲得來自用戶的反饋并利用這種反饋改進(jìn)或優(yōu)化設(shè)計(jì)。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院4以用戶為中心的設(shè)計(jì)⑶用戶對(duì)產(chǎn)品的滿意度不僅取決于使用體驗(yàn)，而且取決于用戶在與產(chǎn)品接觸的全過程中獲得的滿意度。使用產(chǎn)品是全過程中的一個(gè)重要階段，但并非唯一階段。全過程包括初步了解產(chǎn)品、購買或以其他方式獲得產(chǎn)品、安裝和配置、學(xué)習(xí)培訓(xùn)、使用產(chǎn)品、售后服務(wù)與技術(shù)支持、產(chǎn)品升級(jí)換代、產(chǎn)品退役等階段。⑷人機(jī)交互設(shè)計(jì)不能僅止于用戶可以使用產(chǎn)品提供的各項(xiàng)功能，而應(yīng)該追求更高的目標(biāo)：

讓用戶在與產(chǎn)品接觸的全過程中獲得愉悅體驗(yàn)。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院58.1.2人類信息處理模型正確地理解人類如何接收并處理來自計(jì)算機(jī)系統(tǒng)的信息是實(shí)踐以用戶為中心的設(shè)計(jì)理念的前提條件。心理學(xué)上廣為采用的人類信息處理模型將人類接收并處理外界信息的過程劃分為感知（perception）、認(rèn)知（cognition）和反應(yīng)（response）三個(gè)階段。下面結(jié)合軟件產(chǎn)品的用戶界面設(shè)計(jì)概要介紹該模型。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院6（一）感知人類通過感官認(rèn)識(shí)客觀世界，因此，設(shè)計(jì)用戶界面要充分考慮視覺、觸覺和聽覺的作用，這樣才能使用戶有效地從系統(tǒng)獲取信息。多數(shù)用戶界面都在可視介質(zhì)上實(shí)現(xiàn)（如終端屏幕或顯示面板上顯示的報(bào)告、圖表等）。用戶總是眼腦并用，根據(jù)顯示內(nèi)容的體積、形狀、顏色、方向、移動(dòng)和其他種種表征解釋所獲的可視信息。很好地表示這些可視信息是設(shè)計(jì)友好的用戶界面的關(guān)鍵。目前用戶界面設(shè)計(jì)中明顯地存在追求圖形化的趨勢(shì)，但仍有不少可視信息采用文本描述。閱讀——從文本中提取信息仍為大多數(shù)界面的主要活動(dòng)人類首先對(duì)可視的句式（patterns）進(jìn)行解碼，然后在大腦內(nèi)檢索字或短語的意思。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院7感知這個(gè)過程的快慢受到眼球運(yùn)動(dòng)模式的控制，字號(hào)、字體、行長(zhǎng)、大小寫、位置和顏色等諸多因素也會(huì)直接影響到信息提取的難易程度。除圖表和文本外，用戶界面也可以通過聲音向使用者傳遞信息。但與前者不同，聲音在播放完畢后立即消失，所以它不宜作為重要信息的唯一傳遞手段。在界面設(shè)計(jì)中必須考慮人類感知器官和感知信息處理系統(tǒng)的特點(diǎn)。例如，杜絕不必要的眼球移動(dòng)、使用簡(jiǎn)潔的界面布局、突出顯示重要的信息等。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院8（二）認(rèn)知用戶從界面獲得的信息需存儲(chǔ)起來供以后回憶和使用。用戶不得不記住諸如命令、操作順序、選項(xiàng)、出錯(cuò)現(xiàn)場(chǎng)等各種信息。這些信息都將存入人腦中。人腦由一個(gè)短期記憶系統(tǒng)（ShortTermMemory，STM）和一個(gè)長(zhǎng)期記憶系統(tǒng)（LongTermMemory，LTM）組成。感官輸入（視、聽、觸）一開始放在“緩沖區(qū)”中，隨即存入STM。STM中的信息可立即重用。但緩沖區(qū)的大小、STM中信息可重用的時(shí)間間隔都十分有限。知識(shí)（語法和語義信息）一般存在LTM中，它們是人類對(duì)信息作出反應(yīng)的依據(jù)。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院9認(rèn)知在設(shè)計(jì)用戶界面時(shí)，若對(duì)STM或LTM有過份的要求，必將導(dǎo)致用戶滿意度的下降。多數(shù)人遇到問題時(shí)并不進(jìn)行形式的演繹和歸納推理，而是使用一組啟發(fā)式策略。這組策略是從以往對(duì)類似問題的處理中逐漸獲得的。設(shè)計(jì)用戶界面時(shí)應(yīng)便于用戶積累有關(guān)人機(jī)交互的經(jīng)驗(yàn)注意啟發(fā)式策略的一致性，不宜受特殊交互情形的影響。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院10（三）反應(yīng)在感知和認(rèn)知之后用戶往往會(huì)根據(jù)自己獲得并理解的信息作出反應(yīng)。這種反應(yīng)經(jīng)常表現(xiàn)為利用計(jì)算機(jī)輸入設(shè)備（例如鍵盤、鼠標(biāo)、觸摸屏等）對(duì)計(jì)算機(jī)系統(tǒng)發(fā)出進(jìn)一步指令，引導(dǎo)或控制系統(tǒng)持續(xù)邁向其目標(biāo)，完成用戶希望的功能或行為。在界面設(shè)計(jì)中應(yīng)該盡量減少人類反應(yīng)系統(tǒng)的負(fù)荷。如，杜絕不必要的鍵盤和鼠標(biāo)輸入之間的切換，將常用的命令按鈕置于醒目的位置等。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院118.1.3以用戶為中心的設(shè)計(jì)方法以用戶為中心的設(shè)計(jì)的關(guān)鍵目標(biāo)是提高目標(biāo)產(chǎn)品的用戶滿意度。為此，首先必須厘清哪些人將成為目標(biāo)產(chǎn)品的直接使用者。設(shè)計(jì)者勿需關(guān)心用戶群中個(gè)體的姓名，只需關(guān)心用戶群區(qū)別于一般人群的特征，這些特征可能會(huì)影響用戶在與產(chǎn)品接觸的全過程中獲得的滿意度。如，用戶特征可能包括年齡段、受教育程度、特殊的文化背景、計(jì)算機(jī)操作習(xí)慣等。如4.3所述，用戶特征的識(shí)別與軟件需求的獲取可以同時(shí)交叉進(jìn)行并相互促進(jìn)2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院12以用戶為中心的設(shè)計(jì)方法基于初步的軟件需求或目標(biāo)軟件的輪廓描述就可以大致確定用戶群的顯著特征，并隨著需求獲取和需求分析活動(dòng)的不斷推進(jìn)用戶特征會(huì)越來越清晰、越來越具體；用戶群及其特征的確定也有助于發(fā)現(xiàn)軟件需求的新來源，有助于基于用戶特征作出正確的需求工程決策，幫助需求工程師直接從用戶特征出發(fā)推導(dǎo)出新的軟件需求項(xiàng)在關(guān)注用戶特征的同時(shí)，以用戶為中心的設(shè)計(jì)還關(guān)注用戶與系統(tǒng)之間交互的信息。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院13以用戶為中心的設(shè)計(jì)方法這種信息必須是從用戶立場(chǎng)出發(fā)、便于用戶理解、益于用戶達(dá)成其業(yè)務(wù)目標(biāo)的。如第四、五章所述，這種信息存在于用例描述和分析模型之中。在用戶界面設(shè)計(jì)過程中，必須將它們抽取、分類并組織起來，逐步轉(zhuǎn)化成用戶界面視圖。以用戶為中心的設(shè)計(jì)要求在軟件開發(fā)全過程中進(jìn)行各類決策（包括權(quán)衡、取舍、精化等）時(shí)以用戶特征為主要依據(jù)，以用戶滿意度為主要目標(biāo)。在軟件開發(fā)全過程中進(jìn)行各類評(píng)審（review）或評(píng)估（evaluation）時(shí)，以用戶為中心的設(shè)計(jì)強(qiáng)調(diào)盡可能地吸收用戶的反饋信息，避免閉門造車。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院148.2用戶界面設(shè)計(jì)的基本原則為提高界面的用戶滿意度，并體現(xiàn)以用戶為中心的設(shè)計(jì)理念，界面設(shè)計(jì)必須遵循以下原則。⑴易理解性界面上呈現(xiàn)的所有元素，包括文本信息、數(shù)據(jù)表示、狀態(tài)呈現(xiàn)、菜單、按鈕、超鏈等，貼近用戶的業(yè)務(wù)領(lǐng)域，并且具有簡(jiǎn)潔、明確、自然、直觀等特性；

界面中屏幕（screen，見8.3節(jié)）之間的跳轉(zhuǎn)關(guān)系簡(jiǎn)單、自然。⑵易操作性用戶對(duì)軟件系統(tǒng)的命令可以通過簡(jiǎn)單、直觀的方式來完成；為提高用戶的工作效率，界面應(yīng)盡量減少用戶的操作次數(shù)和輸入信息量。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院15用戶界面設(shè)計(jì)的基本原則⑶靈敏性界面必須在合理的時(shí)間內(nèi)對(duì)用戶操作做出響應(yīng)，對(duì)耗時(shí)較長(zhǎng)的內(nèi)部處理過程必須提供及時(shí)的進(jìn)度反饋，保持用戶與界面間的不間斷的雙向溝通。⑷一致性為降低用戶的記憶負(fù)擔(dān)，界面應(yīng)在整個(gè)軟件系統(tǒng)范圍內(nèi)保持顯示風(fēng)格、操作方式的一致性并符合業(yè)界規(guī)范如，用Ctrl+C快捷鍵來實(shí)現(xiàn)復(fù)制功能2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院16用戶界面設(shè)計(jì)的基本原則⑸容錯(cuò)性界面設(shè)計(jì)應(yīng)以降低用戶的誤操作機(jī)率為目標(biāo)，但必須容忍用戶的誤操作對(duì)所有可能造成損害的動(dòng)作，必須在用戶確認(rèn)后才進(jìn)行；

允許用戶對(duì)盡可能多的界面操作反悔（Undo）；

在用戶誤操作后系統(tǒng)具備適當(dāng)?shù)幕謴?fù)能力。⑹人性化在適當(dāng)?shù)臅r(shí)機(jī)出現(xiàn)用戶恰好需要的幫助信息或建議；

在任何情況下用戶均能簡(jiǎn)易地理解軟件系統(tǒng)的當(dāng)前狀態(tài)和響應(yīng)信息，并能清晰地了解自己的操作行為的前因后果，不至因界面跳轉(zhuǎn)而迷失；

界面的布局和色彩應(yīng)使用戶感覺舒適、自然。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院178.3用戶界面設(shè)計(jì)模型的表示本書將界面中的窗口、對(duì)話框、網(wǎng)頁統(tǒng)稱為屏幕。界面設(shè)計(jì)的表示涉及兩個(gè)方面：

屏幕內(nèi)容的表示、屏幕之間跳轉(zhuǎn)關(guān)系的表示屏幕中的界面元素有四種：⑴靜態(tài)元素：與軟件系統(tǒng)的運(yùn)行狀態(tài)無關(guān)、在任何情況下均沒有變化的文本、圖標(biāo)（icon）、圖形（graph）、圖像（image）等。⑵動(dòng)態(tài)元素：

因當(dāng)前用戶及軟件系統(tǒng)的運(yùn)行狀態(tài)而異，由軟件系統(tǒng)根據(jù)業(yè)務(wù)邏輯自動(dòng)呈現(xiàn)于屏幕中，且不允許用戶修改的內(nèi)容，包括不可編輯的文本、表格、圖標(biāo)、圖形、圖像等。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院18用戶界面設(shè)計(jì)模型的表示⑶用戶輸入元素：在屏幕上預(yù)留空位、由用戶在界面操作中填寫或選擇的界面元素，包括可編輯的文本、單選鈕（radio）、多選框（checkbox）、選擇列表（selectlist）、可編輯的表格等。只要一個(gè)界面元素在某些情況下可供用戶修改或選擇，就應(yīng)將其歸入用戶輸入元素類，而非動(dòng)態(tài)元素類。⑷用戶命令元素：用戶點(diǎn)擊此類元素后位于界面后端的業(yè)務(wù)邏輯處理或界面刷新動(dòng)作將被觸發(fā)，其典型代表是按鈕、菜單、超鏈等。屏幕的瞬時(shí)快照可以表示為一張圖，它描述了屏幕中靜態(tài)元素的內(nèi)容、其他三類界面元素在特定時(shí)間點(diǎn)上的視覺形式以及此時(shí)所有可見的界面元素的布局，見圖8.1(a)

。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院19用戶界面設(shè)計(jì)模型的表示如果有界面設(shè)計(jì)工具，可以直接用工具設(shè)計(jì)屏幕外觀，勿需另行繪圖。但是，僅僅依靠外觀或圖形無法完整地表現(xiàn)除靜態(tài)元素之外的其他三類元素的設(shè)計(jì)內(nèi)涵。本書推薦采用UML類來表示屏幕，與瞬時(shí)快照的圖形表示相輔相成，見圖8.1

。在屏幕的UML類表示中，靜態(tài)元素被省略，它們?cè)谌魏吻闆r下均不會(huì)變化；動(dòng)態(tài)元素體現(xiàn)為類的屬性；命令元素對(duì)應(yīng)的動(dòng)作體現(xiàn)為類的操作。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院20用戶界面設(shè)計(jì)模型的表示至于輸入元素的表示，有兩種方法：直接將它們作為屏幕類的屬性，此時(shí)需要采用UML構(gòu)造型（見5.1.4節(jié)）將其與動(dòng)態(tài)元素相區(qū)分，見圖8.2

中的構(gòu)造型<<input>>；第二種方法是，設(shè)立單獨(dú)的“輸入表格”（inputform）類，將輸入元素作為其屬性，此時(shí)需要將從屬于輸入表格的命令元素對(duì)應(yīng)的操作從屏幕類移至輸入表格類，并在這兩個(gè)類之間建立組合關(guān)系（因?yàn)橐粋€(gè)輸入表格對(duì)象總是出現(xiàn)在一個(gè)屏幕中），見圖8.2

中的構(gòu)造型<<inputform>>。在輸入元素為數(shù)組形態(tài)時(shí)（見例8.1

圖8.2

中的“SensorConfigForm”），必須使用第二種方法；在輸入元素盡管不是數(shù)組形態(tài)，但是輸入的信息項(xiàng)較多時(shí)，本書推薦第二種方法；否則，應(yīng)采用第一種表示，以使界面的UML模型更顯簡(jiǎn)潔。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院21用戶界面設(shè)計(jì)模型的表示屏幕中除可見的界面元素外，還有隱藏的界面動(dòng)作，包括：屏幕在每次出現(xiàn)時(shí)自行調(diào)用的初始化動(dòng)作，跳轉(zhuǎn)發(fā)生時(shí)離開本屏幕前自行調(diào)用的動(dòng)作、由本屏幕提供給其他屏幕調(diào)用的動(dòng)作，以及因一個(gè)屏幕元素的狀態(tài)變化而導(dǎo)致其他屏幕元素發(fā)生改變的動(dòng)作等。這些隱藏動(dòng)作也應(yīng)表示為屏幕類的操作，并采用UML構(gòu)造型將隱藏動(dòng)作與命令元素對(duì)應(yīng)的動(dòng)作相區(qū)分。見圖8.5中的動(dòng)作“onInitScreen”。要表現(xiàn)屏幕之間的跳轉(zhuǎn)關(guān)系，既要考慮在典型應(yīng)用場(chǎng)景下屏幕之間的跳轉(zhuǎn)及信息傳遞，又要考慮屏幕之間的靜態(tài)邏輯關(guān)系。前者采用UML交互圖（主要是順序圖）來表示，見圖8.3；后者采用UML類圖來表現(xiàn)，其中的單向關(guān)聯(lián)關(guān)系表示可能發(fā)生的跳轉(zhuǎn)，關(guān)聯(lián)邊之上的名稱應(yīng)能反映跳轉(zhuǎn)的原因，見圖8.4。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院228.4用戶界面設(shè)計(jì)的過程模型用戶界面設(shè)計(jì)的首要目標(biāo)是提高用戶滿意度。用戶本身在文化背景、審美情趣、個(gè)性與偏好、計(jì)算機(jī)操作習(xí)慣等方面的差異導(dǎo)致他們對(duì)同一界面的評(píng)價(jià)可能會(huì)有所不同。為提高用戶滿意度，首先必須分析用戶群的特征，這樣才能在用戶界面的后續(xù)設(shè)計(jì)過程中有的放矢。具體的界面設(shè)計(jì)不僅取決于用戶特征，它更多地取決于用戶意欲利用軟件系統(tǒng)完成的每項(xiàng)任務(wù)，以及在完成這些任務(wù)的過程中用戶與軟件系統(tǒng)之間交互的信息。對(duì)任務(wù)進(jìn)行分析和建模也是界面設(shè)計(jì)的題中應(yīng)有之義。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院23用戶界面設(shè)計(jì)的過程模型基于任務(wù)分析和建模的成果，可以確定用戶為完成每項(xiàng)任務(wù)需要與軟件系統(tǒng)之間進(jìn)行信息交互的時(shí)機(jī)，以及在每個(gè)時(shí)機(jī)軟件系統(tǒng)應(yīng)該呈現(xiàn)的屏幕的大致內(nèi)容。這項(xiàng)活動(dòng)稱之為“用戶界面的概念設(shè)計(jì)”。它區(qū)別于界面的詳細(xì)設(shè)計(jì)，僅從邏輯上表現(xiàn)軟件系統(tǒng)在相應(yīng)時(shí)機(jī)需要向用戶呈現(xiàn)哪些信息，可以接收用戶的哪些命令以及為執(zhí)行命令所必需的應(yīng)該由用戶提供的信息。概念設(shè)計(jì)不關(guān)心界面的布局和美觀性，也可以暫時(shí)忽略某些不太重要的人機(jī)交互信息。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院24用戶界面設(shè)計(jì)的過程模型對(duì)于稍復(fù)雜的任務(wù)，僅通過一次人機(jī)交互不可能完成，所以需要設(shè)置若干屏幕以供用戶在適當(dāng)?shù)臅r(shí)機(jī)獲得適當(dāng)?shù)男畔ⅰl(fā)送適當(dāng)?shù)拿?。無疑，這些屏幕之間存在跳轉(zhuǎn)關(guān)系，本書稱之為“界面流”。界面流的設(shè)計(jì)在時(shí)間上可以與前述的概念設(shè)計(jì)重疊，即，首先確定針對(duì)某項(xiàng)任務(wù)的主屏幕（詳見8.6節(jié)），對(duì)主屏幕進(jìn)行概念設(shè)計(jì)，然后考慮從主屏幕可能跳轉(zhuǎn)到哪些其他屏幕，再對(duì)它們展開概念設(shè)計(jì)，依此類推，直至完整的界面流構(gòu)建完畢，并且界面流中每幅屏幕的概念設(shè)計(jì)也告完成。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院25用戶界面設(shè)計(jì)的過程模型綜上，推薦的用戶界面設(shè)計(jì)過程的主要活動(dòng)如下：⑴用戶分析、任務(wù)分析及建模；⑵概念設(shè)計(jì)；⑶界面流設(shè)計(jì)；⑷界面精化。這些活動(dòng)之間不存在嚴(yán)格的時(shí)序關(guān)系。如，不需等待所有的任務(wù)均分析完畢，就可以針對(duì)已確定的任務(wù)展開界面的概念設(shè)計(jì)和界面流設(shè)計(jì)；概念設(shè)計(jì)與界面流設(shè)計(jì)在時(shí)間上也可以重疊；也不需等待所有屏幕的概念設(shè)計(jì)完畢，就可以針對(duì)部分已完成概念設(shè)計(jì)的屏幕展開界面精化工作。在界面設(shè)計(jì)的整個(gè)過程中均必須基于用戶分析的成果進(jìn)行設(shè)計(jì)決策，這是提高用戶滿意度的關(guān)鍵。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院268.5用戶及任務(wù)分析在展開具體的界面設(shè)計(jì)之前，首先必須分析用戶的特征，分析用戶需要通過目標(biāo)軟件系統(tǒng)完成哪些工作任務(wù)，為完成這些任務(wù)人機(jī)之間需要進(jìn)行哪些信息交互。8.5.1用戶分析人類信息處理模型中提及的影響用戶滿意度的基本因素適用于所有人群。用戶特征會(huì)在很大程度上影響用戶對(duì)用戶界面的滿意度。一個(gè)為技術(shù)人員所接受的界面對(duì)普通用戶可能完全不合適，甚至兩個(gè)受教育和知識(shí)背景情況相似的人因個(gè)性的差異也可能對(duì)同一界面的評(píng)價(jià)有所不同。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院27用戶分析用戶的技能直接影響到他從界面上獲取信息的能力，也影響到他在交互工作中對(duì)系統(tǒng)作出反應(yīng)的能力，以及使用啟發(fā)式策略與系統(tǒng)和諧交互的能力。多數(shù)情況下，特定領(lǐng)域的知識(shí)比廣泛的教育和智能更重要。每個(gè)人都有自己的個(gè)性，個(gè)性往往與認(rèn)知及思維方式相聯(lián)系。理想的界面應(yīng)針對(duì)具有典型個(gè)性的特定的一類用戶而設(shè)計(jì)。界面在必要時(shí)應(yīng)該面向不同類別的用戶呈現(xiàn)最能適合其特征的不同外觀，從而提高整體的用戶滿意度。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院28用戶分析實(shí)現(xiàn)這種界面效果的手段是界面定制允許用戶通過調(diào)整配置信息來改變界面外觀，軟件系統(tǒng)甚至可以通過其內(nèi)嵌的學(xué)習(xí)功能自適應(yīng)地改變界面外觀。前者的示例如許多文檔處理軟件支持用戶定制菜單、工具條的內(nèi)容和外觀。如果用戶分析得到的成果非常豐富，為便于利用，應(yīng)該對(duì)用戶特征建模。具體的建模方法是：

每類用戶表示為一個(gè)UML類，其特征和典型行為分別表示為該類的屬性和方法；

各類用戶之間的關(guān)系表示為UML類之間的相應(yīng)關(guān)系。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院29用戶分析可將用戶分析的成果建模為UML類圖。注意，與需求工程不同，這里的用戶分析及結(jié)果模型只關(guān)注與界面的用戶評(píng)價(jià)和用戶滿意度有關(guān)的特征和行為。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院308.5.2任務(wù)分析用戶使用軟件系統(tǒng)的目的在于通過其幫助完成用戶的工作任務(wù)，所以，用戶在人機(jī)協(xié)同完成工作任務(wù)的過程中獲得的軟件使用體驗(yàn)是用戶滿意度的首要決定性因素。用戶在使用軟件之前及使用過程中，對(duì)于如何完成任務(wù)已經(jīng)具備了部分甚至完整的思維模式，這種模式建基于用戶的相關(guān)知識(shí)和經(jīng)驗(yàn)。如果軟件系統(tǒng)的設(shè)計(jì)（尤其是界面設(shè)計(jì)）與用戶的思維模式相吻合，那么用戶理解和使用軟件系統(tǒng)的過程都會(huì)相對(duì)容易，完成任務(wù)的效率也相對(duì)較高。反之，用戶滿意度肯定降低。任務(wù)分析不僅要從用戶的視角確定人機(jī)協(xié)同需要完成哪些工作任務(wù)，更大的挑戰(zhàn)是，如何根據(jù)用戶特征分析甚至揣測(cè)每類用戶的思維模式，據(jù)此確定人機(jī)協(xié)同完成任務(wù)的過程，在此過程中哪些時(shí)間點(diǎn)上必須進(jìn)行人機(jī)交互，在交互時(shí)人、機(jī)雙方各需要提供和接收哪些信息。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院31任務(wù)分析確定用戶意欲借助于軟件系統(tǒng)完成的工作任務(wù)并不困難，因?yàn)橛美Ｐ椭械拿總€(gè)用例事實(shí)上就對(duì)應(yīng)于一項(xiàng)任務(wù)。在用例描述及分析模型中用來表達(dá)用例實(shí)現(xiàn)方案的UML模型圖（見5.4節(jié)）中也可以提煉出人機(jī)協(xié)同過程和人機(jī)交互信息。界面設(shè)計(jì)過程中任務(wù)分析活動(dòng)的主要任務(wù)是，在用例模型、分析模型和用戶特征模型的基礎(chǔ)上，以提高用戶滿意度為宗旨，設(shè)計(jì)盡可能吻合用戶思維模式的任務(wù)完成過程及人機(jī)交互信息。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院32任務(wù)分析為完成此任務(wù)，軟件設(shè)計(jì)師可以采用類似于需求調(diào)查的方法（見3.2.2節(jié)）。如，通過訪談或會(huì)議要求用戶描述理想的任務(wù)完成過程，通過現(xiàn)場(chǎng)觀摩獲得用戶在完成類似任務(wù)的過程中采用的過程及解決過程中發(fā)生的各類問題的辦法，等。如果不同類型的用戶對(duì)任務(wù)完成過程的偏好存在矛盾，軟件設(shè)計(jì)師必須以整體用戶滿意度為原則進(jìn)行權(quán)衡、取舍，或采用界面定制的方法化解這種矛盾。應(yīng)該對(duì)任務(wù)分析的成果進(jìn)行整理和建模。軟件設(shè)計(jì)師不必另建新的UML模型圖，只需適當(dāng)調(diào)整用例模型和分析模型中相應(yīng)的圖形或文字描述即可。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院338.6用戶界面的概念設(shè)計(jì)概念設(shè)計(jì)的主要目標(biāo)是，確定屏幕中應(yīng)該包含的主要內(nèi)容，及用戶基于該屏幕可施行的主要操作。概念設(shè)計(jì)不關(guān)心界面的布局和美觀性，也不追求界面內(nèi)容和操作的完整性，但概念設(shè)計(jì)階段不應(yīng)遺漏重要的信息項(xiàng)和用戶操作。針對(duì)任務(wù)分析獲得的每項(xiàng)任務(wù)（用例），依據(jù)其人機(jī)協(xié)同過程不難找出該任務(wù)的主屏幕。主屏幕指，用戶剛開始使用軟件系統(tǒng)啟動(dòng)此任務(wù)時(shí)系統(tǒng)呈現(xiàn)出來的畫面，其他屏幕均直接或間接地源自主屏幕，并且用戶在這些屏幕進(jìn)行必要的操作后一般仍會(huì)回歸主屏幕2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院34用戶界面的概念設(shè)計(jì)用戶在主屏幕上將花費(fèi)比其他屏幕更多的使用時(shí)間。通常一項(xiàng)任務(wù)對(duì)應(yīng)一個(gè)主屏幕，但一項(xiàng)復(fù)雜任務(wù)可能對(duì)應(yīng)多個(gè)主屏幕。軟件設(shè)計(jì)師應(yīng)該在邏輯層面抽象地設(shè)計(jì)主屏幕的內(nèi)容，包括靜態(tài)元素、動(dòng)態(tài)元素、用戶輸入元素和用戶命令元素?！霸谶壿媽用娉橄蟮卦O(shè)計(jì)”指，設(shè)計(jì)師不考慮界面元素的形狀、尺寸、顏色、位置、布局等，只需列出這些界面元素并說明其含義。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院35用戶界面的概念設(shè)計(jì)在屏幕上設(shè)置界面元素的依據(jù)：⑴任務(wù)分析階段獲得的人機(jī)交互信息和人機(jī)協(xié)同過程⑵借鑒需求工程階段構(gòu)造的快速原型⑶參考用例模型中的用例描述（見4.5.3節(jié)）⑷參考分析模型中的用例實(shí)現(xiàn)方案（包括領(lǐng)域概念模型、分析類圖，尤其是用來表示用例實(shí)現(xiàn)過程的UML交互圖中執(zhí)行者與邊界類之間的交互過程和交互信息。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院36用戶界面的概念設(shè)計(jì)概念設(shè)計(jì)并非僅針對(duì)主屏幕。在概念設(shè)計(jì)和界面流設(shè)計(jì)交疊進(jìn)行的過程中，針對(duì)界面流中除主屏幕之外的稍復(fù)雜的從屏幕（相對(duì)于主屏幕而言），同樣需要先進(jìn)行概念設(shè)計(jì)，再進(jìn)行精化（或稱界面詳細(xì)設(shè)計(jì)）。對(duì)于簡(jiǎn)單的從屏幕，可直接進(jìn)行詳細(xì)設(shè)計(jì)。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院37例8.1用戶界面的概念設(shè)計(jì)針對(duì)家庭保安系統(tǒng)，加電后它將顯示初始屏幕。該屏幕顯示一條靜態(tài)的歡迎信息（靜態(tài)元素），以文本（動(dòng)態(tài)元素）顯示當(dāng)前時(shí)間和系統(tǒng)當(dāng)前狀態(tài)，以不可編輯的表格（動(dòng)態(tài)元素）列出當(dāng)前系統(tǒng)中傳感器的類別、位置和狀態(tài)，以四個(gè)命令按鈕（命令元素）表示可以接收用戶的“啟動(dòng)監(jiān)控”、“系統(tǒng)配置”、“日志查詢”和“關(guān)機(jī)”命令。該初始屏幕的外觀設(shè)計(jì)及其UML類圖表示見圖8.1。家庭保安系統(tǒng)的主要任務(wù)包括“開關(guān)機(jī)及復(fù)位處理”、“傳感器監(jiān)測(cè)”、“日志查詢”和“系統(tǒng)配置”。本例選擇“系統(tǒng)配置”討論其主屏幕的設(shè)計(jì)。請(qǐng)讀者自行研究其他任務(wù)的主屏幕設(shè)計(jì)。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院38例8.1用戶界面的概念設(shè)計(jì)

圖8.1家庭保安系統(tǒng)的初始屏幕的設(shè)計(jì)

(a)外觀設(shè)計(jì)(b)初始屏幕的

UML類表示2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院39例8.1用戶界面的概念設(shè)計(jì)（續(xù)）用戶從初始屏幕發(fā)出“系統(tǒng)配置”命令后，系統(tǒng)應(yīng)彈出“用戶身份驗(yàn)證”對(duì)話框要求輸入正確的密碼。不能認(rèn)為該對(duì)話框是系統(tǒng)配置任務(wù)的主屏幕；通過密碼驗(yàn)證后進(jìn)入的屏幕才是真正的主屏幕。可供用戶配置的信息包括：密碼，報(bào)警電話號(hào)碼、重?fù)苎舆t和最大重?fù)艽螖?shù)，傳感器編號(hào)、安裝位置、門窗傳感器靈敏度和煙霧濃度閾值。前四項(xiàng)配置信息在屏幕上表現(xiàn)為輸入元素；傳感器一般有多個(gè)，本例將其設(shè)計(jì)為可編輯的表格（見圖8.2(b)中的SensorConfigForm類）。AddSensorScreen類中的屬性sensitivity代表門窗傳感器的靈敏度，煙霧傳感器的濃度閾值。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院40圖8.2家庭保安系統(tǒng)中系統(tǒng)配置主屏幕的設(shè)計(jì)(a)外觀設(shè)計(jì)(b)系統(tǒng)配置主屏幕的UML類表示2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院418.7用戶界面流設(shè)計(jì)界面流設(shè)計(jì)的主要目標(biāo)是，確定屏幕之間的跳轉(zhuǎn)關(guān)系一幅屏幕在何種情況下，或者在響應(yīng)何種用戶操作命令后將跳轉(zhuǎn)至另一屏幕。界面流的出現(xiàn)源于：⑴單個(gè)屏幕的空間容量有限，不足以表現(xiàn)所有必要的界面元素；⑵用戶在主屏幕上的界面操作需要導(dǎo)出新的屏幕，以便在新屏幕上進(jìn)行面向特定業(yè)務(wù)功能的界面交互。在界面流建模過程中，要對(duì)作為跳轉(zhuǎn)目標(biāo)的從屏幕進(jìn)行設(shè)計(jì)，概念設(shè)計(jì)的方法如8.6所述。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院42用戶界面流設(shè)計(jì)界面流的表示方式主要是UML交互圖和類圖交互圖表示特定應(yīng)用場(chǎng)景下的屏幕跳轉(zhuǎn)及跳轉(zhuǎn)發(fā)生時(shí)的消息傳遞類圖借助有向關(guān)聯(lián)關(guān)系表示在目標(biāo)軟件系統(tǒng)中屏幕之間所有可能發(fā)生的跳轉(zhuǎn)及跳轉(zhuǎn)的原因示例分別見圖8.3和圖8.4跳轉(zhuǎn)不太復(fù)雜、也沒有必要特別強(qiáng)調(diào)跳轉(zhuǎn)關(guān)系的應(yīng)用場(chǎng)景，界面流的交互圖可以省略，但類圖表示一般是必需的。在實(shí)際的界面設(shè)計(jì)過程中，屏幕的數(shù)量相當(dāng)多，即使采用分包繪制類圖的方法，仍然很難將一個(gè)包中所有的界面類全部表示于單張類圖之中實(shí)踐中只在類圖描繪主要的屏幕及它們之間的跳轉(zhuǎn)關(guān)系。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院43例8.2用戶界面流設(shè)計(jì)家庭保安系統(tǒng)的用戶從初始屏幕（MainScreen）發(fā)出“啟動(dòng)監(jiān)控”、“系統(tǒng)配置”和“日志查詢”命令后，系統(tǒng)將分別跳轉(zhuǎn)至監(jiān)控主屏幕（MonitorScreen）系統(tǒng)配置主屏幕（SysConfigScreen）日志查詢主屏幕（LogScreen）后兩種跳轉(zhuǎn)關(guān)系忽略了用戶身份驗(yàn)證屏幕當(dāng)系統(tǒng)處在監(jiān)控主屏幕時(shí)，如發(fā)現(xiàn)異常，則跳轉(zhuǎn)至報(bào)警屏幕（AlarmScreen）報(bào)警屏幕報(bào)告異常事件的發(fā)生時(shí)間、位置、異常描述，并顯示通過電話報(bào)警的狀態(tài)如，“正在撥號(hào)”、“已接通”、“正在播報(bào)異常事件”、“已完成”等2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院44例8.2用戶界面流設(shè)計(jì)（續(xù)）用戶從監(jiān)控主屏幕、報(bào)警屏幕分別發(fā)出“停止監(jiān)控”、“復(fù)位”命令后，經(jīng)用戶身份驗(yàn)證屏幕（VerifyUserIdentityScreen）后可返回初始屏幕。從系統(tǒng)配置主屏幕和日志查詢主屏幕發(fā)出“關(guān)閉”命令后也可返回初始屏幕。家庭保安系統(tǒng)中主要界面流的順序圖表示和類圖表示分別見圖8.3和圖8.4。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院45圖8.3家庭保安系統(tǒng)中主要界面流的

順序圖表示2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院46圖8.4家庭保安系統(tǒng)中主要界面流的

類圖表示2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院478.8用戶界面的精化界面精化的主要任務(wù)是，基于概念設(shè)計(jì)和界面流設(shè)計(jì)，給出目標(biāo)軟件產(chǎn)品界面的完整的、詳細(xì)的設(shè)計(jì)設(shè)計(jì)師的工作步驟是①對(duì)屏幕的概念設(shè)計(jì)成果進(jìn)行細(xì)化、補(bǔ)充等，將界面流中每次跳轉(zhuǎn)動(dòng)作與具體的事件或界面動(dòng)作關(guān)聯(lián)起來；②在軟件系統(tǒng)的全局范圍內(nèi)對(duì)屏幕的設(shè)計(jì)和界面流進(jìn)行優(yōu)化；③將每個(gè)精化后的屏幕設(shè)計(jì)成果提交給美工設(shè)計(jì)師，進(jìn)行必要的裝飾、美化工作。針對(duì)屏幕的概念設(shè)計(jì)進(jìn)行精化時(shí)，首先要補(bǔ)齊概念設(shè)計(jì)中遺漏或故意忽略的界面元素。在精化屏幕內(nèi)容的同時(shí)，必須同步地修改、精化屏幕的UML類圖，尤其要注意補(bǔ)齊作為屏幕類的操作的隱藏動(dòng)作（詳見8.3節(jié)，圖8.5中的動(dòng)作“onInitScreen”）2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院48用戶界面的精化選用最適當(dāng)?shù)慕缑嬖亟M織信息的呈現(xiàn)或錄入如，以樹形結(jié)構(gòu)組織遞歸型信息以表格結(jié)構(gòu)組織數(shù)組型信息以checkbox表示布爾型信息，等設(shè)計(jì)界面元素的布局，包括將哪些界面元素集結(jié)于一個(gè)子區(qū)域，哪些界面元素應(yīng)該相互對(duì)齊，等。將用戶的界面動(dòng)作（例如鼠標(biāo)點(diǎn)擊命令按鈕、修改checkbox或radiobox的選項(xiàng)，在界面域中填寫或修改數(shù)據(jù)導(dǎo)致其他界面域的改變，等）與屏幕類中的操作對(duì)應(yīng)起來。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院49用戶界面的精化界面流的精化包括：補(bǔ)齊8.7節(jié)所述的界面流設(shè)計(jì)中遺漏或故意忽略的屏幕，必要時(shí)修改或細(xì)化界面流的順序圖和類圖；具體說明在哪些時(shí)機(jī)或情形下、由哪些事件或界面動(dòng)作會(huì)引發(fā)什么樣的屏幕跳轉(zhuǎn)；針對(duì)每個(gè)屏幕的跳轉(zhuǎn)關(guān)系，說明跳轉(zhuǎn)時(shí)將會(huì)執(zhí)行屏幕類中的哪些操作。必須在整個(gè)軟件系統(tǒng)范圍內(nèi)協(xié)調(diào)多項(xiàng)任務(wù)的屏幕和屏幕流，這些任務(wù)可能順序執(zhí)行，也可能并行或交叉執(zhí)行。必須在全局范圍內(nèi)對(duì)屏幕和屏幕流進(jìn)行優(yōu)化，如，探討屏幕合并的可能性；對(duì)已設(shè)計(jì)的屏幕進(jìn)行調(diào)整，確保界面風(fēng)格一致化、用戶操作方法一致化等。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院50用戶界面的精化最重要的一項(xiàng)界面優(yōu)化工作是，基于迄今獲得的界面設(shè)計(jì)成果，復(fù)核可用性需求的實(shí)現(xiàn)程度。如，可以考慮將可用性需求分解至屏幕類或其操作，使它們成為屏幕類的實(shí)現(xiàn)約束。必須研究屏幕類的實(shí)現(xiàn)能否切實(shí)滿足可用性需求的要求。必要時(shí)，以可用性需求為目標(biāo)，重新調(diào)整屏幕、屏幕類或界面流的設(shè)計(jì)。盡量借助工具構(gòu)造用戶界面原型。原型可顯著提升用戶對(duì)界面設(shè)計(jì)模型的評(píng)審工作的有效性。用戶界面的美工設(shè)計(jì)是一門專門的學(xué)問，感興趣的讀者請(qǐng)參閱文獻(xiàn)。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院51例8.3用戶界面的精化針對(duì)圖8.2(a)所示的家庭保安系統(tǒng)中系統(tǒng)配置主屏幕，考慮到顯示屏的面積較小，基于界面設(shè)計(jì)原則，應(yīng)該將配置信息分為報(bào)警電話（含電話號(hào)碼、重?fù)苎舆t和最大重?fù)艽螖?shù)三個(gè)配置項(xiàng)）、傳感器（含編號(hào)、安裝位置、門窗傳感器靈敏度和煙霧濃度閾值四個(gè)配置項(xiàng)）和密碼共三大類，每類配置信息組織為一個(gè)標(biāo)簽頁（tabpage），從而將圖8.2(a)精化為圖8.5(a)。本例將圖8.5(a)中的三個(gè)標(biāo)簽頁分別命名為

AlarmTelConfigTabSensorConfigTabPswConfigTab。2025/3/2國防科技大學(xué)計(jì)算機(jī)學(xué)院52用戶界面的精化在初次進(jìn)入每個(gè)標(biāo)簽頁時(shí)，系統(tǒng)分別調(diào)用onInitAlarmTelConfigonInitSensorConfigonInitPswConfig

讀入相應(yīng)的配置信息。在用戶修改密碼時(shí)，如