界面設計方案風格說明

1、界面設計風格說明 TOC o 1-5 h z HYPERLINK l bookmark19 o Current Document 引言1 HYPERLINK l bookmark23 o Current Document 編寫目的1 HYPERLINK l bookmark27 o Current Document 文檔范圍1 HYPERLINK l bookmark31 o Current Document 讀者對象2 HYPERLINK l bookmark35 o Current Document 參考文獻2 HYPERLINK l bookmark39 o Current Docume

2、nt 術語與縮寫解釋2 HYPERLINK l bookmark43 o Current Document 目標人群2 HYPERLINK l bookmark47 o Current Document 界面設計原則2 HYPERLINK l bookmark51 o Current Document 界面一致性3 HYPERLINK l bookmark60 o Current Document 系統(tǒng)響應時間3 HYPERLINK l bookmark64 o Current Document 出錯信息和警告3 HYPERLINK l bookmark72 o Current Documen

3、t 一般交互原則3 HYPERLINK l bookmark87 o Current Document 信息顯示原則4 HYPERLINK l bookmark97 o Current Document 視覺設計4 HYPERLINK l bookmark106 o Current Document 設計說明4引言編寫目的本文檔是對系統(tǒng)界面設計風格進行描述，文檔范圍本文檔是對系統(tǒng)界面設計風格進行描述，讀者對象本文檔的閱讀對象是智能手機系統(tǒng)的設計人員、開發(fā)人員、業(yè)務規(guī)范設計人員、軟件測 試人員。參考文獻序號文獻編號作者文獻名出版單位發(fā)表日期術語與縮寫解釋縮寫、術語解釋目標人群追求時尚，重視娛樂功

4、能的年輕一族，和高科技從業(yè)人員。界面設計原則堅持圖形用戶界面設計原則，界面直觀、對用戶透明：用戶接觸系統(tǒng)后對界面上對應的功能一目了然。手機系統(tǒng)是用戶直接操作和應用的主體，用戶界面是手機操作系統(tǒng)的人機 交互的窗口，界面設計基于手機的物理特性，根據(jù)手機所支持的色彩數(shù)量、圖像格式，做到 最大限度的發(fā)揮手機的物理特性。界面一致性為減少用戶的記憶負擔和界面的美觀，在界面中保持界面的一致性，一致性即包括標 準的控件，也指相同的信息表示方法，如在字體、標簽風格、顏色、術語、顯示錯誤信息等 方面確保一致。1）界面樣式的相對統(tǒng)一，具體界面可結(jié)合具體操作的可用性和可實施性，對界面樣式 進行合理的調(diào)整，使區(qū)域與區(qū)域

5、之間協(xié)調(diào)統(tǒng)一，主次得當。確保用戶可以方便快捷地進行功 能操作，減少記憶負擔。2）界面的色彩及風格統(tǒng)一，包括圖標、按鈕的風格及在不同操作狀態(tài)下的視覺效果的 統(tǒng)一。3）菜單選擇、數(shù)據(jù)顯示以及其它功能使用一致的格式。4）界面的協(xié)調(diào)一致。如手機界面按鈕排放，肯定、否定擺放位置等。5）同樣功能用同樣的圖形。系統(tǒng)響應時間系統(tǒng)響應時間應該適中，系統(tǒng)響應時間過長，用戶就會感到不安和沮喪，而響應時間過 短有時會造成用戶加快操作節(jié)奏，從而導致錯誤。因此在系統(tǒng)響應時間上堅持如下原則：響應時間長度界面設計0-3秒顯示處理動畫3秒以上顯示處理窗口，或顯示進度條一個長時間的處理完成時應給予完成警告信息出錯信息和警告有清楚

