UIUser

interfacedesign不是浮云ZacDingUI概念導入UI設計層次UI設計流程設計原則與規范市場現狀分析品牌目標UI的概念導入UI是什么UI的發展歷程UI設計的內涵UI是什么UI的本意是用戶界面，是英文user和interface的縮寫。從字面上看是用戶與界面2個組成部分，但實際上還包括用戶與界面之間的交互關系。UI的發展歷程在西方，UI行業的興起要歸功于以計算機為主的高科技迅速發展，尤其是視窗操作系統的普及，然而廣義的UI概念在十七世紀的工業革命階段就已經開始，只不過，把易用性帶入機械的設計還是一種無意識的舉動，再加上當時幾乎所有的工業程序都是由熟練工人一手操辦，就更加減弱了易用性設計的能見度。當大型計算機剛剛研制出來的時候，可能因為為當初的使用者本身就是該行業的專家，沒有人去關注使用者的感覺；相反，一切都圍繞機器的需要來組織，程序員通過打孔卡片來輸入機器語言，輸出結果也是機器語言，那個時候同計算機交互的重心是機器本身。當計算機系統的用戶越來越由普通大眾組成的時候，對交互體驗的關注也越來越迫切了。UI設計的內涵UI設計的重要性UI設計的用戶UI設計好壞的判斷UI設計的內涵其實UI設計就像工業產品中的工業造型設計一樣，是產品的重要買點。一個友好美觀的界面會給用戶帶來舒適的視覺享受，拉近人與設備的距離，為商家創造賣點。UI設計的核心：交互設計，是一種如何讓產品易用，有效而讓人愉悅的技術，它致力于了解目標用戶和他們的期望，了解用戶在同產品交互時彼此的行為，了解“人”本身的心理和行為特點，同時，還包括了解各種有效的交互方式，并對它們進行增強和擴充。交互設計還涉及到多個學科，以及和多領域多背景人員的溝通。人機交互科學是跨學科的科學，包括了計算機科學，心理學，社會學，人類學，以及工業設計。UI設計的內涵UI設計的重要性UI設計的用戶UI設計好壞的判斷UI設計的重要性UI設計所倡導的是可用，易用，及舒適的人機互動體驗，這對使用者來說是一個長期的感知過程，它不會像產品的其他外在因素一樣馬上被用戶發現，但如果商家忽略UI設計,那將使產品冠上消極的印象并在長時間內很難消除。UI設計的優勢在產品競爭中扮演的重要角色是無庸置疑的，但是，這種優勢實現和意識都是長期性的，而非短期行為。他意味著需要相當長的時間讓客戶了解到，但是一旦形成此種心理上的優勢，就會在很長的時間內存在，會將易用的心理暗示代入整個產品的后續開發甚至整個品牌。UI設計的內涵UI設計的重要性UI設計的用戶UI設計好壞的判斷UI設計的用戶我們可將用戶大致分為兩種：以過程為主的用戶(processorientedenduser)，以結果為主的用戶(resultorientedenduser)。過程為主的用戶的典型例子是電玩族，他們追求的終級目標就是視覺聽覺的沖擊和享受，最終游戲的結果反而變得不是那么重要了。此類設計對視覺和創意的要求是極為挑剔的，與結果為主的用戶設計相比，它的市場和受眾都要小的多。結果為主的用戶不在乎用什么樣的方式完成任務，但是任務必須以最短的時間，以最簡潔的方式，最精確的運算結果來完成。這些用戶通常是工業化軟件的受眾，工作環境以大型企業為主，軟件最終運算結果對于企業的運行和管理有著重大的意義，稍有偏差，可能會對企業產生重大損失。對于此類用戶的產品設計人員來講，絕大部分部分時間可能用在設計任務的邏輯流程(logicaltaskflow),以期最大幅度的符合人腦的思考方式和認知過程(cognitiveprocess)。UI設計的內涵UI設計的重要性UI設計的用戶UI設計好壞的判斷UI設計好壞的判斷UI設計的好壞，必須設定一個任務，從頭至尾使用一遍才能知道。UI的概念是動態的過程，是邏輯的推理，也是各種狀況的預測。如果衡量UI設計只有一種標準，那就是用戶體驗(UserExperience).用戶體驗是以用戶為中心的設計(UCD/UserCenteredDesign)中最重要的一個部分,強調的是過程，是軟件對用戶行為(UserAction)產生的反應與用戶期待值的誤差測試，也就是說，這種誤差越小，也就越符合以用戶為中心的設計原則。UI設計的層次用戶研究/結構設計交互設計視覺設計用戶研究要進行界面開發設計，用戶分析是第一步。我們必須了解各類用戶的習性，技能、知識和經驗，任何一個元素改變結果都會有相應的改變。需求階段同類競爭產品我們必須了解。同類產品比我們提前問世，我們要做得更好才有存在的價值。單純的界面美學考慮好壞不會客觀的評價標準，合適于我們最終用戶的就是最好的。用戶研究/結構設計什么人用什么地方用如何用做什么用用戶研究whowhereWhenwhy年齡性別愛好收入教育公司家庭戶外公共區學校鼠標鍵盤遙控觸摸聲控溝通管理設計娛樂辦公結構設計結構設計也稱概念設計ConceptualDesign結構設計建立在用戶研究的基礎上，是界面設計的骨架。UI的結構設計將直接影響到后期產品的軟件集成、硬件配置、外觀造型設計等諸多因素。UI的結構設計構筑了產品設計的基礎。如只有首先確定了手機菜單的結構交互形式，才能在造型設計上決定是采用五項鍵或上下鍵。

