第一篇：20個UI設計原則

20個UI設計原則

圖形設計大師Paul Rand（保羅.蘭德）曾經說過：“設計絕不是簡單的排列組合與簡單地再編輯，它應當充滿著價值和意義，去說明道理，去刪繁就簡，去闡明演繹，去修飾美化，去贊美褒揚，使其有戲劇意味，讓人們信服你所言……”，由此可見，設計絕非輕而易舉之事，優秀的設計更是難上加難，今日小編偶然發現一篇界面設計師Joshua Porter博客當中的一篇文章——《Principles of User Interface Design》，文章中列舉了20大UI設計原則，全文編譯如下：

1.清晰度是首要工作

清晰度是界面設計中，第一步也是最重要的工作。要想你設計的界面有效并被人喜歡，首先必須讓用戶能夠識別出它？讓用戶知道為什么會使用它？比如當用戶使用時，能夠預料到發生什么，并成功的與它交互。有的界面設計得不是太清晰，雖然能夠滿足用戶一時的需求，但并非長久之計，而清晰的界面能夠吸引用戶不斷地重復使用。

2.界面是為促進交互而存在的界面的存在，促進了用戶和我們的世界之間的互動。優秀的界面不但能夠讓我們做事有效率，還能夠激發、喚起和加強我們與這個世界的聯系。

3.保護和尊重用戶的注意力

我們在閱讀的時候，總是會有許多事物分散我們的注意力，使得我們很難集中注意力安靜地閱讀。因此，在進行界面設計的時候，能夠吸引用戶的注意力是很關鍵的，所以千萬不要將你應用的周圍設計得亂七八糟分散人的注意力，謹記屏幕整潔能夠吸引注意力的重要性。如果你非要顯示廣告，那么請在用戶閱讀完畢之后再顯示。尊重用戶的注意力，不僅讓用戶更快樂，而且你的廣告效果也會更佳。因此要想設計好的界面，保護和尊重用戶的注意力是先決條件。

4.讓界面處在用戶的掌控之中

人類往往對能夠掌控自己和周圍的環境感到很舒心。不考慮用戶感受的軟件往往會讓這種舒適感消失，迫使用戶不得不進入計劃外的交互，這會讓用戶很不舒服。保證界面處在用戶的掌控之中，讓用戶自己決定系統狀態，稍加引導，我想你會達到你希望的目標。

5.直接操作的感覺是最好的當我們能夠直接操作物體時，用戶的感覺是最棒的，但這并不太容易實現，因為在界面設計時，我們增加的圖標往往并不是必須的，比如我們過多的使用按鈕、圖形、選項、附件等等其他繁瑣的東西以便我們最終操縱UI元素而不是重要的事情。而最初的目標呢？就是希望簡化而能夠直接操縱……因此在進行界面設計時，我們要盡可能多的了解一些人類自然手勢。理想情況下，界面設計要簡潔，讓用戶有一個直接操作的感覺。

6.每個屏幕需要一個主題

我們設計的每一個畫面都應該有單一的主題，這樣不僅能夠讓用戶使用到它真正的價值，也使得上手容易，使用起來也更方便，在必要的時候更容易進行修改。如果一個屏幕支持兩個或兩個以上的主題，立馬會讓整個界面看起來混亂不堪。正如文章應該有一個單一的主題以及強有力的論點，我們的界面設計也應該如此，這也是界面存在的理由。

7.勿讓次要動作喧賓奪主

每個屏幕包含一個主要動作的同時，可以有多個次要動作，但盡量不要讓它們喧賓奪主！文章的存在是為了讓人們去閱讀它，并不是讓人們在Twitter上面分享它。所以在設計界面的時候，盡量減弱次要動作的視覺沖擊力，或者在主要動作完成之后再顯示出來。

8.自然過渡

界面的交互都是環環相扣的，所以設計時，要深思熟慮地考慮到交互的下一步。考慮到下一步的交互是怎樣的，并且通過設計將其實現。這就好比我們的日常談話，要為深入交談提供話由。當用戶已經完成該做的步驟，不要讓他們不知所措，給他們自然而然繼續下去的方法，以達成目標。

9.外觀追隨功能（類似于形式追隨功能）

人總是對符合期望的行為最感舒適。當其他人、動物、事物或者軟件的行為始終符合我們的期望時，我們會感到與之關系良好。這也是與人打交道的設計應該做到的。在實踐中，這意味著用戶只要看一眼就可以知道接下來將會有什么的動作發生，如果它看上去像個按鈕，那么它就應該具備按鈕的功能。設計師不應該在基本的交互問題上耍小聰明，要在更高層次的問題上發揮創造力。

10.區分重點

