面向對象第8章人機交互部分的設計

第八章人機交互部分的設計最終的系統(tǒng)是要提供給用戶使用的。用戶對系統(tǒng)的理解，包括用戶要操縱的系統(tǒng)中的"事物"、系統(tǒng)能夠完成的功能以及任務的實施過程，決定了用戶對系統(tǒng)的使用。而用戶對系統(tǒng)的使用是通過人機界面來進行的?，F今的用戶對軟件系統(tǒng)的人機交互方面的要求越來越高，人機界面的設計在軟件系統(tǒng)開發(fā)中所占的地位也就越來越重要。特別是，新一代的人機界面將是"以人為中心的計算"，這樣人機交互部分的設計作為一個獨立且重要的領域，就顯得越發(fā)重要。

簡言之，人機交互部分是人和計算機之間交互信息的媒介，對它的設計涉及計算機科學、心理學、藝術學、認知科學和人機工程學等學科。本章講述的是人機交互的軟件方面的設計。對使用系統(tǒng)的人進行分析——以便設計出適合其特點的交互方式和界面表現形式；對人和機器的交互過程進行分析——核心問題是人如何命令系統(tǒng)，以及系統(tǒng)如何向人提交信息。設計人機交互就是要設計輸入與輸出，其中所包含的對象(稱作界面對象)以及其間的關系構成了系統(tǒng)的人機交互部分的模型。8.1什么是人機交互部分

最初設計人員按設計目標(用戶需求)，設計出界面(原型)，提交給用戶去加以評判，也即這個初步的界面起拋磚引玉的作用。用戶通過對界面的學習，根據自己的經驗和需求，經過一定的評判，把結果反饋給設計人員，讓設計人員繼續(xù)設計。這種過程可能要反復進行多次，使得雙方的意見達到一致或達到一定程度的一致，直至用戶認可為止。

人機界面的開發(fā)不僅是設計和實現問題，也包括分析問題?？梢栽诓煌拈_發(fā)階段，對人機交互部分進行不同的處理。在捕獲需求時對用況所做的描述，其實就包含了人機交互部分的信息。

這些工作的目標是為了更好地理解系統(tǒng)的需求。盡管那時注重的是系統(tǒng)的功能需求，但也很可能在那時分析人員與用戶就系統(tǒng)的界面的框架和內容已經達成了共識。若有必要，在確定了用況模型后，可以緊接著完成人機交互部分的分析工作?？紤]到經過了OOA階段，當時的用況模型會有一些變動，以及要考慮用戶群的特點等因素，在OOD階段仍有必要重新分析原來所做的人機交互部分的分析結果。

對人機界面的分析，首先要對使用系統(tǒng)的人進行分析，以得到適合其特點的交互方式和界面表現形式;然后對人和機器的交互過程進行分析，解決的核心問題是人如何命令系統(tǒng)，以及系統(tǒng)如何向人提交信息。要以捕獲需求時獲得的用況模型為基礎，加上已有的界面原型，進行后一項工作。8.2如何分析人機交互部分1.分析與系統(tǒng)交互的人員參與者

人對界面的需求，不僅在于人機交互的內容，而且在于他們對界面表現形式、風格等方面的愛好。前者是客觀需求，對誰都一樣;后者是主觀需求，往往因人而異。如下給出了分析策略:1)列舉所有的人員參與者;2)對人員參與者進行調查研究;3)區(qū)分人員類型，并了解各類人員的主觀需求;4)統(tǒng)計(或估算)出各類人員的比例;5)按照一定的準則進行折中與均衡。2.從用況分析人機交互我們先回顧一下通常的用況的構成:1)參與者的行為和系統(tǒng)行為按時序交替出現，在布局上左右分明，形成交叉排列的段落;2)每個段落至少含有一個輸入語句或輸出語句;3)有若干純屬參與者自身或系統(tǒng)自身的行為陳述;4)可能包含一些控制語句或括號。