交互設計交互設計InteractiveDesign交互設計的目的是使產品讓用戶能簡單使用。任何產品功能的實現都是通過人和機器的交互來完成的。人的因素應作為設計的核心被體現出來。人和機器的互動過程（HumanMachineInteraction）中，有一個層面，即我們所說的界面（interface）。HumanMachineInteractionInterface情感感覺觸覺聽覺視覺界面設計界面設計Interface界面可分為感覺和情感兩個層次。用戶界面設計是屏幕產品的重要組成部分。界面設計是人與機器之間傳遞和交換信息的媒介，包括硬件界面和軟件界面，是計算機科學與心理學、設計藝術學、認知科學和人機工程學的交叉研究領域。近年來，隨著信息技術與計算機技術的迅速發展，網絡技術的突飛猛進，人機界面設計和開發已成為國際計算機界和設計界最為活躍的研究方向置界面于用戶的控制之下減少用戶的記憶負擔保持界面的一致性1984“交互設計”作為一門新學科由比爾?莫格里奇（IDEO的一位創始人）提出。交互設計原則01)有清楚的錯誤提示。誤操作后，系統提供有針對性的提示。

02)讓用戶控制界面。“下一步”、“完成”，面對不同層次提供多種選擇，給不同層次的用戶提供多種可能性。03)提供多種可能性。允許兼用鼠標和鍵盤。同一種功能，同時可以用鼠標和鍵盤。

04)允許工作中斷。例如用手機寫新短信的時候，收到短信或電話，完成后回來仍能夠找到剛才正寫的新短信。05)使用用戶的語言。而非技術的語言。

06)提供快速反饋。給用戶心理上的暗示，避免用戶焦急。

07)方便退出。如手機的退出，是按一個鍵完全退出，還是一層一層的退出。提供兩種可能性。08)導航功能。隨時轉移功能，很容易從一個功能跳到另外一個功能。

09)讓用戶知道自己當前的位置。使其做出下一步行動的決定。初級階段目標使操作更簡便、快捷、有效、易學、安全、高效、好記、少錯。01)簡易性。界面的簡潔是要讓用戶便于使用、便于了解、并能減少用戶發生錯誤選擇的可能性。02)用戶語言。界面中要使用能反應用戶本身的語言，而不是游戲設計者的語言。03)記憶負擔最小化。人腦不是電腦，在設計界面時必須要考慮人類大腦處理信息的限度。人類的短期記憶極不穩定、有限，24小時內存在25％的遺忘率。所以對用戶來說，瀏覽信息要比記憶更容易。04)一致性。是每一個優秀界面都具備的特點。界面的結構必須清晰且一致，風格必須與游戲內容相一致。

