如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里 

最近半年嘗試性的收了一個小徒弟，因為他今年畢業(yè)，我以為教起來會很順利，因為他是平面設(shè)計專業(yè)而且PS軟件基礎(chǔ)還不錯。但是實際上卻遇到了不少的問題不少的彎路。我把它們整理了下來，總結(jié)了一下。分享給剛?cè)腴T的Ui設(shè)計師們希望能幫到初學(xué)UI的你。

推薦閱讀》《迅速提高設(shè)計能力的秘訣！》《設(shè)計師的6大瓶頸期》《UI設(shè)計的學(xué)習(xí)方法,如何學(xué)習(xí)ui設(shè)計》

一、提升你自己的設(shè)計審美

每個行業(yè)都有屬于自己的一套評判標(biāo)準(zhǔn)。初入行的新人卻很容易摸不清楚。審美水平的提升是進(jìn)本不可能速成的，它是一個非常緩慢的過程。

正所謂：

人生不在于用腳步丈量萬水千山，而是用內(nèi)心真正體會世間百態(tài)。

只有有了一個很好的審美水平，你才能清晰的判斷好或者不好。才能對自己的設(shè)計作品有一個非常清晰的認(rèn)識。

我覺得UI設(shè)計有些像畫素描，在繪畫的過程中你的畫板可能會顯得空，顯得造型不準(zhǔn)，顯得灰。但是在落下最后一筆之后，你一定要對你畫出來的作品有一個明確的判斷。哪里的造型不準(zhǔn)（間距），哪里的顏色過于灰（配色），哪里的地方顯得空（布局）。這些都是應(yīng)該一眼就可以看出來、可以自己去把控修改的，而不是別人告訴你如何去改，那樣實際上你就變成了一個所謂的設(shè)計工具。

這也就是我為什么不喜歡線下速成培訓(xùn)班的原因，在培訓(xùn)班里沒有足夠的時間去培養(yǎng)審美能力，老師告訴你如何去改去改，作品的效果雖然上去了，但實際上對個人的幫助微乎其微。

所以多看一些好的作品，有助你審美的提高，以及對自己作品的一個判斷把握

（圖片來自網(wǎng)絡(luò)）

二、設(shè)計工具切勿貪多嚼不爛

實際上我現(xiàn)在如果做UI一般是Sketch+Principle，之前幾年一直只是PS+AE。

如果你對設(shè)計軟件難以取舍我不妨這樣說。

設(shè)計軟件的選擇實際上取決于你想掌握什么樣的設(shè)計技能。

分享一下我的學(xué)習(xí)路線

PS（美工技能）→AI（美工技能）→AE（動效技能）→DW（切圖技能）→Sketch（美工軟件更新）→Principle(動效軟件更新)→C4D(建模等技能學(xué)習(xí))

希望對你有一定的參考。

新人來講，我覺得會個PS就足夠了。。。

如果有耐心有毅力，可以學(xué)一些初步的AE

三、適當(dāng)?shù)那岸酥R

四年前，我剛接觸UI設(shè)計的時候，還在嘲笑一些公司，為什么會有切圖師這樣的職位。難道他們不知道cutterman這個插件可以自動切圖嘛。

后來我進(jìn)了公司才知道，原來所謂的“切圖”，是指將UI設(shè)計通過前端HTML+CSS+JS進(jìn)行靜態(tài)的切圖布局，我們美工所謂的“切圖”，只是“摳圖”罷了。

這件事過后我就開始了自己的代碼之路，說真的，我是屬于一看見英文單詞就想打瞌睡的。

效率很低，但是至少現(xiàn)在我明白我的界面會通過怎樣的一種方式去實現(xiàn)，懂一些簡單的框架。這在工作中的溝通上對我的幫助是難以言喻的。

很多設(shè)計師會說，設(shè)計就是設(shè)計，不能學(xué)代碼。

但是Vue.js的作者也是設(shè)計師出身，各廠的大神很多也都是懂代碼的，希望新人在面對這個選擇的時候想一想，是自己真的想要一輩子專注設(shè)計，還是只是為了偷懶而找的一個借口。

（圖片來自網(wǎng)絡(luò)）

四、切忌設(shè)計上下限相混

跟其他一些設(shè)計師不同，我很提倡徒弟去臨摹一些飛機(jī)稿。

