干货—ios app从设计到输出切图标注（app切图标注是如何进行的）-科研云

干货—ios app从设计到输出切图标注（app切图标注是如何进行的）

投稿用户 • 2023年4月15日 am10:04 • 科研百科 • 阅读 148

一．设计常用尺寸

PS设计常用尺寸750×1334，如果使用Sketch建议375*667，如果用的是PS画图标的时候一定要是矢量图，方便后续的修改和切图。

干货—ios app从设计到输出切图标注（app切图标注是如何进行的）

二．ios常用屏幕尺寸

干货—ios app从设计到输出切图标注（app切图标注是如何进行的）

三．切图

1.切图最好都是偶数，要放大看，是否对齐到每个像素的边界，那样就不用担心虚边的问题了。

干货—ios app从设计到输出切图标注（app切图标注是如何进行的）

2.切图输出web格式的png24位或jpg，不确定的情况下可以和开发沟通。

3.同一模块内的切图大小需保持一致

干货—ios app从设计到输出切图标注（app切图标注是如何进行的）

4.为了减小包的大小，所有切图尽量压缩后在给开发（如果你懒得压，可以把这个网站链接给开发哥哥，让他们自己压https://tinypng.com/）

干货—ios app从设计到输出切图标注（app切图标注是如何进行的）

5.ios只需要切2套图就可以，分别为：@2x和@3x，@2x的切图可以用750×1334这个尺寸出，@3x的切图可以用1080×1920这个尺寸切。

干货—ios app从设计到输出切图标注（app切图标注是如何进行的）

切图尺寸：功能型切图最小可点击范围是88px*88px，示意型图标为48*48点当然也不能完全限制。如果界面整体比例不合适，或者影响视觉设计，也不必过分强求~

四．标注

个人使用的是Mark man这个软件，也算是一款比较好用的设计稿标注工具，支持 Win / Mac。有免费版和收费版，免费版也是足够用的。

干货—ios app从设计到输出切图标注（app切图标注是如何进行的）

ios标注的时候使用的颜色值为RGB（android使用的是十六进制颜色值）~

五 . 图标尺寸

29*29、40*40、58*58、76*76、80*80、120*120、152*152、167*167

180*180、1024*1024。

干货—ios app从设计到输出切图标注（app切图标注是如何进行的）

切记ios所有图标均为直角。系统会自动处理为圆角。如果你直接输入圆角切图，会出bug。

六．App store商店所需图片尺寸

理论上需要640*960 640*1336 750*1334 1242*2208，这些尺寸。

也可以和开发沟通，现在我们app只需提供1242*2208最大尺寸和640*960最小尺寸，如果你们的app还兼容ipad还需提供2048*2732这个尺寸的商店图。

干货—ios app从设计到输出切图标注（app切图标注是如何进行的）