iOS设计规范整理

iPhone设备尺寸

设备机型	屏幕大小	设计像素	开发像素	PPI	DPI	倍率
iPhone6 Plus	5.5英寸	1242 x 2208 px	414 x 736 pt	401	154	@3x
iPhone6/6s	4.7英寸	750 x 1334 px	375 x 667 pt	326	163	@2x
iPhone5/5s/5c	4英寸	640 x 1136 px	320 x 568 pt	326	163	@2x
iPhone4/4s	3.5英寸	640 x 960 px	320 x 480 pt	326	163	@2x
iPhone1-3GS	3.5英寸	320 x 480 px	320 x 480 pt	163	163	@1x

说明：PS设计建议采用750x1334为基准切图@3x、@2x、@1x即可。Sketch建议采用375x667pt为基准，切图@3x、@2x、@1x即可。

iPhone控件尺寸

设备机型	设计像素	状态栏高度	导航栏高度	工具栏、标签栏
iPhone6 Plus	1242 x 2208 px	60px	132px	146px
iPhone6/6s	750 x 1334 px	40px	88px	98px
iPhone5/5s/5c	640 x 1136 px	40px	88px	98px
iPhone4/4s	640 x 960 px	40px	88px	98px
iPhone1-3GS	320 x 480 px	20px	44px	49px

iPhone图标尺寸

设备机型	App Stroe	应用程序	SpotLight搜索	设置	标签栏	工具栏、导航栏	网页夹
iPhone6 Plus@(3x)	1024 x 1024 px	180 x 180 px	180 x 180 px	87 x 87 px	75 x 75 px (About) (maximum:144 x 96)	66 x 66 px(About)	180 x180 px
iPhone6/6s@(2x)	1024 x 1024 px	120 x 120 px	120 x 120 px	58 x 58 px	50 x 50 px (About) (maximum:96 x 64)	44 x 44 px(About)	120 120 px
iPhone5/5s/5c@(2x)	1024 x 1024 px	120 x 120 px	80 x 80 px	87 x 58 px	50 x 50 px (About) (maximum:96 x 64)	44 x 44 px(About)	120 x 120 px
iPhone4/4sc@(2x)	1024 x 1024 px	120 x 120 px	80 x 80 px	58 x 58 px	50 x 50 px (About) (maximum:96 x 64)	44 x 44 px(About)	120 x 120 px

说明：图标R角的比例：图标尺寸/R角 = 5.7（About）

iPad设备尺寸

设备机型	屏幕大小	设计像素	开发像素	PPI	DPI	倍率
iPad 1-2	9.7英寸	1024 x 768 px	1024 x 768pt	132	132	@1x
iPad 3-4	9.7英寸	2048 x 1536 px	1024 x 768 pt	264	132	@2x
iPad Air 1-2	9.7英寸	2048 x 1536 px	1024 x 768 pt	264	132	@2x
iPad Pro 9.7 英寸	9.7英寸	2048 x 1536 px	1024 x 768 pt	264	132	@2x
iPad Pro 12.9 英寸	12.9英寸	2732 x 2048 px	1024 x 768 pt	264	132	@2x
iPad Mini 1	7.9英寸	1024 x 768 px	1024 x 768 pt	163	132	@1x(About)
iPad Mini 2-4	7.9英寸	2048 x 1536 px	1024 x 768 pt	326	132	@1x(About)

说明：PS设计建议采用2048*1536为基准切图@2x、@1x即可。Sketch建议采用1024x768pt为基准，切图@2x、@1x即可。

iPad控件尺寸

设备机型	设计像素	状态栏高度	导航栏高度	工具栏、标签栏
iPad 1-2	1024 x 768 px	20px	44px	49px
iPad 3-4	2048 x 1536 px	40px	88px	98px
iPad Air 1-2	2048 x 1536 px	40px	88px	98px
iPad Pro 9.7 英寸	2048 x 1536 px	40px	88px	98px
iPad Pro 12.9 英寸	2732 x 2048 px	40px	88px	98px
iPad Mini 1	2048 x 1536 px	20px	44px	49px
iPad Mini 2-4	2048 x 1536 px	40px	88px	98px

iPad图标尺寸

设备机型	App Stroe	应用程序	SpotLight搜索	设置	标签栏	工具栏、导航栏	网页夹
iPad 1-2	1024 x 1024 px	76 x 76 px	60 x 60 px	29 x 29 px	25 x 25 px (About) (maximum:48 x 32)	22 x 22 px(About)	76 x 76 px
iPad 3-4	1024 x 1024 px	152 x 152 px	120 x 120 px	58 x 58 px	50 x 50 px (About) (maximum:96 x 64)	44 x 44 px(About)	152 x 152 px
iPad Air 1-2	1024 x 1024 px	152 x 152 px	120 x 120 px	58 x 58 px	50 x 50 px (About) (maximum:96 x 64)	44 x 44 px(About)	152 x 152 px
iPad Pro	1024 x 1024 px	167 x 167 px	80 x 80 px	58 x 58 px	50 x 50 px (About) (maximum:96 x 64)	44 x 44 px(About)	167 x 167 px
iPad Mini 1	1024 x 1024 px	76 x 76 px	60 x 60 px	29 x 29 px	25 x 25 px (About) (maximum:48 x 32)	22 x 22 px(About)	76 x 76 px
iPad Mini 2-4	1024 x 1024 px	152 x 152 px	120 x 120 px	58 x 58 px	50 x 50 px (About) (maximum:96 x 64)	44 x 44 px(About)	152 x 152 px

说明：图标R角的比例：图标尺寸/R角 = 5.7（About）

iOS文字规范

系统	英文字体	中文字体	设计字号	最小限制
iOS 9	San Francisco	苹方	偶数	英文 18px、中文 22px
iOS 8	Helvetica	Heiti SC	偶数	英文 18px、中文 22px

交互规范

必背： iOS可点击区域最小为44x44pt.

切图规范

1. 软件切图区别：以选中的切片的尺寸为@2x倍率，最终计算出@1x,@2x,@3x切图。Sketch自带切片：以选中的尺寸为基准，乘以倍率，得到最终切图。
2. 切图规范：所有图标尺寸必须为偶数。
3. 切图命名建议：属相_功能_状态@倍率.png.
4. 常见命名：
   页头header 页尾footer 页面主体main 导航nav
   内容content 栏目colum 侧栏sidebar 摘要summary
   滚动scroll 点击click 广告/横幅AD/banner

标注规范

• 标注单位转换为pt（给到开发时必须标明设计设备基准，以便开发换算适配）。
• Sketch可以导出网页标注：安装插件Spec export, Plugns - Measure - Spec export 。（推荐）

转载地址
iOS Human Interface Guidelines