如果屏幕元素各自的功能不同，那么它們的外觀也理應不同。反之，如果功能相同或相近，那么它們看起來就應該是一樣的。為了保持一致性，初級設計師往往對應該加以區分的元素采用相同的視覺處理效果，其實采用不同的視覺效果才是合適的。

11.強烈的視覺層次感

如果要讓屏幕的視覺元素具有清晰的瀏覽次序，那么應該通過強烈的視覺層次感來實現。也就是說，如果用戶每次都按照相同的順序瀏覽同樣的東西，視覺層次感不明顯的話，用戶不知道哪里才是目光應當停留的重點，最終只會讓用戶感到一團糟。在不斷變更設計的情況下，很難保持明確的層次關系，因為所有的元素層次關系都是相對的：

如果所有的元素都突出顯示，最后就相當于沒有重點可言。如果要添加一個需要特別突出的元素，為了再次實現明確的視覺層級，設計師可能需要重新考慮每一個元素的視覺重量。雖然多數人不會察覺到視覺層次，但這是增強設計的最簡單的方法。

12.恰當的組織視覺元素，減輕用戶的認知負荷

正如注明設計師John Maeda在其著作《Simplicity》中所言，恰當地組織視覺元素能夠化繁為簡，幫助他人更加快速簡單地理解你的表達，比如內容上的包含關系。用方位和方向上的組織可以自然地表現元素間的關系。恰如其分地組織內容可以減輕用戶的認知負荷，他們不必再琢磨元素間的關系，因為你已經表現出來了。不要迫使用戶做出分辨，而是設計者用組織表現出來。不要迫使用戶自己去把問題搞明白，設計師應當直接在。

13.色彩不是決定性的因素

物體的色彩會隨光線改變而改變。艷陽高照與夕陽西沉時，我們看到的景物會有很大反差。換句話說，色彩很容易被環境改變，因此，設計的時候不要將色彩視為決定性因素。色彩可以醒目，作為引導，但不應該是做區別的唯一元素。在長篇閱讀或者長時間面對電腦屏幕的情況下，除了要強調的內容，應采用相對暗淡或柔和的背景色。當然，視讀者而定，也可采用明亮的背景色。

14.循序展現

每個屏幕只展現必需的內容。如果用戶需要作出決定，則展現足夠的信息供其選擇，他們會到在下一屏找到所需細節。避免過度闡釋或把所有一次展現，如果可能，將選擇放在下一屏以有步驟地展示信息。這會使你的界面交互更加清晰。

15.內嵌“幫助”選項

在理想的用戶界面，“幫助”選項是不必要出現的，因為用戶界面能夠有效地指引用戶學習。類似“下一步”實際上就是在上下文情境中內嵌的“幫助”，并且只在用戶需要的時候出現在適當的位置，其他時候都是隱藏的。設計者的任務不是在用戶有需要的地方建立一個幫助系統，把發現用戶需要的義務推諉給用戶，讓用戶去在幫助系統中尋找他們問題的答案。而是應該確保用戶知道如何使用你提供的界面，讓用戶在界面中得到指導并學習。

16.關鍵時刻：零狀態

用戶對一個界面的首次體驗是非常重要的，而這常常被設計師忽略。為了更好的幫助用戶快速適應我們的設計，設計應該處于零狀態，也就是什么都沒有發生的狀態。但這個狀態不是一塊空白的畫布，它應該能夠為用戶提供方向和指導，以此來幫助用戶快速適應設計。在初始狀態下的互動過程中會存在一些摩擦，一旦用戶了解了各種規則，那將會有很高的機會獲得成功。

17.針對現有問題去完善界面

人們總是尋求各種方案去解決已經存在的問題，而不是潛在的或者未來的問題。所以，不要為假設的問題設計界面，我們應該觀察現有的行為和設計，解決現存的問題。這確實不是件能夠讓人興奮的事情，但卻是最有價值的事情，因為一旦你的用戶界面愈加完善，會有更多的用戶愿意使用你的界面。

18.優秀的設計是無形的優秀的設計有個古怪的屬性，它通常會被它的用戶所忽略。其中的一個原因是這個設計非常成功，以至于它的用戶專注于完成自己的目標而忽略了自己面對的界面，用戶順利達成自己的目標后，他們會很滿意地退出界面。但是作為設計師，這可能會有點不公平，當我們的設計很優秀的時候，我們不會受到很多阿諛奉承。當然，優秀的設計師不會去介意這些，因為他們心里明白，滿意的用戶往往都是沉默的。

19.多領域學習，借鑒其他學科

視覺、平面設計、排版、文案、信息結構以及可視化，所有的這些知識領域都應該是界面設計應該包含的內容，設計師對這些知識都應該有所涉獵或者比較專長。不要看不起這些知識：要從中獲取許多值得學習的東西，以此來提高你的工作能力。設計師的眼光要長遠，要能從看似無關的學科中學習，比如出版、編程、裝訂、滑板、消防甚至空手道。