05)清楚。在視覺效果上便于理解和使用。06)用戶的熟悉程度。用戶可通過已掌握的知識來使用界面，但不應超出一般常識。07)從用戶的觀點考慮。想用戶所想，做用戶所做。用戶總是按照他們自己的方法理解和使用。通過比較兩個不同世界(真實與虛擬)的事物，完成更好的設計。如：書籍對比竹簡。08)排列。一個有序的界面能讓用戶輕松的使用。09)安全性。用戶能自由的作出選擇，且所有選擇都是可逆的。在用戶作出危險的選擇時有信息介入系統的提示。10)靈活性。簡單來說就是要讓用戶方便的使用，但不同于上述。即互動多重性，不局限于單一的工具(包括鼠標、鍵盤或手柄)。11)人性化。高效率和用戶滿意度是人性化的體現。應具備專家級和初級玩家系統，即用戶可依據自己的習慣定制界面，并能保存設置。界面設計原則視覺設計視覺設計VisualDesign在結構設計的基礎上，參照目標群體的心理模型和任務達成進行視覺設計。包括色彩、字體、頁面、排版、動畫等。視覺設計要達到用戶愉悅使用的目的。視覺設計原則視覺設計的原則：01）界面清晰明了。允許用戶定制界面。02）減少短期記憶的負擔。讓計算機幫助記憶，例：UserName,、Password、IE進入界面地址可以讓機器記住。

03）依賴認知而非記憶。如打印圖標的記憶、下拉菜單列表中的選擇04）提供視覺線索。圖形符號的視覺的刺激；GUI（圖形界面設計）：Where,What,NextStep

05）提供默認（default）、撤銷（undo）、恢復（redo）的功能06）提供界面的快捷方式07）盡量使用真實世界的比喻。如：電話、打印機的圖標設計，尊重用戶以往的使用經驗。08）完善視覺的清晰度。條理清晰；圖片、文字的布局和隱喻不要讓用戶去猜。

09）界面的協調一致。如手機界面按鈕排放，左鍵肯定；右鍵否定；或按內容擺放。10）同樣功能用同樣的圖形。11）色彩與內容。整體軟件不超過5個色系，盡量少用紅色、綠色。近似的顏色表示近似的意思。經過上面設計過程的描述，大家可以清楚的發現，UI設計是一個非常科學的推導公式，他有設計師對藝術的理解感悟，但絕對不是僅僅表現設計師個人的繪畫。所以我們一再強調這個工作過程是設計過程，但更是一個科學的推演過程。第一階段：基礎調研競爭產品分析尋找市場上的競爭產品，挑選3-5款進行解剖分析。整理競爭產品的功能規格；并分析規格代表的需求，需求背后的用戶和用戶目標；分析競爭產品的功能結構和交互設計，從產品設計的角度解釋其優點、缺點及其原因，成為我們產品設計的第一手參考資料。領域調研結合上述分析基礎和資料，縱觀領域競爭格局、市場狀況，利用網絡論壇、關鍵字搜索等手段獲得更多用戶反饋、觀點、前瞻性需求。產出物相應的對比分析文檔和領域調研報告開發流程競爭產品分析領域調研產出物新產品開發任務第二階段：產品分析產品定位從軟件提供者的角度分析產品推出的意義和重點關注的方面，實際考量、豐滿決策層的idea，明確列出產品定位，通過討論修繕取得決策層的認可；用戶分析

結合競爭產品的分析資料，采用定性分析的方法，獲得對產品目標用戶在概念層面的認識；產品概述

以軟件提供的身份，以最簡短的文字，向用戶介紹產品，突出產品對用戶的價值。避免功能點的簡單羅列，而應該在歸納總結的基礎上突出重點；功能需求規格整理

在歸納關鍵功能的基礎上，結合競爭產品規格整理的領域認識，從邏輯上梳理需求規格列表，重在邏輯關系清楚、組織和層級關系清晰。劃定項目（設計和研發）范圍；產出物

