軟件系統(tǒng)是當(dāng)下生活比較普遍的一種系統(tǒng)，在現(xiàn)今信息化逐漸普及，這也讓人們更加的重視使用各種軟件，而軟件設(shè)計(jì)也更為重要起來，那么軟件系統(tǒng)界面設(shè)計(jì)關(guān)鍵以及規(guī)范有哪些呢?跟隨小編一起看下吧。

界面設(shè)計(jì)關(guān)鍵

　　在設(shè)計(jì)的過程中有較多注意的關(guān)鍵問題，以下列出幾點(diǎn):

　　(1)軟件啟動(dòng)封面設(shè)計(jì)--Splash

　　應(yīng)使軟件啟動(dòng)封面最終為高清晰度的圖像，如軟件啟動(dòng)封面需在不同的平臺(tái)、操作系統(tǒng)上使用將考慮轉(zhuǎn)換不同的格式，并且對選用的色彩不宜超過256色，最好為216色安全色。軟件啟動(dòng)封面大小多為主流顯示器分辨率的1/6大。如果是系列軟件將考慮整體設(shè)計(jì)的統(tǒng)一和延續(xù)性。在上面應(yīng)該醒目的標(biāo)注制作或支持的公司標(biāo)志、產(chǎn)品商標(biāo)，軟件名稱，版本號，網(wǎng)址，版權(quán)聲明，序列號等信息，以樹立軟件形象，方便使用者或購買者在軟件啟動(dòng)的時(shí)候得到提示。插圖宜使用具有獨(dú)立版權(quán)的，象征性強(qiáng)的，識別性高的，視覺傳達(dá)效果好的圖形，若使用攝影也應(yīng)該進(jìn)行數(shù)位處理，以形成該軟件的個(gè)性化特征。

　　(2)軟件框架設(shè)計(jì)

　　軟件的框架設(shè)計(jì)就復(fù)雜得多，因?yàn)樯婕败浖氖褂霉δ?，?yīng)該對該軟件產(chǎn)品的程序和使用比較了解，這就需要設(shè)計(jì)師有一定的軟件跟進(jìn)經(jīng)驗(yàn)，能夠快速的學(xué)習(xí)軟件產(chǎn)品，并且在和軟件產(chǎn)品的程序開發(fā)員及程序使用對象進(jìn)行共同溝通，以設(shè)計(jì)出友好的，獨(dú)特的，符合程序開發(fā)原則的軟件框架。軟件框架設(shè)計(jì)應(yīng)該簡潔明快，盡量少用無謂的裝飾，應(yīng)該考慮節(jié)省屏幕空間，各種分辨率的大小，縮放時(shí)的狀態(tài)和原則，并且為將來設(shè)計(jì)的按鈕，菜單，標(biāo)簽，滾動(dòng)條及狀態(tài)欄預(yù)留位置。設(shè)計(jì)中將整體色彩組合進(jìn)行合理搭配，將軟件商標(biāo)放在顯著位置，主菜單應(yīng)放在左邊或上邊，滾動(dòng)條放在右邊，狀態(tài)欄放在下邊，以符合視覺流程和用戶使用心理。

　　(3)軟件按鈕設(shè)計(jì)

　　軟件按鈕設(shè)計(jì)應(yīng)該具有交互性，即應(yīng)該有3到6種狀態(tài)效果：點(diǎn)擊時(shí)狀態(tài);鼠標(biāo)放在上面但未點(diǎn)擊的狀態(tài);點(diǎn)擊前鼠標(biāo)未放在上面時(shí)的狀態(tài);點(diǎn)擊后鼠標(biāo)未放在上面時(shí)的狀態(tài);不能點(diǎn)擊時(shí)狀態(tài);獨(dú)立自動(dòng)變化的狀態(tài)。按鈕應(yīng)具備簡潔的圖示效果，應(yīng)能夠讓使用者產(chǎn)生功能關(guān)聯(lián)反應(yīng)，群組內(nèi)按鈕應(yīng)該風(fēng)格統(tǒng)一，功能差異大的按鈕應(yīng)該有所區(qū)別。

　　(4)軟件面板設(shè)計(jì)

　　軟件面板設(shè)計(jì)應(yīng)該具有縮放功能，面板應(yīng)該對功能區(qū)間劃分清晰，應(yīng)該和對話框，彈出框等風(fēng)格匹配，盡量節(jié)省空間，切換方便。

（圖片來自網(wǎng)絡(luò)）

　　(5)菜單設(shè)計(jì)

　　菜單設(shè)計(jì)一般有選中狀態(tài)和未選中狀態(tài)，左邊應(yīng)為名稱，右邊應(yīng)為快捷鍵，如果有下級菜單應(yīng)該有下級箭頭符號，不同功能區(qū)間應(yīng)該用線條分割。