20.界面的存在必須有所用途

在大多數設計領域，界面設計成功的要素就是有用戶使用它。打個比方，一把漂亮的椅子，雖然精美但坐著不舒服，那么用戶不會選擇使用它，它也就是失敗的設計。因此，界面設計不僅僅是設計一個使用環境，還需要是創造一個值得使用的藝術品。界面設計僅僅能夠滿足其設計者的虛榮心是不夠的：它必須要有用！

第二篇：《UI設計》課程標準

《UI設計》學習領域課程標準

執筆：甄珍

審核：

時間： 2013-5-

5一、學習領域定位

“UI”熱是近幾年來興起的潮流，近幾年國內很多從事手機，軟件，網站，增值服務等企業和公司都設立了這個部門。還有很多專門從事UI設計的公司也應運而生。

正是鑒于目前UI行業的發展狀況，本專業第一次開設計《UI設計》課程。

《UI設計》是所有與網絡通信軟件相關專業課程，該課程既可以鞏固前期所學的設計基礎理論知識和設計軟件應用知識，還重在給學生開拓新的專業知識面，認知一個新的設計領域，從而拓展職業能力和就業選擇面。

二、職業分析

目前UI即用戶界面設計行業剛剛在全球軟件業興起，屬于高新技術設計產業，與國外在同步發展水平。其次國內外眾多大型IT企業(例如：百度、騰訊、Yahoo、中國移動、Nokia、聯想、網易、微軟、盛大、淘寶等眾多企業)均已成立專業的UI設計部門，但專業人才稀缺，人才資源爭奪激烈。但目前全國UI設計專業的系統教學極其稀少。UI設計師的待遇和地位也逐漸上升。

三、學習目標

知識目標：使學生能熟悉UI設計的流程和設計方法，并能使用制作有創意的，充滿視覺沖擊力的UI設計作品。

技能目標：使學生學會系統規劃和全局思維，能夠完成一整套UI系統的設計。

素養目標：使學生具備能從事UI系統的開發與設計能力，培養學生團隊合作、及獨立思考能力。

四、學習內容

四、學習領域課程設計思路

（一）設計理念

五、考核方式

學生成績的評定，以學生平時表現和任務完成情況及最終考核來核定。評分細則如下表：

其中，平時成績包括平時上課的表現和各任務的完成情況，占總成績的30％；最終考核成績所用考核方式為機試，占總成績的70％。

第三篇：UI設計流程

UI設計流程

階段一：分析

1用戶需求分析 2用戶交互場景分析 3競爭產品分析

這兩者可以說是相輔相成的。對于一個較為正規的項目而言，必然有對用戶需求的分析內容。Tanjurd瑭錦資深UI設計師表示其中用戶UI需求是重要的組成部分。如果說UI設計原則是所有UI設計的出發點的話，那么用戶UI需求就是本次設計的出發是好的UI設計建立在對用戶深刻了解之上。因此用戶交互場景分析就很重要。對于大部分項目組來說也許沒有時間和精力去實際勘查用戶的現有交互、制作完善的交互模型考察，但是UI設計人員在分析的時候一定要站在用戶角度思考：如果我是用戶，這里我會需要什么。競爭產品能夠上市并且被UI設計者知道，必然有其長處。這就是所謂三人行必有我師的意思。每個設計者的思維都有局限性，看到別人的設計會有觸類旁通的好處。當然有的時候可以參考的并不一定是競爭產品。

階段二 設計需求：（葉面設計前需提給UI頁面組）

1.系統設計需求文檔。2.系統結構文檔（例如欄目劃分，目錄結構，導航方式等）。3.較復雜頁面表現形式草圖（手繪或相關軟件繪制）。4.較復雜業務流程文檔。5.如有可能提供參考和示例站點。6.與程序員溝通部分頁面實現方法。

段三：頁面制作：

1.經過確認的美術設計的方案圖7.系統設計需求文檔等，較復雜務流程文檔。2.所需頁面腳本需求，與程序員溝通部分頁面實現方法。3提交給程序

用戶交互case圖（說明用戶和系統之間的聯系）用戶交互流程圖（說明交互和事件之間的聯系）交互功能設計圖（說明功能和交互的對應關系）最終得到UI的設計產品。

階段四：驗證

界面測試：（頁面組提交給測試組包括：1.經確認的設計方案圖。2.靜態模板頁面。以上二項均為便于查看嵌入程序后的葉面情況。3.常出現的界面錯誤：圖片錯誤，頁面不美觀，布局不合理，與原先設計不符，文字 錯誤HTML代碼錯誤，頁面程序錯誤。4.界面bug測試報告：

