《5-圖書管理系統(tǒng)-GUI設(shè)計(jì)》由會員分享，可在線閱讀，更多相關(guān)《5-圖書管理系統(tǒng)-GUI設(shè)計(jì)（31頁珍藏版）》請?jiān)谘b配圖網(wǎng)上搜索。
1、,*,Arial,或,Frutiger,55 Roman 25pt,華文細(xì)黑簡,25pt,Arial,或,Frutiger 55 Roman 25pt,華文細(xì)黑簡,25pt,Arial,或,Frutiger 55 Roman 25pt,華文細(xì)黑簡,25pt,Arial,或,Frutiger 55 Roman 25pt,華文細(xì)黑簡,25pt,Arial,或,Frutiger 55 Roman 25pt,華文細(xì)黑簡,25pt,Arial,或,Frutiger Bold 40pt,黑體,簡,40pt,軟件工程實(shí)踐,今天的工作任務(wù),完成圖書管理系統(tǒng),GUI,設(shè)計(jì),提交內(nèi)容,GUI,工程師在課上完成第一
2、個(gè),GUI,設(shè)計(jì)，并確定完成的界面?zhèn)€數(shù)（含名稱）。,我們的進(jìn)度，在這里,GUI,工程師的工作并不是從設(shè)計(jì)階段才開始的，早在需求分析階段，,GUI,工程師就已經(jīng)參與到用戶訪談中，了解用戶的使用習(xí)慣，喜好等，為設(shè)計(jì)用戶界面做準(zhǔn)備,我們的進(jìn)度，在這里,GUI,（圖形用戶界面）設(shè)計(jì)概述,對于用戶來說，友好的界面是至關(guān)重要的。,用戶界面（,U,ser,I,nterface,）的設(shè)計(jì)質(zhì)量直接影響用戶對軟件產(chǎn)品的評價(jià)，從而影響軟件產(chǎn)品的競爭力和使用壽命，因此，對人機(jī)界面的設(shè)計(jì)必須給予足夠的重視。,我們的進(jìn)度，在這里,先看一個(gè)例子,對比同一界面的以下兩種不同設(shè)計(jì)，然后說出哪種要好一些？,我們的進(jìn)度，在這里,我
3、們的進(jìn)度，在這里,我們的進(jìn)度，在這里,良好的設(shè)計(jì)原則,1,、關(guān)注用戶及其任務(wù)，而不是技術(shù),2,、首先考慮功能，其次才是表現(xiàn),3,、與用戶對任務(wù)的看法,保持一致,4,、設(shè)計(jì)要符合常見情況,5,、不要分散用戶對他們目標(biāo)的注意力,6,、促進(jìn)學(xué)習(xí)，從外,(,用戶,),到里,(,設(shè)計(jì)人員,),思考，而不是相反。,7,、傳遞信息，而不僅僅是數(shù)據(jù),8,、設(shè)計(jì)應(yīng)滿足響應(yīng)需求,9,、通過用戶試用發(fā)現(xiàn)錯(cuò)誤，然后修復(fù)它,最好的程序界面就是用戶無需去閱讀操作手冊就知道該如何使用的界面。,我們的進(jìn)度，在這里,關(guān)注用戶及其任務(wù)，而不是技術(shù),對人的理解,程序必須反映用戶的視角和行為。要充分理解用戶開發(fā)者首先要理解人。人類通
4、過辨別比通過記憶學(xué)習(xí)起來更容易。,要經(jīng)常試著提供一個(gè)數(shù)據(jù)列表給用戶，而非讓用戶憑記憶自己輸入數(shù)據(jù),。普通人能記住,2000,到,3000,單詞，但卻可以認(rèn)出,50000,單詞。,我們的進(jìn)度，在這里,我們的進(jìn)度，在這里,從用戶的視角看問題，使用用戶的詞匯進(jìn)行描述，保持一致性，引導(dǎo)用戶的使用習(xí)慣,清楚一致的設(shè)計(jì),很多,GUI,程序?qū)ψ罱K用戶常常不夠清楚。一個(gè)增強(qiáng)程序清楚表述能力的有效方法是使用列表中的,保留字,進(jìn)行開發(fā)。用戶中最常見的抱怨是某個(gè)術(shù)語表述的不清楚或不一致。,在軟件開發(fā)中經(jīng)常出現(xiàn)的情況是，在程序發(fā)布之后，一個(gè)屏幕上可能寫著“項(xiàng)目”，而下一屏卻寫著“產(chǎn)品”，而第三屏又變成了“貨物”，可是
5、其實(shí)這三個(gè)術(shù)語是指的同一個(gè)東西。這種一致性的缺乏導(dǎo)致用戶非常迷惑并產(chǎn)生操作失誤。,我們的進(jìn)度，在這里,保留字列表,文本,含義和行為,是否出現(xiàn)在按鈕上,是否出現(xiàn)在菜單上,MnemonicKeystrokes,熱鍵？,ShortcutKeystrokes,快捷鍵？,OK,接受輸入的數(shù)據(jù)或顯示的響應(yīng)信息，關(guān)掉窗口,Yes,No,None,or,Cancel,不接受輸入的信息，關(guān)掉窗口,Yes,No,None,Esc,Close,結(jié)束當(dāng)前的任務(wù)，讓程序繼續(xù)進(jìn)行；關(guān)掉數(shù)據(jù)窗口,Yes,Yes,Alt+C,None,Exit,推出程序,No,Yes,Alt+X,Alt+F4,Help,調(diào)出程序的幫助信息,
6、Yes,Yes,Alt+H,Fl,Save,保存數(shù)據(jù)，停留在當(dāng)前窗口,Yes,Yes,Alt+S,Shift+Fl2,Save As,用新名字保存數(shù)據(jù),No,Yes,Alt+A,F12,Undo,撤銷前一個(gè)動(dòng)作,No,Yes,Alt+U,Ctrl+Z,Cut,剪切高亮字符,No,Yes,Alt+T,Ctrl+X,Copy,拷貝高亮的文本,No,Yes,Alt+C,Ctrl+C,Paste,在插入點(diǎn)粘貼被拷貝或剪切的文本,No,Yes,Alt+P,Ctrl+V,利用保留字表使得系統(tǒng)詞匯保持一致,提供可視反饋,如果你曾有過傻傻的瞪著自己,電腦上顯示的沙漏等著一個(gè)操作結(jié)束的時(shí)候，就會明白沒有可視化的
7、反饋信息有多糟糕。,用戶非常希望知道一個(gè)操作會花費(fèi)多長的時(shí)間以便準(zhǔn)備好足夠的耐心。作為最一般的規(guī)則，當(dāng)一個(gè)操作超過,7,10,秒的時(shí)候，大多數(shù)用戶希望看到一個(gè)帶有進(jìn)度條的消息對話框。時(shí)間,的長短要根據(jù)用戶類型和應(yīng)用程序的特點(diǎn)來調(diào)整。,使常用的用戶任務(wù)簡單化，不要讓用戶解決額外的問題,GUI,設(shè)計(jì)案例賞析,1):,常用菜單要有命令快捷方式。,2):,完成相同或相近功能的菜單用橫線隔開放在同一位置。,3):,菜單前的圖標(biāo)能直觀的代表要完成的操作。,Good,如果用戶不能理解對話框里的內(nèi)容，這就意味著是這個(gè)對話框設(shè)計(jì)者的失敗。通常情況下，就,像標(biāo)準(zhǔn)保存對話框或打開文件對話框那樣，所有對話框都應(yīng)該含有
8、一個(gè)用來提問或警告的消息,（圖標(biāo)），另外還含有一段附加的描述性文字來提供額外提示譬如“這個(gè)操作不可恢復(fù)”,這個(gè)問題對話框的標(biāo)題與所提示的信息不符，更糟糕的是沒有任何信息告訴用戶究竟要“確信”,啥（對話框顯示“您確信嗎？”的問題，而窗口標(biāo)題卻是“錯(cuò)誤”）,Bad,使用彩色用戶界面元素時(shí)，要考慮緊接這個(gè)界面元素的相鄰界面元素是什么。特別是要注意文本所在的背景底色。,提高對比度才看的清楚。,Bad,第一個(gè)例子不會讓用戶知道這個(gè)對話框是何用途。沒有對話框里面文字的提示，用戶不可能知道下一步該怎么辦。,相反，第二個(gè)例子用意則非常的明顯以致于不需要解釋文字用戶也知道該怎么做。,Bad,Good,第一個(gè)例子
9、完全沒有使用空白，按鈕之間的距離都是一樣的，盡管我們知道這三個(gè)按鈕點(diǎn)下去造成的后果大不相同。有意思的是，這個(gè)會造成數(shù)據(jù)損失的按鈕竟然相當(dāng)不方便的放在中間。,所以，這就造成一種被錯(cuò)誤選擇的可能性：如果你要點(diǎn)“是（,Yes,）”的右部，或者“取消（,Cancel)”,的左邊，可手不小心一抖錯(cuò)過了幾個(gè)象素就點(diǎn)到“否”按鈕上了！數(shù)據(jù)因此而丟失。,而下面的這組按鈕就有效的利用了空白。既然對話框中的提示是“您想在關(guān)閉文檔前保存內(nèi)容嗎？”，所以這些按鈕的動(dòng)作結(jié)果和上面的一組一樣：“取消”使關(guān)閉文檔的命令取消；“保存”將保存文檔并且關(guān)閉；因此“不要保存”按鈕是唯一可以造成未保存數(shù)據(jù)丟失的按鈕，所以它和其它兩個(gè)
10、按鈕“取消”和“保存”（它們都不會未保存數(shù)據(jù)丟失）之間有一個(gè)很大的空白。這樣的分布保證了讓用戶偶然錯(cuò)誤選擇“不要保存”的可能性非常小。,利用空白分割,Bad,Good,選擇合適的控件。上圖中，,yes,和,no,只能二選一，所以不應(yīng)該使用,checkbox,，而是,radiobutton,Bad,GUI,圖形用戶界面設(shè)計(jì)過程,設(shè)計(jì)原型,用戶試用,和評估,修改原型,評估,GUI,設(shè)計(jì)工具,GUI Design Studio,MS Visio,甚至可以是,MyEclipse,（加入,VE,插件后的）或者,NETBean,等,IDE,。,GUI Design Studio,是什么？,GUI Desi
11、gn Studio,是一款針對,windows,系統(tǒng),的,圖形界面設(shè)計(jì)工具,它可以便捷的創(chuàng)建界面圓形文檔而不要任何的腳本和編程知識。,使用標(biāo)準(zhǔn)組件繪制屏幕 窗口或者組建組合,并把它們按照工作流連結(jié)在一起,然后演示你的設(shè)計(jì)。,利用,GUI Design Studio,自帶的案例進(jìn)行學(xué)習(xí),打開,GUI Design Studio,文件夾下面的,sample,文件夾，選擇,Design Collection,文件夾，打開案例，使用模擬器進(jìn)行運(yùn)行。查看效果,依次學(xué)習(xí),Standard Components,文件夾和,Tutorial,文件夾中的案例。,幾個(gè)要點(diǎn),對齊，和調(diào)整大小使用下面這個(gè)工具條,插入
12、圖片的方法：設(shè)計(jì)菜單,添加位圖,在,GUI Design Studio,中完成圖書管理系統(tǒng)的,GUI,設(shè)計(jì),建立界面控制流的轉(zhuǎn)換,新建一個(gè)設(shè)計(jì)，用來設(shè)計(jì)另外一個(gè)界面“圖書管理系統(tǒng)主界面”,建立界面控制流的轉(zhuǎn)換,在圖書管理登錄,.,gui,中，點(diǎn)擊右鍵選擇“添加組合屏幕”,選擇圖書管理系統(tǒng)主界面添加進(jìn)去。,用鏈接工具 將登陸按鈕與圖書管理系統(tǒng)主界面鏈接起來,將圖書管理系統(tǒng)登錄界面點(diǎn)擊右鍵，“設(shè)置為典型元件”,運(yùn)行模擬器查看效果。,為圖書管理系統(tǒng)主界面增加菜單項(xiàng),為“注銷”和主界面的關(guān)閉按鈕添加一個(gè)確認(rèn)退出系統(tǒng)的對話框,依次類推,畫出其余的,GUI,界面來。交給代碼人員，他們進(jìn)行代碼編寫。,如果你同時(shí)擔(dān)任代碼和,GUI,，那么建議你直接在,IDE,里面做,GUI,設(shè)計(jì)，省時(shí)省力,課程小結(jié),本次課中，用到以下知識,設(shè)計(jì),學(xué)習(xí)使用了工具,GUI Design Studio,我們的進(jìn)度，在這里,
5-圖書管理系統(tǒng)-GUI設(shè)計(jì)