用戶分析文檔和產品概述、功能規格列表開發流程產品定位用戶分析產品概述功能需求規格整理產出物第一次Check是/否通過？第三階段：交互設計（功能結構和交互流程設計）產品概念模型分析從產品功能邏輯入手，結合對常見軟件的經驗積累和競爭產品的認識，加上對用戶的理解，為產品設計一個盡量接近用戶對產品運行方式理解的概念模型，成為產品設計的基礎框架；功能結構圖在產品概念模型的基礎上豐富交互組件，并理順交互組件之間的結構關系；使用場景分析模擬典型用戶執行關鍵功能達到其目標的使用場景；交互流程分析模擬在上述概念模型和功能結構決定的產品框架之中，支持使用場景的關鍵操作過程（即鼠標點擊步驟和屏幕引導路徑）；產出物

產品設計文檔的交互設計部分開發流程概念模型分析功能結構圖使用場景分析交互流程分析產出物第一次Check是/否通過？第四階段：原型設計（信息架構和界面原型設計）信息架構和界面原型設計設計產品界面中應該包含的控件數量和類型、控件之間的邏輯和組織關系，以支持用戶對控件或控件組所代表的功能的理解，對用戶操作的明確引導；所有界面設計成為一套完整的可模擬的產品原型；設計要點說明

對界面設計的重點添加說明，幫助涉眾對設計的理解；

產出物

產品設計文檔的原型設計部分開發流程信息架構和界面原型要點說明產出物第一次Check是/否通過？第五階段：詳細設計（詳細設計和偽代碼編寫）詳細設計完善設計細節、交互文本和信息設計（Messagebox）；設計和邏輯說明

對界面控件/控件組/窗口的屬性和行為進行標準化定義，梳理完整的交互邏輯，用狀態遷移圖或偽代碼形式表示；產出物產品設計文檔的詳細設計部分開發流程詳細設計設計和邏輯說明產出物第四次Check是/否通過？第六階段：設計維護（研發跟蹤和設計維護）語言文檔整理設計通過評審之后，把產品中所有的交互文本整理成excel文檔，預備研發工作；研發跟蹤維護

進入研發階段后負責為研發工程師解釋設計方案、問題修改、文檔完善、Bug跟蹤等；

產出物