正如Tanjurd瑭錦國際UI交互設計原則文中提到的，對于UI產品的驗證主要從下面幾個方面入手：

1、功能性對照UI設計的再好，和需求不一致也不可以。

2、實用性內部測試UI設計的最重要點就是實用性。

3、用戶焦點小組UI設計是否優秀的重要衡量依據。最后，瑭錦Tanjurd說一點其他的問題。現在往往認為交互式設計和最終的UI效果設計可以截然分開。這就好比說需求可以和設計截然分開，是不可能的。

總結：

1.產品定位與市場分析這一類工作大多都是由新產品研發部門以及市場需求完成的，但UI設計師應了解產品的市場定位、產品定義、客戶群體、運營方式等。

2.用戶研究與分析這個過程是非常重要的，設計師應該找到合適的方法來完成此環節。你可以搜集相關資料分析目標用戶的使用特征、情感、習慣、心里、需求等，提出用戶研究報告和可用性設計建議。這部分工作也可和團隊配合完成。時間與項目需求允許的情況下，更可以制定實景用戶分析。

3.架構設計這里涉及到比較多的界面交互與流程的設計，根據可用性分析結果制定交互方式、操作與跳轉流程、結構、布局、信息和其他元素。

4.原型設計我覺得這里應該是一個小的階段標志，要對前面所有工作加以設計方面的實施，根據進度與成本，可以把原型控制在“手繪－圖形－FLASH-視頻”幾個質量范圍。原型的本質更傾向與一個DEMO，它不需要有全部的功能，但要體現出設計對象的基本特性。

5.界面設計如果很傾向于圖形界面設計，這兒是你最喜歡的部分。但一定要結合循環討論過的分析結果做設計，否則你的作品很難被人信服。色調、風格、界面、窗口、圖標、皮膚的表現是本環節的關鍵。

6.界面輸出作為設計師，在這一部分的工作就是配合好開發人員完成相關的界面結合。7.完善工作這個環節是很多部門共同參與的，包括可用性的循環研究、用戶體驗回饋、測試回饋。同時，UI人員也應該把一些可行性建議進行完善。Tanjurd瑭錦表示很多設計師做了東西不喜歡改，這是一個大忌。

如上的流程，可能會有很多部門共同參與完成，UI設計師如何與團隊配合并發揮自己應有的作用非常重要。一名合格的UI設計師，應該能貫穿整個UI流程進行工作，而并非是單純的圖形界面設計。

第四篇：UI設計流程

UI設計流程

分析、設計、配合、驗證

確認目標用戶

在軟件設計過程中，需求設計角色會確定軟件的目標用戶，獲取最終用戶和直接用戶的需求。

用戶交互要考慮到目標用戶的不同引起的交互設計重點的不同。

例如：對于科學用戶和對于電腦入門用戶的設計重點就不同。

采集目標用戶的習慣交互方式

不同類型的目標用戶有不同的交互習慣。這種習慣的交互方式往往來源于其原有的針對現實的交互流程、已有軟件工具的交互流程。

當然還要在此基礎上通過調研分析找到用戶希望達到的交互效果，并且以流程確認下來。

提示和引導用戶

軟件是用戶的工具。因此應該由用戶來操作和控制軟件。軟件響應用戶的動作和設定的規則。

對于用戶交互的結果和反饋，提示用戶結果和反饋信息，引導用戶進行用戶需要的下一步操作。

一致性原則

設計目標一致

軟件中往往存在多個組成部分（組件、元素）。不同組成部分之間的交互設計目標需要一致。

例如：如果以電腦操作初級用戶作為目標用戶，以簡化界面邏輯為設計目標，那么該目標需要貫徹軟件（軟件包）整體，而不是局部。

元素外觀一致

交互元素的外觀往往影響用戶的交互效果。同一個（類）軟件采用一致風格的外觀，對于保持用戶焦點，改進交互效果有很大幫助。遺憾的是如何確認元素外觀一致沒有特別統一的衡量方法。因此需要對目標用戶進行調查取得反饋。

交互行為一致

在交互模型中，不同類型的元素用戶觸發其對應的行為事件后，其交互行為需要一致。

例如：所有需要用戶確認操作的對話框都至少包含確認和放棄兩個按鈕。

對于交互行為一致性原則比較極端的理念是相同類型的交互元素所引起的行為事件相同。但是我們可以看到這個理念雖然在大部分情況下正確，但是的確有相反的例子證明不按照這個理念設計，會更加簡化用戶操作流程。

可用性原則

可理解

軟件要為用戶使用，用戶必須可以理解軟件各元素對應的功能。

如果不能為用戶理解，那么需要提供一種非破壞性的途徑，使得用戶可以通過對該元素的操作，理解其對應的功能。

