IOS iphone 苹果设计规范

IOS iphone 苹果设计规范

 

关于设计我都快忘得差不多了,但是偶然看到这篇文章,对于ios设计规范介绍的还是非常详细明了的。有需要的小伙伴请收藏起来哦!

iPhone、iPad分辨率和显示屏规格

设备 分辨率 状态栏高度 导航栏高度 标签栏(工具栏)高度
iPhone6 plus设计版 1242 × 2208 60px 132px 147px
iPhone6 plus物理版 1080 × 1920 54px 132px 147px
iPhone6 750 × 1334 40px 88px 98px(88px)
iPhone5s 640 × 1136 40px 88px 98px(88px)
iPhone5c 640 × 1136 40px 88px 98px(88px)
iPhone5 640 × 1136 40px 88px 98px(88px)
iPhone4s 640 × 960 40px 88px 98px(88px)
iPhone4 640 × 960 40px 88px 98px(88px)
iPad 1024 × 768 20px 44px 49px(44px)
iPad(@2x) 2048 × 1536 40px 88px 98px(88px)

iPhone分辨率和显示屏规格

 

iPad分辨率和显示屏规格

iPhone6+缩减像素取样

在iOS上渲染像素和物理像素(physical pixels)是等同的,只有一个例外:iPhone 6 Plus的Retina HD显示屏。
由于它屏幕的像素分辨率要低于一个常规的@3x分辨率,所以被渲染内容会自动调整为原始尺寸的87%(从2208*1242像素来适应为1920*1082像素的显示屏分辨率)

ICON规格

描述 iPhone 6 Plus?(@3x) iPhone 6 and iPhone 5?(@2x) iPhone 4s?/4/iPod touch(@2x) iPad and iPad mini(@2x) iPad 2 and iPad mini?(@1x)
应用程序图标(应用程序所需的所有) 180 x 180 120 x 120 120 x 120 152 x 152 76 x 76
为App Store(应用程序所需的所有应用程序图标) 1024 x 1024 1024 x 1024 1024 x 1024 1024 x 1024 1024 x 1024
启动影像(所有的应用程序所需的) 设计版:1242 × 2208

物理版:1080 × 1920

iPhone 6: 750 × 1334

iPhone 5: 640 x 1136

640 x 960 1536 x 2048 (纵向)

2048 x 1536 (横向)

768 x 1024 (纵向)

1024 x 768 (横向)

Spotlight搜索结果图标(推荐) 120 x 120 80 x 80 80 x 80 80 x 80 40 x 40
设置图标(推荐) 87 x 87 58 x 58 58 x 58 58 x 58 29 x 29
工具栏和导航栏图标(可选) 约 66 x 66 约 44 x 44 约 44 x 44 约 44 x 44 约 22 x 22
标签栏图标(可选) About 75 x 75 (maximum: 144 x 96) 约 50 x 50 (最大: 96 x 64) 约 50 x 50 (最大: 96 x 64) 约 50 x 50 (maxi最大mum: 96 x 64) 约 25 x 25 (最大: 48 x 32)
默认报刊亭盖为App Store图标(书报亭应用程序所需 至少为 1024 像素的最长边 至少为 1024 像素的最长边 至少为 1024 像素的最长边 至少为 1024 像素的最长边 至少为 512 像素的最长边
网页剪辑图标(推荐的Web应用程序和网站) 180 x 180 120 x 120 120 x 120 152 x 152 76 x 76

iPhone ICON规格

 

iPad ICON规格

附录:

1:iPhone 5S, 6 以及6+显示屏区别的详细信息可参:The Ultimate Guide To iPhone Resolutions

2:圆角ICON:非官方的模板

3:iOS版本中默认字体:完整的预置字体列表

参考引文:

iOS Human Interface Guidelines?– Apple

iOS Accessibility Guidelines?– Apple

Why Control Center in iOS 10 makes sense?– Darin Dimitroff

Apple’s new design style in iOS 10 is a statement on accessibility?– Connor Mason

Complexion Reduction: A New Trend In Mobile Design?– Michael Horton

「后扁平化时代」的 i18n 和 L10n?– JJYing

The new Music app in iOS 10: a big bold confusing mess?– Sébastien Page

Big, bold, and beautiful: Apple’s design language is changing in iOS 10?– Serenity Caldwell

Designing a New Look for Instagram, Inspired by the Community?– Ian

未经允许不得转载:小月博客 » IOS iphone 苹果设计规范
微信公众号
关注我们,每天及时接收最新的学习资料
12000人已关注
分享到:
赞(0) 打赏

评论抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