UI知識(shí),制作icon到底是用AI還是用PS?(2)

來(lái)源:站酷 作者:HHTHH 學(xué)習(xí):30099人次

 

有這些疑惑的設(shè)計(jì)師,祝賀你,你是一個(gè)喜歡思考的的UI設(shè)計(jì)師,因?yàn)楹芏嘣O(shè)計(jì)師一般會(huì)簡(jiǎn)單粗暴的回答:當(dāng)然是PS簡(jiǎn)單直接也可以切圖,一鍵走天涯。

 

我個(gè)人工作過(guò)一個(gè)公司,期間一直用PS制作圖標(biāo),切圖,主管也一直這么做的,確實(shí)沒(méi)有什么問(wèn)題。在PS里面直接制作出效果圖,然后切圖出來(lái),馬克鰻軟件標(biāo)注尺寸,有些小的項(xiàng)目甚至都沒(méi)有輸出過(guò)@2X@3X。所以入門的設(shè)計(jì)師不用怕不懂這些就做不了UI。依然可以做好工作,但是不能不懂這些東西,經(jīng)過(guò)我一天時(shí)間跟不同公司的人溝通交流我梳理了一下,讓大家理解更清晰,雖然用不到,但是還是可以提升理解的。

 

第一種:直接用PS因?yàn)镻S里面有形狀工具還可以描邊,再加上強(qiáng)大的布爾運(yùn)算結(jié)合PSCC最新的版本,完全可以勝任所有icon的制作,效果一點(diǎn)也不比AI制作差,尤其是轉(zhuǎn)換為智能對(duì)象直接解決了圓角弧度的等比變化問(wèn)題。關(guān)鍵它也是矢量形狀,不懼放大縮小,確實(shí)是UI設(shè)計(jì)師的福音。

 

第二種:用AI還有CRD他們才是真正的矢量圖形,圓角弧形的表現(xiàn)無(wú)它能敵(PA里面再?gòu)?qiáng)也是有鋸齒的(無(wú)限放大放大看))矢量就是任性。

 

其實(shí)大家最關(guān)心的還是工作效率的問(wèn)題,能用一個(gè)搞定我們就少操作一個(gè)軟件,我也是這么想的,以前在公司,我也不愿意打開(kāi)AI,能用PS就用PS,但是經(jīng)過(guò)我一天的咨詢,我發(fā)現(xiàn)雖然我的公司是這樣,但不代表UI設(shè)計(jì)行業(yè)都這樣,我不能坐井觀天。我相信大家糾結(jié)的關(guān)鍵因素是因?yàn)榍袌D,切圖的@2X@3x,會(huì)不會(huì)受到影響。

 

如果公司要求不嚴(yán)格,或者公司自己開(kāi)發(fā)一款用戶范圍很小的APP一般不會(huì)要求那么細(xì)致,在PS里面隨便做一套icon然后切出來(lái)適配某幾個(gè)分辨率就行了。這樣的公司設(shè)計(jì)師比較舒服,不用過(guò)多考慮切圖問(wèn)題。

 

第二種公司就是類似于QQ百度微信這種級(jí)別的應(yīng)用或者要求更高的專業(yè)公司,他們的APP絕不可能只切幾個(gè)分辨率進(jìn)行適配,因?yàn)槭鼙娙后w太多,考慮的手機(jī)平臺(tái)更多。舉個(gè)栗子:在PS中我們做出icon切圖后輸出不同尺寸的切圖,PS是不能保證每一個(gè)尺寸的切圖都是沒(méi)有變形或者虛邊的。(仔細(xì)想想是有道理的)

UI知識(shí),制作icon到底是用AI還是用PS?_www.theoat.com.cn

但是AI等矢量軟件輸出什么樣的尺寸都無(wú)所謂,所以我肯定類似BAT這樣的公司是絕不可能用PS制作或者直接切圖重要位置圖標(biāo)的;疽WC重要圖標(biāo)的矢量效果適應(yīng)各種尺寸規(guī)范。

 

這時(shí)候大家覺(jué)得看來(lái)專業(yè)的還是得用AI啊,但是AI和PS交換使用做設(shè)計(jì)時(shí)候會(huì)不會(huì)麻煩啊。
UI知識(shí),制作icon到底是用AI還是用PS?_www.theoat.com.cn

 

 

通過(guò)跟這位設(shè)計(jì)師對(duì)話我明白了一個(gè)道理:我們?cè)赑S里面只是演示一個(gè)界面設(shè)計(jì),如果很完美那么就直接保存PNG然后用馬克鰻標(biāo)注,但是前端那邊最好是接到AI矢量圖標(biāo)再按照我們效果圖標(biāo)注的大小進(jìn)行切圖(這公司UI設(shè)計(jì)師都不切圖的,太閑了吧)結(jié)合大眾那就是我們?cè)O(shè)計(jì)師效果圖標(biāo)注,用AI切圖。因此省去了我們一個(gè)非常重要的步驟:AI里面的圖標(biāo)不必每次調(diào)整都要放到PS效果圖里面展示,只需要用PS里面的形狀工具畫(huà)出一個(gè)效果即可。(因?yàn)锳I沒(méi)有像素概念A(yù)I里面的圖標(biāo)拖到PS里面有可能會(huì)出現(xiàn)很多半像素,所以拖過(guò)來(lái)制作效果沒(méi)有必要)。

 

 

綜上所訴:我個(gè)人理解就是PS做效果,AI繪圖標(biāo)。涉及到切圖在PS里面制作大小效果,在AI里面大小自定義(因?yàn)槭噶浚┮簿褪钦f(shuō)對(duì)切圖要求嚴(yán)格的公司里面的UI設(shè)計(jì)師是肯定用AI制作icon的并進(jìn)行切圖,但是PS里面的icon效果就不一定是從AI那邊拖過(guò)來(lái)的了畢竟來(lái)回拖拽太麻煩。

以上只是我一個(gè)初級(jí)設(shè)計(jì)師的淺顯理解,不作為任何設(shè)計(jì)的的參考建議,本文最終目的也只是想拋磚引玉,希望有人能指點(diǎn)錯(cuò)誤,我會(huì)及時(shí)改正,并標(biāo)注出來(lái),感謝大家。如果有大神指導(dǎo)AI切圖方法,也請(qǐng)不吝賜教。

 

學(xué)習(xí) · 提示

  • 一定要打開(kāi)PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習(xí)時(shí),大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問(wèn):新手求助
  • 加官方微信,隨時(shí)隨地,想學(xué)就能學(xué):ps_bbs,或掃右側(cè)二維碼!
  • 關(guān)注我們學(xué)更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評(píng)論 | 交作業(yè) -
最新評(píng)論
暫無(wú)評(píng)論,交個(gè)作業(yè)支持一下吧~

關(guān)注大神微博加入>>

網(wǎng)友求助,請(qǐng)回答!