例如：刪除操作元素。用戶可以點擊刪除操作按鈕，提示用戶如何刪除操作或者是否確認刪除操作，用戶可以更加詳細的理解該元素對應的功能，同時可以取消該操作。

可達到

用戶是交互的中心，交互元素對應用戶需要的功能。因此交互元素必須可以被用戶控制。

用戶可以用諸如鍵盤、鼠標之類的交互設備通過移動和觸發已有的交互元素達到其它在此之前不可見或者不可交互的交互元素。

要注意的是交互的次數會影響可達到的效果。當一個功能被深深隱藏（一般來說超過4層）那么用戶達到該元素的幾率就大大降低了。

可達到的效果也同界面設計有關。過于復雜的界面會影響可達到的效果。（參考簡單導向原則）

可控制

軟件的交互流程，用戶可以控制。

功能的執行流程，用戶可以控制。

如果確實無法提供控制，則用能為目標用戶理解的方式提示用戶

1、分析階段

需求分析、用戶場景模擬、競品分析（聆聽用戶心聲）。

需求分析：對于一個產品來說，必然有對用戶需求的分析內容，更多的是從MRD與PRD獲得，或者從產品需求評審會議上得到需求分析的內容，當然可以直接與產品經理交流獲得相關產品需求。如果說設計原則是所有設計的出發點的話，那么用戶需求就是本次設計的出發點。用戶場景模擬：好的設計建立在對用戶深刻了解之上。因此用戶使用場景分析就很重要，了解產品的現有交互以及用戶使用產品習慣等，但是設計人員在分析的時候一定要站在用戶角度思考：如果我是用戶，這里我會需要什么。

競品分析（聆聽用戶心聲）：競爭產品能夠上市并且被UI設計者知道，必然有其長處。這就是所謂三人行必有我師的意思。每個設計者的思維都有局限性，看到別人的設計會有觸類旁通的好處。當市場上存在競品時，去聽聽用戶的評論，哪怕是罵聲都好，別沉迷于自己的設計中，讓真正的用戶說話。

輸入物：MRD、PRD、市場需求文檔、市場調查報告、競品分析文檔（或其一或全部）

輸出物：設計初稿（或許只是幾個簡單的界面）

2、設計階段

設計方法采用面向場景、面向事件驅動和面向對象的設計方法。面向場景是針對該產品使用場所等模擬，模擬用戶在多種情況下產品使用的模擬。面向事件驅動則是對產品響應與觸發事件的設計，一個提示框，一個提交按鈕……這類都是對事件驅動的設計。面向對象，產品面向的用戶不同對于產品的設計要求不同，不同年齡層的用戶對于產品的要求不同，產品的用戶定位將對UI設計師影響因素。輸入物：交互文檔（高保真原型）輸出物：設計終稿（所有的設計稿）

3、配合

UI設計師交出產品設計圖時，更多的配合開發人員、測試人員進行截圖配合。配合開發人員對于PSD格式的圖片切圖操作，對于不同的開發人員的要求，切圖方式也有不同，UI設計師需配合相關的開發人員進行最適合的切圖配合。輸入物：設計終稿

輸出物：設計修改稿（設計稿切片）

4、驗證

產品出來后，UI設計師需對產品的效果進行驗證，與當初設計產品時的想法是否一致，是否可用，用戶是否接受，以及與需求是否一致。都需要UI設計師驗證，UI設計師是將產品需求用圖片展現給用戶最直接的經手人，對于產品的理解會更加深刻。輸入物：產品

輸出物：產品（面向用戶最終版本）

產品UI設計中夾雜著許多設計原則要求，統一公司UI設計流程，使UI設計師參與到產品設計整個環節中來，對產品的易用性進行全流程負責，使UI設計的流程規范化，保證UI設計流程的可操作性。UI設計師應該分析公司產品的特點，制定符合產品生命周期的UI設計流程。每個產品的生命周期中，UI設計師應該嚴格按照流程，完成每個環節的職責，確保流程準確有效的得到執行，從而提高產品的可用性，提升產品質量。GUI設計詳細流程定義：

1.項目開始GUI設計時間點之前，明確客戶的GUI需求,了解機器外形硬件和軟件的特性。

2.概念設計【提供GUI設計方案幾套，參考產品組人員和領導層的建議，但最多3套，精心設計各套方案；項目組和產品組共同進行方案評審會，決策方案；并且需要項目組提供真機，展開界面的真機效果和環境測評，優化界面顏色、亮度等細節）】； 3.詳細設計【需要明確界面研發的細節；建議項目提出強烈建議優化的幾項產品設計點（用戶調查）】；對界面有變化的界面進行統計，整理出文檔提交給UI層面技術工程師，做好相關的界面準備工作。4.原型設計時間【目前國內研發軟件的現狀通常此環節被忽略，但時間充足，建議按計劃進行】 5.與UI層面的技術工程師共同展開界面實現（界面實現和界面優化的時間點控制在項目時間的百分之幾點，需要明確）

