第一章ui設計概論

1、,,,第一章 概 論,1、什么是界面設計？（難點）2、界面設計涉及的范圍及學科3、界面設計的工作流程4、以用戶為中心的界面設計原則(重點）,通過什么操作Photoshop程序？,通過什么操作手機？,,什么是界面設計（UI）？界面——UI即User Interface(用戶界面)的簡稱。廣義上來講，UI界面是人與機器進行交互的操作平臺，即用戶與機器相互傳遞信息的媒介。,,,,,,用戶,機器,界面,概括成一句話就是——人和機器之間

2、的界面。這個界面實際上是體現在我們生活中的每一個環(huán)節(jié)的，例如開車時候方向盤和儀表盤就是這個界面 ，看電視的時候遙控器和屏幕就是這個界面，用電腦的時候鍵盤和顯示器就是這個界面?！　∮谑俏覀兛梢园裊I可以分成兩大類：硬件界面和軟件界面。本課程所關注的UI設計特指軟件界面，我們也可以稱為特殊的或者狹義的UI設計。,,一、什么是界面設計？界面設計即User Interface Design（用戶界面設計）的簡稱，是指對軟件的人機交互、

3、操作邏輯、界面美觀的整體設計。,,,,,人機交互,操作邏輯,界面美觀,,問題一：界面設計=版式設計？謂版式設計，就是在版面上，將有限的視覺元素進行有機的排列組合界面設計的內容包括：圖形、文字、色彩、編排，使界面起到美化效果的作用。需要研究用戶需求，研究目標用戶。,,問題二：界面設計=用戶+界面？或者界面設計就是單單指界面美化設計？從字面上看，UI有用戶與界面兩個組成部分，但實際上還有用戶與界面之間的交互關系。界面設計需要定位

4、使用者、使用環(huán)境、使用方式。不僅僅是美化界面，還有需要研究用戶、讓界面變得更友好、更有趣、更易用、更舒適。,,,,,UI,用戶,界面,=,+,,交互,,,=,,版式,考慮用戶的心理需求，研究目標用戶,前面講到UI設計包括兩方面——美化和交互。讓大家更了解UI設計的重要性從美化的角度看，UI優(yōu)化后:1更有時尚感、層次感2.從QQ圖像就能知道是QQ的登入界面，更直觀、形象。從交互的角度，未UI優(yōu)化的界面：1.功能過于簡單2.登入

5、沒有體現按鈕的特點，而不會單擊3.密碼輸入框也沒有做掩密處理，被盜號的風險系數增加,二.ui設計是做什么的？ UI設計從工作內容上來說分為3個方向。它主要是由UI 研究的3個因素決定的， 其分別是研究界面，研究人與界面的關系，研究人 。1.研究界面---視覺設計師國內目前大部分UI工作者都是從事這個行業(yè)。也有人稱之為美工，但實際上不是單純意義上的美術工人，而是軟件產品的產品外形設計師。這些設計師大多是美術院校畢業(yè)的，其中

6、大部分是有美術設計教育背景，例如工業(yè)外形設計，裝潢設計，視覺傳達設計，信息多媒體設計等。2.研究人與界面的關系---交互設計師 在圖形界面產生之前，長期以來UI設計師就是指交互設計師。交互設計師的工作內容就是設計軟件的操作流程，樹狀結構，軟件的結構與操作規(guī)范（spec）等。一個軟件產品在編碼之前需要作的就是交互設計，并且確立交互模型，交互規(guī)范。　　交互設計師一般都是軟件工程師背景居多。,3.研究人----用戶測試/研究工程

7、師 任何的產品為了保證質量都需要測試，軟件的編碼需要測試，自然UI設計也需要被測試。這個測試和編碼沒有任何關系，主要是測試交互設計的合理性以及圖形設計的美觀性。測試方法一般都是采用焦點小組，用目標用戶問卷的形式來衡量UI設計的合理性。這個職位很重要，如果沒有這個職位，UI設計的好壞只能憑借設計師的經驗或者領導的審美來評判，這樣就會給企業(yè)帶來嚴重的風險性?！　∮脩粞芯抗こ處熞话闶切睦韺W人文學背景比較合適?！　?綜上

8、所述UI設計師就是：軟件圖形設計師、交互設計師和用戶研究工程師。,,三、界面設計涉及的范圍及學科人機產品界面設計、移動設備界面設計、網頁界面設計、軟件界面設計界面設計是一種結合美學、計算機科學、心理學、行為學、人機工程學、信息學以及市場學等的綜合性學科，強調人—機—環(huán)境三者作為一個系統(tǒng)進行總體設計。,,四、界面設計的工作流程1）. 產品制作人，寫產品計劃書。   2）. 

9、用戶體驗研究員，作調查分析。   3）. 信息建構師，設計產品架構。   4）. 交互設計師，作出互動流程。   5）. 視覺設計師，作出頁面視覺設計。   6）. 前臺工程師，前臺開發(fā)。   7）. 后臺工程師，后臺開發(fā)。

10、60;  8）. 用戶體驗研究員，做用戶測試確保質量。,,,線框原型、黑白原型稿,,產品原型,,界面設計,,五、以用戶為中心的界面設計原則1）、一致性和必要的個性化2）、使用用戶的語言3）、用戶記憶負擔最小化4）、用戶界面的功能性5）、容易理解6）、清楚的報錯信息7）、快捷方式的組合8）、連續(xù)性9）、方便退出10）、幫助系統(tǒng),,1）、一致性和必要的個性化OFFICE 軟件風格一致

11、，要有統(tǒng)一的字體字號、統(tǒng)一的色調、統(tǒng)一的提示用詞、窗口在統(tǒng)一的位置、按鈕也在窗口的相同的位置。目的是能夠減少記憶量、減少出錯概率而且能迅速積累操作經驗。個性化。在一致性下，適當突出該軟件的“個性化”如PPT中不同于word 有自己的動畫效果,,2）、使用用戶的語言界面中要注意使用用戶的語言，而不是設計者的語言，最有效的方法：讓數據說話，如詢問用戶、用戶投票等。因此，用戶使用系統(tǒng)的錯誤會降到最低。,,3）、用戶記憶負擔最小化

12、瀏覽信息比記憶更容易，在設計時一定要考慮到減輕用戶的記憶負擔。,,4）、用戶界面的功能性界面最基本的性能是具有功能性與使用性，通過界面設計，讓用戶明白功能操作，并將產品本身的信息更加順暢的傳遞給使用者，是功能界面存在的基礎與價值用戶界面一定要有基本的功能，設計者不能片面追求界面外觀漂亮而導致華而不實。,,5）、容易理解大多數的用戶都有豐富的生活經驗，也就是使用各種工具或者玩具的經驗。如果能夠在界面設計中把這些積累的生活經驗和界面視

13、覺元素對應或這連接起來就會讓用戶更容易理解。如電子書界面，模擬翻書的設計可以很快讓用戶理解如何操作，并且給讀者熟悉的閱讀體驗。,6）、清楚的報錯信息 錯誤操作后，系統(tǒng)應該提供有針對性的錯誤信息反饋提示，讓用戶心里有數。,7）、快捷方式的組合在菜單及按鈕中使用快捷鍵可以讓用戶操作的更加快捷因此在一些軟件設計中會把的常用的功能用圖標按鈕的形式擺在工具條上或用快捷件。如在犀牛軟件中按住中間滾輪就能彈出常用的功能鍵或者在CAD軟件中

14、每個常用工具都會有個相應的英文快捷鍵。直線工具：L(line),,8）、連續(xù)性一個有序的連續(xù)的界面能讓用戶輕松使用。在排列和版面布局上要有序，是水平排列還是垂直排列還是兩者都有之。如QQ界面。,9）、方便退出在界面的使用上要設計方便退出，提供不同可能性，如手機的退出，是按一個鍵就可退出還是一層一層的退出。 10）、幫助系統(tǒng)它可以幫助用戶更快捷、更好的學習界面的使用，告訴用戶在遇到某些使用問題時該如何處理、減少用戶在使用中的