Logo



iosapp设计规范(安卓和ios的设计规范)

本文目录一览:

设计APP平面时图片的分辨率是多少?

1、苹果iOS版本的iphone APP UI设计尺寸规范:

2、Andriod 版本的APP UI设计尺寸规范

主流的手机设计尺寸:460*800 px 1280*720 px 设计版本是:1280*720 px

视觉设计师通常在480x800px下进行设觉设计,然后进行适配HVGA(320×480)等。

我们设计稿的尺寸是选最大的 1280*720来设计。然后按照常用的分辨率来切几个版

ios和android设计规范区别

Android 整体视觉设计规范

App 界面iosapp设计规范的整体视觉组成大致可以分为四个部分iosapp设计规范

StatusBar(状态栏)、TopBar(头部栏)、Body Content(内容区域)、FootBar(底部栏)。

StatusBar 的样式由系统 UI 决定iosapp设计规范,除背景配色外,不需要做其iosapp设计规范他的设计。

TopBar 两个系统平台规范上的显示高度与内容布局有明显的差异,按各自的规范进行设计。

Body Content 除控件外,采用相同的布局与视觉设计。

FootBar 除控件外,采用相同的布局与视觉设计。

二、Android差异化设计案例解读

1. StatusBar/TopBar 差异化设计

2. 常用的三个系统图标/控件差异化

3. 搜索/输入控件差异化

4. 弹窗样式差异化

三、Android系统交互与iOS系统交互的差异化设计

1. 交互方式:

除了上面提到了弹窗样式与交互差异化之外,对于一些系统交互行为,推荐尽量使用 iOS 与 Android 各自平台的系统控件与交互方式,降低开发与用户学习成本。系统交互行为主要包含以:返回上级/关闭当前页面的方式、通知开启或者关闭设置、发送/提交内容(键盘自带或者新增按钮点击)、Item 列表排序/删除、提示窗显隐、时间选择控件、手势操作等等。

2. 交互动效:

交互动效也推荐尽量使用 iOS 与 Android 各自平台的系统提供的动效。比如 iOS 的镜头切近与高斯模糊,Android 的纸墨磁吸等等。

单条 item 的交互差异示例

总体来说,就是以 iOS 版为参照,底部栏与中间内容区域尽量保持相同的设计,通过对状态栏、头部样式、控件(开关、选框、搜索、输入)、系统图标(返回、分享、更多)、弹窗样式、系统交互进行 Android 规范化差异,以保证该 App 的设计在两个不同的系统平台即能符合中国用户的使用习惯,又能适当体现系统的不同风格与特性。

安卓/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和安卓的设计规范有何不同

是一种基于Linux的自由及开放源代码的操作系统。主要使用于移动设备iosapp设计规范,如智能手机和平板电脑,由Google公司和开放手机联盟领导及开发。

iOS是苹果公司的移动操作系统。

iOS是由苹果公司开发的移动操作系统,苹果公司最早于2007年1月9日的Macworld大会上公布这个系统,最初是设计给iPhone使用的,后来陆续套用到iPod touch、iPad以及Apple TV等产品上。

iOS和安卓的ui区别二:UI设计规范不一样。

具体的UI设计规范详解请点击阅读:iOS、Android、WindowsPhone官方设计规范汇总

比如现在通常设计的尺寸对比如下:

iOS: 750*1334 或者 1242*2208

android 720*1280 或者 1080*1920

iOS和安卓的ui区别三:导航方式不一样

iOS的Tab放在页面底部,不能通过滑动来切换,只能点击。也有放在上面的,也不能滑动,但有些Tab本身可以滑动,比如天猫的。还有新闻类的应用。

Android一般放在页面顶端,可以通过滑动页面来切换Tab,当然Tab可以点击切换,Tab多的话,Tab本身也可以滑动。比如豌豆荚,百度贴吧,QQ。总之,Android啥都可以有。

iOS和安卓的UI区别四:单条item的操作

iOS单条item的操作有两种,点击和滑动,点击一般进入一个新的页面,滑动会出现对这条item的一些常用操作,如微信里滑动一条对话,会出现标记未读和删除。

Android中,单条item的操作也有两种,点击和长按,点击一般进入一个新的页面。长按进入一个编辑模式,可以在里面进行批量和其他一个操作,比如删除,顶置等等。比如小米的短信页面;长按也可以弹出情境操作栏dialog,进行操作,比如Android版的微信。

OS和安卓的UI区别五:实体键

iOS只有一个实体键(音量,电源不算哈),home键,这个键有这么几个功能:

1、按一次,回到桌面。

2 、双击,出现多任务界面

3、iOS8里面,轻触两下Home键,调出单手模式

4 、指纹解锁

Android有四个实体键(现在很多被屏幕上的虚拟键代替,但功效是一样的)4.4一下的分别是back键,home键,menu键,和搜索键。4.4及以上,是back键,home键,多任务键。安卓原生是这样,经过优化的Android就不一定iosapp设计规范了,比如魅族的smart bar,根据当前页面情景变化,不过蛮好用。

Android的back键,在大部分情况下,和页面上的返回功效一样。不过,Android的back键可以在应用件切换,还可以返回主屏幕。这个iOS里面的键不能在应用间直接切换。

iOS和安卓的UI区别六:浮窗设计元素不一样

安卓里可以看到各种浮窗,流量,清理内存等等。iOS暂时还不支持这样的浮窗。越狱的貌似可以。

iOS和安卓的UI区别七:图标尺寸和命名规范不一样

1、iOS和安卓手机的APP图标尺寸规范和图标命名规范

2、对比PC、iOS、Android等终端APP的交互设计的差异化

  iosapp设计规范 


评论


最新评论