從用況中抽取人機交互序列可以用以下方法:針對各用況，先刪除所有與輸入、輸出無關的語句和不再包含任何內容的控制語句與括號，剩下的就是對參與者(人)使用系統(tǒng)功能時的人機交互描述。圖8-2為一個從用況提取人機交互描述的示例。收款員收款（usecase）輸入開始本次收款的命令；作好收款準備，應收款總數置為0，輸出提示信息；for顧客選購的每種商品do

輸入商品編號；

if此種商品多于一件then

輸入商品數量

endif；檢索商品名稱及單價；貨架商品數減去售出數；if貨架商品數低于下限then

通知供貨員請求上貨endif；計算本種商品總價并打印編號、名稱、數量、單價、總價；總價累加到應收款總數；endfor；打印應收款總數；輸入顧客交來的款數；計算應找回的款數，打印以上兩個數目，收款數計入賬冊。

（a）一個usecase的例子收款員收款（人機交互）輸入開始本次收款的命令；輸出提示信息；for顧客選購的每種商品輸入商品編號；

if此種商品多于一件then

輸入商品數量

endif；打印商品編號、名稱、數量、單價、總價；endfor；打印應收款總數輸入顧客交來的款數打印交款數及找回款數；（b）人機交互描述從usecase提取人機交互描述8.3如何設計人機交互部分以往在操作系統(tǒng)和編程語言的支持下，或再加上圖形包，進行圖形方式的人機界面開發(fā)，工作量是很大的。也就是說，以往對圖形化的人機交互的開發(fā)在整個系統(tǒng)的開發(fā)工作中占有很大比例?，F在，可以通過窗口系統(tǒng)、GUI和可視化編程環(huán)境這樣的高級界面支持系統(tǒng)進行人機界面開發(fā)。特別是使用可視化編程環(huán)境可以按所見即所得的方式，定制所需的人機界面。如此定義的界面對象可由編程環(huán)境提供的工具自動地轉化為程序代碼。這樣，人機界面的設計工作就可以大大簡化，但仍有一些設計工作要做。其中的很多內容對各種設計方法都是相同的，也有一些是采用本方法所必須要考慮的。例如，可視化編程環(huán)境一般都帶有內容豐富的界面類庫，界面類庫中對大部分常用的界面對象都給出了類的源代碼，在進行人機界面設計時要充分地復用這些類。8.3.1設計輸入與輸出根據前面從用況中提取出來的對人機交互的描述，設計輸入與輸出。首先要選擇界面支持系統(tǒng)，如窗口系統(tǒng)、圖形用戶界面(GUl)或可視化編程環(huán)境，然后進行輸入與輸出設計。輸入與輸出技術正在不斷地發(fā)展，這里僅就目前常見輸入與輸出的方式進行闡述。1.設計輸入在設計輸入時，要進行如下的工作。(1)確定輸入設備

常見的輸入設備有鍵盤、鼠標、磁卡閱讀器、條碼閱讀器、光電字符識別閱讀器、掃描儀、觸摸屏、電子筆和書寫板等。鍵盤和鼠標屬于標準的計算機設備，不考慮在內。對于一些非標準的計算機外部設備的接口程序，可以把它們放在相應的類中。如果要從外系統(tǒng)進行輸入，可以把外系統(tǒng)的接口程序放在相應的類中。如果要隔離外部設備或外系統(tǒng)的變化對本系統(tǒng)的影響，可以針對外部設備或外系統(tǒng)的接口程序單設立類。對于某些復雜的情況，可能還需要考慮同步機制。(2)設計輸入界面在用戶的輸入界面中，主要的界面元素有窗口、菜單、對話盒、圖符、滾動條和按鈕等。下面以菜單和對話盒為例，說明如何設計其內容。菜單是提供給用戶的一系列對應著用戶動作的條目列表。大部分系統(tǒng)都具有通常形式的菜單，如文件、視圖、工具、窗口和幫助等，但也都具有自己的特有部分。在設計特有部分時，要保證術語的一致性與簡潔性，并按邏輯對條目進行分組。菜單要設計成面向不同用戶的，最好可以進行重組。

