UI(User Interface)即用戶界面
人機交互設計,不僅指用戶和界面,還包括用戶和界面之間的關系。具體指人機交互、操作邏輯、界面美觀的整體設計,好的UI不僅是讓軟件變得有個性有品味,還要讓軟件的操作變得舒適、簡單、自由、充分體現(xiàn)軟件的定位和特點。
UI有三個方面: 圖形用戶界面GUI(Graphic User Interface)
用戶研究(User Experience)
交互設計師(Interaction Designer)
UED是以用戶為中心的一種設計手段,以用戶需求為目標而進行的設計。UED團隊包括:交互設計師(Interaction Designer)、視覺設計師(Vision Designer)、用戶體驗設計師(User Experience Design)、用戶界面設計師(User Interface Design)和前端開發(fā)工程師(Web Developer)等。設計過程注重以用戶為中心,用戶體驗的概念從開發(fā)的最早期就開始進入整個流程,并貫穿始終。
UI設計原則:
1.清晰度是首要工作 要想你設計的界面有效并被人喜歡,首先必須讓用戶能夠識別出它?讓用戶知道怎么使用它?比如當用戶使用時,能夠預料到發(fā)生什么,并成功的與它交互。
2.讓界面處在用戶的掌控之中 保證界面處在用戶的掌控之中,讓用戶自己決定系統(tǒng)狀態(tài),稍加引導,我想你會達到你希望的目標。
3.直接操作的感覺是最好的 理想情況下,界面設計要簡潔,讓用戶有一個直接操作的感覺。
4.每個屏幕需要一個主題 我們設計的每一個畫面都應該有單一的主題,這樣不僅能夠讓用戶使用到它真正的價值,也使得容易上手用起來也更方便,在必要的時候更容易進行修改,這也是界面存在的理由。
5.勿讓次要動作喧賓奪主 每個屏幕包含一個主要動作的同時,可以有多個次要動作,但盡量不要讓它們喧賓奪主!所以在設計界面的時候,盡量減弱次要動作的視覺沖擊力,或者在主要動作完成之后再顯示出來。
6.自然過渡 界面的交互都是環(huán)環(huán)相扣的,所以設計時,要深思熟慮地考慮到交互的下一步??紤]到下一步的交互是怎樣的,并且通過設計將其實現(xiàn)。當用戶已經完成該做的步驟,不要讓他們不知所措,給他們自然而然繼續(xù)下去的方法,以達成目標。
7.外觀追隨功能 人總是對符合期望的行為最感舒適。當其他人、動物、事物或者軟件的行為始終符合我們的期望時,我們會感到與之關系良好。這也是與人打交道的設計應該做到的。在實踐中,這意味著用戶只要看一眼就可以知道接下來將會有什么的動作發(fā)生,如果它看上去像個按鈕,那么它就應該具備按鈕的功能。
8.恰當?shù)慕M織視覺元素,減輕用戶的認知負荷 恰當?shù)亟M織視覺元素能夠化繁為簡,幫助他人更加快速簡單地理解你的表達,比如內容上的包含關系。用方位和方向上的組織可以自然地表現(xiàn)元素間的關系。他們不必再琢磨元素間的關系,因為你已經表現(xiàn)出來了。不要迫使用戶做出分辨,而是設計者用組織表現(xiàn)出來。
9.色彩不是決定性的因素 設計的時候不要將色彩視為決定性因素。色彩可以醒目,作為引導,但不應該是做區(qū)別的唯一元素。在長篇閱讀或者長時間面對電腦屏幕的情況下,除了要強調的內容,應采用相對暗淡或柔和的背景色。
10.內嵌“幫助”選項 在理想的用戶界面,“幫助”選項是不必要出現(xiàn)的,因為用戶界面能夠有效地指引用戶學習。類似“下一步”實際上就是在上下文情境中內嵌的“幫助”,并且只在用戶需要的時候出現(xiàn)在適當?shù)奈恢?,其他時候都是隱藏的。
11.針對現(xiàn)有問題去完善界面 人們總是尋求各種方案去解決已經存在的問題,而不是潛在的或者未來的問題。一旦你的用戶界面愈加完善,會有更多的用戶愿意使用你的界面。
12.優(yōu)秀的設計是無形的 優(yōu)秀的設計通常會被它的用戶所忽略。其中的一個原因是這個設計非常成功,以至于它的用戶專注于完成自己的目標而忽略了自己面對的界面,用戶順利達成自己的目標后,他們會很滿意地退出界面。但是作為設計師,這可能會有點不公平,當我們的設計很優(yōu)秀的時候,我們不會受到很多阿諛奉承。當然,優(yōu)秀的設計師不會去介意這些,因為他們心里明白,滿意的用戶往往都是沉默的。
13.多領域學習,借鑒其他學科 視覺、平面設計、排版、文案、信息結構以及可視化,所有的這些知識領域都應該是界面設計應該包含的內容,設計師對這些知識都應該有所涉獵或者比較專長。設計師的眼光要長遠,要能從看似無關的學科中學習,比如出版、編程、裝訂、滑板、消防甚至空手道。
14.界面的存在必須有所用途 在大多數(shù)設計領域,界面設計成功的要素就是有用戶使用它。打個比方,一把漂亮的椅子,雖然精美但坐著不舒服,那么用戶不會選擇使用它,它也就是失敗的設計。界面設計僅僅能夠滿足其設計者的虛榮心是不夠的:它必須要有用!
總結:始終以用戶體驗為中心。界面設計不是獨立的,是產品經理、交互設計、開發(fā)共同討論的結果。
有這么一種說法:UI有別與平面設計,平面是UI的一小部分,平面設計一般是實物產品,采用的是cmyk色彩模式,設計上給人驚艷、驚奇的感覺。而UI是無形的產品,用于電腦、手機等,采用rgb模式,更多的是追求不被察覺,形式依從于內容,清晰,依從,有層次。畢竟我們的互聯(lián)網產品不只是給你看的,是給人用的。
視覺、交互都是服務于用戶體驗,首先是好用、易用然后是美觀,解決問題是首要的,用戶同樣可以引導產品的方向。
小小的改動,只要符合用戶的想法,可大大提升點擊率。
當你關注用戶時,他們會告訴你如何使產品更好。
草圖勾勒出你的想法,多溝通,勝過埋頭苦干。
工作流程:
1、產品定位和市場分析 市場定位、產品定義、用戶群體、運營方式等。
2、用戶研究和分析 分析用戶的使用使用特征、情感、習慣、心里需求等,提出用戶研究報告和可用性建議。
3、架構設計 界面交互和流程設計,根據(jù)可用性分析結果制定交互方式、操作和跳轉流程、結構、布局、信息和其他元素等。目錄體系的邏輯分類和詞語定義是用戶易于理解和操作的前提,
4、交互設計 目的是讓用戶簡單實用,手繪或者axcure制作原型圖,最好是可以跳轉的加上交互說明。
5、界面設計 在架構設計和原型圖基礎上,參照用戶群的心理模型和任務達成進行視覺設計。色調、界面布局、風格、圖標等是這個階段的關鍵。
6、界面輸出(切圖) 配合開發(fā)人員做好設計的實現(xiàn)。
7、完善工作 這個階段是很多部門共同參與的,包括可用性的循環(huán)研究,用戶體驗回饋、測試回饋,同時,UI也應該把一些可行性建議進行完善。
總結:UI設計師如何與團隊各部門配合,并發(fā)揮應有的作用非常重要,一名合格的UI設計師應該貫穿整個流程,而非單純的圖形界面設計。
沒有什么工具是固定或必須采用的,只有當你不為選擇什么工具而發(fā)愁的時候,你才能把精力集中在產品上。
團隊協(xié)作能夠營造一個良好的氛圍,使產品的設計過程更加容易,敞開心扉,采納別人的創(chuàng)意過程,經驗、直覺。
設計互聯(lián)網產品與制造實物產品之間存在很大差別,因為互聯(lián)網產品是基于軟件基礎的數(shù)字化產品,它是動態(tài)的、可變的,互聯(lián)網產品永遠沒有終點。
第一階段:a、有一個想法
b、通過低保真分享這個想法
c、啟動開發(fā),先有個功能模型嘗試使用
d、UI設計,美觀易用
第二階段:a、再次分享,思考從設計角度看起來真實
b、改進
c、在功能和數(shù)據(jù)上調整和核驗
d、分享該產品
e、測試
網站目標/用戶需求——功能/內容需要——交互信息架構——界面設計/導航設計——視覺設計/內容優(yōu)化
之所以我們現(xiàn)在頁面感覺這么雜亂無章,就是沒有一個統(tǒng)一的規(guī)劃設計、視覺規(guī)范,都是零零散散的增加。
BS視覺設計
界面美觀、操作易用性、維護成本低是評價 B/S 系統(tǒng)的關鍵。
通用原則:
1、需求導向原則 界面設計要一切以滿足需求為第一準則。
2、易用性原則 用戶不用查閱幫助,就知道界面的功能,進行相關的操作。
3、合理性原則 盡量在界面的對角線及其左上角四分之一處放置用戶關心的操作和界面元素。
4、協(xié)調性原則 長寬接近黃金比例,布局合理,不易過于密集,或空曠,合理利用空間。
5、容錯性原則 對用戶的某些操作可能發(fā)生的嚴重后果有相應的提醒或補救措施,或回到原來的正確狀態(tài)。
6、一致性原則 保持統(tǒng)一的界面操作方式、色彩、布局等方面的一致性,減少用戶的記憶負擔。
7、用最少的操作步驟實現(xiàn)目標功能 鼠標移動距離最短為原則,相同或相近的功能菜單放在同一位置。
界面用色規(guī)范:
1、設計要符合公司的經營理念,VI規(guī)范,
2、對于用戶長時間使用的系統(tǒng),切記 顏色過于花哨艷麗,致使用戶易產生視覺疲勞,妨礙視覺交互。
3、用戶界面風格要保持一致,同一功能或者類型的字體要一致。
總結起來:
產品制作人,寫產品計劃書;
用戶體驗研究員,做調查分析;
信息架構師,設計產品架構;
交互設計師,做交互文檔(原型圖)
視覺設計師,頁面設覺設計;
前端工程師,前端開發(fā)。
填寫下面表單即可預約申請免費試聽!怕錢不夠?可先就業(yè)掙錢后再付學費! 怕學不會?助教全程陪讀,隨時解惑!擔心就業(yè)?一地學習,可推薦就業(yè)!
?2007-2022/ mwtacok.cn 北京漫動者數(shù)字科技有限公司 備案號: 京ICP備12034770號 監(jiān)督電話:010-53672995 郵箱:bjaaa@aaaedu.cc