2018-7-10 藍(lán)藍(lán)設(shè)計的小編
如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點這里
版權(quán)申明:本文原創(chuàng)作者UI設(shè)計七緊,感謝UI設(shè)計七緊的原創(chuàng)經(jīng)驗分享!致敬哈
本文重點梳理以下七大問題:一、令人眼花繚亂的專業(yè)術(shù)語;二、交互和視覺如何分工;三、工作的流程;四、視覺類UI的自學(xué);五、交互設(shè)計需要掌握的知識;六、今天設(shè)計什么;七、設(shè)計師的薪資
經(jīng)常有人問我新手如何自學(xué)交互設(shè)計,我之前也錄過一個視頻給大家,沒想到放到網(wǎng)上后點擊率很高,看來對新人是的確有幫助的。所以今天再次針對這個問題做闡述,修正了第一版的一些內(nèi)容,也更具有針對性。
以上七點是我歸納的大家在學(xué)習(xí)和工作中經(jīng)常感到困惑的問題,下面就逐一解答。
一、令人眼花繚亂的專業(yè)術(shù)語
專業(yè)術(shù)語這個問題的確令人頭疼,來看看下面的對應(yīng)關(guān)系:
在這四對關(guān)系中,GUI對應(yīng)界面視覺(畫icon,畫視覺效果)、PM對應(yīng)產(chǎn)品經(jīng)理是比較準(zhǔn)確的,但是UI這個詞相對來說就比較混亂了。有人認(rèn)為UI是視覺設(shè)計,有人認(rèn)為UI是交互設(shè)計,這是有一定的歷史原因的。在很多的大公司里,我指的是諸如騰訊、阿里、百度、谷歌這樣的巨頭,它們的UI分工是很明確的,指的就是交互設(shè)計,交互設(shè)計師的主要任務(wù)就是發(fā)掘需求以及根據(jù)需求來進行構(gòu)架。但是在一些小公司里是沒有專門的交互設(shè)計的崗位的,UI設(shè)計師通常既要做交互也要做視覺,這就造成了UI的指向不是很明確。所以有時候很多同學(xué)找我說要學(xué)UI,我其實不太清楚他們到底是想學(xué)視覺還是交互的。
UE這個詞常見于一些大公司,它其實只是為了跟UI有區(qū)分,指的真的就是交互設(shè)計師。但是UE在做交互的同時也多參與一些用戶研究的內(nèi)容,這樣的崗位一般只有規(guī)模比較大的公司才設(shè)置。在很多公司里,發(fā)展到后期你可能既是交互設(shè)計師也是產(chǎn)品經(jīng)理,因為交互設(shè)計師和產(chǎn)品經(jīng)理在前期的工作任務(wù)中,特別是對需求的把控上,有很多是重合的。這就是四個名詞所代表的意思了。
二、交互和視覺如何分工
下面我們再來看看視覺設(shè)計師和交互設(shè)計師工作職責(zé)的差異,下圖形象的展示了兩者不同的任務(wù):
視覺設(shè)計主要包括Logo、界面元素、圖標(biāo)(icon)、色彩與字體、形狀與尺寸以及視覺效果設(shè)計,它的關(guān)注點是“界面”,把界面更好地呈現(xiàn)出來。雖然我在視覺設(shè)計下方標(biāo)注了“關(guān)注美麗”,但這只是區(qū)別于交互設(shè)計來說的,光是“美麗”是不夠的,還要注意信息的可讀性和易讀性。視覺設(shè)計與平面設(shè)計不同,比如說給一個房地產(chǎn)公司做宣傳海報,雇主要求海報視覺上打動人,文案也要有亮點吸引人,這是平面設(shè)計;但是GUI的話,不管是做手機的APP還是WEB也好TV也好,要考慮到每一條信息都是要給用戶讀取的,這就要求視覺要有穩(wěn)定性,不能有些易讀有些難讀。
作為交互設(shè)計師更關(guān)注的是“邏輯”,在做設(shè)計的時候?qū)嶋H上是在建立一種體系。也就是說在設(shè)計產(chǎn)品的時候要考慮出口入口、尋找需要元素、如何操作等等。所以說交互設(shè)計師前期需要進行需求分析,要更好地區(qū)理解和分析用戶的需求,然后要進行信息構(gòu)架,畢竟需求最終要反映在信息構(gòu)架上面。什么是信息構(gòu)架呢?你看我們使用的手機,圖片有自己的固定位置,導(dǎo)航有自己固定的位置,文字、說明也有固定的位置,這些東西就是由信息構(gòu)架來決定的。還要說明的是文案,這也是屬于交互設(shè)計范疇的,因為界面需要設(shè)計一些信息被用戶讀取。
所以說基本上交互是帶著視覺前進的,因為交互要對最終的體驗負(fù)責(zé),而視覺也是體驗的一部分。
三、工作的流程
下面來談?wù)劜煌娜藛T在具體工作中的分工:
先來看產(chǎn)品經(jīng)理,產(chǎn)品經(jīng)理要對項目的最終的結(jié)果負(fù)責(zé)。產(chǎn)品經(jīng)理一般來說要為項目背黑鍋,比如老板要求三個月做出產(chǎn)品并且目標(biāo)用戶達(dá)到十萬,那么這些任務(wù)就落到產(chǎn)品經(jīng)理的身上。
然后產(chǎn)品經(jīng)理對交互設(shè)計師的要求可能就是要保證產(chǎn)品的構(gòu)架清晰,有良好的體驗。那么交互設(shè)計師要根據(jù)這些要求去挖掘其他的需求,然后根據(jù)用戶的反饋或者是迭代的一些東西做一個完美的信息構(gòu)架,把信息先設(shè)計出來。哪塊放導(dǎo)航,哪塊放圖片,哪塊放主體內(nèi)容,到底采用什么樣的結(jié)構(gòu),這些都是要考慮的。
交互設(shè)計進行到0.5版本時,即把產(chǎn)品的大體結(jié)構(gòu)設(shè)計出來后,這時視覺設(shè)計師和開發(fā)人員就可以加入進來了。視覺設(shè)計師開始畫界面,根據(jù)信息把視覺呈現(xiàn)出來,比如重要的信息顏色可能更醒目一點,同時保證視覺流的平衡,總之為最終的“美麗”服務(wù);開發(fā)人員的職責(zé)就是實現(xiàn)效果。進入1.0版本,視覺效果做好后做高保真的迭代呈現(xiàn)給用戶或上級等。這時候測試人員也要跟進了,做一些可用性測試、bug測試以及體驗測試。
我講的比較籠統(tǒng),只是把大致的流程梳理一下,讓大家看到各個角色是怎么分配的,因為考慮到新人講得太細(xì)的話也不一定能夠明白。
四、視覺類UI的自學(xué)
視覺類UI我們稱之為GUI,從軟件篇來看的話,有些培訓(xùn)機構(gòu)是有點坑人的(這里就不點名了),因為大部分公司只要用PS就可以了,即地把圖片畫出來然后切圖。交互設(shè)計師一般用PTT和AXUR來做原型,這三款軟件基本上就可以覆蓋你的職業(yè)生涯了。但是很多培訓(xùn)結(jié)構(gòu)卻讓學(xué)員花費大量的金錢和時間學(xué)習(xí)軟件。剩下的一下軟件像AE/flash屬于錦上添花的技能:AE可以輸出高保真原型動畫,便于展示你的想法;flash可以做高保真的交互動畫。其實這些東西在企業(yè)里是有研發(fā)人員協(xié)助你完成的,所以會更好,不會也無大礙。IOS是有專門的軟件處理高保真原型的,可以現(xiàn)用現(xiàn)學(xué),不太復(fù)雜。
所以總的來說還是要把PS練好。我特別想告誡新人的是:軟件和設(shè)計完全是兩回事,軟件用得熟練不代表設(shè)計做得好,它們只是實現(xiàn)設(shè)計的工具和手段。而設(shè)計的學(xué)習(xí)重在培養(yǎng)思維和視野。
下面簡單介紹一下視覺流行的三種風(fēng)格:
這個是水晶風(fēng)格,由微軟首創(chuàng),現(xiàn)在中國的rigo design也是做的不錯的。水晶風(fēng)格的特點是晶瑩、有玻璃質(zhì)感和光感,rigo design已經(jīng)把水晶風(fēng)格做得很棒了,貼兩張圖看看:
下面來看擬物風(fēng)格:
新手如果想快速學(xué)習(xí)的話可以嘗試臨摹擬物風(fēng)格的作品,這個確實難度是比較大的。蘋果原來就是擬物風(fēng)格的代表。來欣賞一些作品,畫得的確精致:
還有扁平化風(fēng)格的設(shè)計:
以及中國風(fēng)的設(shè)計:
中國風(fēng)的東西盡量還是不要做了,這種風(fēng)格其實只適合比賽。真實的項目里對icon識別度的要求是很高的,中國風(fēng)的設(shè)計識別度太差了。對icon來說,美觀不是第一位的,識別度才是。
零基礎(chǔ)的新人我建議采用這樣的方法來提高自己的視覺設(shè)計能力:先臨摹一個icon,然后根據(jù)這個icon的風(fēng)格設(shè)計其他的icon。臨摹考驗的是你對軟件的熟悉程度以及對細(xì)節(jié)捕捉的能力,而自己模仿設(shè)計才是真正提高設(shè)計能力的。這兩步認(rèn)真走下來基本上可以勝任初級的視覺設(shè)計師了。
icon臨摹完之后可以嘗試畫一些界面,找找界面的感覺。特別是一些跨專業(yè)的新人,通過臨摹找設(shè)計感覺是比較好的方法。
五、交互設(shè)計需要掌握的知識
交互設(shè)計的自學(xué)是非常困難的,最好有人帶,有人點撥。這也是我們集創(chuàng)堂現(xiàn)在主要做的事情,帶一些有經(jīng)驗的設(shè)計師提高交互設(shè)計的能力。如果想自學(xué)的話,一般來講需要培養(yǎng)一下三種能力:
心理學(xué)的能力有助于了解、定位用戶,讓你能更好地在產(chǎn)品的博弈中找準(zhǔn)用戶的的需求,繼而發(fā)掘出更符合用戶內(nèi)心的一種設(shè)計模式,所以心理學(xué)的知識作用還是很大的。
邏輯學(xué)的知識幫助設(shè)計師將找到的用戶需求構(gòu)建出來,形成一種體系,讓產(chǎn)品更好用。做產(chǎn)品需求很強的邏輯性,哪些需求重要哪些不重要、點擊與功能如何對應(yīng)、信息的隸屬關(guān)系都需要厘清。所以邏輯學(xué)知識重在構(gòu)建,視覺設(shè)計的知識與最后產(chǎn)品能夠?qū)崿F(xiàn)的效果相關(guān)。
這是三大能力各自起到的作用,優(yōu)秀的設(shè)計師必須要掌握。當(dāng)然如果提出更高的要求的話,最好再關(guān)注一下商業(yè)的知識。
想自學(xué)的話可以看看以上推薦的書,大家可以去看之前發(fā)的《交互設(shè)計師自學(xué)書籍推薦》,這里就不細(xì)說了。
總的來說,交互設(shè)計的自學(xué)還是比較辛苦的,視覺設(shè)計通過臨摹等方法提高還是顯著的,但是交互設(shè)計還是需要人指點的。
六、今天設(shè)計什么
說句恐怖的話,目前90%的設(shè)計師是不合格的。我看到很多人在論壇、貼吧里討論的還是怎么設(shè)計界面之類的,這樣的關(guān)注點是不對的。
關(guān)于UI的前途,我們可以看到今天的手機、PAD、電腦、智能手表等都是通過UI來控制的,UI成為人和今天的大數(shù)據(jù)信息的唯一接口,所以發(fā)展?jié)摿Ψ浅>薮蟆?
在未來,像無人拍攝飛機、家庭只能電器、大型工作輔助設(shè)備等都是通過UI控制的,UI依舊是人和數(shù)據(jù)的接口,UI設(shè)計的需求量巨大。我們之前的社會是人和人交往的社會,慢慢將過渡到人和數(shù)據(jù)的社會,實際上人和數(shù)據(jù)的接口就是UI。
很遺憾,我說過90%的設(shè)計師都不合格,他們的關(guān)注點依然是界面好不好看,即“美”的問題。今天來說,“信息”才是首位的,來看幾個例子:
來看今天我們用得很多的三款A(yù)PP:微信、淘寶、58同城,如果單純從審美的角度來看,它們的設(shè)計并不完美,但實際上幾乎每個人都在使用它們。根本原因這些APP能夠提供我們需要的信息。
七、設(shè)計師的薪資
相信這個問題是大家比較感興趣的,我大致梳理一下不同薪資水平對設(shè)計師能力的要求。年6萬以下的設(shè)計師其實就是美工,工作多是畫畫cicon、改改圖片,基本只對視覺效果負(fù)責(zé),這種類型的員工完全還沒有走進交互設(shè)計和信息設(shè)計的門檻;6萬-12萬年薪的我們稱之為初級交互設(shè)計師,初步具備了根據(jù)需求來進行構(gòu)架的能力,參與分析競品、定位人群,同時也參與一些GUI的工作;12萬-24萬年薪的算是中級的UI設(shè)計師了,需要懂得在前期的時候挖掘用戶的需求,根據(jù)需求進行構(gòu)架,有能力精細(xì)地把控產(chǎn)品(包括文案、顏色等);20萬-40萬的屬于資深設(shè)計師,需要了解相關(guān)類型的競品,知道自己產(chǎn)品的特點和命門,能夠協(xié)調(diào)運營和研發(fā)資源,了解產(chǎn)品的商業(yè)目的,能夠很好地完成交互設(shè)計的布局等??紤]的層次越多,完成產(chǎn)品的維度越高,薪資越高。再往上走的話,基本上就是管理崗位了,要全權(quán)負(fù)責(zé)一款產(chǎn)品,主要職責(zé)可能就是招聘人員、提升效率、制定規(guī)范之類的了,這個就不適合給新人講了。
問題基本梳理完畢,大家都學(xué)習(xí)交互的或者想交流的都可以找我,謝謝。
藍(lán)藍(lán)設(shè)計( sillybuy.com )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
相關(guān)文章:
------------------
創(chuàng)意設(shè)計的方法—無窮關(guān)聯(lián)法
藍(lán)藍(lán)設(shè)計的小編 http://sillybuy.com