對話盒是用來收集用戶的輸入信息或向用戶提供反饋的區(qū)域。用于輸入時，其上可有一些選擇鈕和輸入框等元素，可用鼠標在其上選取值，或從輸入設備向其中輸入值。在設計對話盒時，要注意如下幾點:1)使用有意義且易于理解的簡短標題和輸入框名。

2)按邏輯對輸入框進行分組并排序。

3)允許對文本型輸入框進行簡單的編輯。

4)清楚地標出哪些輸入框是可選的，哪些是必選的。

5)對輸入框進行必要的解釋(如在Windows的狀態(tài)條上列出解釋)。設計對話盒時，還要注意對輸入內容的檢查:1)盡可能地防止錯誤的輸入，當輸入有誤時要提供出錯信息。

2)輸入框組合控制。檢查各輸入框中的數據項的可能組合，以保證輸入的數據是正確的。例如，參加工作的日期必須晚于出生日期。

3)數據的有效范圍控制。檢查所輸入的數據的合理性。例如，在現今社會，一個人的年齡不應該超過200歲。

4)輸入框組合的完備性。確保所有必要的輸入框都要被輸入。例如，在進行身份檢查時，

除了輸入名稱，還要輸入密碼。

5)數據的有效位數的控制。例如，身份證上的號碼必須是15位或18位的。(3)輸入步驟的細化向系統(tǒng)輸入信息，可以一次輸入完畢，也可以分為若干細小的步驟完成。以較少的步驟完成輸入，意味著每一步輸入的內容較多，不易記憶;或者要從較多的選項中進行選擇，不易發(fā)現目標。以較多的步驟完成輸人，可以使每個步驟的操作比較簡單，并且容易對用戶形成引導，但總的操作步驟會增加，使操作效率下降。技能熟練的用戶傾向于追求效率，初學者和一般水平的人員更重視系統(tǒng)以較多的步驟引導他們進行正確的操作。一項輸入被細化后，可能變成輸入與輸出交替的動作序列，其中的輸出是系統(tǒng)的計算結果或系統(tǒng)對用戶的提示信息等。2.設計輸出在設計輸出時，要進行如下的工作。

(1)確定輸出設備

常見的輸出設備有打印機、顯示器、繪圖儀、文件或數據庫表等。對于一些非標準的計算機外部設備的接口程序，可以把它們放在相應的類中。如果要向外系統(tǒng)輸出，可以把與外系統(tǒng)的接口程序放在相應的類中。如果要隔離外部設備或外系統(tǒng)的變化對本系統(tǒng)的影響，可以為外部設備或外系統(tǒng)的接口程序單設立類。對于某些復雜的情況，可能還需要考慮同步機制。(2)確定輸出的形式和內容

輸出的形式有文本、表格、圖形、圖像、聲音和視頻片段等。輸出的內容包括提示信息、系統(tǒng)的計算或處理結果、對輸入處理情況的反饋信息等。

