IAMUE
  • Home
  • 文章分类
    • 交互
      • 从零开始学交互
      • IxD案例
      • 微信热点
    • UXD
    • Wireframes
    • GUID
    • PM
  • More
    • AID
    • 资源下载
    • 作品集
    • 电子书:《从零开始做交互》
    • Sketch 4.9 - Sketch全系列免费下载(更新Sketch4.9)
    • 淘宝手机H5版UX移动交互设计规范
    • Axure基础入门
    • 隐私政策

浅谈iOS与Android设计规范:6类交互设计规范对比

Catherine • 2017-05-03 23:44 • 交互设计

iOS和Android两个不同的平台,肯定是有很多区别的,下面就从交互的角度,谈谈区别。

文章目录[隐藏]

  • 一、全局导航
  • 二、二级导航
  • 三、工具栏
  • 四、提示框
  • 五、警示框
  • 六、手势定义
  • 结语

iOS和Android两个不同的平台,肯定是有很多区别的,下面就从交互的角度,谈谈区别。

浅谈iOS与Android设计规范:6类交互设计规范对比

以前就读过IOS和Android的规范,但是觉得没啥大用处,因为现在APP为了保持一致性,通常在IOS和Android上的设计是一样的,而且一些小公司只设计IOS的交互原型,因为只要IOS上能用,安卓上肯定没问题,前段时间,和一个人聊,问我它俩的区别,当时一脸懵逼,不知从何说起。毕竟是两个不同的平台,肯定是有很多区别的,下面就从交互的角度,谈谈区别。

一、全局导航

  • IOS:通常放在底部,方便用户点击
  • Android:通常放在上面,下面有物理按键,防止误操作。

浅谈iOS与Android设计规范:6类交互设计规范对比

浅谈iOS与Android设计规范:6类交互设计规范对比

解析:因为Android比IOS多了物理按键,为了防止误操作,所以只能将全局导航放在上面,但是随着屏幕越来越大,上面是手指无法触及的区域,所以切换起来相对成本较高。

二、二级导航

  • IOS:通常放返回、上一级标题、标题(居中),操作通常只有一个
  • Android:通常返回控件、logo、下拉菜单、重要操作、更多操作

浅谈iOS与Android设计规范:6类交互设计规范对比

浅谈iOS与Android设计规范:6类交互设计规范对比

解析:IOS显示了上一级的名称,让用户点击返回后,心里有预期,Android放了APP的logo,增加了品牌性,但是就使用来讲,用户不知道点击会回到哪,下拉菜单和更多操作都需要点击才能显示,增加了操作步骤。

三、工具栏

  • IOS:通常放在最下面,方便操作
  • Android:放在导航栏里,将重要操作放在外面,其他放在更多里。

浅谈iOS与Android设计规范:6类交互设计规范对比

浅谈iOS与Android设计规范:6类交互设计规范对比

解析:IOS将操作都放在底部,区域更大,操作更方便。Android将操作放在了顶部,显得很拥挤,并且还收起了一部分,需要用户查找,但是却节省了空间,让内容显示区更大。

四、提示框

  • IOS:出现在屏幕中间,可以带图标,可以不带,可以是静态的,也可以是动态的。
  • Android:不可以带图标,不能是动态的,最多只可以带一个操作按钮,最多只能出现一个提示,不能和低端的悬浮按钮重合。

浅谈iOS与Android设计规范:6类交互设计规范对比

浅谈iOS与Android设计规范:6类交互设计规范对比

解析:IOS的设计理念是尽量不打扰用户,只要用户能看见变化,轻易不会出现提示,只有一些用户无法感知时,才会出现提示框,所以可以是动态的,像调节音量。Android的提示要比IOS重一些,因为它可以带一个按钮。

五、警示框

IOS:标题和按钮是必须的,可以有内容和输入

浅谈iOS与Android设计规范:6类交互设计规范对比

