一.android版
在做android版本设计的时候，尺寸有很多种，这时我们要以一种尺寸为基准，那这个基准尺寸是480px*800px，设计图完成之后就开始切图了，我拿我之前设计的一张图为例子讲解下：

当看到上边这张设计图的时候，我们首先分析下应该给技术切哪些图（为了避免以后少改动，建议切图之前最好和技术先沟通下，怎么切）；
1、底部栏目的icon和背景：
这个一般有2种切法：（有默认和选中之后的效果）

2、顶部栏目的背景切图：
由于顶部导航栏的是渐变样式，所以切图只需要切一小条，技术来平铺拉伸就可以~（PS：如果是花纹背景，就必须切整条了，因为花纹切一小条就会被拉伸了~）
3、标注文字大小和行间距：（以这张图为例子，我标注好了，请看下图）
需要注意的：
A：android主要有3种屏，即：
QVGA和WQVGA屏density=120;
HVGA屏density=160;
WVGA屏density=240;
B：apk的资源包中，
当屏幕density=240时使用hdpi标签的资源
当屏幕density=160时使用mdpi标签的资源
当屏幕density=120时使用ldpi标签的资源；
C：我们标注的是PX，但是技术的算法是DP，所以需要PX和DP进行转化，PX和DP的转化主要跟密度有关系，当密度density=160即（屏幕尺寸：320*480）时，1PX=1DP；当密度density=240即（屏幕尺寸：480*800）时，1PX=0.75DP；当屏幕的尺寸大于480*800的时候，密度都按照240计算即可；当密度density=120即（屏幕尺寸：240*320）时，这个现在几乎没有人用了，所以我也不知道转化公式，如果您知道，可以留言告诉我啊~
注意：因为我们做的是基于480*800尺寸的，大家都知道android的尺寸太多了，要想适配现在流行的尺寸，比如：640*960；720*1280等，唯一的解决办法就是图标可以根据不同尺寸各做一套，也就是图标需要做480、640和720共3套图标，不过如果你们的产品的要求不严格，做一套就可以，只不过是在大于480尺寸的屏幕上有些图标被拉大变虚而已~
二.ios版
在做ios版本设计的时候，尺寸有3种，分别是：320*480、640*960、640*1136；这时我们要以一种尺寸为基准，那这个基准尺寸是640px*960px，设计图完成之后就开始切图了，我拿我之前设计的一张图为例子讲解下：

当看到上边这张设计图的时候，我们首先分析下应该给技术切哪些图（为了避免以后少改动，建议切图之前最好和技术先沟通下，怎么切）；
1、底部栏目的icon和背景：
这个一般有2种切法：（有默认和选中之后的效果）

2、顶部栏目的背景切图：
由于顶部导航栏的是多颜色的，所以只能切一整条给技术，商圈的图标要单独切出来

3、二级标题栏目的切图：

4、主体栏目的切图：

5、标注文字大小和行间距：（以这张图为例子，我标注好了，请看下图）
需要注意的：
A：我们标注的尺寸是像素px，技术那边的实际运用到技术中的是像素的一半，即像素的一半=技术的尺寸；例如：“分类”2个字，我标准的是36px，技术那边的尺寸就是18px；
B：所有文字，行间距的标注的尺寸都是偶数；因为技术那边都是根据我们的尺寸除以2；
C：颜色的标注有的技术要求16进制，有的技术要求RGB，由于页面的限制所以我只标注了16进制的，按16进制和RGB都标注的是最好的~
注意：因为我们做的基于640*960尺寸的，ios共有3套尺寸，因为640*960和640*1136的宽度是不变的，所以图标没有变化重新切，只是行间距需要调整下；320*480尺寸的是640*960的一半，所以技术完全可以根据你标注的640的尺寸做就可以~
三.android和ios的转化关系
1.因为ios的尺寸是640*960，android当密度等于120即（320*480）时，1PX=1DP，所以android和ios的标注像素之间的换算关：即ios像素尺寸*1/2=android dp尺寸；
2.如果你们的产品同时做android和ios，你只想标注一套尺寸的时候，就可以标注ios版的标注去计算即可。

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倍图则为：abc@2x.png，3倍图则为：abc@3x.png;

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使用速度，尽量降低图片文件大小

网页切图是网站前端制作人员的工作一部分，一般网页切图指的是网站从效果图中获得切片并使用切片来制作网站前端静态页面。网站切图原则：

尽量少切图，能使用css编写的尽量使用css样式编写出想要的效果

网页禁忌全部使用图片切成，这样会使网页上很多文字不利于后期修改，同时增加了网页的加载速度。

网站切图小图片尽量放在一张图片上，减少网页访问时对服务器的请求数，因为一个图片就是一个次请求。

背景图片可以平铺的尽量切成一个小单元平铺，可以减少图片的大小。

切图需要降低图片质量，在保证质量的情况下，缩小图片占用内存的大小。

网站切图因网页布局决定，并不是除按钮以外都可以当做背景。