提示信息告訴用戶下面要進行何種輸入以及如何輸入。對于系統(tǒng)的計算或處理結果的輸出，總是伴隨著用戶輸入的命令的執(zhí)行而出現。若要在窗口或打印機上以報表、報告、圖形或窗口上的多媒體演示等形式進行輸出，則要先確定每種形式的內容要求，然后把它們各對應于一個或幾個類。對于反饋信息，一般是在系統(tǒng)需要較長的時間進行計算時才需要的，表明系統(tǒng)已經接收到命令，正在進行處理，對于這種情況要表示出處理的進度。(3)輸出步驟的細化如果系統(tǒng)輸出的信息量較大，可以分若干步驟進行輸出。一種常見的做法是發(fā)一條簡單的信息，通知用戶如何得到更詳細的輸出信息。另一種做法是為用戶設計一些閱讀或瀏覽輸出信息的動作，在這些動作的控制下，展示輸出信息中用戶所關心的部分。這樣，一項輸出可能被細化為一個輸入與輸出交織的過程。細化時考慮的主要因素是如何使用戶感到方便，以及輸出介質(如顯示屏、紙張等)的版面限制。8.3.2命令的組織在設計輸入與輸出時，還有一項重要的工作要做，那就是設計用戶使用系統(tǒng)的命令以及對命令的組織。系統(tǒng)可能有大量的命令，且一條命令可能含有大量的參數和任選項，如果對命令不加任何組織和引導，會給用戶帶來不便?？刹捎脙煞N技術措施對命令進行組織:1)分解:將一條含有許多參數和選項的復雜命令分解為若干較簡單的命令。2)組合:當一個系統(tǒng)的命令很多時，按照它們的功能或者所屬于的子系統(tǒng)，組合成若干命令組，使每組只包含幾條命令。這樣，命令間就形成了層次結構。按照下面的概念以及用戶需求，運用分解與組合技術，實現對命令的定義與組織。基本命令:使用一項獨立的系統(tǒng)功能的命令。一個從用況提取出來的人機交互過程是針對一項系統(tǒng)功能的，基本命令正是開始該交互過程并使用該項系統(tǒng)功能的命令。選中一個基本命令，對應的事件要傳送到實現該命令功能的系統(tǒng)成分。也即由人機交互部分的對象接收命令后，向問題域部分中實現該功能的對象發(fā)消息，請求進行處理。命令步:在執(zhí)行一條基本命令的交互過程中所包含的具體輸入步驟。從一個用況提取出來的人機交互過程的各項輸入都是這樣的命令步。高層命令:如果一條命令是在另一條命令的引導下選用的，則后者稱作前者的高層命令。高層命令是對基本命令的組織，相當于一個命令索引目錄。高層命令并不涉及某一項具體的系統(tǒng)功能，只是顯示下一層可選的系統(tǒng)功能，以供用戶選擇。對其常見的設計方式為主菜單條和下拉菜單等。圖8-3展示了基本命令及其命令步的結構。a)線性結構b)樹形結構（c）半序網狀結構（d）一般網狀結構圖8-3展示了基本命令以及命令步間的關系，圖中的實心圓點表示一個基本命令開始的命令步，空心圓點表示后續(xù)的一個命令步。

若基本命令過多，就需要用高層命令進行組織。可按功能的相似性進行組織，如在常見的菜單子系統(tǒng)中，高層命令“文件”下有“創(chuàng)建”、“打開”、“關閉”和“保存”等基本命令。也可以按子系統(tǒng)結構來組織基本命令，如對于正文編輯子系統(tǒng)和編譯子系統(tǒng)，要把屬于這兩個子系統(tǒng)的全部命令分別組織到高層命令“編輯”和“編譯”之下。圖8-4說明了高層命令及其結構。

圖中的實心圓點仍表示開始基本命令的命令步，空心圓點表示高層命令。根節(jié)點表示啟動整個系統(tǒng)的命令，或啟動系統(tǒng)的一個人機界面的命令。根節(jié)點的下一層命令是界面啟動后在最高層次上的可以被用戶選擇的命令(如主菜單上的命令)。虛線表示某些上層命令共享某個下層命令，或從下層命令轉向高層命令。圖8-4高層命令及其結構在兩個命令步之間通常要輸出信息，如圖8-5所示。圖8-5命令之間的輸出信息結構圖8-5a表示兩個命令步之間不存在著輸出信息結構。圖8-5b表示兩個命令步之間可能存在著三種輸出信息結構。第一種為反饋信息，在一個命令需要較長的時間執(zhí)行時，應該向用戶顯示當前命令執(zhí)行的情況，如給出一個進度條;第二種為處理結果，當前命令執(zhí)行的結果可能要向用戶顯示;第三種為提示信息，即對下一步可輸人的命令的提示。圖8-5c表示兩層命令之間的更為復雜的輸出信息結構。

在建立命令樹時，應遵循如下策略:1)把使用最頻繁的命令放在前面，或按照用戶的工作步驟進行排列。

