火星网校
iPhone6的UI设计尺寸规范，原来如此重要！
发布时间：2024-07-03 18:37:47 浏览量：729次
很多iOS APP的UI设计都以iPhone6为基准，这样既方便向上适配iPhone7尺寸，又方便向下适配iPhone5尺寸。下面让小编分享一下iPhone6界面设计尺寸的规范。
1. 界面尺寸规范
1.1 界面尺寸大小为：750x1334px。
1.2 状态栏（status bar）高度为：40px。
1.3 导航栏（navigation）高度为：88px。
1.4 主菜单栏（submenu，tab）高度为：98px。
1.5 内容区域（content）高度为：1108px。
图标尺寸规范：
- 导航栏和工具栏尺寸：44x44px
- 标签栏尺寸：75x75px
- 导航栏文字最大尺寸：34-36px
- 标签栏图标下文字大小：20px
- 内容区域文字大小范围：20px - 34px
3. 设置界面的图标高度和开关滑动按钮高度为58px。
4. 可点击高度规范统一为88px。
5. 搜索栏高度统一为58px。
6. 界面元素之间的距离规范：
在iPhone6设计稿中，亲密距离为20px，疏远距离为30px。
A、疏远距离：比如，元素距离屏幕左边的距离。
B、亲密距离：比如，左侧图标与右侧文字之间的距离。
7. 原型设计需要考虑不同屏幕尺寸的苹果手机，iPhone5对应@1x屏幕尺寸为320x568px，iPhone6对应@1x屏幕尺寸为375x667px，iPhone6Plus对应@1x屏幕尺寸为414x736px。
8. iPhone6Plus对应@3x，iPhone6对应@2x，iPhone5对应@2x。
iPhone6Plus对应1242x2208px的@3x像素分辨率，逻辑分辨率为414x981px；iPhone6对应750x1334px的@2x像素分辨率，逻辑分辨率为375x889px；iPhone5对应640x1135px的@2x像素分辨率，逻辑分辨率为320x757px。
想要学习更多关于UI设计的知识吗？快来火星时代教育，我们提供游戏设计培训、动画培训、UI设计培训等课程，让您成为数字艺术领域的专家！点击咨询
热门课程推荐
热门资讯
-
将为大家介绍12个绝佳的UI设计网站,这些网站不仅可以为你提供灵感,还可以帮助你学习新的技巧,助力你的创意之旅!dribbbleDribbble 是一个面向设计师的...
-
2. 移动端UI设计中常见的5种APP界面类型，你get到了吗？
通过介绍移动端UI设计中的闪屏页、引导页、浮层引导页、空白页和首页等5种APP界面类型，帮助大家更好地了解UI设计的基本知识
-
怎样可以提升你的UI设计能力!第一个:站酷站酷想必是设计师都知道的一个网站,里面不止有UI设计的资源,还有其他设计的,不如:平面设计、网页设计、字体...
-
在移动端设计中,列表页和表单页是不可或缺的部分。一个好的列表页和表单页设计能够让用户轻松地获取信息并产生点击欲望,从而提高点击率。本文将为你...
-
对于想要提高自己的设计能力和创造力的小白和UI设计师来说,这本书是一个很好的选择。4.《设计的觉醒》(IKKO TANAKA)推荐理由: 这本书是日本现代平面...
-
想要了解iPhone6界面设计的尺寸规范吗？这里为您详细介绍iPhone6的UI设计尺寸规范，包括界面尺寸、图标尺寸、可点击高度规范、搜索栏高度规范以及界面元素之间的距离规范。
-
那么,要学习UI设计就要学习哪些课程呢? 其实,UI设计课程涉及到许多领域,一般分为艺术设计课程、设计辅导课程、图形课程、测试课程、动画示范课程等几...
-
8. Photoshop操作教程：自制电子印章 | PS技巧详解
想要学会制作电子公章吗？跟随本教程，详细介绍Photoshop操作步骤，让您轻松掌握PS技巧，制作精美电子印章。
-
学习平面设计要用到哪些软件？随着社会的发展，平面设计在我们日常生活中越来越重要。想了解平面设计软件都有哪些吗？本文为您介绍Photoshop、CorelDRAW、AI和CAD这四款必备的设计软件。
-
10. 物联网APP UI设计:创造智能硬件领域的沉浸式体验
ui设计应该让用户一目了然,能够快速找到所需的信息和功能。在设计过程中,应尽量使用简洁的图标、文字和色彩,避免过多的视觉干扰。符合用户习惯:ui设...