產品語言文檔，設計調整維護開發流程完成設計進入設計維護End競爭產品分析領域調研產出物新產品開發任務產品定位用戶分析產品概述功能需求規格整理產出物Check是/否通過？概念模型分析功能結構圖使用場景分析交互流程分析產出物Check是/否通過？信息架構和界面原型要點說明產出物Check是/否通過？詳細設計設計和邏輯說明產出物Check是/否通過？完成設計進入設計維護EndBASICRESEARCHPRODUCTANALYSEINTERACTIONDESIGNPROTOTYPEDESIGNDETAILEDDESIGNUSER職能主導關系功能需求結構設計交互設計視覺設計DEMOUI設計（交互/視覺/編碼）實現PMORTEAMLEADER軟件工程師用戶體驗UserExperience戰略層：目標和用戶需求范圍層：功能規格和內容需求結構層：交互設計與信息架構框架層：界面設計、導航設計和信息設計表現層：視覺設計無論是控件使用，提示信息措辭，還是顏色、窗口布局風格，遵循統一的標準，做到真正的一致。做法：項目組有經驗人士，確立UI規范：美工提供色調配色方案，提供整體配色表界面控制程序人員、用戶體驗人員提出合理統一使用的控件庫。參考標準界面使用規范：控件功能遵循行業標準，windows平臺參見《Microsoft用戶體驗》控件樣式在允許的范圍內可以統一修改其樣式、色調參考其他軟件先進操作，提取對本項目有用的功能，以使用，絕對不能盲從，漫無目的。根據需要，設計特殊操作控件，準則為：簡化操作、達到一定功能目的界面實施人員與美工商榷控件可實現性,(如不實行此步驟，將會導致各自對對方工作不滿意，也會產生不一致的混亂)。重復疊代上述工作。建立合理化文檔《UI標準》描述上述規范，強行界面設計者理解之，并作為開發準則，SQA人員進行監控開發人員是否遵循，及時告誡開發人員。用戶體驗原則規范基本原則1：統一色調，針對軟件類型以及用戶工作環境選擇恰當色調：如：安全軟件，根據工業標準，可以選取黃色，綠色體現環保，藍色表現時尚、紫色表現浪漫等等，淡色可以使人舒適，暗色做背景使人不覺得累等2：如果沒有自己的系列界面，采用標準界面則可以少考慮此方面，做到與操作系統統一，讀取系統標準色表3：色盲、色弱用戶，即使使用了特殊顏色表示重點或者特別的東西，也應該使用特殊指示符，?quot;!，?著重號，以及圖標等4：顏色方案也需要測試，常常由于顯示器、顯卡的問題，色彩表現每臺機器都不一樣，應該經過嚴格測試，不同機器進行顏色測試5：遵循對比原則：在淺色背景上使用深色文字，深色背景上使用淺色文字，藍色文字以白色背景容易識別，而在紅色背景則不易分辨，原因是紅色和藍色沒有足夠反差，而藍色和白色反差很大。除非特殊場合，杜絕使用對比強烈，讓人產生憎惡感的顏色。6：整個界面色彩盡量少的使用類別不同的顏色itop色表具體標準參考美術學統計學術標準。色表的建設，對于美工在圖案設計、包裝設計上起著標準參考作用，對于程序界面設計人員設計控件、窗體調色起到有章可循的作用。用戶體驗原則規范顏色使用一個多姿多彩的人機交互界面，少不了精美的圖標、圖片、動畫、底圖等。1：也需要遵循統一的規則，包括上述顏色表的建立，圖標的建立步驟也應該盡可能的形成標準，參考itop的outlookbar圖標設計標準2：有標準的圖標風格設計，有統一的構圖布局，有統一的色調、對比度、色階，以及圖片風格3：底圖應該融于底圖，使用淺色,低對比，盡量少的使用顏色。4：圖標、圖像應該很清晰的表達出意思，遵循常用標準，或者用戶機器容易聯想的到物件，絕對不允許畫出莫名奇妙的圖案。5：鼠標光標樣式統一，盡量使用系統標準，杜絕出現重復的情況，例如某些軟件中一個手的形狀就有4鐘不同的樣子。用戶體驗原則規范資源運用使用統一字體(Font)，字體標準的選擇依據操作系統類型決定。中文采用標準字體，“宋體”，英文采用標準MicrosoftSansSerif不考慮特殊字體(隸書、草書等,特殊情況可以使用圖片取代),保證每個用戶使用起來顯示都很正常。字體大小根據系統標準字體來，例如MSS字體8磅，宋體的小五號字(9磅）五號字（10.5磅)。所有控件盡量使用大小統一的字體屬性，除了特殊提示信息、加強顯示等例外情況ITop采用BCB，所有控件默認使用parentfont，不允許修改，這樣有利于統一調整。系統大小字體屬性改變的處理。Windows系統有個桌面設置，設置大字體屬性，很多界面設計者常常為這個惱火，如果設計時遵循微軟的標準，全部使用相對大小作為控件的大小設置，當切換大小字體的時候，相對不會有什么特殊問題。但是由于常常方便使用點陣作為窗口設計單位，導致改變大字體后，出現版面混亂的問題。這個情況下，應該做相應處理：1：寫程序自動調節大小，點陣值乘以一個相應比例2：全部采用點陣作為單位，不理會系統字體的調節，這樣可以減少調節大字體帶來的麻煩。BCB/DELPHI中多采用這種方法，但是必然結果是和系統不統一。用戶體驗原則規范字體標準提示信息、幫助文檔文字表達(Text)遵循以下準則：1：口語化、客氣、多用您、請，不要用或少用專業術語，杜絕錯別字2：斷句逗號句號頓號分號的用法，提示信息比較多的話，應該分段，3：警告、信息、錯誤使用對應的表示方法4：使用統一的語言描述，例如一個關閉功能按鈕，可以描述為退出、返回、關閉，則應該統一規定。5:根據用戶不同采用相應的詞語語氣語調，如專用軟件，可以出現很多專業屬于，用戶為兒童：這可以語氣親切和藹，老年用戶則應該成熟穩重。制定標準遵循之。用戶體驗原則規范文字表達控件風格(STYLE)不要使用錯誤控件，控件功能要專一要設計好的同一風格的控件，如果沒有能力設計出一套控件，則使用標準控件，絕對不能不倫不類，雜亂無章用戶體驗原則規范控件風格可理解軟件要為用戶使用，用戶必須可以理解軟件各元素對應的功能。如果不能為用戶理解，那么需要提供一種非破壞性的途徑，使得用戶可以通過對該元素的操作，理解其對應的功能。例如：刪除操作元素。用戶可以點擊刪除操作按鈕，提示用戶如何刪除操作或者是否確認刪除操作，用戶可以更加詳細的理解該元素對應的功能，同時可以取消該操作。可達到用戶是交互的中心，交互元素對應用戶需要的功能。因此交互元素必須可以被用戶控制。用戶可以用諸如鍵盤、鼠標之類的交互設備通過移動和觸發已有的交互元素達到其它在此之前不可見或者不可交互的交互元素。要注意的是交互的次數會影響可達到的效果。當一個功能被深深隱藏（一般來說超過4層）那么用戶達到該元素的幾率就大大降低了。可達到的效果也同界面設計有關。過于復雜的界面會影響可達到的效果。用戶體驗原則規范可用原則易用性原則規范性原則合理性原則美觀性原則協調性原則安全性原則以手機行業為例，當手機剛剛進入市場的時候不但價格貴得驚人，而且除了通話以外沒有什么其他功能。由于當時的主導是技術，所以大家都把精力放在信號、待機時間、壽命等方面，對于產品的造型，使用的合理性很少關心。事過境遷，當技術已經完全的達到用戶的需求，于是商家為了創造賣點，提高爭力，非常重視產品的外觀設計，除此之外還頻頻推出短信，彩屏，和鉉，彩信，攝像頭等等。這樣一來產品的美觀、個性、易用、易學、人性化等等都成了產品的賣點。而時至今日，產品的硬件及技術趨于同質化，導致各手機品牌在成本限制的情況下，手機的硬件及功能之間的差異已非常微弱。各商家也已不再僅僅追求強大的功能，上乘的質量，周密的市場策略，合適的價格定位，甚至是美觀的造型設計，如今精明的商家已將UI設計納入了產品開發的最前端。行業現狀企業戰略市場分析品牌戰略概念設計技術研發產品設計生產制造營銷推廣渠道銷售售后服務概念設計CI/VIID\MDUI\UE品牌戰略產品營銷推廣銷售售后產品設計人機外觀結構模具材料工藝軟件界面交互包裝技術研發IC信號電池原件制式屏顯功能企業戰略產品研發生產品牌銷售人力戰略目標完善企業形象提升品牌形象創意產品形象品牌差異化產品識別性用戶體驗強用戶研究概念設計交互設計界面設計用戶體驗品牌管理產品創新產品評估工作目標由上分析我們不難知道UI在手機產品中的作用，事實上，我們要做的就是堅持一個原則，那就是創新，解放自己的思想，實事求是地來不斷解決產品中的各種問題，以團隊的形式來解決各種問題。在產品前期規劃、市場定位、產品戰略、產品外觀設計概念、外觀設計方案確認、產品推廣、產品包裝、產品廣告、產品說明書、產品售后服務等各個環節中，建立系統的工作機制，以此達到塑造產品產異化、品質感和提升產品附加價值的重要作用！傳統經典千篇一律可更換皮膚習慣的交互設計設計余地有限容易被拷貝體驗感不足識別性不強默認皮膚標準化內置皮膚功能可擴展元素連貫性統一品牌識別強用戶可自定義形式不改變方案框架不受配色表現限制默認皮膚默認皮膚默認皮膚皮膚更換與內置皮膚不沖突用戶個性自定義設計成本低設計效率高搭建皮膚商店增強推廣賣點結合ID提升產品設計感流行風格被模仿和抄襲對硬件要求