切圖教程，分享一種高效切圖方法

作為UI設(shè)計(jì)師，過(guò)完稿和開(kāi)發(fā)對(duì)接時(shí)，需要標(biāo)注設(shè)計(jì)稿和切圖，把標(biāo)注切圖文件給到開(kāi)發(fā)。這個(gè)時(shí)候就犯難了，那么多尺寸怎么切圖，iPhone就有8個(gè)版本，更別提安卓那一堆尺寸。今天這篇好文分享一個(gè)意想不到的切圖方法，幫你高效切圖。

不用在意那么多設(shè)備，不管iOS和Android手機(jī)型號(hào)有多少，只要我們了解它的屏幕分辨率之后就好辦了。

<點(diǎn)圖片看大圖>

有人會(huì)發(fā)現(xiàn)一個(gè)問(wèn)題，6S、6S plus的尺寸呢？因?yàn)樗麄兊姆直媛屎?、6 plus尺寸一致的。

從上圖可以看出不同分辨率對(duì)應(yīng)不同的倍率，這樣的話我們適配的時(shí)候就知道怎么切圖了，@2x表示兩倍圖，@3x表示三倍圖；以上的那些尺寸圖，重點(diǎn)看這張圖就可以同時(shí)適配iOS和Android的切圖了。

現(xiàn)在PhotoshopCC2015已經(jīng)出了切圖就更方便了，但是對(duì)于電腦的配置要求比較高，不然卡死，土豪就不用擔(dān)心，隨便安裝，對(duì)于電腦配置比較低的可以這樣干，作圖的時(shí)候用CS6，文件在這里面做好之后，只需要啟動(dòng)CC2014或者CC2015進(jìn)行切圖操作就可以了，我現(xiàn)在就是這么干的，畢竟高配置的電腦成本比較高。

現(xiàn)在開(kāi)始來(lái)?yè)v鼓CC2014或者CC2015吧。

1、調(diào)出首選項(xiàng)Command（Ctrl）+k，勾選啟用生成器，默認(rèn)是不夠選的。

2、文件-生成-圖像資源，這個(gè)是后期的時(shí)候用的比較多的一個(gè)選項(xiàng)。

1、不同的模塊建立不同的切圖文件夾存放。