2)在命令中發(fā)現整體-部分模式，以幫助對命令進行組織。

3)每層命令的個數應遵循7±2原則，命令的層次深度盡量要少。8.3.3用OO概念表達所奇的界面成分按照上述根據人機交互需求所做的設計，可以用OO概念表達所有的界面成分。如下為一些指導策略:

1)每個窗口分別對應一個類。

2)在窗口中，按照命令的邏輯，部署所需要的元素，如菜單、工作區(qū)和對話框等。窗口中的部件元素對應窗口類的部分類，部分類與窗口類形成聚合關系。

3)發(fā)現窗口類間的共性以及部件類間的共性，定義較一般的窗口類和部件類，分別形成窗口類問以及部件類間的泛化關系。

4)用類的屬性表示窗口或部件的靜態(tài)特征，如尺寸、位置和顏色等。如果使用界面生成工具可視化地定義定制界面，這樣的屬性往往會自動地出現在窗口和部件的屬性欄中。重要的是用屬性表示邏輯特征，如在菜單類中，每個選項表示一條命令，屬性的名稱要與它所對應的命令相符。還要注意對表示界面類間的聚合關系的屬性的命名，這樣的屬性要確切地表達每個部件的名稱。

5)用操作表示窗口或部件的動態(tài)特征，如選中、移動和滾屏等。如果使用界面生成工具，不需要對這樣的操作的特征標記花費精力，重要的是對命令進行響應的部分的設計，如選中一個命令按鈕后具體要執(zhí)行什么后續(xù)操作。

6)發(fā)現界面類之間的聯系，在其間建立關聯。必要時，進一步地繪制用戶與系統(tǒng)會話的順序圖。

7)建立界面類與問題域類之間的聯系。有些界面對象要與問題域中的對象進行通信，故要對二者之間的通信進行設計。在具體設計時，設計人員應該注意以下幾點:

人機界面只負責輸入與輸出和窗口更新這樣的工作，并把所有面向問題域部分的請求轉發(fā)給問題域部分，即在界面對象中不應該對業(yè)務邏輯進行處理。在多數情況下，問題域部分的對象不應該主動發(fā)起與界面部分對象之間的通信，而只能對界面部分對象進行響應，也就是說，只有界面部分的對象才能訪問問題域部分的對象。通常把界面對象向問題域對象傳輸信息或發(fā)布命令看作是"請求"，而把問題域對象向界面對象傳輸信息看作是"回應"或"通知"。盡量減少界面部分與問題域部分的耦合。由于界面是易變的，從易于維護和易于復用的角度出發(fā)，問題域部分和界面部分應該是低耦合的。解決問題的一種方法是，二者之間要通過接口來進行通信，圖8-6給出的是一個示意圖。也可以通過在人機交互部分和問題域部分之間增加控制器或協(xié)調類的方式解決這種問題，如可采用下面將要講述的發(fā)布一訂閱模式。在上面的策略中已經提到，在可視化的編程環(huán)境下，能節(jié)省很多界面設計工作。例如，利用工具，選擇界面元素，如窗口、菜單、對話框、圖符、滾動條、控制板、文本框和按鈕等，構建人機界面;所創(chuàng)建的各界面元素，都有自動創(chuàng)建的代碼與之對應，且界面元素間的嵌套關系也能體現在代碼中。這種創(chuàng)建界面的工作是所見即所得的。但上述建立的界面類與問題域類之間的聯系仍需要設計人員去設計。圖8-6問題域部分與人機交互部分通過接口進行聯系如下為兩個有關人機界面部分設計的例題?！纠}8-1】用發(fā)布一訂閱模式銜接問題域部分和人機交互部分。使用該模式可解決一些問題域中的對象與界面對象間進行交互的問題。

