第九章界面設計原則_第1頁
第九章界面設計原則_第2頁
第九章界面設計原則_第3頁
第九章界面設計原則_第4頁
第九章界面設計原則_第5頁
已閱讀5頁,還剩93頁未讀 繼續免費閱讀

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內容提供方,若內容存在侵權,請進行舉報或認領

文檔簡介

交互設計的核心一切以用戶為中心的設計。UI設計原則UI設計的宗旨:1、減少用戶的認知負擔2、保持界面的一致性3、滿足不同目標用戶的創意需求4、用戶界面友好性5、圖標功能的一致性6、建立界面與用戶的互動交流UI的主要應用領域:手機通訊移動產品、電腦操作平臺、軟件產品、PDA產品、數碼產品、車載系統產品、智能家電產品、游戲產品、產品的在線推廣等。UI設計原則空間記憶當人們進入一個全新環境時,他們需要對空間建立認知模型,要有個空間記憶的感覺。同樣,當新用戶打開一個全新、陌生的軟件時,用戶也希望有個類似站點地圖的東西。但如果想讓用戶更加自如的使用軟件,讓用戶毫無顧及的去嘗試,不怕迷路,我們必須為用戶建立起空間記憶模式。它猶如沙漠中迷途者手中的指南針與行駛在荒原上汽車裝的GPS一樣.

當人們使用東西或文檔時,他們經常通過回憶它們在哪里來再次找到它們,而不是它們的名字。

很多軟件把它們的表單按鈕——確定、取消等——放在預定的位置上,部分原因是由于它們的空間記憶依賴性。

在復雜的應用系統中,工具條上的工具、層級結構中的對象等,也可以由記憶它們的相對位置找到;因此,我們應該小心使用像響應式展開這樣的模式。

把某個東西添加到界面上通常不會引起麻煩,但是把控件重新排列會打亂空間記憶,從而難以找到。空間記憶和習慣之間的關系很密切。和習慣一樣,空間記憶也是一個在應用中及在應用間保持一致性會帶來好處的理由。人們會期望在類似的地方找到類似的功能表現。順便說一句,網站導航菜單列表的頂部和底部都是很特別的區域,從認知的角度說,與處于菜單中間的項目相比,頂部和底部的項目會獲得用戶更多的注意力,記憶也更持久。如果他們發生改變,對用戶的重新建立空間記憶勢必會造成影響,請慎之。不論軟件是升級還是改善。交互方式不能隨意改變,當用戶建立起空間記憶對公司軟件產品的長期發展是很有必要的。一、圖形界面設計的基本原則用戶原則是圖形界面設計最基本和最重要的設計原則。所謂用戶原則,就是在軟件界面設計中,要充分體現出“以人為本”、“用戶友好”的基本要求,做到:易懂、易學、易用。1.1圖形界面設計的“黃金法則”用戶原則是大原則,人們在長期的圖形界面設計過程中,總結出了圖形界面設計中一些有用的法則,這些原則被稱作軟件界面設計的“黃金法則”。這些法則進一步豐富了用戶原則,使用戶原則變得實在、可操作。1、圖形界面的一致性原則一致性原則是“黃金法則”中最重要的原則,也是界面開發人員最容易忽略和違反的一個原則。一致性原則有利于減少用戶的學習量和記憶量,用戶可以把局部的經驗和知識推廣到其他應用場合。

