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

、用戶界面的概念和定義用戶界面：又稱人機(jī)界面，實(shí)現(xiàn)用戶與計(jì)算機(jī)之間得通信，以控制計(jì)算機(jī)或進(jìn)行用戶和計(jì)算機(jī)之間得數(shù)據(jù)傳送得系統(tǒng)部件。GUI：即圖形用戶界面(GraphicalUserInterface,GUI)一種可視化得用戶界面，它使用圖形界面代替正文界面。是為應(yīng)用程序提供一個(gè)圖形化的界面，程序通過GUI與用戶交互，GUI能使一個(gè)應(yīng)用程序具有與眾不同的“外觀”和“感覺”。有了GUI，用戶就不必花很多時(shí)間去記憶各個(gè)鍵盤序列的功能，從而把更多的時(shí)間投入到有效地使用應(yīng)用程序本身上。[1]由于傳統(tǒng)觀念的影響，用戶界面設(shè)計(jì)一直不為重視，認(rèn)為這純粹是取悅用戶的伎倆，沒有任何實(shí)用價(jià)值。只要一個(gè)應(yīng)用軟件具有強(qiáng)大的功能，能順利幫助用戶完成任務(wù)就可以了。近年來，隨著計(jì)算機(jī)硬件技術(shù)迅猛發(fā)展，生產(chǎn)成本大幅度下跌，用戶在應(yīng)用軟件的可操作性以及操作的舒適性等方面提出了更高的要求，期望應(yīng)用軟件能盡可能的為他們提供一個(gè)輕松、愉快、感覺良好的操作環(huán)境。這表明，友好的人機(jī)界面設(shè)計(jì)已經(jīng)成為應(yīng)用軟件開發(fā)的一個(gè)重要組成部分。對(duì)于應(yīng)用軟件來說，一個(gè)基本現(xiàn)實(shí)就是：用戶界面是面向用戶的。用戶需要的是開發(fā)者開發(fā)的應(yīng)用軟件滿足其需求，并且易于使用。太多的開發(fā)者自以為是藝術(shù)天才，他們不去盡力遵循用戶界面設(shè)計(jì)標(biāo)準(zhǔn)，或花精力使得產(chǎn)品好用；相反，他們錯(cuò)誤地認(rèn)為編寫更靈巧的代碼或是使用一套確實(shí)有趣的顏色方案才是重要的事。[2]界面設(shè)計(jì)成為以用戶為中心，實(shí)現(xiàn)軟件的簡單使用和愉悅使用，使軟件能夠被用戶所接受。因此，判定一個(gè)成功的交互系統(tǒng)的首要條件是看它能否滿足用戶的需要。這就要使應(yīng)用軟件不僅能夠識(shí)別各種用戶群，而且還可辨別各個(gè)用戶所掌握的技能、經(jīng)驗(yàn)以及他們的偏好。任何計(jì)算機(jī)應(yīng)用系統(tǒng)都是通過用戶界面與用戶交互的，用戶界面已成為所有計(jì)算機(jī)系統(tǒng)的有機(jī)組成部分，它決定了人類如何控制和操縱系統(tǒng)。一個(gè)好的用戶界面應(yīng)該為用戶提供統(tǒng)一、規(guī)范的交互界面，從而提高用戶工作效率，增強(qiáng)用戶對(duì)系統(tǒng)的認(rèn)可程度。因此可以說，用戶界面設(shè)計(jì)的優(yōu)劣已經(jīng)成為計(jì)算機(jī)應(yīng)用系統(tǒng)成功與否的關(guān)鍵因素之一。那么什么是以用戶為中心的設(shè)計(jì)？以用戶為中心的設(shè)計(jì)在國際上還沒有定論，但是有人提出幾種熟悉用戶、他們的任務(wù)以及需求的方法：1．與用戶交談2．到辦公地點(diǎn)拜訪用戶3．觀察用戶工作4．將用戶工作錄像5．了解工作組織6．自我嘗試7．使用戶在工作時(shí)邊想邊說8．讓用戶參與設(shè)計(jì)9．在設(shè)計(jì)小組中包括專家級(jí)用戶10．執(zhí)行任務(wù)分析11．利用調(diào)查和問卷12．制定可測試的目標(biāo)因此根據(jù)這些方法，就需要有一定的規(guī)范。二、用戶界面設(shè)計(jì)規(guī)范一般說來，公認(rèn)的設(shè)計(jì)規(guī)范應(yīng)該包括下面幾個(gè)內(nèi)容：1．用戶界面設(shè)計(jì)原則堅(jiān)持圖形用戶界面（GUI）設(shè)計(jì)原則，界面直觀、對(duì)用戶透明：用戶接觸軟件后對(duì)界面上對(duì)應(yīng)的功能一目了然、不需要多少培訓(xùn)就可以方便使用本應(yīng)用系統(tǒng)。界面設(shè)計(jì)員應(yīng)該明白軟件中用戶是所有處理的核心，不應(yīng)該有應(yīng)用程序來決定處理過程，所以用戶界面應(yīng)當(dāng)由用戶來控制應(yīng)用如何工作、如何響應(yīng)，而不是由開發(fā)者按自己的意愿把操作流程強(qiáng)加給用戶。[3]2．一致性原則一致性原則指在術(shù)語、控件、字體、標(biāo)簽、顏色、圖標(biāo)、信息及信息表現(xiàn)方式等方面確保一致。整個(gè)應(yīng)用程序用統(tǒng)一的風(fēng)格，從而達(dá)到良好的使用效果。3．合理性原則程序應(yīng)用中應(yīng)該保持統(tǒng)一的風(fēng)格和操作方式，符合用戶的操作習(xí)慣，相關(guān)信息應(yīng)集中在一起，并突出主要信息。合理的布局是界面好壞的另一個(gè)重要標(biāo)準(zhǔn)。4．快捷性原則保持界面能很快對(duì)用戶操作作出反應(yīng)。特別對(duì)于有大量錄入項(xiàng)的界面，能讓用戶不使用鼠標(biāo)即可完成快速數(shù)據(jù)錄入。在用戶界面中加入一些功能，這些功能可以讓熟練用戶在不同的區(qū)域快速的輸入數(shù)據(jù)。這些功能包括重復(fù)功能、快捷鍵、帶有有意義的圖標(biāo)的按鈕等等，所有這些可以使速度快的用戶可以控制界面并加快數(shù)據(jù)的輸入。5．清晰性原則（1） 設(shè)計(jì)的結(jié)果應(yīng)從清晰易懂為首要原則。它的內(nèi)容主要體現(xiàn)在：擁有含義明確的標(biāo)識(shí)符號(hào)。盡量采用已有的協(xié)議。減少消息模式的數(shù)目。（2） 類的結(jié)構(gòu)應(yīng)當(dāng)盡量簡明，層次深度應(yīng)適當(dāng)（3） 盡量使用簡單的協(xié)議。（4）盡量使用簡單的服務(wù)。三、用戶界面的發(fā)展從早期的人去適應(yīng)計(jì)算機(jī)到現(xiàn)在的計(jì)算機(jī)在不斷的適應(yīng)新時(shí)期的用戶需求來看，用戶界面的發(fā)展不僅影響了最終用戶的使用，影響了計(jì)算機(jī)的推廣應(yīng)用，甚至影響了人們的工作和生活。我們這里只就計(jì)算機(jī)輸出信息的形式而言來簡單介紹一下用戶界面的反展和趨勢。1．命令語言形式。從有人機(jī)交互以來，用戶與計(jì)算機(jī)之間就借助一種雙方都能理解的語言進(jìn)行交互式對(duì)話。根據(jù)語言的特點(diǎn)可分為：a.形式語言。b.自然語言。c.類自然語言。[4]2．圖形用戶界面。即就是我們前面所提到的GUI界面，一種可視化得用戶界面，它使用圖形界面代替正文界面。圖形用戶界面和人機(jī)交互過程極大地依賴視覺和手動(dòng)控制的參與，因此具有強(qiáng)烈的直接操作特點(diǎn)。3．直接操縱用戶界面。直接操縱界面強(qiáng)調(diào)不是去用單純的文字或數(shù)字的表示，而要更多的借助其他的表示形式，比如物理、空間或形象的表示。4．多媒體用戶界面。在多媒體用戶界面出現(xiàn)之前，用戶界面中只有兩種媒體：文本和圖形，都是靜態(tài)的媒體。多媒體技術(shù)引入了動(dòng)畫、音頻、視頻等動(dòng)態(tài)媒體，特別是引入了音頻媒體，從而大大豐富了計(jì)算機(jī)表現(xiàn)信息的形式。5．多通道用戶界面。雖然多媒體大大豐富了計(jì)算機(jī)的表現(xiàn)形式，但它仍然是使用常規(guī)的簡單的輸入設(shè)備，如常用的鼠標(biāo)，鍵盤等，只能單通道輸入，呈現(xiàn)出輸入輸出不平衡的形式。那么不同于傳統(tǒng)的輸入方式就是多通道用戶界面了。綜合采用視線、語音、手勢等新的交互通道、設(shè)備和交互技術(shù)，使用戶利用多個(gè)通道以自然、并行、協(xié)作的方式進(jìn)行人機(jī)對(duì)話，通過整合來自多個(gè)通道的精確的和不精確的輸入來捕捉用戶的交互意圖，提高人機(jī)交互的自然性和高效性。6．虛擬現(xiàn)實(shí)技術(shù)。作為一種新型人機(jī)交互形式，虛擬現(xiàn)實(shí)技術(shù)比以前任何人機(jī)交互形式都有希望徹底實(shí)現(xiàn)和諧的、“以人為中心”的人機(jī)界面。多通道和多媒體技術(shù)的許多應(yīng)用成果可直接被應(yīng)用于虛擬現(xiàn)實(shí)技術(shù)，而虛擬現(xiàn)實(shí)技術(shù)正是一種以集成為主的技術(shù)，其人機(jī)界面可以分解為多媒體多通道界面。7．理想的人機(jī)交互方式。人機(jī)交互技術(shù)幾十年來經(jīng)歷了幾個(gè)不同的主要發(fā)展階段和典型風(fēng)格。那么到底什么是理想的人機(jī)交互方式呢？我個(gè)人認(rèn)為，所謂理想的交互應(yīng)該追求自然和和諧，使得用戶和計(jì)算機(jī)能夠簡單自然的進(jìn)行交流。用戶界面工作流程。用戶界面設(shè)計(jì)在工作流程上分為結(jié)構(gòu)設(shè)計(jì)、交互設(shè)計(jì)、視覺設(shè)計(jì)三個(gè)部分。?結(jié)構(gòu)設(shè)計(jì)StruetureDesign結(jié)構(gòu)設(shè)計(jì)也成概念設(shè)計(jì)(ConceptualDesign)，是界面設(shè)計(jì)的骨架。通過對(duì)用戶研究和任務(wù)分析，制定出產(chǎn)品的整體架構(gòu)?；诩堎|(zhì)的的低保真原型(PaperPrototype)可提供用戶測試并進(jìn)行完善。在結(jié)構(gòu)設(shè)計(jì)中，目錄體系的邏輯分類和語詞定義是用戶易于理解和操作的重要前提。?交互設(shè)計(jì)InteractiveDesign交互設(shè)計(jì)的目的是使產(chǎn)品讓用戶能簡單使用。任何產(chǎn)品功能的實(shí)現(xiàn)都是通過人和機(jī)器的交互來完成的。因此，人的因素應(yīng)作為設(shè)計(jì)的核心被體現(xiàn)出來。交互設(shè)計(jì)的原則如下：有清楚的錯(cuò)誤提示。誤操作后，系統(tǒng)提供有針對(duì)性的提示。讓用戶控制界面?！跋乱徊健?、“完成”，面對(duì)不同層次提供多種選擇，給不同層次的用戶提供多種可能性。允許兼用鼠標(biāo)和鍵盤。同一種功能，同時(shí)可以用鼠標(biāo)和鍵盤。提供多種可能性。允許工作中斷。例如用手機(jī)寫新短信的時(shí)候，收到短信或電話，完成后回來仍能夠找到剛才正寫的新短信。使用用戶的語言，而非技術(shù)的語言。提供快速反饋。給用戶心理上的暗示，避免用戶焦急。7） 方便退出。如手機(jī)的退出，是按一個(gè)鍵完全退出，還是一層一層的退出。提供兩種可能性。8）導(dǎo)航功能。隨時(shí)轉(zhuǎn)移功能，很容易從一個(gè)功能跳到另外一個(gè)功能。9）讓用戶知道自己當(dāng)前的位置，使其做出下一步行動(dòng)的決定。?視覺設(shè)計(jì)VisualDesign在結(jié)構(gòu)設(shè)計(jì)的基礎(chǔ)上，參照目標(biāo)群體的心理模型和任務(wù)達(dá)成進(jìn)行視覺設(shè)計(jì)。包括色彩、字體、頁面等。視覺設(shè)計(jì)要達(dá)到用戶愉悅使用的目的。視覺設(shè)計(jì)的原則如下：1）界面清晰明了。允許用戶定制界面。2）減少短期記憶的負(fù)擔(dān)。讓計(jì)算機(jī)幫助記憶，例：UserName,、Password、IE進(jìn)入界面地址可以讓機(jī)器記住。3） 依賴認(rèn)知而非記憶。如打印圖標(biāo)的記憶、下拉菜單列表中的選擇4）提供視覺線索。圖形符號(hào)的視覺的刺激；GUI（圖形界面設(shè)計(jì)）：Where,What,NextStep5）提供默認(rèn)（default）、撤銷（undo）、恢復(fù)（redo）的功能6） 提供界面的快捷方式7） 盡量使用真實(shí)世界的比喻。如：電話、打印機(jī)的圖標(biāo)設(shè)計(jì)，尊重用戶以往的使用經(jīng)驗(yàn)。8） 完善視覺的清晰度。條理清晰；圖片、文字的布局和隱喻不要讓用戶去猜。9） 界面的協(xié)調(diào)一致。如手機(jī)界面按鈕排放，左鍵肯定；右鍵否定；或按內(nèi)容擺放。10） 同樣功能用同樣的圖形。11） 色彩與內(nèi)容。整體軟件不超過5個(gè)色系，盡量少用紅色、綠色。近似的顏色表示近似的意思。[5]四、窗口界面信息輸入窗口界面也是人機(jī)交互的重要界面，所以在設(shè)計(jì)某個(gè)系統(tǒng)的輸入界面時(shí)，一般應(yīng)注意如下幾方面的問題。1．可靠性高，容錯(cuò)性好1）．為可能的參數(shù)設(shè)置初始值．設(shè)置各種效驗(yàn)，隨時(shí)檢查和提示用戶系統(tǒng)的工作狀態(tài)與錯(cuò)誤信息．設(shè)置容錯(cuò)、糾錯(cuò)功能，允許用戶出錯(cuò)。2．操作簡單，易學(xué)易用。盡可能減少錄入量，特別時(shí)漢字的錄入，對(duì)固定信息用菜單當(dāng)時(shí)錄入。操作符簡單、明確，容易記憶。適當(dāng)增加幫助功能，使用戶可以邊用邊學(xué)。輸入界面的色彩不可過于單調(diào)，也不可過于濃重。信息反饋時(shí)間不能過長(vlOS),f否則應(yīng)當(dāng)增加提示信息。3．風(fēng)格一致，布局合理l)應(yīng)當(dāng)使系統(tǒng)中所有的輸入界面具有統(tǒng)一的風(fēng)格。2)同一系統(tǒng)各輸入界面具有基本統(tǒng)一的操作方式。布局上要把相關(guān)信息集中在一起，突出主要信息。輸入的順序符合自上而下、自左而右的習(xí)慣。輸入信息過多時(shí)可以分屏顯示，不要使界面過于擁擠。[6]五、面向?qū)ο笤O(shè)計(jì)的內(nèi)容。系統(tǒng)設(shè)計(jì)．系統(tǒng)層次結(jié)構(gòu)設(shè)計(jì)。.系統(tǒng)數(shù)據(jù)存儲(chǔ)設(shè)計(jì)。.系統(tǒng)資源訪問設(shè)計(jì)。.并發(fā)性設(shè)計(jì)。.交互行為方式設(shè)計(jì)。對(duì)象/類的設(shè)計(jì)。.對(duì)象靜態(tài)結(jié)構(gòu)設(shè)計(jì)。.對(duì)象動(dòng)態(tài)行為模型設(shè)計(jì)。六、面向?qū)ο笤O(shè)計(jì)的一般原則。界面形式應(yīng)力求簡單、友好。界面系統(tǒng)應(yīng)提供一定的容錯(cuò)或糾錯(cuò)機(jī)制。符合用戶的實(shí)際需求和使用習(xí)慣。設(shè)計(jì)一個(gè)人機(jī)交互界面時(shí)，應(yīng)分析不同類別用戶的實(shí)際需求，以及充分考慮用戶的知識(shí)、技能水平，確定用戶滿意的，并樂于接受的界面形式和結(jié)構(gòu)。人機(jī)交互界面是給用戶使用的，為設(shè)計(jì)好人機(jī)交互部分，設(shè)計(jì)者必須認(rèn)真研究使用它的用戶，要設(shè)身處地的為用戶著想。通常應(yīng)該從這幾個(gè)方面考慮：1．按技能層次分類：可分為初學(xué)者、初級(jí)、中級(jí)、高級(jí)。2．按職務(wù)分類：可分為總經(jīng)理、經(jīng)理、管理人員、辦事人員。3．按不同的成員分類：可分為職員、顧客。應(yīng)該仔細(xì)了解每類用戶情況，把信息記錄下來，供設(shè)計(jì)時(shí)參考。1．用戶類型。2．使用系統(tǒng)要達(dá)到的目的。3．特征（年齡、性別、受教育程度和限制因素等）。4．成功的關(guān)鍵因素（需求、愛好和習(xí)慣等）。5．技能水平。6．完成本職工作的腳本。[7]七、下面以業(yè)務(wù)查詢訂單為例介紹具體操作方法：在設(shè)計(jì)訂單界面以前，應(yīng)該先確定訂單查詢業(yè)務(wù)的處理流程。在畫流程圖時(shí)應(yīng)該遵循以下原則：1．滿足業(yè)務(wù)處理需要2．盡量減少數(shù)據(jù)的冗余3．方便修改、添加和刪除4．提高查詢效率流程圖：