圖8-7說明了對一組不斷變化的數據，用三種顯示方式進行實時地顯示。a=50%b=30%c=20%圖8-7用三種方式對一組不斷變化的數據進行實時地顯示在系統(tǒng)中，計算數據的工作由問題域部分完成，顯示工作由界面部分完成。由于顯示方式是易變的，此處要采用發(fā)布訂閱模式來解決這個問題。圖8-8所示是采用該模式所建立的一個模型。出版者訂閱者發(fā)布者1111..*有變化時，向管理者發(fā)布事件。維護出版者和訂閱者間的映射，把出版者發(fā)布信息，利用參數通知給訂閱者。向管理者訂閱事件。圖8-8采用發(fā)布一訂閱模式銜接問題域部分和人機交互部分統(tǒng)計數據事件管理者顯示窗口1..*111{另一種方式,顯示窗口訪問統(tǒng)計數據}

在該模型中，訂閱者向發(fā)布者訂閱所感興趣事件，出版者向發(fā)布者發(fā)布事件，發(fā)布者維護出版者和訂閱者間的映射。當數據有變化時，發(fā)布者把出版者發(fā)布的數據情況利用消息通知給訂閱者。訂閱者是人機界面模型中的一部分，出版者是問題域模型中的一部分，發(fā)布者是人機交互部分和問題域部分之間的協(xié)調器。

在圖8-8中，一個發(fā)布者可以管理多個訂閱者，這樣無論增加或減少顯示方式，都不需要改動出版者，而且對訂閱者的顯示方式的修改，對出版者也沒有影響。有關發(fā)布一訂閱模式的更多內容請見第12章12.5節(jié)。a=50%b=30%c=20%統(tǒng)計數據事件管理者顯示窗口1..*111{另一種方式,顯示窗口訪問統(tǒng)計數據}目標是通知的發(fā)布者,它發(fā)出通知時,并不知道誰是它的觀察者.可以有任意數目的觀察者訂閱并接收通知.12.5Observer模式Observer(觀察者)模式用于定義對象間的一對多的依賴關系，當一個對象發(fā)生變化并對外發(fā)布消息時，所有依賴它的對象都將得到通知并可進行更新。后一句話中的那組對象是觀察者，它們要在發(fā)布消息的對象中進行登記（訂閱），以便在發(fā)布消息時能找到它們。該模式也稱為發(fā)布－訂閱（Publish-Subscribe）模式。采用觀察者模式，要在發(fā)布消息的對象中設立增減觀察者對象的操作，對于觀察者對象要建立一個統(tǒng)一的用于接收消息的接口。（若有必要，采用適配器模式來適配觀察到的子類）

益處：觀察者發(fā)生變化時，只須在發(fā)布消息的對象中增減對象標識即可，而不需進行其他改動。12.3Adapter模式（結構型）

Adapter（適配器）模式用于將類的一個接口轉換為另一個類所需的接口，以使由于接口不兼容的類能夠一起協(xié)作。

現系統(tǒng)要增加繪制圓形的功能，并且要求復用一個繪制圓型的類Circle。若類Circle中的繪圖和填充操作的特征標記與類Polygon的并不一致，則無法使用圖中運用的多態(tài)機制。解決該問題的一個方法是修改類Circle中的特征標記。若類Circle中的特征標記已經用在其他的類中，則會引起一系列的修改問題。況且修改他人的代碼有時還會出現難以預測的副作用。

對象Adapter模式類Adapter模式【例題8-2】用00概念表達界面成分。圖8-9中給出的類圖描述了一個界面的構成。圖8-9用類圖描述界面構成的示例上面已經提到，在可視化的編程環(huán)境下設計工作大為簡化，往往不需要建立上面那樣的模型。若有必要建立這樣的模型，可以直接使用可視化編程環(huán)境或類庫所提供的可復用類。在復用時，一種方式是直接使用，即把所復用的類標上{復用}，在類圖中直接使用。另一種方式是對復用類進行繼承，以進行擴充。圖8-10為上述兩種復用方式的示例。圖8-10兩種復用方式示例8.4人機交互部分的設計準則有關人機界面的設計原則有很多，都做到是不易的。但必須要保證界面的正確性和用戶友好性。如下是一些重要的界面設計原則。