一致性原則要做到:界面外觀上的一致:具有相似的外觀布局和信息顯示格式。例如Office和Adobe軟件。操作次序上的一致:例如不同命令操作后的顯示效果一致。概念、語義、命令語法一致:例如同一功能的命令名稱要一致,例如“復制”命令。不同軟件開發商之間的界面設計要保持某種一致:例如Windows操作系統下的各種軟件都具有一致性。Dreamweaver界面Flash界面AfterEffects界面Premiere界面2、圖形界面的簡潔性原則簡潔不僅是界面設計的美學原則,而且也是顯示屏幕大小所要求的。復雜化是界面設計的一大誤區!簡潔性原則主要表現在:內容歸類合理、內容排列整齊一致3、圖形界面的快捷方式原則用戶希望能減少人機對話的次數以減輕操作的頻率,快捷方式就是一個較好的辦法。Windows常用的快捷方式有:刪除、查找、插入、保存、打開、復制、粘貼、幫助、打印、關閉、剪切等。Windows操作操作系統下的應用程序基本都遵循一樣的快捷方式原則。4、軟件信息的反饋原則軟件界面對用戶的每個操作都應當提供及時的信息反饋,尤其是簡明的錯誤處理和幫助功能是軟件界面的重要反饋信息。例如光盤刻錄程序在工作的時候提示進度,結束的時候告訴任務完成、如果沒有光盤提示插入光盤等反饋信息;手機信息發送成功\失敗提示等。5、軟件界面的在線幫助原則軟件界面的友好性還體現在為用戶提供有好的幫助界面,幫助用戶學習和使用本軟件。如下圖:6、軟件界面的操作可逆性原則操作的可逆性對用戶來說,是一種有效的鼓勵。如果用戶知道操作是可逆的,即使發生錯誤也能恢復到原來的狀態,用戶就能大膽地對不熟悉的功能進行探索和學習。如下圖:7、圖形界面的最少記憶項目原則好的圖形界面應該盡量減少用戶的記憶量,用戶必須記住的任何信息應該是和當前操作有關的,而不是和計算機相關。為減少記憶量,應該通過菜單設計及聯機幫助等形式幫助用戶記憶,一般地說,用戶的短期記憶不要超過7個項目。8、圖形界面操作序列的完整性原則界面中每個操作序列都應該清楚地標明開始和結結束,其余的操作應插在中間。操作序列的結尾應該給用戶完成的感覺,并指示下一個任務的開始。想象一下發送手機信息的整個操作過程。1.2圖形界面的配色原則(色彩構成)在黑白顯示器的年代,人們是不用考慮色彩的配置的。今天,屏幕色彩的配置是屏幕顯示設計的一個關鍵。恰當的色彩運用,不但能美化軟件界面,而且還能夠增加用戶的興趣,引導用戶順利完成操作。《色彩構成》是配色的基礎,請同學們好好回顧一下,學會把色彩構成理論用到圖形界面設計當中。例如,在電子地圖上可以用不同的顏色區分不同的省、不同的國家;也可以用同一顏色的不同深法度來區分海洋的深度或地形的高度;在電腦游戲中可用顏色來表示游戲的進程。相反地,如果錯誤地使用顏色,會誤導用戶放棄操作,如有的打印程序用紅色表示激光打印機預熱就緒,可以打印,但有的用戶卻誤解為機器出現危險而放棄操作。因此,屏幕色彩的配置直接關系到用戶對軟件操作的信賴程度。1、色調的一致性色調的一致性指的是在整個軟件系統中要采用統一的色調,就是有個主色調。例如,用綠色表示運行正常,那么軟件的色彩編碼就要始終用綠色表示運行正常,如果色彩編碼改變了,用戶就會認為信息的意義變了。所以,在軟件界面設計前,設計者應該把色彩編碼標推方案寫出來,以利于每一個設計者遵守。例如很多程序采用交通燈的色彩編碼含義。2、保守地使用色彩大多數的界面設計者都贊成這一色彩配置原則。所謂保守地使用色彩,就是從大多數的用戶考慮出發,根據不同的用戶設計不同的色彩。界面設計時提倡采用一些柔和的、中性的顏色,以便于絕大多數用戶能接受。因為有時急于使用色彩突出顯示效果,反而適得其反。如有的軟件界面使用大號字母,每個字母還使用不同的顏色顯示,在遠距離看來,屏幕耀眼奪目,可是它不利于閱讀,而且會導致多屏顯示。

3、色彩選取盡可能符合人們的習慣用法對于一些專門軟件,在配置顏色時,要充分考慮用戶對顏色的喜愛。例如明亮的紅色、綠色和黃色適用于為兒童設計的應用程序。一般來說紅色表示錯誤,黃色表示警告,綠色表示運行正常等等。思考下面配色方案可能適合的群體和環境:

4、把色彩作為功能分界的識別元素不同的色彩可以幫助用戶加快對各種數據的識別,明亮的色彩可以有效地突出或者吸引人們對重要區域的注意力。

5、能讓用戶控制配色方案通常圖形界面都可以讓用戶自定義界面色彩配置,選擇自己最喜歡的顏色。例如windows操作系統界面,瀏覽器,QQ界面等等。

6、色彩搭配要便于閱讀要確保屏幕的可讀性,就要注意色彩的搭配,有效的方法是遵循對比法則。在淺色背景上使用深色文字,在深色背景上使用淺色文字等等。動態對象的顏色應該比較鮮明,靜態對象的顏色應該較暗淡。

7、色彩數目應該有限建議把單個界面顏色限制為4種以內,整個軟件系統系列顏色應限制在7種以內。

二、UI設計的規范法則三.設計規則和規范(界面)

