用戶(hù)界面設(shè)計(jì)大作業(yè)范例

1、精選優(yōu)質(zhì)文檔-傾情為你奉上鍵入公司名稱(chēng)基于Zigbee技術(shù)的福利院看護(hù)系統(tǒng)用戶(hù)界面設(shè)計(jì)說(shuō)明書(shū)zhaofengnian2012/11/27 修訂歷史記錄日期版本號(hào)修改說(shuō)明修改人核準(zhǔn)人1.0制定大綱及編寫(xiě)正文2.0修改界面設(shè)計(jì)規(guī)范3.0修改主要界面設(shè)計(jì)目錄1 引言1.1編寫(xiě)目的本文檔是對(duì)系統(tǒng)界面設(shè)計(jì)風(fēng)格進(jìn)行描述，和用戶(hù)交互的最終界面在詳細(xì)設(shè)計(jì)說(shuō)明書(shū)中設(shè)計(jì)和解釋。1.2項(xiàng)目背景基于Zigbee技術(shù)的福利院看護(hù)系統(tǒng)。（此處需增加細(xì)節(jié)。）1.3定義、縮略詞Zigbee：Zigbee是一種低速短距離傳輸?shù)臒o(wú)線(xiàn)網(wǎng)絡(luò)協(xié)定，底層是采用IEEE802.15.4 標(biāo)準(zhǔn)規(guī)范的媒體存取層與實(shí)體層。主要特色有低速、低耗電

2、、低成本、支援大量網(wǎng)絡(luò)節(jié)點(diǎn)、支援多種網(wǎng)絡(luò)拓?fù)洹⒌蛷?fù)雜度、快速、可靠、安全。Zigbee協(xié)定層從下到上分別為實(shí)體層（PHY）、媒體存取層（MAC）、網(wǎng)絡(luò)層（NWK）、應(yīng)用層（APL）等。用戶(hù)界面：又稱(chēng)人機(jī)界面，實(shí)現(xiàn)用戶(hù)與計(jì)算機(jī)之間得通信，以控制計(jì)算機(jī)或進(jìn)行用戶(hù)和計(jì)算機(jī)之間得數(shù)據(jù)傳送得系統(tǒng)部件。 GUI：即圖形用戶(hù)界面，一種可視化得用戶(hù)界面，它使用圖形界面代替正文界面。1.4參考資料（此處應(yīng)增加細(xì)節(jié)）2 應(yīng)當(dāng)遵循的界面設(shè)計(jì)規(guī)范2.1 用戶(hù)界面設(shè)計(jì)原則本系統(tǒng)堅(jiān)持圖形用戶(hù)界面（GUI）設(shè)計(jì)原則，界面直觀、對(duì)用戶(hù)透明。用戶(hù)接觸軟件后對(duì)界面上對(duì)應(yīng)的功能一目了然、不需要多少培訓(xùn)就可以方便使用本應(yīng)用

3、系統(tǒng)。 界面設(shè)計(jì)員應(yīng)該明白軟件中用戶(hù)是所有處理的核心，不應(yīng)該有應(yīng)用程序來(lái)決定處理過(guò)程，所以用戶(hù)界面應(yīng)當(dāng)由用戶(hù)來(lái)控制應(yīng)用如何工作、如何響應(yīng)，而不是由開(kāi)發(fā)者按自己的意愿把操作流程強(qiáng)加給用戶(hù)。 界面設(shè)計(jì)必須經(jīng)過(guò)確認(rèn)才能完成。2.2 界面一致性 在界面設(shè)計(jì)中應(yīng)該保持界面的一致性。一致性既包括使用標(biāo)準(zhǔn)的控件,也指使用相同的信息表現(xiàn)方法,如在字體、標(biāo)簽風(fēng)格、顏色、術(shù)語(yǔ)、顯示錯(cuò)誤信息等方面確保一致。2.2.1 顯示信息一致性標(biāo)準(zhǔn)（1）標(biāo)簽提示:字體為不加重、宋體、黑色、灰底或透明、無(wú)邊框、右對(duì)齊、不帶冒號(hào)、一般情況為五號(hào)（10號(hào)）； （2）日期:正常字體、宋體、白底黑

4、字、3-D lowered； （3）對(duì)齊方法：  左對(duì)齊:一般文字、單個(gè)數(shù)字、日期等  右對(duì)齊:數(shù)字、時(shí)間、日期加時(shí)間。 （4）分辨率為800*600，增強(qiáng)色16色 （5）字體缺省為宋體、五號(hào)、黑色 （6）底色缺省采用灰色 這些信息的排列顯示風(fēng)格供參考, 在同一個(gè)應(yīng)用中,這些信息的表現(xiàn)方式不一致,會(huì)使得用戶(hù)分散注意力,影響這一軟件的使用，因此開(kāi)發(fā)者應(yīng)當(dāng)注意在同一軟件中表現(xiàn)形式的一致性。 2.2.2 布局合理化原則應(yīng)注意在一個(gè)窗口內(nèi)部所有控件的布局和信息組織的藝術(shù)性,使得用戶(hù)界面美觀。在一個(gè)窗口中

