APP切圖是每個UI設計師必備的一門知識，如今最新的iphone手機是iphone X,大家也都喜歡以此做為樣本，這手機尺寸是1125*2436px，跟iphone 8 的放大模式尺寸1125*2001px 是高了435px。如下圖所示：
所以，切片是@3x就可以滿足iphone x 最新手機的尺寸要求了。
所以，APPUI設計師需要給出的APP切片資源有3套：
1、 標註圖（以750為寬度尺寸為基準標註）
2、 2x切圖（以750為寬度尺寸為基準切圖）
3、 3x切圖（以1242為寬度尺寸為基準切圖）
手機APP的切片要求：
1、切圖資源尺寸必須為雙數
如果是單數切圖的話，手機系統就會自動拉伸切圖，從而導致切圖元素邊緣模糊，造成開發出來的APP界面效果與原設計效果差距甚遠。
2、如果設計稿是按標準分辨率1242X2208設計，圖片資源尺寸則是@3倍圖尺寸，將整個設計圖壓縮成750X1334，圖片資源尺寸則是@2倍圖尺寸，在二倍圖的基礎上壓縮成50%，圖片資源尺寸則是1倍圖尺寸； 當然，你也可以按照@2x圖 750*1334px的尺寸來設計。然後再去適配@3x倍圖的設備。
3、產品效果圖獨立切片，即是每張效果圖獨立建立一個文件夾（命名以效果圖名稱為準），文件夾內容包含1倍圖文件、2倍圖文件、3倍圖文件和標識文件
4、圖片命名要求語義化，格式為png；
5、圖片資源需要備有1倍圖、2倍圖、3倍圖，3倍圖命名規則為：添加後綴@3x；2倍圖命名規則為：添加後綴@2x；例如：1倍圖：abg.png，2倍圖則為：[email protected]，3倍圖則為：[email protected];
6、 字體:IOS默認字體—— 英文 HelveticalNeue 中文 黑體；字體大小採用點pt，設計稿以相對單位px，字體大小需要進行轉化，轉化公式為：px*72/96=pt（eg：12px*72/96=9pt）， 字體顏色只需給出rgb值（eg：color：rgb（255，255，255））；
7、頁面純色背景需標出rgb值，如果有透明度則需標出rgba值，其他特殊背景直接切圖；
8、頁面的圖標、色塊、按鈕的高度都必須是4的倍數，最小像素不能低於44px，如不夠可以添加補白；
9、頁面外邊距留白為10px；可點擊部件應當注意其點擊區域不小於88px
10、啟動圖標1024*1024,png格式，不能透明底，透明的部分補白色。
11、為了提升APP使用速度，儘量降低圖片文件大小
圖片在線壓縮工具有：手機APP設計必備圖片壓縮神器-TinyPNG和設計師最愛的無損圖片壓縮工具—ImageOptim
12、使用APP切圖 ps插件Cutterman——一鍵切圖，真正解放雙手
如果是sketch設計的APP UI 可以搭配Sketch Measure來進行切片。
Sketch Measure是最新的Sketch切圖插件使用方法非常簡單，能夠一鍵生成Html標註文件，並且自動生成設計規範文件十分高端。
13、ios切片和安卓切片，大部分是可以共用的。只要你輸出的切片是@2x 和@3x的資源就可以了。
Android 目前支持五種不同的dpi模式：mdpi hdpi xhdpi xxhdpi 分別對應的就是
14、輸出文件命名的技巧分享給大家。
① 如果一個圖層需要輸出多種格式圖片，命名可以用逗號分割。（例如：a.jpg,a.png）
② 同一個圖層想輸出多種質量的圖片，可以在命名後加參數。 （比如：a.png8,b.png32 這樣就會輸出一張8位的a.png和一張32位的b.png文件）
③ JPG默認輸出是90%的質量，也可以命名加參數控制（例如：a.jpg50%）
閱讀更多 UI巴巴 的文章