6.界面工程師制作好Demo，提交給項目負責人、決策人和UI用戶界面測試工程師（需要指定負責人），展開用戶體驗反饋建議匯總，提出用戶界面體驗的反饋意見表（需要項目負責人支持）。

7.測試評估，盡早發現存在的交互設計和視覺設計的不足之處，進行軟件界面的改善設計。

UI設計流程以及設計師參與的環節

最近的工作中總結出一條結論：擁有一個完善規范的流程，是決定著一個項目走向成功或失敗的關鍵。

對于UI設計的工作流程，我覺得可以根據“市場分析－用戶分析－架構－原型－界面－輸出－完善”這條主線制定，每個環節UI設計師都應參與其中。

1.產品定位與市場分析

這一類工作大多都是由新產品研發部門以及市場需求完成的，但UI設計師應了解產品的市場定位、產品定義、客戶群體、運營方式等。

2.用戶研究與分析

這個過程是非常重要的，設計師應該找到合適的方法來完成此環節。你可以搜集相關資料分析目標用戶的使用特征、情感、習慣、心里、需求等，提出用戶研究報告和可用性設計建議。這部分工作也可和團隊配合完成。時間與項目需求允許的情況下，更可以制定實景用戶分析。

3.架構設計

這里涉及到比較多的界面交互與流程的設計，根據可用性分析結果制定交互方式、操作與跳轉流程、結構、布局、信息和其他元素。

4.原型設計

我覺得這里應該是一個小的階段標志，要對前面所有工作加以設計方面的實施，根據進度與成本，可以把原型控制在“手繪－圖形－FLASH-視頻”幾個質量范圍。原型的本質更傾向與一個DEMO，它不需要有全部的功能，但要體現出設計對象的基本特性。

5.界面設計

如果很傾向于圖形界面設計，這兒是你最喜歡的部分。但一定要結合循環討論過的分析結果做設計，否則你的作品很難被人信服。色調、風格、界面、窗口、圖標、皮膚的表現是本環節的關鍵。

6.界面輸出

作為設計師，在這一部分的工作就是配合好開發人員完成相關的界面結合。

7.完善工作

這個環節是很多部門共同參與的，包括可用性的循環研究、用戶體驗回饋、測試回饋。同時，UI人員也應該把一些可行性建議進行完善。很多設計師做了東西不喜歡改，這是一個大忌。

如上的流程，可能會有很多部門共同參與完成，UI設計師如何與團隊配合并發揮自己應有的作用非常重要。一名合格的UI設計師，應該能貫穿整個UI流程進行工作，而并非是單純的圖形界面設計。

確認目標用戶

在軟件設計過程中，需求設計角色會確定軟件的目標用戶，獲取最終用戶和直接用戶的需求。

用戶交互要考慮到目標用戶的不同引起的交互設計重點的不同。

例如：對于科學用戶和對于電腦入門用戶的設計重點就不同。采集目標用戶的習慣交互方式

不同類型的目標用戶有不同的交互習慣。這種習慣的交互方式往往來源于其原有的針對現實的交互流程、已有軟件工具的交互流程。

當然還要在此基礎上通過調研分析找到用戶希望達到的交互效果，并且以流程確認下來。

提示和引導用戶

軟件是用戶的工具。因此應該由用戶來操作和控制軟件。軟件響應用戶的動作和設定的規則。

對于用戶交互的結果和反饋，提示用戶結果和反饋信息，引導用戶進行用戶需要的下一步操作。一致性原則

設計目標一致

軟件中往往存在多個組成部分（組件、元素）。不同組成部分之間的交互設計目標需要一致。

例如：如果以電腦操作初級用戶作為目標用戶，以簡化界面邏輯為設計目標，那么該目標需要貫徹軟件（軟件包）整體，而不是局部。

元素外觀一致

交互元素的外觀往往影響用戶的交互效果。同一個（類）軟件采用一致風格的外觀，對于保持用戶焦點，改進交互效果有很大幫助。遺憾的是如何確認元素外觀一致沒有特別統一的衡量方法。因此需要對目標用戶進行調查取得反饋。

交互行為一致

在交互模型中，不同類型的元素用戶觸發其對應的行為事件后，其交互行為需要一致。

例如：所有需要用戶確認操作的對話框都至少包含確認和放棄兩個按鈕。

對于交互行為一致性原則比較極端的理念是相同類型的交互元素所引起的行為事件相同。但是我們可以看到這個理念雖然在大部分情況下正確，但是的確有相反的例子證明不按照這個理念設計，會更加簡化用戶操作流程。可用性原則