　　(6)標(biāo)簽設(shè)計(jì)

　　標(biāo)簽設(shè)計(jì)應(yīng)該注意轉(zhuǎn)角部分的變化，狀態(tài)可參考按鈕。

　　(7)圖標(biāo)設(shè)計(jì)

　　圖標(biāo)設(shè)計(jì)色彩不宜超過64色，大小為16x16、32x32兩種，圖標(biāo)設(shè)計(jì)是方寸藝術(shù)，應(yīng)該加以著重考慮視覺沖擊力，它需要在很小的范圍表現(xiàn)出軟件的內(nèi)涵，所以很多圖標(biāo)設(shè)計(jì)師在設(shè)計(jì)圖標(biāo)時(shí)使用簡單的顏色，利用眼睛對色彩和網(wǎng)點(diǎn)的空間混合效果，做出了許多精彩圖標(biāo)。

　　(8)滾動(dòng)條及狀態(tài)欄設(shè)計(jì)

　　滾動(dòng)條主要是為了對區(qū)域性空間的固定大小中內(nèi)容量的變換進(jìn)行設(shè)計(jì)，應(yīng)該有上下箭頭，滾動(dòng)標(biāo)等，有些還有翻頁標(biāo)。狀態(tài)欄是為了對軟件當(dāng)前狀態(tài)的顯示和提示。

　　(9)安裝過程設(shè)計(jì)

　　安裝過程設(shè)計(jì)主要是將軟件安裝的過程進(jìn)行美化，包括對軟件功能進(jìn)行圖示化。

　　(10)包裝及商品化

　　最后軟件產(chǎn)品的包裝應(yīng)該考慮保護(hù)好軟件產(chǎn)品，功能的宣傳融合于美觀中，可以印刷部分產(chǎn)品介紹，產(chǎn)品界面設(shè)計(jì)。

（圖片來自網(wǎng)絡(luò)）

　　界面設(shè)計(jì)規(guī)范

　　1.一致性。堅(jiān)持以用戶體驗(yàn)為中心設(shè)計(jì)原則，界面直觀、簡潔，操作方便快捷，用戶接觸軟件后對界面上對應(yīng)的功能一目了然、不需要太多培訓(xùn)就可以方便使用本應(yīng)用系統(tǒng)。

　　2.字體。保持字體及顏色一致，避免一套主題出現(xiàn)多個(gè)字體;不可修改的字段，統(tǒng)一用灰色文字顯示。

　　3.對齊。保持頁面內(nèi)元素對齊方式的一致，如無特殊情況應(yīng)避免同一頁面出現(xiàn)多種數(shù)據(jù)對齊方式。

　　4.表單錄入。在包含必須與選填的頁面中，必須在必填項(xiàng)旁邊給出醒目標(biāo)識(*);各類型數(shù)據(jù)輸入需限制文本類型，并做格式校驗(yàn)如電話號碼輸入只允許輸入數(shù)字、郵箱地址需要包含“@”等，在用戶輸入有誤時(shí)給出明確提示。

　　5.鼠標(biāo)手勢?？牲c(diǎn)擊的按鈕、鏈接需要切換鼠標(biāo)手勢至手型;

　　6.保持功能及內(nèi)容描述一致。避免同一功能描述使用多個(gè)詞匯，如編輯和修改，新增和增加，刪除和清除混用等。建議在項(xiàng)目開發(fā)階段建立一個(gè)產(chǎn)品詞典，包括產(chǎn)品中常用術(shù)語及描述，設(shè)計(jì)或開發(fā)人員嚴(yán)格按照產(chǎn)品詞典中的術(shù)語詞匯來展示文字信息。

　　7.準(zhǔn)確性。使用一致的標(biāo)記、標(biāo)準(zhǔn)縮寫和顏色，顯示信息的含義應(yīng)該非常明確，用戶不必再參考其它信息源。顯示有意義的出錯(cuò)信息，而不是單純的程序錯(cuò)誤代碼。避免使用文本輸入框來放置不可編輯的文字內(nèi)容，不要文本將輸入框當(dāng)成標(biāo)簽使用。使用縮進(jìn)和文本來輔助理解。使用用戶語言詞匯，而不是單純的專業(yè)計(jì)算機(jī)術(shù)語。高效地使用顯示器的顯示空間，但要避免空間過于擁擠。保持語言的一致性，如“確定”對應(yīng)“取消”,“是”對應(yīng)“否”。

（圖片來自網(wǎng)絡(luò)）

　　8.布局。在進(jìn)行UI設(shè)計(jì)時(shí)需要充分考慮布局的合理化問題，遵循用戶從上而下，自左向右瀏覽、操作習(xí)慣，避免常用業(yè)務(wù)功能按鍵排列過于分散，以造成用戶鼠標(biāo)移動(dòng)距離過長的弊端。多做“減法”運(yùn)算，將不常用的功能區(qū)塊隱藏，以保持界面的簡潔，使用戶專注于主要業(yè)務(wù)操作流程，有利于提高軟件的易用性及可用性。