界面是軟件與用戶交互的最直接的層,界面的好壞決定用戶對軟件的第一印象。而且設計良好的界面能夠引導用戶自己完成相應的操作,起到向導的作用。同時界面如同人的面孔,具有吸引用戶的直接優勢。設計合理的界面能給用戶帶來輕松愉悅的感受和成功的感覺,相反由于界面設計的失敗,讓用戶有挫敗感,再實用強大的功能都可能在用戶的畏懼與放棄中付諸東流。目前界面的設計引起軟件設計人員的重視的程度還遠遠不夠,直到最近網頁制作的興起,才受到專家的青睞。而且設計良好的界面由于需要具有藝術美的天賦而遭拒絕。目前流行的界面風格有三種方式:多窗體、單窗體以及資源管理器風格,無論那種風格,以下十條規則是應該被重視的。1.易用性:按鈕名稱應該易懂,用詞準確,屏棄沒楞兩可的字眼,要與同一界面上的其他按鈕易于區分,能望文知意最好。理想的情況是用戶不用查閱幫助就能知道該界面的功能并進行相關的正確操作。易用性細則:1):完成相同或相近功能的按鈕用框子框起來,常用按鈕要支持快捷方式。2):完成同一功能或任務的元素放在集中位置,減少鼠標移動的距離。3):按功能將界面劃分局域塊,用框子框括起來,并要有功能說明或標題。4):界面要支持鍵盤自動瀏覽按鈕功能,即按Tab鍵的自動切換功能。5):界面上首先應輸入的和重要信息的控件在Tab順序中應當靠前,位置也應放在窗口上較醒目的位置。6):同一界面上的控件數最好不要超過10個,多于10個時可以考慮使用分頁界面顯示。7):分頁界面要支持在頁面間的快捷切換,常用組合快捷鍵Ctrl+Tab8):默認按鈕要支持Enter及選操作,即按Enter后自動執行默認按鈕對應操作9):可寫控件檢測到非法輸入后應給出說明并能自動獲得焦點。10):Tab鍵的順序與控件排列順序要一直,目前流行總體從上到下,同時行間從左到右的方式。11):復選框和選項框按選擇幾率的高底而先后排列。12):復選框和選項框要有默認選項,并支持Tab選擇。13):選項數相同時多用選項框而不用下拉列表框。14):界面空間較小時使用下拉框而不用選項框。15):選項數叫少時使用選項框,相反使用下拉列表框。16):專業性強的軟件要使用相關的專業術語,通用性界面則提倡使用通用性詞眼。目前流行的界面風格有三種方式:多窗體、單窗體以及資源管理器風格,無論那種風格,以下十條規則是應該被重視的。2:規范性:通常界面設計都按Windows界面的規范來設計,即包含“菜單條、工具欄、工具箱、狀態欄、滾動條、右鍵快捷菜單”的標準格式,可以說:界面遵循規范化的程度越高,則易用性相應的就越好。小型軟件一般不提供工具箱。規范性細則:1):常用菜單要有命令快捷方式。2):完成相同或相近功能的菜單用橫線隔開放在同一位置。3):菜單前的圖標能直觀的代表要完成的操作。4):菜單深度一般要求最多控制在三層以內。5):工具欄要求可以根據用戶的要求自己選擇定制。6):相同或相近功能的工具欄放在一起。

7):工具欄中的每一個按鈕要有及時提示信息。8):一條工具欄的長度最長不能超出屏幕寬度。9):工具欄的圖標能直觀的代表要完成的操作。10):系統常用的工具欄設置默認放置位置。

11):工具欄太多時可以考慮使用工具箱。12):工具箱要具有可增減性,由用戶自己根據需求定制。

13):工具箱的默認總寬度不要超過屏幕寬度的1/5。14):狀態條要能顯示用戶切實需要的信息,常用的有:目前的操作、系統狀態、用戶位置、用戶信息、提示信息、錯誤信息等,如果某一操作需要的時間較長,還應該顯示進度條和進程提示。15):滾動條的長度要根據顯示信息的長度或寬度能及時變換,以利于用戶了解顯示信息的位置和百分比。16):狀態條的高度以放置五好字為宜,滾動條的寬度比狀態條的略窄。17):菜單和工具條要有清楚的界限;菜單要求凸出顯示,這樣在移走工具條時仍有立體感。18):菜單和狀態條中通常使用5號字體。工具條一般比菜單要寬,但不要寬的太多,否則看起來很不協調。19):右鍵快捷菜單采用與菜單相同的準則。3:幫助設施:系統應該提供詳盡而可靠的幫助文檔,在用戶使用產生迷惑時可以自己尋求解決方法。幫助設施細則:1):幫助文檔中的性能介紹與說明要與系統性能配套一致。2):打包新系統時,對作了修改的地方在幫助文檔中要做相應的修改。3):操作時要提供及時調用系統幫助的功能。常用F1。4):在界面上調用幫助時應該能夠及時定位到與該操作相對的幫助位置。也就是說幫助要有即時針對性。5):最好提供目前流行的聯機幫助格式或HTML幫助格式。6):用戶可以用關鍵詞在幫助索引中搜索所要的幫助,當然也應該提供幫助主題詞。7):如果沒有提供書面的幫助文檔的話,最好有打印幫助的功能。8):在幫助中應該提供我們的技術支持方式,一旦用戶難以自

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網頁內容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間,僅對用戶上傳內容的表現方式做保護處理,對用戶上傳分享的文檔內容本身不做任何修改或編輯,并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容,請與我們聯系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論