可理解

軟件要為用戶使用，用戶必須可以理解軟件各元素對應的功能。

如果不能為用戶理解，那么需要提供一種非破壞性的途徑，使得用戶可以通過對該元素的操作，理解其對應的功能。

例如：刪除操作元素。用戶可以點擊刪除操作按鈕，提示用戶如何刪除操作或者是否確認刪除操作，用戶可以更加詳細的理解該元素對應的功能，同時可以取消該操作。

可達到

用戶是交互的中心，交互元素對應用戶需要的功能。因此交互元素必須可以被用戶控制。

用戶可以用諸如鍵盤、鼠標之類的交互設備通過移動和觸發已有的交互元素達到其它在此之前不可見或者不可交互的交互元素。

要注意的是交互的次數會影響可達到的效果。當一個功能被深深隱藏（一般來說超過4層）那么用戶達到該元素的幾率就大大降低了。

可達到的效果也同界面設計有關。過于復雜的界面會影響可達到的效果。（參考簡單導向原則）可控制

軟件的交互流程，用戶可以控制。

功能的執行流程，用戶可以控制。

如果確實無法提供控制，則用能為目標用戶理解的方式提示用戶。

上面的文章提到了UI設計的原則，并且對此做出了一些所謂的定義。大家要明白，本人對UI設計的研究時間不長，這些原則只是個人體會。

因此就有人提出問題：有了原則固然好，那么如何付諸實施呢？個人理解達到目標是需要方法的，因此在UI設計原則里面東西拷貝了一些方法和模式。而能夠讓方法持續實施，達到目標就需要流程-或者說過程來保證。

所以這里就對流程進行一下總結和探討。以付茶資吧！

我們把UI設計的流程分為一個出發點，4個階段。

[出發點]

1、了解UI設計的原則。

沒有原則，就喪失了設計的立足點。

2、了解UI交互模式

正如同編程不了解模式就會事半功倍一樣，UI設計不了解模式就會對設計原則的實施造成困惑。

3、了解UI交互元素及其功能

如果對于UI的基本交互元素和功能都不了解，如何設計UI呢？ [階段一：分析]

1、用戶需求分析

2、用戶交互場景分析

3、競爭產品分析

這兩者可以說是相輔相成的。對于一個較為正規的項目而言，必然有對用戶需求的分析內容。其中用戶UI需求是重要的組成部分。如果說UI設計原則是所有UI設計的出發點的話，那么用戶UI需求就是本次設計的出發點。

好的UI設計建立在對用戶深刻了解之上。因此用戶交互場景分析就很重要。對于大部分項目組來說也許沒有時間和精力去實際勘查用戶的現有交互、制作完善的交互模型考察，但是UI設計人員在分析的時候一定要站在用戶角度思考：如果我是用戶，這里我會需要什么。

競爭產品能夠上市并且被UI設計者知道，必然有其長處。這就是所謂三人行必有我師的意思。每個設計者的思維都有局限性，看到別人的設計會有觸類旁通的好處。

當然有的時候可以參考的并不一定是競爭產品。[階段二：設計]

采用面向場景、面向事件驅動和面向對象的設計方法。

UI設計著重于交互，因此必然要對最終用戶的交互場景進行設計。

軟件是交互產品，用戶所作的就是對軟件事件的響應以及觸發軟件內置的事件。因此要面向事件設計。

現在的程序開發主流采用的是面向對象設計。面向對象設計可以有效的體現面向場景和面向事件的特點。

設計的四個要素： 交互對象 數據對象

事件（交互事件和異常）動作

[階段三：開發] 通過：

用戶交互case圖（說明用戶和系統之間的聯系）用戶交互流程圖（說明交互和事件之間的聯系）交互功能設計圖（說明功能和交互的對應關系）最終得到UI的設計產品。[階段四：驗證]

正如UI交互設計原則探討文中提到的，對于UI產品的驗證主要從下面幾個方面入手：

1、功能性對照

UI設計的再好，和需求不一致也不可以。

2、實用性內部測試

UI設計的最重要點就是實用性。

3、用戶焦點小組

UI設計是否優秀的重要衡量依據。

第五篇：UI設計基礎知識 免費

UI設計基礎知識

UI設計學習者經常會陷入迷茫期，學習內容零碎雜亂、自覺性差、水平不夠、無人指導走彎路等問題接踵而來，導致很多人半途而廢。要想從零基礎小白成長為真正的UI設計師，需要制定合理的學習計劃，并加以系統的學習課程，才能助你快速成長為一名優秀的UI設計師。

一、【UI設計需要學什么？】UI設計學習內容分四大階段：