　　9.菜單。保持菜單簡潔性及分類的準(zhǔn)確性，避免菜單深度超過3層。菜單中功能是需要打開一個(gè)新頁面來完成的，需要在菜單名字后面加上“…”。【只適用于C/S架構(gòu)，B/S請無視】。

　　10.按鈕。確認(rèn)操作按鈕放置左邊，取消或關(guān)閉按鈕放置于右邊。

　　11.功能。未完成功能必須隱藏處理，不要置于頁面內(nèi)容中，以免引起誤會(huì)。

　　12.排版。所有文字內(nèi)容排版避免貼邊顯示(頁面邊緣)，盡量保持10-20像素的間距并在垂直方向上居中對齊;各控件元素間也保持至少10像素以上的間距，并確?？丶夭痪o貼于頁面邊沿。

　　13.表格數(shù)據(jù)列表。字符型數(shù)據(jù)保持左對齊，數(shù)值型右對齊(方便閱讀對比)，并根據(jù)字段要求，統(tǒng)一顯示小數(shù)位位數(shù)。

　　14.滾動(dòng)條。頁面布局設(shè)計(jì)時(shí)應(yīng)避免出現(xiàn)橫向滾動(dòng)條。

　　15.頁面導(dǎo)航(面包屑導(dǎo)航)。在頁面顯眼位置應(yīng)該出現(xiàn)面包屑導(dǎo)航欄，讓用戶知道當(dāng)前所在頁面的位置，并明確導(dǎo)航結(jié)構(gòu)，如：首頁>新聞中心>歐科智能招商服務(wù)平臺(tái)正式發(fā)布，其中帶下劃線部分為可點(diǎn)擊鏈接。

（圖片來自網(wǎng)絡(luò)）

　　16.信息提示窗口。信息提示窗口應(yīng)位于當(dāng)前頁面的居中位置，并適當(dāng)弱化背景層以減少信息干擾，讓用戶把注意力集中在當(dāng)前的信息提示窗口。一般做法是在信息提示窗口的背面加一個(gè)半透明顏色填充的遮罩層。

　　17.系統(tǒng)操作。盡量確保用戶在不使用鼠標(biāo)(只使用鍵盤)的情況下也可以流暢地完成一些常用的業(yè)務(wù)操作，各控件間可以通過Tab鍵進(jìn)行切換，并將可編輯的文本全選處理。查詢檢索類頁面，在查詢條件輸入框內(nèi)按回車應(yīng)該自動(dòng)觸發(fā)查詢操作。在進(jìn)行一些不可逆或者刪除操作時(shí)應(yīng)該有信息提示用戶，并讓用戶確認(rèn)是否繼續(xù)操作，必要時(shí)應(yīng)該把操作造成的后果也告訴用戶。信息提示窗口的“確認(rèn)”及“取消”按鈕需要分別映射鍵盤按鍵“Enter”和“ESC”。避免使用鼠標(biāo)雙擊動(dòng)作，不僅會(huì)增加用戶操作難度，還可能會(huì)引過用戶誤會(huì)，認(rèn)為功能點(diǎn)擊無效。表單錄入頁面，需要把輸入焦點(diǎn)定位到第一個(gè)輸入項(xiàng)。用戶通過Tab鍵可以在輸入框或操作按鈕間切換，并注意Tab的操作應(yīng)該遵循從左向右、從上而下的順序。

　　18.系統(tǒng)響應(yīng)。系統(tǒng)響應(yīng)時(shí)間應(yīng)該適中，響應(yīng)時(shí)間過長，用戶就會(huì)感到不安和沮喪，而響應(yīng)時(shí)間過快也會(huì)影響到用戶的操作節(jié)奏，并可能導(dǎo)致錯(cuò)誤。因此在系統(tǒng)響應(yīng)時(shí)間上堅(jiān)持如下原則：

　　1)2-5秒窗口顯示處理信息提示，避免用戶誤認(rèn)為沒響應(yīng)而重復(fù)操作;

　　2)5秒以上顯示處理窗口，或顯示進(jìn)度條;

　　一個(gè)長時(shí)間的處理完成時(shí)應(yīng)給予完成警告信息。

　　以上是關(guān)于軟件系統(tǒng)界面設(shè)計(jì)關(guān)鍵和規(guī)范的具體介紹說明，在進(jìn)行軟件系統(tǒng)設(shè)計(jì)時(shí)需要我們詳細(xì)的列出要求和方法，從而確保了設(shè)計(jì)軟件更加實(shí)用。