自從換了新工作,切圖成了我的新問題。因為不是專業的美工, 對photoshop的操作也只限於基本操作, 以前雖然也有遇到不切圖的UI, 但是以前做的都是電商扁平化網站, 圖片都很簡單,差不多都是方方正正,即使有一兩個像素不對, 也沒有問題,用css寫對就行。 然后現在從事的是游戲公司的網站, 而且美術不負責切圖, 就只能自己動手了, 第一次拿到多邊形的時候,我傻眼了。不知道怎么下手。 第一次的時候還是找前同事的UI 幫忙的。但是不能每次都找別人幫忙啊, 第二次的時候就自己動手了。切圖都花了1天多(慚愧,羞愧,懊惱。。。),因為這些, 沒被產品少投訴。
言歸正傳, 由於被投訴效率低, 第一次項目完了之后, 我就開始找一些可以提高效率的方法。 首先,切圖是最重要的第一步。 偶然在慕課網看到切圖的工具, 真是及時雨呀, 於是我認認真真把視頻看了兩遍,還一邊看一邊操作,真是好用, 下面把詳細步驟貼出來。(下面我拿御龍三國手游官網來進行步驟舉例)
1. 下周photoshopCC 2014, 安裝, 至於是否破解, 你自己決定。
2.打開文件-------> 腳本---------> 將圖層導出到文件。




3. 設置下面的設置, 如圖所示。 如果是想要jpg等其他文件, 可以在文件類型那里設計


4.點擊運行。 大功告成。 完成的時間, 由文件里面的圖層以及電腦的配置決定。 我的電腦裝了固態硬盤, 內存8G, 導出一個非常多的圖層的文件, 花了5-6個小時。 也許你會說這個效率還沒有手工的高,是的,我也有同感,但是對於ps的小白, 這兒可以很精確的導出想要的圖層文件, 真是太好了。 只要晚上把電腦開着, 就可以安心回家睡覺了, 早上來的時候, 一切都ok了。
5. 當然,這樣子是不行的, 后來我想了幾個辦法。 把圖層分組, 有些美工已經把這兒事情做了。 然后把哪些需要的Ctrl+E合並成一個圖層,還有, 你想要的也合並為一個圖層, 這樣psd里的圖層就減少了。這個方法非常有效, 我試了一下, 10幾分鍾就得到了那些我想要的圖片。
7. 當然還有更好的方法。這也是在慕課網的視頻上學的。 ctrl+K出來首選項(編輯-->首選項),然后設置增效文具。


8. 再設置 文件----->生成---->圖像資源。 (這個設置了下次才生效,設置不上就重啟ps)


9.設置psd里面圖層文件名稱。到psd痛目錄下面,生成了一個 源文件-asset文件, 打開會有驚喜喲。 是不是分分鍾解決了難題。




10.總結; 沒事就到慕課網去看看, 怎么感覺像打廣告呢。 算了, 總結就是沒事的時候多在網上多逛逛, 就會發現我的這個經驗。
11. 添加一個重要的線索。 因為手機上,如果原圖大小,可能已經會出現鋸齒, 所以最好的做一個2倍大小的文件。 表達式這樣子寫: 200% 源圖層名稱 @2x.jpg。
12.生成不同質量 源圖層.jpg8 生成質量問80% 質量的jpg文件在assets