轉自Akring的博客git
Slicy程序員
1、前言
切圖做爲美工出圖的最後一步,向來都是使人頭疼的工做,其工做內容繁瑣枯燥,但又必不可少。同時,做爲IOS開發者,咱們每每須要爲程序準備兩 套圖片資源,以應對低清屏和Retina屏的不一樣需求,隨之而來的是切圖工做量的成倍增長。今天爲你們推薦一款Mac下的切圖小工具——Slicy,以上 煩惱皆可獲得妥善的解決。
軟件特性:
1. 切圖方便,簡單的拖放便可,傻瓜式操做2.
2. 培養爲圖片資源合理命名的好習慣
3. 自動生成@2x兩套圖片,極大方便IOS開發者
2、軟件使用
一、PSD文件的預處理
這一步能夠由美工來處理,不過我的推薦程序員親自完成這一步驟,由於這裏涉及到圖片的命名,咱們本身來對圖片進行命名能夠更好的使之符合整個項目的命名規則,方便在項目中對對應圖片資源進行調用和管理。
首先用PhotoShop打開美工給你的PSD文件,以下圖
圖中的綠色狀態圖標即爲本次須要切出的素材圖片
在右側分組面板中,選中對應的組「Statues」
對「Statues」組的組名進行重命名,將其重命名爲「Statues@2x.png」,所有完成後保存PSD文件便可。
注意: 別忘了@2x後面的「.png」。同時,這裏的命名即爲圖片素材被切出後的名字,所以建議你們在命名時考慮到項目總體的命名規則和調用的方便來進行命名,避免圖片切好以後再來修更名字,浪費時間。
到這裏,PSD文件的預處理就完成了,事實上這一步也是整個流程中比較繁瑣的一步了,完成了這些,今天的切圖工做就已經完成了八成。
二、使人愉悅的切圖工做
問:使用Slicy切圖總共分幾步? 答:總共分2步
第一步:把PSD拖進去
第二步:把圖片拖出來
是的,就是如此簡單,打開Slicy的主界面,你能夠看到其主界面也是如此的簡單。。。
第一步
將咱們預處理好的PSD文件拖進去,在一段使人愉悅的動畫以後,咱們會看到這個:
第二步
按住Command + A快捷鍵全選,將圖片拖到你須要的地方
能夠看到,一套嚴格命名,大小合規的圖片已經被切好導出了,就是這麼簡單!
小結
Slicy的存在使得本來繁瑣的切圖工做變得輕鬆愜意,綜上,Slicy使用簡單,小巧清爽,iOS開發者必備神器github