甚至是各種動效亂飛現(xiàn)在的技術(shù)實現(xiàn)起來很困難的設(shè)計稿，因為我認(rèn)為，對于新人而言，提升眼界的一個最快的方式就是臨摹飛機(jī)稿。

只有當(dāng)你飛到兩萬英尺的高空，你才能看到最廣闊的風(fēng)景。

視覺效果極佳的飛機(jī)稿就是提升審美的一個相對的捷徑。

但是在實際落地的需求中大肆運用飛機(jī)稿去設(shè)計，那就是找死了。

設(shè)計分為上限和下限。決定著你設(shè)計水平的體現(xiàn)和實際項目的體現(xiàn)，切忌相混。

就如同車展的概念車和落地車，有可能你自己上限和下限的差距，比人跟豬的差距，都要大。

（圖片來自網(wǎng)絡(luò)）

五、多去關(guān)注一下行業(yè)狀況，跳出設(shè)計本身去思考問題

UI設(shè)計和平面設(shè)計不同，我們設(shè)計的是一個軟件產(chǎn)品，甚至有時候還包括著一些內(nèi)部的跳轉(zhuǎn)架構(gòu)。

只有你吃透了相關(guān)行業(yè)的運作，才能明白其中的邏輯關(guān)系，才能更好的去設(shè)計產(chǎn)品。

前些年UI設(shè)計群里一直有人每天都在發(fā)“XXX20億融資O2O”之類的歸類新聞，有什么用呢。

不如撇開這些快餐式的行業(yè)新聞，直接去看一看相關(guān)專業(yè)人員的分析。

看的越深，你就會越覺得，

設(shè)計只是一個產(chǎn)品內(nèi)部的一個齒輪，外觀做的再漂亮，也不如和其他的齒輪有一個默契的配合。

有的人總喜歡噴別的設(shè)計師或者別的產(chǎn)品，做出來的東西一點都不好看。尤其是培訓(xùn)班的設(shè)計師，自己的設(shè)計稿天花亂墜般酷炫，外面的產(chǎn)品是如此的普通。

但是，當(dāng)你糾結(jié)于設(shè)計本身的時候，你是否發(fā)覺自己進(jìn)了一個死胡同。

（圖片來自網(wǎng)絡(luò)）

網(wǎng)上的屠龍寶刀，點擊就送，是不是丑？

但是這是一個洗腦式的營銷。

有的產(chǎn)品交互是不是不太合理？給用戶增加了不少的麻煩？

交互設(shè)計不全等于尊重用戶體驗，而是在體驗和變現(xiàn)之間尋求一個平衡。

六、適當(dāng)?shù)慕⒆约旱脑O(shè)計素材庫

這點不多做贅述，但是請注意，你的素材庫一定是要有一個素材命名規(guī)范的

比如01-001-XXXXX

01代表移動端或者PC端

001代表設(shè)計素材的編號

XXXXX代表你對這個素材的簡略概況

這樣能讓你在擁有近五位數(shù)的素材的時候也能快速準(zhǔn)確的找到你想要的那一張。

（圖片來自網(wǎng)絡(luò)）

七、細(xì)節(jié)處理

我上高中的時候，一個美院老教授來我們學(xué)校開講座，我問了一個問題。

如何畫好一幅素描？

老教授回答了六個字：“造型、空間、對比”

當(dāng)時不理解，現(xiàn)在想了想，其實足夠。

對于新人設(shè)計師，我也想說：“字體、間距、關(guān)系”

字體指的是一個合適的字體以及合適的字號

我現(xiàn)在還見到有的設(shè)計師用宋體用楷體，理由是好看。

我現(xiàn)在還看到有的設(shè)計師在750*1334的設(shè)計稿上用很小的字體，理由是顯得精細(xì)。

這樣的設(shè)計稿如果給前端，簡直是一場災(zāi)難。

間距指的是合適的間距，MD上講的是8px 16px 24px。

關(guān)系指的是你需要明白你設(shè)計稿顯示的主要信息是什么，次要信息是什么，不重要信息是什么。

這樣，在你設(shè)計的時候，你是不是就可以把主要信息突出展示，不重要信息可以在空間擁擠的時候收起來？

藍(lán)藍(lán)設(shè)計( bouu.cn )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)