01必不可少的軟件基礎：熟練掌握UI設計基本軟件Photoshop、Illstrator核心功能，讓成為UI 設計師事半功倍。

02各模塊的設計學習：系統全面學習習近平面設計、網頁設計、APP設計、交互設計等各個版塊，打造會設計、知交互、懂用戶體驗的UI設計師。

03UI項目實訓：通過項目實戰案例的練習，積累設計經驗，提升設計整體水平。04高薪就業指導：提升綜合素質及實際求職能力。

二、UI到底是什么？

User Interface（用戶界面），簡稱UI，是指從事對軟件的人機交互、操作邏輯、界面美觀的整體設計。UI設計分三個分支：

1、研究界面——圖形設計師Graphic UI Designer，簡稱GUI,國內目前大部分UI工作者都是從事這個行業。包括（網頁設計，軟件界面，移動端界面設計），每天工作做著各種界面設計。

2、研究人和界面的關系——交互設計師Interaction Design,簡稱ID，做整個項目的交互和流程。

3、研究用戶體驗——用戶體驗設計師User Experience，簡稱UE，主要是通過各種方法去了解用戶現在需要什么樣的體驗什么樣的界面，從而對這個項目的總體性體驗做決策。

UI設計是屏幕產品的重要組成部分。界面設計是一個復雜的由不同學科參與的工程，認知心理學、設計學、語言學等在此都扮演著重要的角色。用戶界面設計的三大原則是： 1.置界面于用戶的控制之下； 2.減少用戶的記憶負擔；

江西新華電腦學院

3.保持界面的一致性； 即要符合用戶的心智模型。

所以一個優秀的UI設計師，從技能上講，不僅能畫圖標，還能做好界面，會很多交互知識。

好的UI設計不僅是讓軟件變得有個性有品味，還要讓軟件的操作變得舒適、簡單、自由、充分體現軟件的定位和特點。

圖標，界面，交互知識都是需要長期的經驗積累，所以UI這條路很長，要學的技能很多，大家加油吧！

三、UI設計師工作中都做些什么工作？ 1.視覺設計（GUI）

界面設計并標注尺寸（設計規范）； 圖片資源導出給程序員（切圖）； 啟動圖標設計；

制作海報、商品圖、活動頁面等圖片資源； 提交到各大平臺的推廣圖。2.交互設計（ID）需求分析；

理清操作流程（流程圖、線框圖）；

負責項目中各種交互元素的設計（交互文檔、界面跳轉、圖標、按鈕、動效）； 優化頁面，使用戶操作更人性化。3.用戶體驗設計（UE）測試軟件功能、界面美觀； 搜集用戶反饋，提供優化意見； 參與到產品迭代過程中。

大部分公司招UI需求上包含以上所有內容。大點的公司會細化以上職責。所以一個好的UI設計師需要學習的知識是巨大的。

四、UI設計師工作流程是什么？ 1.需求分析階段

此階段，遵循3w原則（who目標人群、where使用場景、why解決什么問題），梳理產品需求，分析相關競品，確定功能模塊。輸出：需求文檔。2.視覺概念設計階段

江西新華電腦學院

在確定產品需求后，交互設計尚未完成前，由GUI主導，根據需求文檔及競品分析后作出的只關注產品視覺主要特征的設計工作。輸出：視覺概念方案2套備選。3.視覺詳細設計階段

通過視覺概念設計確定產品界面視覺效果，并根據交互設計確定產品每個界面具體的布局以及內容后，便進入到視覺界面詳細設計階段。此階段需要輸出所有典型界面的效果圖（高保真原型），控件的所有不同狀態效果圖。輸出：設計方案效果圖。4.設計評審階段

設計師在發起評審前需先在線下與其主管溝通并確認參與評審作品的質量，確保用于評審的作品無重大紕漏再發起評審。評審的意義在于獲得不同領域反饋，檢查設計是否存在偏離，是否存在對產品有害的部分，并誘發設計師潛力。輸出：演示文檔。5.標注、切圖、命名規則

通過評審對視覺設計定版后，需要為開發提供程序使用的圖像資源，開發必需以此為依據完成頁面開發。

輸出：切圖包，內含圖片資源（注意命名規則）、界面原圖、界面標注圖、規范文檔。6.視覺測試階段

將圖片資源及規范發給開發后，設計師需要根據設計圖判斷開發實現的界面是否符合設計方案，并在開發工程師在界面構建過程中遇到問題時給予所需的解決方案。

輸出：新修改的圖片資源、新的規范、測試報告。7.開發完成、投入使用

制作各平臺宣傳圖片資源，參與產品體驗測試，搜集用戶意見，為產品迭代確定方向。

輸出：圖片資源、測試報告。

江西新華電腦學院