超级全面!Androidapp和iOSapp设计差异对比这样做学起来快!只有了解并妥善结合平台的规格和优势,才能达到最佳的用户体验。为了创建最好的本机应用程序,您需要牢记iOS和Android平台之间的差异。这些平台差异不仅在视觉层面上有所不同,在结构和流程上也有所不同。牢记这些差异可以为原生应用提供最佳用户体验。适用于iOS和Android的本机应用程序具有特殊的系统内置功能。Apple和Google的规范建议尽可能使用平台标准控件:页面布局、标签栏、分隔线、表格视图、集合视图和拆分视图。用户熟悉这些控件在各个平台上的一般操作方式,因此如果使用标准控件,用户将非常直观地知道如何使用它们。本文将重点介绍iOS和Android上交互设计模式之间的差异,解释为什么iOS和Android上的应用程序看起来不同,以及为什么应该如此。此外,本文还将提供本机应用程序设计示例,以帮助您更好地理解本文所写的内容。1.导航方式的差异界面切换是移动应用中常见的操作。考虑到iOS和Android本机应用程序控制规范的差异对于导航模式的设计至关重要。Android设备底部有一个全局导航栏,使用导航栏中的后退按钮是返回上一屏幕或步骤的简便方法,适用于所有Android应用程序。△与苹果的全局导航栏(安卓)相比,设计方式完全不同。iOS没有全局导航栏,所以我们不能期望像Android原生控件那样支持全局返回。此功能将影响iOS应用程序的设计。应用中需要设计一个导航栏,在左上角添加一个返回按钮。△iOS上的返回键严格来说,iOS也有一个全局的返回操作,可以直接在界面右滑返回上一页。(译者注:之前真的不知道有这个功能,现在用起来很顺手。)右滑是返回上一级,在Android上是切换标签。为了保持与其他移动应用程序的一致性,请务必牢记平台差异。△向左滑动切换标签页(Android)2.应用程序内部的导航方式在iOS和Android上是不同的。MaterialDesign设计规范中有一些不同的导航模式。Android应用程序中众所周知的导航模式是抽屉和选项卡的组合。导航抽屉实际上是一个菜单,可以通过点击汉堡包图标并将其从左侧或右侧滑出来访问。标签栏一般位于标题栏的下方,这样可以很好的管理内容。通过标签栏,用户可以切换应用的视图、数据集和功能。△左边是抽屉导航;右侧是标签栏。MaterialDesign中还有一个组件叫做底部导航。这个组件对于安卓原生应用也是非常重要的。底部菜单项易于点击和操作。但是安卓规范其实并不推荐同时使用底部导航和标签页,因为这样会造成导航时的混乱。△底部导航(MaterialDesign)在苹果的人机交互规范中,没有类似抽屉菜单的标准导航控件。相反,Apple建议将全局导航放在标签栏中。标签栏位于应用程序的底部,可以在应用程序的核心功能之间快速切换。通常,底栏标签不会超过5个。正如你所看到的,这个组件非常类似于Android上的底部导航,但这种导航形式在iOS中更为常见。△iOS两种常见的导航形式,分段式控件和底部标签栏虽然两个操作系统都有类似的功能(切换标签页和分段式控件,底部导航和标签栏),但导航形式仍然是iOS和iOS之间的主要区别之一安卓。两者之间存在一些客观差异,例如在Android中具有全局导航栏而在iOS中没有,以及两者之间的视觉差异。苹果认为,常用的导航入口尽可能放在外部,一些用户不常用的功能需要放在汉堡菜单中。与安卓规范相比,主导航通常被放置在汉堡菜单中。3.改造标准控件需要额外的开发时间和缺乏用户体验。如果您希望应用程序中的每个元素在每个平台上看起来都一样,您将需要额外的开发工作来创建最佳的移动应用程序设计。最麻烦的是当涉及到默认控件时,例如单选按钮、复选框、选项卡开关等,这些控件需要自定义视图才能在Android上显示类iOS控件或在iOS上显示类Android控件。每个平台的交互方式都有其独特之处。好的设计是尊重不同平台用户使用习惯的设计。在为iOS和Android设计移动应用程序时,务必牢记平台之间的差异,这样您才能设计出满足用户期望的应用程序。两个平台之间差异的一个例子是日期选择器。Android用户不熟悉iOS中常见的老虎机风格的日期选择器。在Android中使用这类日期选择器也需要重新布局,无形中增加了开发难度和时间,界面看起来与系统风格格格不入。△iOS标准左侧日期选择器;右侧Android标准日期选择器△左侧iOS标准选择器;右侧的Android标准选择器4.iOS和Android中的按钮样式在Android设计规范按钮中有2种不同的样式-扁平和凸起。这些按钮用于不同的场景。在Android中,按钮上的文字通常全部大写。大写文本有时也会出现在原生iOS应用程序的按钮中,但更常见于标题中。△左边是标准的安卓按钮;右边是标准的iOS按钮。还有一种非常有特色的按钮类型——Android上叫floatingbutton,iOS上叫activebutton。浮动按钮用于显示应用程序的主要操作。例如,这个浮动按钮将用于在邮件APP中写邮件,或者在社交APP中发送状态。iOS中的类似按钮称为活动按钮,通常放置在底部导航的中间。△左边是标准的iOS活动按钮;右边是标准的Android悬浮按钮5、iOS和Android底部操作视图的区别Android中底部操作视图有两种不同的类型:模态视图和常驻视图。有两种不同类型的模态视图:具有不同操作内容的模态列表和用户点击“共享”图标后显示的应用程序列表。在iOS上也可以找到类似的组件,但设计风格和布局却大不相同。△左边是标准的Android底部菜单视图;右边是标准的iOS标准菜单视图六、触摸范围和系统网格的区别iOS和Android触摸范围略有不同(iOS最小触摸范围为44px@1x,Android为48dp/48px@1x)。Android规范还建议以8dp作为规范基准来设计所有元素。7、字体差异iOS系统默认字体为SanFrancisco,Android系统默认字体为Roboto。Noto是Android所有界面都可以使用的字体,包括那些不支持Roboto字体的语言。正是因为存在差异,所以需要密切关注不同平台的排版和布局规范。△左边是安卓字体;右边是iOS字体8.交互细节差异给用户的第一印象通常基于设计层次。创造用户的第一印象对产品来说很重要。在APP开发设计过程中,做好微交互和动画,可以为用户创造有吸引力的体验。下面我们来明确下两个平台在交互和动画方面的规则和建议,看看官方给出的一些标准示例。焦点和优先级——交互设计的目的是将用户的注意力集中在应用程序中对他来说真正重要的事情上。这两个平台都不鼓励滥用动画,因为过多的动画很容易分散用户的注意力,并且会让用户感到焦虑。一致性和层次结构——重要的是要记住,交互设计就是通过识别元素之间的层次关系来帮助用户在应用程序中找到他们想要的东西。贴心、流畅、不突兀的页面跳转,确保用户轻松操作。至此,两个平台都对动画规范提出了一些合理的建议。虽然Android的MaterialDesign(材料设计规范)在动画规范的使用上与iOS的HumanInterface(人机交互规范)非常相似,但也有一些明显的区别。用户习惯了特定平台的动画过渡,并认为只有他们习惯的才是最自然的。这就是为什么我们要特别注意平台之间的交互形式。这些小细节可以很好的提升用户体验,让用户在不同的平台上都能有自然的体验。9.iOSiOS用户习惯于iOS中的微动画,比如流畅的过渡、横竖屏旋转、模拟物理规律等。当应用程序显示毫无意义或违反物理常识的动画时,用户会感到困惑。比如用户想下拉刷新界面,想右滑返回。iOS设计规范强烈建议,除非你是在创造沉浸式体验,比如游戏,否则你应该尽可能遵循官方的动画规范。10.Android按照MaterialDesign规范,一个元素在转换过程中分为传出、传入或驻留,不同的元素会有不同的转换方式。动画可以引导用户的注意力。当界面发生变化时,动画在过渡前后建立连续性。导航切换是界面中非常重要的元素。它们通过清晰的结构帮助用户定位自己。例如,当一个UI元素被展开填满整个屏幕时,展开后的新界面就是点击该元素的child,return返回到parent。△父子切换示例(Android设计规范)在父界面上,嵌入的子元素在点击时会在合适的位置提升展开。将过渡集中在子界面上,并明确子界面和父界面之间的关系。共享同一父界面的一致动作(例如选项卡切换时的内容)可以加强它们之间的关系。标签选项卡固定在一个位置,内容界面在水平方向移动。在应用程序的顶层,切换目标通常按主要任务分组(它们可能彼此不相关)。这些界面通过改变不透明度和缩放值来进行适当的转换。总结当然也有例外:一些iOS应用程序遵循Android设计指南(如Gmail),而一些Android应用程序遵循iOS设计指南(如Instagram)。△左边是iOS版的Gmail,右边是Android版的Gmail△左边是iOS版的Instagram,右边是Android版的Instagram但其实很明显——使用的组件这两个平台系统来设计应用程序,过程要快得多。因此,与其花一些时间去了解两个平台的不同设计规范,不如混用iOS和Android的组件模型,然后花大功夫去开发。
