@蘇暮鷓 ：切圖作為設(shè)計(jì)師出圖的最后一步，向來都是令人頭疼的工作，其工作內(nèi)容繁瑣枯燥，但又必不可少。同時(shí)，作為IOS開發(fā)者，我們往往需要為程序準(zhǔn)備兩套圖片資源，以應(yīng)對(duì)低清屏和Retina屏的不同需求，隨之而來的是切圖工作量的成倍增加。今天為大家推薦一款Mac下的切圖小工具——Slicy，以上煩惱皆可得到妥善的解決。

Slicy 官網(wǎng)：http://macrabbit.com/slicy
Examples：http://macrabbit.com/slicy/help
App Store：https://itunes.apple.com/tw/app/slicy/id512533449

相關(guān)文章推薦：
《高效神器！21款強(qiáng)大實(shí)用的Photoshop擴(kuò)展插件》
《神器一籮筐：創(chuàng)建高保真的移動(dòng)Demo（工具篇）》

軟件特性：

1. 切圖方便，簡(jiǎn)單的拖放即可，傻瓜式操作2.
2. 培養(yǎng)為圖片資源合理命名的好習(xí)慣
3. 自動(dòng)生成@2x兩套圖片，極大方便IOS開發(fā)者

二、軟件使用

1、PSD文件的預(yù)處理

這一步可以由設(shè)計(jì)師來處理，不過個(gè)人推薦程序員親自完成這一步驟，因?yàn)檫@里涉及到圖片的命名，我們自己來對(duì)圖片進(jìn)行命名可以更好的使之符合整個(gè)項(xiàng)目的命名規(guī)則，方便在項(xiàng)目中對(duì)對(duì)應(yīng)圖片資源進(jìn)行調(diào)用和管理。

首先用PhotoShop打開設(shè)計(jì)師給你的PSD文件，如下圖：

圖中的綠色狀態(tài)圖標(biāo)即為本次需要切出的素材圖片

在右側(cè)分組面板中，選中對(duì)應(yīng)的組"Statues"

對(duì)"Statues"組的組名進(jìn)行重命名，將其重命名為"Statues@2x.png"，全部完成后保存PSD文件即可。

這里要注意別忘了@2x后面的".png"。同時(shí)，這里的命名即為圖片素材被切出后的名字，因此建議大家在命名時(shí)考慮到項(xiàng)目整體的命名規(guī)則和調(diào)用的方便來進(jìn)行命名，避免圖片切好之后再來修改名字，浪費(fèi)時(shí)間。

到這里，PSD文件的預(yù)處理就完成了，事實(shí)上這一步也是整個(gè)流程中比較繁瑣的一步了，完成了這些，今天的切圖工作就已經(jīng)完成了八成。

二、令人愉悅的切圖工作

• 問：使用Slicy切圖總共分幾步？

• 答：總共分2步

• 第一步：把PSD拖進(jìn)去
• 第二步：把圖片拖出來

是的，就是如此簡(jiǎn)單，打開Slicy的主界面，你可以看到其主界面也是如此的簡(jiǎn)單。。。

第一步

將我們預(yù)處理好的PSD文件拖進(jìn)去，在一段令人愉悅的動(dòng)畫之后，我們會(huì)看到這個(gè)：

第二步

按住Command + A快捷鍵全選，將圖片拖到你需要的地方。

可以看到，一套嚴(yán)格命名，大小合規(guī)的圖片已經(jīng)被切好導(dǎo)出了，就是這么簡(jiǎn)單！

小結(jié)

Slicy的存在使得原本繁瑣的切圖工作變得輕松愜意，尤其是當(dāng)程序猿霸氣的對(duì)設(shè)計(jì)師妹子說："看你那么辛苦，今天的圖我來切"時(shí)，相信大多數(shù)設(shè)計(jì)師妹子都會(huì)感動(dòng)的痛哭流涕有木有。。。

綜上，Slicy使用簡(jiǎn)單，小巧清爽，實(shí)在是居家旅行，殺人滅口勾搭設(shè)計(jì)師的必備神器。

原文地址： akring.github
作者：@蘇暮鷓

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：2650232288@qq.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是一個(gè)分享網(wǎng)頁設(shè)計(jì)、無線端設(shè)計(jì)以及PS教程的干貨網(wǎng)站。
【特色推薦】
設(shè)計(jì)師需要讀的100本書：史上最全的設(shè)計(jì)師圖書導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計(jì)微博：擁有粉絲量70萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com
———————————————————–
想在手機(jī)上、被窩里獲取設(shè)計(jì)教程、經(jīng)驗(yàn)分享和各種意想不到的"福利"嗎？
添加 優(yōu)秀網(wǎng)頁設(shè)計(jì) 微信號(hào)：【youshege】?jī)?yōu)設(shè)哥的全拼
您也可以通過掃描下方二維碼快速添加：