iosapp图标尺寸(ios应用图标尺寸)
ios app icon需要哪些尺寸
首先,确定你的app是针对iPhone的,还是ipad的,或者2者都支持.
Iphone
简述:iphone平台一般要求3种规格的图片:1x、2x、3x,也是就Icon.png、Icon@2x.png、Icon@3x.png.
可在Xcode工程Image.xcassets里拖拽设置.
Ipad
简述:Ipad稍与Iphone不同,没有3x图.
Universal apps
简述:顾名思义,2个平台都支持,所需的文件也就是2个平台都需要的.
总结:以上就是 App Icon的尺寸要求.
ios图标尺寸
看了一下新的苹果开发文档和Xcode给的AppIcon坑,发现又新增了一些尺寸的图标。在这里整理一下最新的最全的icon尺寸。
itunes中使用的icon
1024 * 1024
iPhone: iOS7-10桌面图标
60 * 60
120 * 120 @2x
180 * 180 @3x
iPhone: iOS5-6桌面App图标
57 * 57
114 * 114 @2x
iPad: iOS7-10桌面图标
76 * 76
152 * 152 @2x
iPad: iOS5-6桌面图标
72 * 72
144 * 144 @2x
iPhone: iOS5-6的搜索 iOS5-10的设置
iPad: iOS5-10的设置
29 * 29
58 * 58 @2x
87 * 87 @3x
iPad: iOS5-6系统搜索图标
50 * 50
100 * 100 @2x
iPhone、iPad: iOS7-10系统搜索图标
40 * 40
80 * 80 @2x
120 * 120 @3x
iPhone、iPad: iOS7-10通知栏图标
20 * 20
40 * 40 @2x
80 * 80 @3x
iPad Pro: App桌面图标
167 * 167 @2x
iPhone汇总:
1024 * 1024
120 * 120
180 * 180
20 * 20
40 * 40
80 * 80
29 * 29
58 * 58
87 * 87
57 * 57 (iOS5-6)
114 * 114 (iOS5-6)
iPad汇总:
1024 * 1024
76 * 76
152 * 152
20 * 20
40 * 40
80 * 80
120 * 120
29 * 29
58 * 58
72 * 72 (iOS5-6)
144 * 144 (iOS5-6)
50 * 50 (iOS5-6)
100 * 100 (iOS5-6)
167 * 167 (iPad Pro)
安卓/ios中,app设计时常见的尺寸有哪些
大家都知道手机采用的:一个是苹果的iOS系统,另一个就是谷歌公司的安卓系统。华为的鸿蒙系统虽然早就上线,但是还没有真正运用在手机移动端上,小阿在这里期待着,希望有一天也能写“华为‘鸿蒙系统’的界面尺寸规范。”
这两者之间有一个明显的区别就是iOS系统是非开源的,简单来说就是不能别随意改动的,连图标都是必须带圆角的,对交互设计师很友好的。
而安卓系统就是开源的,界面可以随意改动,尺寸也没有特别的规范,图标、尺寸成千上万种,根据手机品牌不同,形状也不同,对于交互设计稍微有那么些许不友好。
今天我们的主题就是探讨iOS的界面尺寸规范。首先苹果分为两种尺寸,一种是中码比如6s、7、8等,这种我们一般切图命名为@2X。还有一种就是plus版本,这种一般切图命名为@3X。
今天我们的主题就是探讨iOS的界面尺寸规范。
首先苹果分为两种尺寸,一种是中码比如6s、7、8等,这种我们一般切图命名为@2X。还有一种就是Plus版本,这种一般切图命名为@3X。
苹果6s 的尺寸750px * 1334px,6s plus的尺寸就是1242px * 2208 px。两者之间的关系就是1.5倍,怎么说呢,就是6s之类的手机想要变成Plus,我们设计师稍微想要偷懒一下设计,只需要整体扩大1.5倍,比如图标。
来分析一下界面的尺寸规范:
首先是状态栏,就是信号电池栏的高度为40px。导航栏部分,就是“设置”栏高度为88px。
而下边的底部栏(导航栏)高度则为98px。
注意这三种尺寸是规定比较死的。我们做开发遇到Plus版把以上尺寸等比例扩大1.5倍就可以了。剩下的中间空白部分,我们就可以任意填充内容,Banner或者图标?
☆ 关于图标部分
苹果的图标极具有美感,完全符合栅格黄金比例,所以看起来十分协调。因为都是使用的网格进行规范化设计,所以一整套图标都保持着高统一性。
整个点击图标最小不能小于44px,一般大小为58px,圆角为12px,但是我们习惯取为整数60Px,就会非常的标准。为什么一定有最小的控制呢?因为我们手指有一个触碰面呀~低于上述的宽度,就可能碰不到。一定要非常注意用户的使用感受哦。
☆ 关于分割线部分
注意分割线不是一条线,是一个宽度为1px的矩形,而且颜色多为灰色。
☆ 关于板块与板块之间
板块与板块之间的灰色条间隔是30-70之间,一般来说取整数。iOS系统采取了70 px,有利于减轻用户的阅读负担。列表的高度一般高于88 px,列表与列表之间的距离是10px-30px,太小会有碰撞。作为UI设计师,这一点是要考虑的是吧?
☆ 关于列表中的尺寸规范以及字体要求
☆ 关于左右间隔的安全区域
这个安全区域又称之为留白边距,iOS的原生态页面【设置】页面的边距是30px,根据不同产品有不同的调整,宽度一般在16px--30px浮动,更大的特点就是数值全是偶数。
☆ 关于切换按钮的尺寸
☆ 关于字体
iOS系统的字体是苹方字体,字体的颜色和粗细也大有讲究,标题等文字就是粗体,一些说明文字等就是浅色非加粗体。常常用文字的粗细体来区分重要信息和次要信息,进行信息层级的划分。字体颜色很少采用纯黑色,一般用的是深灰色和浅灰色。
主标题的字体大小设置一般是32-36左右,加粗居中。列表中的文字就要小一些,字体大小为30,不会加粗。辅助性字体大小一般24-26。说明文字一般不会小于22,最小设置为20,再小就看不到啦。
另外需要注意的一点是所有的字号设置都必须为偶数,上下级内容字号极差关系为2-4号。
浅谈iOS APP设计规范-按照iphone6尺寸
现在iOS app 的尺寸也变多了,要适配到各种尺寸需要选择一个折中的尺寸来向上向下适配,以前一般用的是iphone5的尺寸,iPhone6 plus出现后,iPhone6尺寸成了大多数设计师的选择。
一、iPhone6的界面布局是:
屏幕是4.7英寸的,设计稿的大小750x1334px
☆ 状态栏(status bar):就是电量条,其高度为:40px;
☆ 导航栏(navigation):就是顶部条,其高度为:88px;
☆ 主菜单栏(submenu,tab):就是标签栏,底部条,其高度为:98px;
☆ 内容区域(content):就是屏幕中间的区域,其高度为:1334px-40px-88px-98px=1108px
二、关于iPhone6的图标的尺寸是:
☆导航栏的图标高度为44px(绝大部分功能按钮)左右,标签栏的图标尺寸为50x50px左右,更大为96x64px。
☆关闭按钮34px*34px,返回按钮26px,简单笔画图标40px。
三、常用的可点击高度-登陆框、密码框、功能列表等,统一设成88px。
四、搜索栏、输入框、评论框、地址框的高度,在iPhone6的原型图上,统一设成58px或60px。
五、在iPhone6设计稿中,界面元素之间的常用距离。
常用间距-亲密距离:20px(与边缘距离);疏远距离:30px;
其它距离-10px,44px等;
区块间隔:30-40px。
A、疏远距离:比如,改图标距离手机屏幕最左边的距离;
B、亲密距离:比如,左边图标与右边文字之间的距离。
六、黑白灰颜色常用的数值是:
① 文字黑色#333
② 文字深灰色#666
③ 文字浅灰色#999
④ 边框浅灰色#e5e5e5
⑤ 背景淡灰色#f2f2f2
⑥ 按钮背景纯白色#ffffff
一、注意事项
1、在每个项目设计中只使用1-2个字体样式,而在品牌字有明确的规范的情况下,只需要一种字体贯穿全文,通过对字体放大来强调重点文案。字体用的太多,越显得不够专业。
2、不同的样式的字体,形状或系列更好相同,保证字体风格的一致性。
3、字体与背景的层次要分明,确保字体样式与色调气氛相匹配
二、界面中文字选用的规则
在不同平台的界面设计中规范的字体会有不同,像移动界面的设计就会有固定的字体样式,网页中会有常用的几个字体。
以下是在72像素/英寸下的规范
移动端常规字体
IOS:常选择华文黑体或者冬青黑体,尤其是冬青黑体效果更好, 方正兰亭黑和方正黑体简 、方正中等线也运用的比较多。
三、字体的大小
1、导航栏的文字大小是36-38px;
2、标题字号:32px ,34px;
3、内容区域的正文文字大小是:28px,30px;
4、辅助性文字:20px , 24px,26px;
5、标签栏(或主菜单栏)的图标下方的文字大小为20px;
6、终极原则:不大于所在要件高度的一半;
7、行间距:字号的1.2-1.5倍。
下图是百度用户体验做过的一个小调查,可以看出用户可接受的文字大小:
版权声明
本文仅代表作者观点,不代表本站立场。
本文系作者授权发表,未经许可,不得转载。