![界面設計規(guī)范演示文稿_第1頁](http://file4.renrendoc.com/view/ddb6d633b9cee9c7d216413ee0359f35/ddb6d633b9cee9c7d216413ee0359f351.gif)
![界面設計規(guī)范演示文稿_第2頁](http://file4.renrendoc.com/view/ddb6d633b9cee9c7d216413ee0359f35/ddb6d633b9cee9c7d216413ee0359f352.gif)
![界面設計規(guī)范演示文稿_第3頁](http://file4.renrendoc.com/view/ddb6d633b9cee9c7d216413ee0359f35/ddb6d633b9cee9c7d216413ee0359f353.gif)
![界面設計規(guī)范演示文稿_第4頁](http://file4.renrendoc.com/view/ddb6d633b9cee9c7d216413ee0359f35/ddb6d633b9cee9c7d216413ee0359f354.gif)
![界面設計規(guī)范演示文稿_第5頁](http://file4.renrendoc.com/view/ddb6d633b9cee9c7d216413ee0359f35/ddb6d633b9cee9c7d216413ee0359f355.gif)
版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認領(lǐng)
文檔簡介
界面設計規(guī)范演示文稿目前一頁\總數(shù)六十頁\編于十點軟件界面規(guī)范的重要性及其目的用戶體驗為何如此重要Web規(guī)范體系介紹界面設計開發(fā)流程應該遵循的基本原則界面設計規(guī)范目前二頁\總數(shù)六十頁\編于十點軟件界面規(guī)范的重要性及其目的產(chǎn)品設計通過規(guī)范的方式來達到以用戶為中心的目的。
使最終設計出來的界面風格一致化,開發(fā)編碼人員相互之間開發(fā)更輕松,遵循統(tǒng)一的操作規(guī)范,以標準化的方式設計界面,提高工作效率。減少和改變責任不明,任務不清和由此產(chǎn)生的信息溝通不暢、反復修改、重復勞動、效率低下的現(xiàn)象。目前三頁\總數(shù)六十頁\編于十點軟件界面規(guī)范的重要性及其目的用戶體驗為何如此重要Web規(guī)范體系介紹界面設計開發(fā)流程應該遵循的基本原則界面設計規(guī)范目前四頁\總數(shù)六十頁\編于十點日常生活中的遭遇什么是用戶體驗用戶體驗的要素用戶體驗和軟件應用記住你的用戶早晨起來,發(fā)現(xiàn)鬧鐘沒有按原先設定響起來。一邊燒水,一邊穿衣服,臨走前去喝水卻發(fā)現(xiàn)水還沒有燒開。到了地鐵站,發(fā)現(xiàn)公交卡沒有錢了。無奈之下只能去排隊買票。排了3趟地鐵,終于到公司了,但是你卻遲到了。結(jié)果:盡管你已經(jīng)非常努力,但是你還是遲到了。那么,讓我們看看這一連串的倒霉事,是什么讓我們?nèi)绱死仟N?用戶體驗為何如此重要?X員工悲慘的一天目前五頁\總數(shù)六十頁\編于十點
什么是用戶體驗用戶體驗(userexperience)是以用戶為中心的設計中最重要的一個部分,強調(diào)的是過程,是軟件對用戶行為產(chǎn)生的反應與用戶期待值要盡可能的一致。表現(xiàn)一:過分使用各種奇形怪狀、五顏六色的控件。表現(xiàn)二:界面元素比例失調(diào)。比如按鈕巨大無比,其尺寸甚至超過顯示重要內(nèi)容的文本框的界面。表現(xiàn)三:界面元素凌亂。比如說,按鈕和文本框擺放地點隨意,該對齊的控件對不齊。表現(xiàn)四:違背使用習慣。你按F1,它沒有彈出幫助,卻執(zhí)行了一件絕對出乎你意料的動作。表現(xiàn)五:消息框信息含糊、混亂。比如軟件彈出一個消息框。把原本“確定”和“取消”寫成為“是”和“否”,讓用戶不知道什么意思。表現(xiàn)六:還有一種糟糕的用戶界面,乍一看很厲害,實際上完全是缺乏規(guī)劃的結(jié)果。這種軟件本身的確提供了比較復雜的功能,但對于哪些是常用功能,哪些是很少用到的高級功能,缺乏評估。什么功能都往界面上擠,占地方不說,用戶會厭煩,弄不好還會被嚇跑。用戶體驗為何如此重要?體驗好的用戶界面糟糕的用戶界面表現(xiàn)糟糕的用戶界面目前六頁\總數(shù)六十頁\編于十點用戶體驗為何如此重要?
用戶體驗的要素表現(xiàn)層視覺設計交互設計信息架構(gòu)界面設計導航設計功能說明內(nèi)容需求用戶需求產(chǎn)品目標框架層結(jié)構(gòu)層范圍層戰(zhàn)略層具體抽象表現(xiàn)層---視覺設計在這個五層結(jié)構(gòu)的頂端,我們把注意力轉(zhuǎn)移到系統(tǒng)用戶會注意到的那些方面:視覺設計,這里,內(nèi)容、功能和美學匯集到一起來產(chǎn)生一個最終設計,這將滿足其他四個層面的所有目標??蚣軐印缑嬖O計、導航設計和信息設計在充滿概念的結(jié)構(gòu)層中開始形成了大量的需求,這些需求都是來自我們的戰(zhàn)略目標的需求。在框架層,我們要更進一步的提煉這些結(jié)構(gòu),確定很詳細的界面外觀、導航和信息設計,這能讓結(jié)構(gòu)變得更實在。結(jié)構(gòu)層—交互設計與信息架構(gòu)在收集完用戶需求并將其排列好優(yōu)先級別之后,我們對于最終界面將會包括什么特性已經(jīng)有了清楚的圖像。然而,這些需求并沒有說明如何將這些分散的片段組成一個整體。這就是范圍層的上面一層:為產(chǎn)品創(chuàng)建一個概念結(jié)構(gòu)。范圍層—功能規(guī)格和內(nèi)容說明帶著“我們想要什么”、“我們的用戶想要什么”的明確認識,我們就能弄清楚如何去滿足所有這些戰(zhàn)略的目標。當你把用戶需求和系統(tǒng)目標轉(zhuǎn)變成系統(tǒng)應該提供給用戶什么樣的內(nèi)容和功能時,戰(zhàn)略就變成了范圍。戰(zhàn)略層—產(chǎn)品目標和用戶需求成功的用戶體驗,其基礎是一個被明確表達的“戰(zhàn)略”。知道企業(yè)與用戶雙方對產(chǎn)品的期許和目標,有助于確立用戶體驗各方面戰(zhàn)略的制定目前七頁\總數(shù)六十頁\編于十點面對大量的選擇,用戶只能自己想辦法,去決定哪一個軟件系統(tǒng)功能會符合她的要求。企業(yè)開始意識到,提供優(yōu)質(zhì)的用戶體驗是一個重要的、可持續(xù)的競爭優(yōu)勢。用戶體驗形成了客戶對企業(yè)的整體印象,界定了企業(yè)和競爭對手的差異,并且決定了客戶什么時候還會再次光顧。用戶體驗為何如此重要?
用戶體驗和軟件應用目前八頁\總數(shù)六十頁\編于十點用戶體驗為何如此重要?
記住你的用戶以用戶為中心的設計-------在開發(fā)產(chǎn)品的每一個步驟中,都要把用戶列入考慮范圍內(nèi)??紤]用戶體驗把它分為各個組成要素從不同角度來了解它-----通過這些才能確保你控制了決策所造成的全部結(jié)果用戶體驗很重要,最大的理由:它對你的用戶很重要。協(xié)調(diào)一致,直觀明了,甚至讓人愉快的體驗-----“一次”每件事都按照正確的方式在工作的體驗。目前九頁\總數(shù)六十頁\編于十點軟件界面規(guī)范的重要性及其目的用戶體驗為何如此重要Web規(guī)范體系介紹界面設計開發(fā)流程應該遵循的基本原則界面設計規(guī)范目前十頁\總數(shù)六十頁\編于十點產(chǎn)品/項目約定界面框架規(guī)范基礎界面元素規(guī)范產(chǎn)品VILOGO系統(tǒng)框架視覺風格根據(jù)業(yè)務需求約定交互模式、頁面流總體界面框架結(jié)構(gòu)界面模式靈活優(yōu)化多語言、多瀏覽器、換膚、組件庫、擴展性等問題界面組件及其組合基礎應用模板Web標準編碼,優(yōu)化結(jié)構(gòu),代碼可重用性強Web規(guī)范體系介紹目前十一頁\總數(shù)六十頁\編于十點軟件界面規(guī)范的重要性及其目的用戶體驗為何如此重要Web規(guī)范體系介紹界面設計開發(fā)流程應該遵循的基本原則界面設計規(guī)范目前十二頁\總數(shù)六十頁\編于十點生命周期軟件界面設計實現(xiàn)過程相關(guān)活動需求PM:需求規(guī)劃討論P-spec編寫Ui草圖提供根據(jù)p-spec對界面工作成果審核確認PM:根據(jù)P-spec對界面工作成果審核確認RD:編寫pdd設計開發(fā)測試PM:根據(jù)P-spec修正解釋需求RD:編碼PM:解釋需求QA:測試RD:修正Bug界面維護支持框架、頁面模板HTML+CSS修正各HTML頁面修正及CSS技術(shù)支持DHTML組件HTML+CSS修正界面規(guī)劃(需求)需求理解建立界面模型界面設計主界面、登錄頁GUI設計主要模板頁GUI設計界面實現(xiàn)(編碼)框架、頁面模板HTML+CSS實現(xiàn)根據(jù)模板填充制作各HTML頁面部分DHTML組件的HTML+CSS提供界面設計制作InputFromPM1.P-spec2.UI草圖經(jīng)PM確認1.分析規(guī)劃文檔2.低保真模擬示意原型圖片經(jīng)PM確認主要界面高保真GUI設計圖經(jīng)PM確認模板頁html+css各原型頁面html組件html+css界面設計開發(fā)流程目前十三頁\總數(shù)六十頁\編于十點軟件界面規(guī)范的重要性及其目的用戶體驗為何如此重要Web規(guī)范體系介紹界面設計開發(fā)流程應該遵循的基本原則界面設計規(guī)范目前十四頁\總數(shù)六十頁\編于十點應該遵循的基本原則顯示信息一致性的原則以用戶為主導原則易用性原則鼠標與鍵盤一致性原則系統(tǒng)響應時間原則出錯信息和警告原則信息顯示原則數(shù)據(jù)輸入原則合理性原則美觀與協(xié)調(diào)性原則目前十五頁\總數(shù)六十頁\編于十點顯示信息一致性的原則無論是控件使用,提示信息措辭,還是顏色、窗口布局風格,遵循統(tǒng)一的標準,做到真正的一致。界面直觀、對用戶透明:用戶接觸軟件后對界面上對應的功能一目了然、不需要多少培訓就可以方便使用應用系統(tǒng)。這樣得到的好處:
用戶使用起來能夠建立起精確的心里模型,使用熟練了一個系統(tǒng)界面后,切換到另外一個系統(tǒng)界面能夠很輕松的推測出各種功能。降低培訓、支持成本,支持人員不用費力逐個指導。給用戶統(tǒng)一感覺,不覺得混亂,心情愉快,支持度增加。應該遵循的基本原則目前十六頁\總數(shù)六十頁\編于十點明確用戶是所有系統(tǒng)處理的核心,不應該有應用程序來決定處理過程,所以用戶界面應當由用戶來控制應如何工作、如何響應,而不是由開發(fā)者按自己的意愿把操作流程強加給用戶。應該遵循的基本原則以用戶為主導的原則目前十七頁\總數(shù)六十頁\編于十點用戶不用查閱幫助就能知道該界面的功能并進行相關(guān)正確的操作。應該遵循的基本原則完成相同或相近功能的按鈕用Frame框起來,常用按鈕要支持快捷方式。完成同一功能或任務的元素放在集中位置,減少鼠標移動的距離。按功能將界面劃分局域塊,用Frame框括起來,并要有功能說明或標題。界面要支持鍵盤自動瀏覽按鈕功能,即按Tab鍵的自動切換功能。界面上首先應輸入的和重要信息的控件在Tab順序中應當靠前,位置也應放在窗口上較醒目的位置。同一界面上的控件數(shù)最好不要超過10個,多于10個時可以考慮使用分頁界面顯示。
易用性細則:易用性原則目前十八頁\總數(shù)六十頁\編于十點應該遵循的基本原則易用性細則:分頁界面要支持在頁面間的快捷切換,常用組合快捷鍵Ctrl+Tab默認按鈕要支持Enter操作,即按Enter后自動執(zhí)行默認按鈕對應操作??蓪懣丶z測到非法輸入后應給出說明并能自動獲得焦點。復選框和選項框按選擇幾率的高底而先后排列。復選框和選項框要有默認選項,并支持Tab選擇。專業(yè)性強的軟件要使用相關(guān)的專業(yè)術(shù)語,通用性界面則提倡使用通用性詞眼。
目前十九頁\總數(shù)六十頁\編于十點盡量遵循可不用鼠標的原則:應用中的功能只用鍵盤也應當可以完成。但是,許多鼠標的操作,如雙擊、拖動對象等,并不能簡單地用鍵盤來模擬即可實現(xiàn),此類操作可適當增加操作按鈕。應該遵循的基本原則鼠標與鍵盤一致性原則目前二十頁\總數(shù)六十頁\編于十點系統(tǒng)響應時間應該適中,響應時間過長,用戶就會感到不安和沮喪,而響應時間過快也會影響到用戶的操作節(jié)奏,并可能導致錯誤。因此在系統(tǒng)響應時間上堅持如下原則:0-5秒鼠標顯示成為沙漏;5秒以上顯示處理窗口,或顯示進度條;一個長時間的處理完成時應給予完成警告信息。應該遵循的基本原則系統(tǒng)響應時間原則目前二十一頁\總數(shù)六十頁\編于十點出錯信息和警告是指出現(xiàn)問題時系統(tǒng)給出的壞消息,對于出錯信息和警告應該遵循以下原則:信息以用戶可以理解的術(shù)語描述;信息簡明扼要,指出出錯原因并提供解決辦法提示。應該遵循的基本原則出錯信息和警告原則目前二十二頁\總數(shù)六十頁\編于十點信息顯示遵循以下原則:只顯示與當前用戶語境環(huán)境有關(guān)的信息;不要用數(shù)據(jù)將用戶包圍,使用便于用戶迅速吸取信息的方式表現(xiàn)信息;使用一致的標記、標準縮寫和顏色,顯示信息的含義應該非常明確,用戶不必再參考其它信息源;產(chǎn)生有意義的出錯信息;使用縮進和文本來輔助理解;使用窗口分隔控件分隔不同類型的信息;高效地使用顯示器的顯示空間,但要避免空間過于擁擠。應該遵循的基本原則信息顯示原則目前二十三頁\總數(shù)六十頁\編于十點數(shù)據(jù)輸入遵循以下原則:盡量減少用戶輸入動作的數(shù)量;維護信息顯示和數(shù)據(jù)輸入的一致性;交互應該是靈活的,對鍵盤和鼠標輸入的靈活性提供支持;在當前動作的語境中使不合適的命令不起作用;讓用戶控制交互流,用戶可以跳過不必要的動作、改變所需動作的順序(如果允許的話)以及在不退出系統(tǒng)的情況下從錯誤狀態(tài)中恢復;為所有輸入的動作提供幫助;消除冗余輸入??赡艿脑捥峁┠J值、絕不要讓用戶提供程序中可以自動獲取或計算出來的信息。應該遵循的基本原則數(shù)據(jù)輸入原則目前二十四頁\總數(shù)六十頁\編于十點應該遵循的基本原則合理性原則屏幕對角線相交的位置是用戶直視的地方,正上方四分之一處為易吸引用戶注意力的位置,在放置窗體時要注意利用這兩個位置。
目前二十五頁\總數(shù)六十頁\編于十點應該遵循的基本原則合理性原則合理性細則:父窗體或主窗體的中心位置應該在對角線焦點附近。子窗體位置應該在主窗體的左上角或正中。多個子窗體彈出時應該依次向右下方偏移,以顯示窗體出標題為宜。重要的命令按鈕與使用較頻繁的按鈕要放在界面上醒目的位置。與正在進行的操作無關(guān)的按鈕應該加以屏蔽(用灰色顯示,沒法使用該按鈕)。對可能造成數(shù)據(jù)無法恢復的操作必須提供確認信息,給用戶放棄選擇的機會。非法的輸入或操作應有足夠的提示說明。對運行過程中出現(xiàn)問題而引起錯誤的地方要有提示,讓用戶明白錯誤出處,避免形成無限期的等待。提示、警告、或錯誤說明應該清楚、明了、恰當。
目前二十六頁\總數(shù)六十頁\編于十點美觀與協(xié)調(diào)性細則:應該遵循的基本原則美觀與協(xié)調(diào)性原則界面應該大小適合美學觀點,感覺協(xié)調(diào)舒適,能在有效的范圍內(nèi)吸引用戶的注意力。長寬接近黃金點比例,切忌長寬比例失調(diào)、或?qū)挾瘸^長度。布局要合理,不宜過于密集,也不能過于空曠,合理的利用空間。按鈕大小基本相近,忌用太長的名稱,免得占用過多的界面位置。按鈕的大小要與界面的大小和空間要協(xié)調(diào)。避免空曠的界面上放置很大的按鈕。放置完控件后界面不應有很大的空缺位置。字體的大小要與界面的大小比例協(xié)調(diào),通常使用的字體中宋體9-12較為美觀,很少使用超過12號的字體。
目前二十七頁\總數(shù)六十頁\編于十點應該遵循的基本原則美觀與協(xié)調(diào)性原則美觀與協(xié)調(diào)性細則:前景與背景色搭配合理協(xié)調(diào),反差不宜太大。常用色考慮使用Windows界面色調(diào)。如果使用其他顏色,主色要柔和,具有親和力,堅決杜絕刺目的顏色。大型系統(tǒng)常用的主色有“#E1E1E1”、“#EFEFEF”、“#C0C0C0”等。界面風格要保持一致,字的大小、顏色、字體要相同,除非是需要藝術(shù)處理或有特殊要求的地方。如果窗體支持最小化和最大化或放大時,窗體上的控件也要隨著窗體而縮放;切忌只放大窗體而忽略控件的縮放。通常父窗體支持縮放時,子窗體沒有必要縮放。如果能給用戶提供自定義界面風格則更好,由用戶自己選擇顏色、字體等。
目前二十八頁\總數(shù)六十頁\編于十點軟件界面規(guī)范的重要性及其目的用戶體驗為何如此重要Web規(guī)范體系介紹界面設計開發(fā)流程應該遵循的基本原則界面設計規(guī)范目前二十九頁\總數(shù)六十頁\編于十點所有界面基準字體為9pt。不考慮特殊字體(隸書、草書等,特殊情況可以使用圖片取代),保證每個用戶使用起來顯示都正常。所有字體屬性設定應在CSS中完成。所有控件盡量使用大小統(tǒng)一的字體屬性,除了特殊提示信息、加強顯示等例外情況。避免使用粗體和斜體:用粗體來吸引人的注意,用斜體表示著重,但還要少使用。避免混合字體:最多包含兩種不同的字體。界面設計規(guī)范【功能名稱】字體【功能簡述】各個頁面必須使用統(tǒng)一的字體樣式【規(guī)范要求】不規(guī)范實例:目前三十頁\總數(shù)六十頁\編于十點所有字體尺寸一律采用“pt”作為單位,對象和線條的尺寸一律采用“px”作為單位。界面設計規(guī)范【功能名稱】尺寸單位【功能簡述】各個頁面必須使用統(tǒng)一的尺寸單位【規(guī)范要求】目前三十一頁\總數(shù)六十頁\編于十點界面設計規(guī)范盡可能通過選擇合適的主題顏色或系統(tǒng)顏色來選擇顏色。不要混用顏色類型。這就是說,應當始終將主題顏色與對應的主題顏色匹配使用,系統(tǒng)顏色與對應的系統(tǒng)顏色匹配使用,固定顏色與其他固定顏色一起使用。如果你一定要使用主題或系統(tǒng)顏色之外的顏色:最好是從某個主題或系統(tǒng)顏色派生,而不要硬編碼顏色值。如果不是為了顯示真實感的圖形和圖像,應當限制屏幕的色彩數(shù)目,因為人們在觀察屏幕時很難同時記住多種色彩應當根據(jù)對象的重要性來選擇顏色,重要的對象應該用醒目的顏色表示。使用顏色的時候應當保持一致性,例如錯誤提示信息用紅色表示,正常信息用綠色表示。在表達信息時,不要過度依賴顏色,因為有些用戶可能色盲或色弱?!竟δ苊Q】顏色【功能簡述】各個頁面必須使用統(tǒng)一的顏色設置【規(guī)范要求】“危險、有風險、未知、基本安全”的顏色,有什么講究嗎?“黃色”看不清楚。另外,文字不完整,在數(shù)字后面加“個”,前后項留合適的間隙。目前三十二頁\總數(shù)六十頁\編于十點界面設計規(guī)范【功能名稱】登錄框【功能簡述】【規(guī)范要求】1.用戶名、密碼寬度應該上下對齊。2.輸入框上下對齊。3.鼠標點擊登錄、重置按鈕應該顯示手型,而不是箭頭。目前三十三頁\總數(shù)六十頁\編于十點打開一個新界面,光標默認停留在第一個待輸入的文本框中。當選擇下拉框不存在默認值時,則默認為“請選擇”;當存在默認值時,請綁定顯示默認值。界面設計規(guī)范【功能名稱】默認值【功能簡述】各個頁面都會存在默認值【規(guī)范要求】目前三十四頁\總數(shù)六十頁\編于十點界面的必填項必須以紅色*號標識出來。當必填項沒有填寫時,可在光標準備移走時,在文本框后以“請輸入”紅色文字標識。當界面排列較緊時,必填項沒有填可以以彈出信息的方式來提示,光標移走時彈出或最后提交時彈出都可;但確定后必須停留在第一個待輸入的文本框中。
界面設計規(guī)范【功能名稱】必填值【功能簡述】對界面必填項的一些規(guī)范【規(guī)范要求】目前三十五頁\總數(shù)六十頁\編于十點可輸入/選擇框以正常色顯示;不可輸入/選擇框以灰色顯示;對于不可輸入/選擇框,通過鼠標或鍵盤都不可讓光標定位至此控件。
界面設計規(guī)范【功能名稱】控件顯示【功能簡述】【規(guī)范要求】目前三十六頁\總數(shù)六十頁\編于十點提示信息中標點符號請統(tǒng)一為全角符號。提示信息如有主語,請統(tǒng)一為‘您’。復雜的操作在成功后給予提示信息。需要后續(xù)操作的操作在成功后給予提示信息。提示信息不宜太長,寬度不能超過當前窗口的1/2;當超過此比例時,請視具體情況進行換行。當功能按鈕為圖片按鈕時,光標停留需給予浮動提示信息。
界面設計規(guī)范【功能名稱】提示語【功能簡述】提示信息的規(guī)范【規(guī)范要求】目前三十七頁\總數(shù)六十頁\編于十點支持回車鍵提交。支持tab鍵、shift+tab鍵移動光標焦點。Tab鍵移動遵循從左上至右下的原則。
界面設計規(guī)范【功能名稱】鍵盤支持【功能簡述】由于用戶還是會常用鍵盤進行操作,故提供一些簡單的鍵盤支持是必要的。【規(guī)范要求】目前三十八頁\總數(shù)六十頁\編于十點當父窗體與子窗體都存在同樣的查詢條件時,父窗體已輸入的查詢條件必須被帶到子窗體中。當子窗體的任何操作影響了父窗體的數(shù)據(jù)時,子窗體關(guān)閉返回必須刷新父窗體的數(shù)據(jù)。關(guān)閉父窗體必須連同子窗體一同關(guān)閉。
子窗體的大小最好不要超過父窗體,且最好不要遮住父窗體的主要信息。
界面設計規(guī)范【功能名稱】界面?zhèn)鬟f【功能簡述】父窗體與子窗體的傳遞?!疽?guī)范要求】目前三十九頁\總數(shù)六十頁\編于十點如果存在多層嵌套窗口,每層窗口彈出時都自動往右下移動一點點,以保證不遮蓋上層窗口標題為準。窗口嵌套層次最好不超過3層。
界面設計規(guī)范【功能名稱】窗口嵌套【功能簡述】針對多層窗口的嵌套【規(guī)范要求】
目前四十頁\總數(shù)六十頁\編于十點【功能名稱】輸入框限制【功能簡述】對各種輸入框的限制?!疽?guī)范要求】
界面設計規(guī)范只允許輸入數(shù)字的輸入框請控制不允許輸入其它字符,而不是輸入非法值后給予提示。只允許輸入日期、時間的輸入框請給予格式化,而不是輸入非法值后再給予提示或者就沒有提示。當輸入的內(nèi)容達到了字段的長度限制時,請控制不允許再輸入,而不是保存后自動截斷或保存時給予提示。對非法字符的控制。限制不可以輸入或提交時給予提示。(如’、”、<、<>)
目前四十一頁\總數(shù)六十頁\編于十點【功能名稱】表單列表【功能簡述】對表單列表的相關(guān)規(guī)范?!疽?guī)范要求】界面設計規(guī)范表頭水平/垂直居中對齊。表單中內(nèi)容如為定長,則為居中顯示;如為不固定的中英文內(nèi)容,則為居左顯示;如為數(shù)值形式,則為居右顯示。保證表格的寬度不被擠變形,對于不定長的內(nèi)容,可固定顯示寬度,當超出此顯示寬度后,以……顯示,光標停留后,詳細內(nèi)容再在浮動層顯示。
目前四十二頁\總數(shù)六十頁\編于十點【功能名稱】窗體【功能簡述】對窗體的相關(guān)規(guī)范。【規(guī)范要求】對話框窗體大小盡量不要超過640*460。并且高和寬(或W寬和高)的比應該大致保持為3:4(或4:3)。由于每個人的屏幕大小設置不一樣,有些是1024*768,有些是1366*768,因此在設計期間請注意窗體大小,盡量不要超過1024*768,以免出現(xiàn)窗體超出或覆蓋屏幕的問題
界面設計規(guī)范目前四十三頁\總數(shù)六十頁\編于十點【功能名稱】快捷鍵的限制【功能簡述】由于IE本身的一些原因,避免一些不必要的錯誤,故對其進行限制?!疽?guī)范要求】
在用戶沒有提供明確需求情況下,限制F5、IE工具欄、退格鍵(僅限頁面不限輸入框)。限制右鍵菜單的使用。
界面設計規(guī)范目前四十四頁\總數(shù)六十頁\編于十點【功能名稱】頁面布局【功能簡述】對界面布局、分辨率的規(guī)范【規(guī)范要求】
必須要能自適應1024*768的分辨率。界面層次不宜超過3層。
默認窗口設置下,不應出現(xiàn)水平、垂直滾動條。
當界面內(nèi)容超出顯示區(qū)域時,以浮動層的形式顯示。
界面設計規(guī)范目前四十五頁\總數(shù)六十頁\編于十點列表名稱選中的行菜單層次列表內(nèi)容表頭按鈕【功能名稱】列表界面【功能簡述】對列表界面規(guī)范要求【規(guī)范要求】界面設計規(guī)范目前四十六頁\總數(shù)六十頁\編于十點1.菜單層次:說明本模塊所在位置的文字,所在的位置必須對應功能菜單,比如點擊菜單上的則模塊位置說明文字必須對應起來,顯示:2.按鈕說明:按鈕的顏色是統(tǒng)一的;按鈕上如果只有兩個字,則這兩個字之間和兩個字的兩邊都需要一個空格;如果是兩個字以上的則只需要在字兩邊加一個空格;按鈕如靠右放置,則按鈕的最右端必須和列表的最右端對齊;按鈕之間沒有空格;間距由css定義。界面設計規(guī)范不規(guī)范實例目前四十七頁\總數(shù)六十頁\編于十點3.記錄文字說明:如果列表前選擇框使用的是RadioButton,則應該默認選中第1條;選中的記錄必須和未選中的記錄區(qū)分開來;列表中數(shù)量數(shù)字必須靠右顯示;金額數(shù)字采用千分位分隔符的形式,分隔符為西文逗號“,”如:列表中字數(shù)固定的文字(比如日期,圖片等)居中顯示;字數(shù)不規(guī)則的記錄靠左顯示;4.如果沒有選中列表的項,在點擊功能操作按鈕時,必須有提示“沒有選擇..”。例如:沒有選擇項目列表中的項目時,按功能按鈕彈出窗口提示:“您沒有選擇項目!”。界面設計規(guī)范目前四十八頁\總數(shù)六十頁\編于十點5.在列表的字段中,有被截短的,鼠標放上去,必須顯示出全部的值6.選中的行顯示為不同的顏色。7.如果列表沒有數(shù)據(jù)時,顯示“本列表暫無記錄!”如圖所示:界面設計規(guī)范目前四十九頁\總數(shù)六十頁\編于十點【功能名稱】一般編輯界面【功能簡述】對一般編輯界面規(guī)范要求【規(guī)范要求】界面設計規(guī)范文本框必填項多行文本框目前五十頁\總數(shù)六十頁\編于十點1.文本框:只讀的文本框和可輸入的文本框在顏色上必須區(qū)分;可以輸入的文本框以白色為背景;如只讀的文本框一灰色為背景;如:文本框上下或者左右對齊;數(shù)字靠右顯示;字數(shù)不等的文字靠左顯示;
界面設計規(guī)范【功能名稱】一般編輯界面【功能簡述】對一般編輯界面規(guī)范要求【規(guī)范要求】目前五十一頁\總數(shù)六十頁\編于十點輸入框樣式應該統(tǒng)一
界面設計規(guī)范【功能名稱】一般編輯界面【功能簡述】對一般編輯界面規(guī)范要求【規(guī)范要求】目前五十二頁\總數(shù)六十頁\編于十點2.彈出窗口說明:彈出式窗口應居中顯示;必須有關(guān)閉窗口的按鈕。如果是關(guān)閉按鈕,名稱必須叫做“關(guān)閉”,不能寫成“取消”或其他類似的名字。系統(tǒng)中彈出框的樣式需統(tǒng)一界面設計規(guī)范【功能名稱】一般編輯界面【功能簡述】對一般編輯界面規(guī)范要求【規(guī)范要求】目前五十三頁\總數(shù)六十頁\編于十點3.必填項說明:編輯頁面中的必填項必須有標識,如右圖:4.多行文本框說明:多行的文本框必須有提示剩余輸入字數(shù)的功能,且文字是黑色的,數(shù)字必須是突出的紅色字體如圖所示:界面設計規(guī)范【功能名稱】一般編輯界面【功能簡述】對一般編輯界面規(guī)范要求【規(guī)范要求】5.控件:暫時不用的控件應該灰掉目前五十四頁\總數(shù)六十頁\編于十點界面設計規(guī)范【功能名稱】防錯和出錯處理【功能簡述】用戶在使用軟件的過程中,不可避免的會出現(xiàn)一些錯誤的操作。倘若用戶不小心輸入了錯誤的數(shù)據(jù)或者錯誤的刪除了有用的數(shù)據(jù),而軟件將錯就錯的執(zhí)行了,那么用戶肯定很惱火,以后就不敢放心的使用軟件。在設計用戶界面時必須考慮防錯處理,目的是讓用戶不必為避免犯錯誤而提心吊膽,小心翼翼的操作。【規(guī)范要求】對輸入的數(shù)據(jù)進行校驗對于某些情況下不應該使用的菜單項和命令按鈕,應當將其“失效”(變成灰色,可見但不可操作)或者隱藏。例如對于某些軟件,不用的用戶有不同的操作權(quán)限。如果低權(quán)限的用戶登錄到系統(tǒng),那些僅供高級權(quán)限用戶使用的功能應當被隱藏,或者將其“失效”執(zhí)行破壞性的操作之前,應當獲得用戶的確認。例如用戶刪除一個文件時,應當彈出對話框:“真的要刪除該文件嗎”,當用戶確認后才真正刪除文件。盡量提供undo功能,用戶可以撤銷剛才的操作。如果發(fā)生意外和錯誤,應當及時給出警告信息和錯誤信息,提醒用戶做出正確的處理。目前五十五頁\總數(shù)六十頁\編于十點界面設計規(guī)范實例分析好的差的不規(guī)范的消息框主要表現(xiàn)在:措辭生硬、幼稚、甚至有文字、語法錯誤。消息文本、圖形標志和命令按鈕在語義上不一致等目前五十六頁\總數(shù)六十頁\編于十點【功能名稱】html編寫【功能簡述】對html編寫的規(guī)范要求【規(guī)范要求】首行縮進的處理,不要使用全角空格來達到效果,規(guī)范的做法是在樣式表中定義p{text-indent:2em;}
然后給每一段加上<p>
標記,注意,一般情況下,請不要省略</p>
結(jié)束標記。為了最大
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責。
- 6. 下載文件中如有侵權(quán)或不適當內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 2025年度建筑植筋加固材料供應及施工合同
- 2025年度人工智能項目借款合同范本
- 2025年度文化藝術(shù)場館工裝裝飾裝修合同范本
- 金華浙江金華永康市自然資源和規(guī)劃局工作人員招聘5人筆試歷年參考題庫附帶答案詳解
- 溫州浙江溫州泰順縣面向2025年醫(yī)學類普通高等院校應屆畢業(yè)生提前招聘筆試歷年參考題庫附帶答案詳解
- 桂林2025年廣西桂林市全州縣事業(yè)單位招聘服務期滿三支一扶人員5人筆試歷年參考題庫附帶答案詳解
- 杭州浙江杭州市上城區(qū)人民政府南星街道辦事處編外人員招聘筆試歷年參考題庫附帶答案詳解
- 承德2025年河北承德寬城滿族自治縣招聘社區(qū)工作者40人筆試歷年參考題庫附帶答案詳解
- 2025年金頭黑色密胺筷項目可行性研究報告
- 2025至2031年中國長方形木爐座行業(yè)投資前景及策略咨詢研究報告
- 金融服務鄉(xiāng)村振興
- 2024-2030年中國出版社行業(yè)發(fā)展現(xiàn)狀及前景趨勢分析報告
- (新版)廣電全媒體運營師資格認證考試復習題庫(含答案)
- 教師及教育系統(tǒng)事業(yè)單位工作人員年度考核登記表示例范本1-3-5
- 2024年低空智聯(lián)網(wǎng)發(fā)展研究報告
- 胸腔鏡肺癌根治術(shù)手術(shù)配合
- 初二地理會考復習教案
- 外研版七年級上冊英語課文翻譯
- 銀行營銷術(shù)語演練
- 醫(yī)院培訓課件:《成人住院患者靜脈血栓栓塞癥的預防護理》
- 學校食品安全教育學習活動食品安全講座課件
評論
0/150
提交評論