這是一個(gè)簡單的查詢界面，簡單明了，只有幾個(gè)按鈕就能清清楚楚的表達(dá)出要進(jìn)行的動(dòng)作行為。標(biāo)識(shí)明確，簡明易懂，但不足的是沒有提供一定的容錯(cuò)和糾錯(cuò)功能。這個(gè)是一個(gè)比較好的定單表，界面以渚黃色為主，以灰色為輔，給人以穩(wěn)重舒適的

感覺。在結(jié)構(gòu)上，總體來說符合界面設(shè)計(jì)的一般原則，也提供了多種不同方式的選擇，整體風(fēng)格一致，美觀，大方，易學(xué)。產(chǎn)品情況詳細(xì)，服務(wù)周到。符合了用戶和顧客的實(shí)際要求，滿足了不同消費(fèi)群體的需求。三］I?搜索▼I矽三］I?搜索▼I矽辱0個(gè)已攔截I警拼寫檢查▼叵選項(xiàng)衛(wèi)衛(wèi)定單查詢表地址（為 http://www.cntags.net/order-made-order.htm8參▼|定單查詢表轉(zhuǎn)到123456首頁|產(chǎn)品介紹|網(wǎng)上定購|匯款方式丨郵寄贋用丨內(nèi)容模板丨誠征分銷商|常見間題丨聯(lián)系我們屈上定購壇寫定購單下載定峋表格定購涼程彩買流程付款流程匯款方式網(wǎng)上支付平臺(tái)_屈上定購壇寫定購單下載定峋表格定購涼程彩買流程付款流程匯款方式網(wǎng)上支付平臺(tái)_銀行匯款帳于定單查詢點(diǎn)擊輸入定單號(hào)填寫定購表定購數(shù)量:|“不愣鋼一魅”（89彫2片/I套） jJ墊圈顏色：|軍用黒色二］詳情見：涓音墊圈例圖郵寄方式：|普通平郵包裹一大陸7元二J查詢郵寄的資費(fèi)標(biāo)準(zhǔn)計(jì)算總價(jià)I」冗）可以使坤以下宇符=英文：ABCDEFGHIJKLMN0[D0R0TUMWH*數(shù)字：0123456789符號(hào)：J「/&@第一行：I無 I」第二行： L 第三行：i第四行：i第五行：i文宇對(duì)齊方式：「'左邊對(duì)齊”說明：“1套”的識(shí)別牌j2片上面制作的內(nèi)容和材料要求都是一樣的，否則按照2個(gè)單片計(jì)算價(jià)格BTM■申Internet尤其是在售后服務(wù)方面此界面更是能考慮到客戶的技能層次和限制因素等，在最后的設(shè)計(jì)中添加了修改功能。在不是很清晰的地方都提供了信息提示。簡單易學(xué)。如圖所示：

示參考文獻(xiàn)：[1].Java程序設(shè)計(jì)教程與實(shí)例許文憲董子建主編北京大學(xué)出版社2005ISBN.7-301-09598-8./club/bbs/showAn