浅谈iOS与Android设计规范:6类交互设计规范对比

Android:主要有四种:用途、内容、事件、表现。

1、用途包含了标题,内容和事件。

浅谈iOS与Android设计规范:6类交互设计规范对比

2、内容:只包含标题和内容

浅谈iOS与Android设计规范:6类交互设计规范对比

3、事件:标题、内容、更多操作按钮(不只是接受不接受)

浅谈iOS与Android设计规范:6类交互设计规范对比

4、表现:有标题、可输入、可操作、有按钮。

浅谈iOS与Android设计规范:6类交互设计规范对比

解析:警示框按钮的排列是一致的,左侧是消极的,右侧是积极的。IOS的警示框划分要少一些,构成就是标题和按钮,也可以解释和输入。但是,Android要复杂的多,分了4种情况,但是我觉得第一种和第三种差不多,标题和内容是必须的,按钮和输入可以选择。

六、手势定义

IOS的手势规定有8种,如下:

浅谈iOS与Android设计规范:6类交互设计规范对比

Android:将手势进行了单指和双指的划分,有14种。

  • 单次触击(Touch):一只手指按下,提起
  • 双次触击(Double Touch):两只手指按下,提起,其中一只手指按下,提起
  • 拖拽(Drag),轻滑(Swipe)和快掷(Fling):一只手指按下,移动再提起
  • 长按:一只手指按下,稍后再提起
  • 长按拖动:一只手指按下后稍后,移动,再提起
  • 双触拖动:一只手指按下后提起,再按下后,拖动,再提起
  • 捏放(Pinch Open):双指按下,向外移动,再提起
  • 捏合:双指按下,向内移动,再提起
  • 双指触击:双指快速按下,提起
  • 双指拖拽,轻滑和快掷:两指按下,移动后提起
  • 双指长按:双指按下,稍后提起
  • 双指长按拖动:双指按下,稍后移动,再提起
  • 双指双次触击:双指快速按下提起,重复一次该动作
  • 旋转:双指按下,以指间中点为圆心快速转动,再提起

解析:IOS只有8种手势,Android有14种,但是很多都不常用,个人感觉IOS的8种已经完全够用了,定义那么多种,用户的学习成本就会提高,而且Android的有些手势并没有定义可以做什么,所以给出这么多手势也没有用。

结语

本文对IOS和Android的规范进行了对比,Android的规范那是相当详细,但是IOS的只给出了设计原则,所以,一些是我自己总结的,可能对比的还不够全面,欢迎大家一起讨论。

 

本文由 @设计Zan 原创发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/23076/

AndroidioslogoUEDUX交互交互设计交互设计规范产品产品经理原型图标用户设计设计原则设计规范转载
赞 (0)
CatherineCatherine
0
生成海报
认知设计论:关于认知最全面的一篇
上一篇 2017-05-03 22:33
视觉设计师需要懂的4个设计原理
下一篇 2017-05-04 00:53

