2.2 ios与Andriod的设计规范

平台页面布局规范

ios(总结:经典的延续)


2.2 ios与Andriod的设计规范_第1张图片
clipboard.png

页眉——导航栏
用于实现再应用不同信息层级结构间的导航,有时候也可用于管理当前屏幕内容。
页脚——工具栏
用于防止操作当前屏幕中各对象的控件。
页脚——标签栏(最多承载5个)
标签栏让用户在不同的任务、界面和模式中进行切换

Andriod(总结:变化与统一)

2.2 ios与Andriod的设计规范_第2张图片
clipboard.png

页眉——操作栏(Action Bar)

2.2 ios与Andriod的设计规范_第3张图片
clipboard.png

两种快速界面切换的规范

2.2 ios与Andriod的设计规范_第4张图片
clipboard.png

操作栏也可以转移到下面,界面会变得更简洁干净。但是会增加误操作的风险,操作栏用于实现APP内视图的切换和层级间的导航
(返回上层),还会防止一些重要控件。

操作栏也可以转移到下面,界面会变得更简洁干净。但是会增加误操作的风险,操作栏用于实现APP内视图的切换和层级间的导航
(返回上层),还会防止一些重要控件。

安卓5.0在扁平化的基础上增加了了一个z轴变化,增加了页面的质感和层次感
安卓5.0的规范

2.2 ios与Andriod的设计规范_第5张图片
clipboard.png

页眉——应用栏(APP Bar)
应用栏在以前的安卓版本中被叫做操作栏,是用来显示应用的标识,应用导航,内容搜索以及其他操作。例如:


2.2 ios与Andriod的设计规范_第6张图片
clipboard.png

界面切换放到了抽屉式的导航里面(安卓5.0)


2.2 ios与Andriod的设计规范_第7张图片
clipboard.png

2.2 ios与Andriod的设计规范_第8张图片
clipboard.png

二级界面可以直接加载抽屉式导航的下面,但是这样对用户来说切换不是很好切换,也不好点击。这个时候我们可以参照上图所示的方式将二级页面放到二级导航栏里面。

平台常用控件

控件——控制元件,用户通过控件来操作界面状态或设定状态


2.2 ios与Andriod的设计规范_第9张图片
clipboard.png

在两个平台里面,搜索框的控件也是不一样的。


2.2 ios与Andriod的设计规范_第10张图片
clipboard.png

当用户等待时间比较短时,我们使用无限循环指示器,如果我们等待时间有可能比较长时,我们则使用进度条告诉用户我们当前所执行的进度时怎么样的。


2.2 ios与Andriod的设计规范_第11张图片
clipboard.png

平台常用手势

优势:直观化和快捷高效


2.2 ios与Andriod的设计规范_第12张图片
clipboard.png

例如ios端删除右滑,而安卓则是长按出现删除按钮

文章整理自网易云课堂学习笔记

你可能感兴趣的:(2.2 ios与Andriod的设计规范)