6、的出錯信息和警告提示。誤操作后，系統(tǒng)提供有針對性的提示。對出錯信息和警 告應該遵循以下原則：1）信息以用戶可以理解的術語描述；2）信息應指出錯誤可能導致的不良后果，以便用戶做出判斷或改正；3）信息應伴隨著視覺上的提示，如特殊的圖像、顏色或信息閃爍。4）信息不能帶有判斷色彩，即任何情況下不能指責用戶一般交互原則一般交互遵循以下原則：1）一致性：菜單選擇、數(shù)據(jù)顯示以及其它功能都應使用一致的格式。2）對于使有耗時的操作都給出反饋3）確保具有明顯后果的操作要求用戶進行明確的選擇*用戶需要完全明確他將要進 行危險性操作或破壞性操作。4）在數(shù)據(jù)錄入上允許取消大多數(shù)操作5）減少在動作間必須記憶的信息數(shù)量6）

7、在對話中提高效率7）允許用戶非惡意錯誤，系統(tǒng)應保護自己不受致命作物的破壞8）方便退出。9）導航功能。隨時轉(zhuǎn)移功能，很容易從一個功能跳到另外一個功能。10）讓用戶知道自己當前的位置，使其做出下一步行動的決定。11）避免水平滾動條 與垂直滾動條不同，水平滾動條并不受歡迎，因為它會使項目閱 讀起來比較困難。信息顯示原則信息顯示遵循以下原則：1）只顯示與當前用戶語境環(huán)境有關的信息；2）提供適當?shù)哪J值 提供提供適當?shù)哪J值來減少用戶不必要的操作，從而幫助用 戶完成工作。3）使用一致的標記、標準縮寫和可預測的顏色，顯示信息的含義應該非常明確，用戶 不必再參考其它信息源；4）產(chǎn)生有意義的出錯信息；5）使用

8、縮進和文本來輔助理解；6）使用窗口分隔控件分隔不同類型的信息；視覺設計1）允許用戶定制界面。用戶可以根據(jù)自己的需要來改變默認的系統(tǒng)設置，選擇一種自 己滿意的個性化設置，達到軟件產(chǎn)品與用戶之間的協(xié)調(diào)性。2）實時幫助設施。通過實時幫助設施可以幫助用戶熟悉系統(tǒng)、縮短獲得幫助的時間， 增加界面的友好性。進行系統(tǒng)交互時，提供部分幫助功能，即：提供主要操作的幫助。表示 幫助時采用提示文本，同時幫助提示文本不影響正常交互方式，觸筆移出相應功能區(qū)即自動 關閉幫助文本。3）提供視覺線索，用圖形符號幫助用戶記憶。如用圖標表示、下拉菜單列表中的選擇4）使用真實世界的比喻。如：電話、地址簿的圖標設計，尊重用戶以往的使

9、用經(jīng)驗， 不要讓用戶去猜。5）界面色彩，使用鄰近色或同類色進行色彩構(gòu)成，采用色彩的弱對比，整體色調(diào)對比 不要太強，近似的顏色表示近似的意思。設計說明做為一款功能實用型的手機，我們在界面配色的選擇上，以藍色做為主色調(diào)。藍色體現(xiàn) 著理性，帶有科技感和時尚感，給人一種清爽、現(xiàn)代的感覺，讓人一看就能體會到舒適與成 功。以深灰藍色作為基礎色，結(jié)合漸變效果，穩(wěn)重中不失變化。搭配以淺天藍色，亮麗清新， 形成反差的同時又做到了統(tǒng)一。輔以白色，與各類冷暖色調(diào)和諧搭配，清晰顯示文字信息。 與基礎色相呼應，這樣類自然天空的色彩搭配，做到整個屏幕的完美與統(tǒng)一。簡潔明快的設 計理念，體現(xiàn)一種科技時尚與自然的和諧之美，必然會受到時尚青年和高科技從業(yè)人員的喜 愛。另外提供一系列為女性設計的粉色主題，粉紅色基色和白色面板的搭配，從而突出青春 氣息、動感活力，在追求可愛時尚中又不失穩(wěn)重，能更好的滿足女性用戶的需求。此外手機 用戶還能通過自定義主題來滿足對時尚的追求、彰顯個性。在設計風格上，我們追求簡約的風格，以活潑圓潤的