5、按tab鍵,移動(dòng)聚焦的順序不能雜亂無(wú)章,tab的順序是先從上至下，再?gòu)淖笾劣?。首先?yīng)輸入的和重要信息的控件在tab順序中應(yīng)當(dāng)靠前,位置也應(yīng)放在窗口上較醒目的位置。該系統(tǒng)的界面設(shè)計(jì)布局力求簡(jiǎn)潔、有序、易于操作。2.2.3 鼠標(biāo)與鍵盤(pán)對(duì)應(yīng)原則應(yīng)遵循的是可不用鼠標(biāo)的原則:應(yīng)用中的功能只用鍵盤(pán)也應(yīng)當(dāng)可以完成,即設(shè)計(jì)的應(yīng)用中還應(yīng)加入一些必要的按鈕和菜單項(xiàng)。但是,許多鼠標(biāo)的操作,如雙擊、拖動(dòng)對(duì)象等,并不能簡(jiǎn)單地用鍵盤(pán)來(lái)模擬即可實(shí)現(xiàn)。例如在一個(gè)列表框中用鼠標(biāo)雙擊其中一項(xiàng)可以表示選中該項(xiàng)內(nèi)容。為了用鍵盤(pán)也能實(shí)現(xiàn)這一功能,必須在窗口中定義一個(gè)表示選中的按鈕,以作為實(shí)現(xiàn)雙擊功能的替代（或其它方式）。又如在一個(gè)窗口

6、中有兩個(gè)數(shù)據(jù)窗口,可以用鼠標(biāo)從一個(gè)數(shù)據(jù)窗口中將一項(xiàng)拖出然后放到另一個(gè)中。如果只用鍵盤(pán),就應(yīng)當(dāng)在菜單中設(shè)置拷貝或移動(dòng)的菜單項(xiàng)3 界面的關(guān)系圖和工作流程圖4 主界面4.1 登錄界面用戶(hù)登錄看護(hù)系統(tǒng)的界面，是一個(gè)獨(dú)立于首頁(yè)之外的界面，用戶(hù)必須登錄才能查看到首頁(yè)上的信息，以次來(lái)增加系統(tǒng)信息的安全性。在登錄時(shí)，用戶(hù)可以選擇登錄權(quán)限即“看護(hù)員”、“管理員”登錄。為防止可能出現(xiàn)的惡意攻擊，登錄時(shí)設(shè)置了驗(yàn)證碼。4.2 子界面首頁(yè)用戶(hù)成功登錄后所見(jiàn)到的第一個(gè)頁(yè)面，此頁(yè)面上顯示福利院發(fā)布的通知和新聞。基于看護(hù)系統(tǒng)對(duì)象為老人，在首頁(yè)上添加了顯示農(nóng)歷的日歷。4.3子界面入院登記老人入住時(shí)必須進(jìn)行入院登記，生成對(duì)應(yīng)的檔

7、案。包括ID（用于區(qū)別老人身份和查詢(xún)信息）、姓名、性別、年齡、民族、入院日期、家庭住址、親人聯(lián)系方式、病歷。4.4子界面信息查詢(xún)看護(hù)員可以通過(guò)此頁(yè)面查詢(xún)老人的即時(shí)信息，包括：體溫，脈搏，血壓，所在位置以及老人基本信息，還可以查看老人最近身體情況。4.5子界面智能定位輸入ID，可以查詢(xún)到老人所在位置，結(jié)合視頻監(jiān)控等功能，實(shí)現(xiàn)對(duì)老人的實(shí)時(shí)定位。4.6子界面視頻監(jiān)控對(duì)老人的活動(dòng)區(qū)域進(jìn)行監(jiān)控，在頁(yè)面上可以調(diào)用對(duì)應(yīng)區(qū)域的高清攝像頭對(duì)指定區(qū)域進(jìn)行監(jiān)控，通過(guò)頁(yè)面上的旋轉(zhuǎn)按鈕，實(shí)現(xiàn)對(duì)攝像頭的簡(jiǎn)單操作。4.7子界面工作安排包括福利院每周的安排和看護(hù)員每日的安排。只有管理員具有修改、添加信息的權(quán)限。4.8子界面員

8、工社區(qū)顯示所有員工簡(jiǎn)單信息，包括照片、聯(lián)系方式等。5 美學(xué)設(shè)計(jì)本系統(tǒng)采用了人機(jī)界面設(shè)計(jì)。遵循了以用戶(hù)為本、提高可交互性、盡量避免需要記憶的內(nèi)容、簡(jiǎn)化用戶(hù)操作、提高操作的效率、應(yīng)用安全等一般原則。對(duì)于用戶(hù)問(wèn)題和要求表現(xiàn)得了很好的滿(mǎn)足，且界面用語(yǔ)具有可理解性和易用性，極大程度上便于用戶(hù)的習(xí)慣使用方式。6界面資源設(shè)計(jì)6.1圖標(biāo)資源（加入細(xì)節(jié)）6.2圖像資源（加入細(xì)節(jié)）6.3界面組件（加入細(xì)節(jié)）7其他用戶(hù)界面清單：代碼名稱(chēng)所屬子系統(tǒng)相關(guān)組件/模塊描述UII1.1Login.html/UII1.2Index.html/UII2.1registration.html智能監(jiān)護(hù)系統(tǒng)入院登記UII2.2Query.ht