相关推荐

  • 2014年APP分类排行 交互设计

    2014年APP分类排行

    纵观全年,在APP应用领域有四大类发展最为迅速,分别是社交、支付、导航以及美化软件。此外,打车软件则是在2014年一新兴产品,该类软件的推出填补了APP领域的一项空白,同时也是用户的一大刚需,在很短时间内就被…

    2015-01-13
  • 【译文】作为新手,我该如何学习Web设计 交互设计

    【译文】作为新手,我该如何学习Web设计

    我现在对于网页开发一无所知,我应该学习什么能让我可以在六个月之内开发任何网站?无论是看书或者开展项目都可以。 简单引导: 学习基础知识.  看一本书,而不是文章 设计一些东西.  从一款很酷的设计工具开始,比…

    2016-08-04
  • 【交互】做上进的设计师,交互设计大趋势! 从零开始学交互

    【交互】做上进的设计师,交互设计大趋势!

    一群关注趋势的小伙伴,从大量的APP中去发现设计范式,挖掘设计趋势,预测出在移动产品中会被广泛应用的十大交互设计趋势。希望这些新颖的设计模式,为设计师们带来创新设计灵感,进而为用户带来新鲜有趣的体验。|…

    2017-08-01
  • 微信热点

    Axure 原型 | 用Axure画流程图

    当前浏览器不支持播放音乐或语音,请在微信或其他浏览器中播放吻得太逼真张敬轩 - Urban Emotions作者:陈张良来源:简书用Axure绘制流程图好处是可以随时预览,比较灵活。不过就是没有Visio那么多模板和强大的功能。Axure默认的流程图控件:其实我们最常用的是:矩形、菱形、箭头。因为这些基本图形其实并没有形象的表明它们是什么,更多的还是需要使用者根据自身的流程实际情况多加注释,所以大部分流程图只需使用这两个控件即可。Axu...

    2018-03-04
  • 扇贝单词App软件的交互思路,神还原! 交互设计

    扇贝单词App软件的交互思路,神还原!

    本篇勾文思路,重点是明白设计软件为了什么?而不要盲目设计,时刻记住目标。

    2017-05-13
  • 百度地图:智能化设计探索,让出行更简单 交互设计

    百度地图:智能化设计探索,让出行更简单

    出行一直是地图用户的核心诉求。随着移动互联科技的飞速发展,越来越多的出行服务参与到地图用户的生活中,同时也使得用户的出行场景变得复杂多变。但传统地图的出行功能无论从产品还是从用户体验上,大多只满足了用户规划路线、导航驾车等基础需求。所以,探索用户的潜在出行需求,设计贴心的出行服务,让用户的出行更有效率并提升出行体验,是地图设计团队的核心目标。

    2017-05-12
  • axure官方原版教材(英文) Axure

    axure官方原版教材(英文)

    AxureCoreTraining axure rp 官方教程,PDF免费下载 推荐阅读英文版,翻译的毕竟有些差异的。   点我下载AxureCoreTraining 

    2015-06-11
  • 视觉设计-文字编排的易读性 交互设计

    视觉设计-文字编排的易读性

    在视觉设计工作中,大家总习惯将重点放在图标和色彩上。但实际上,作为一个阅读类app,思考如何让文章更易于阅读是和图形、色彩处理同等甚至更为重要。 在设计工作中,如果有100个人就会有100种设计理论,我认为并…

    2014-09-08
  • 微信热点

    交互设计暑假基础进阶班报名通道开启中

    编辑//花花对于考研,方向大于努力,为了找准跑道,慢慢摸索的路上你听了很多分享会,看过很多大牛干货,但是实践才能见真知,经验谈打不了胜战,没有领路人,考研太容易进入误区。这个暑假我们针对考研,定制了一套造型能力训练考研强化班,其作用在于,用最专业的的指导,在短时间内向学员传授训练手绘提高造型能力的方法。课程介绍01Day 01Introducing Interaction Design交互设计概论认识什么是交互设计,了解交互设计的历史演...

    2018-04-08
  • 微信热点

    3000字,详细梳理用户体验要素之核心五要素

    网站看起来如何,它怎样进行运转,它让你执行什么。这些决策都是互相依赖的,它告知并影响用户体验的各个方面。当产品发展到一定阶段,系统化的用户体验设计对于产品在激烈的商业竞争中保持核心竞争力至关重要。比如最近很火的共享单车,开锁是否方便这样一个小细节直接决定着用户选择,用户体验就成为了商机。这里与大家分享用户体验要素的核心五要素。要讨论的事今天跟大家分享的是用户体验的五个核心要素。虽然用户体验要素远不止这五个,但作为梳理一个产品的用户体验开...

    2018-03-20
  • UED书单
  • 微信精选
  • 投稿说明
  • 赞助

Copyright © 2024 WPCOM 版权所有 粤ICP备000000000号 Powered by WordPress