编者按:个App,为什么iOS 和Android 交互操作有那么大区?本文将用大量原生设计案例,为你说明它们为什么应该这样做,赶紧学起来!
了解并适当结合平台规范与优势,才做到最佳的户体验。
为了创建最佳的生 APP,就需要你牢记 iOS 和 Android 之间的差异。这些差异不仅在视觉层面有所不同,在结构和流程上也有别。牢记这些差异,才能给生应用以最佳的用户体验。
用于 iOS Android 的原应用具特殊的系统内置功能。 Apple Google 的规范建议尽可能使用平台标准控件:页面布局,标签栏,分割线,表格视图,集合视图拆分视图。 用户熟悉这些控件每平台的一般操作方式,因此如果使用标准控件,用户将会非常直观的知道如何使用。 本文将聚焦于 iOS Android 的交互设计模式之间的别,阐 iOS 和 Android 上的应用起来不同的因,以及它为什应该这做。 另外,本文还将提供生应用计示例,以帮助你更好的理解本文所写的内容。
一、导航模式的差异
在界面之间切换是移动应用中的常见操作。考虑 iOS 和 Android 生应用控件规范的差异,对于导航模式的计关键。 Android 备底部有一个全局导航栏, 使用导航栏中的后退按钮是返回上一个界面或步骤的简便方法,它适用于所有 Android 应用。
△ 全局导航栏(Android)
对比 Apple,设方法却截然不同。 iOS 全局导航栏,因此我们不能指望 Android 原控件那样能支持全局返回。 这特性就会影响到 iOS 应用的设,应用中需设一导航栏,并左角加一返回按钮。
△ iOS的返回按钮
严来说,iOS 也有一个返回的局操,直接在界面上右滑即返回上一级页面。(译者注:个特我原来还不道,现在已经用的很顺手。)
△ 局返回操(iOS)
在这情况下,iOS 和 Android 区在于,在 iOS 设备上页右滑是返回上级,而在 Android 上则是切换标签。
为了保持与他移应的一致性,一定要记住平台之间的差异。
△ 左滑操作切换标签(Android)
二、应用内部的导航模式在iOS和Android上是不同的
在 Material Design 设计规范中有一些同的导航模式。在 Android 应中被大熟知的导航模式是抽屉和标签形式的组合。
抽屉导航其实是一个菜,通过点击汉堡图标,然后从左侧或右侧滑出。标签栏一位于标题栏的下方,使得内容能够好地被管理,通过标签栏,用户可以对应用的视图,数据集和功能进行切换。
△ 左侧就是抽屉导航;右侧是标签栏
Material Design 中还一组件叫底部导航。这组件对于安卓原应用也非常重。底部的单项很易点击操作。但安卓规范其实不建议同时使用底部导航标签,因它可能会导航时引起混乱。
△ 底部导航(Material Design)
在 Apple 的人机互规范中,没有类似抽屉菜单的标准导航控件。相反,Apple 则建议将局导航放在标签栏中。标签栏放在应用的底部,让应用的核心功能能够快速切换。
常,底部栏标签不会过5个。正如你看到那样,这个组件常像安卓端底部导航,是在 iOS 这形导航更加常用。
△ iOS两常见导航形,分段控制和底部标签栏
虽然在两个操作系统中都有类似的功(切换标签和分控制,导航和标签栏),但导航形式仍然是 iOS 和 Android 之间的要区别之一。 两者之间存在一些客观差异,例如 Android 中有全导航栏而在 iOS 中却没有,及两者在视觉上的差异。
Apple 认为,常用导航入应该尽可能的外置,一些用户不常用的功能才需要被放进汉堡菜中。而对比安卓规范,通常会把主要导航也放在汉堡菜中。
三、改造标准控件需要额外的开发时间,用户也缺乏使用经验
如果希望应用中的每个素在各个上起来都一,那将需要额外的开发工作来创建最佳的移动应用计。最麻烦的是涉及默认控件,比如选按钮、复选框、tab切换等等,这些控件需要一个定制的视图来实现显示 Android 上类似 iOS 的控件或 iOS 上类似 Android 的控件。
每平台的交互方式各其独特性。好的设尊重不同平台用户习惯的设。 iOS Android 设移动应用时,一记住平台之间的差异,这样能设出满足用户望的应用。
两个平台差异的一个例子是期选择器。安卓用户对 iOS 中常见的老虎机形式的期选择器并不熟悉。在 Android 中使用种类型的期选择器还需要重新局,样无形中增加开的难度和时间,并使界面看来与系统风不。
△ 左边是iOS标准期选择器; 右边是Android标准期选择器
△ 左边是iOS标准选择器;右边是Android标准选择器
四、iOS和Android中的按钮样式
在 Android 设计规范中有2种不同样式的按钮——扁平的和凸的。按钮分别用在不同的场下。在 Android 中,按钮上的文字一般是大写。在 iOS 原生应用的按钮中有时也能找到大写的文字,但更的情况是出现在标题上。
△ 左边是标准的Android按钮;右边是标准的iOS按钮
有常有特按钮类型——在 Android 上叫做浮动按钮,在 iOS 上叫做活动按钮。浮动按钮用来展示应用主要操作。例如,在邮件 APP 写邮件,或者在社交 APP 发状态都会用到这个浮动按钮。而在 iOS 与类似按钮则叫做活动按钮,常会放在底部导航。
△ 左边是标准iOS活动按钮;右侧是标准Android浮动按钮
五、iOS与Android底部操作视图的差异
在 Android 有两不类型底部操作视图:模态视图和常驻视图。模态视图又有两不类型:具有不操作内容模态列表和用户击「共享」图标后显示应用列表。在 iOS 上也能找到类似组件,是在设计风格和布局上异比较大。
△ 左边是标准Android底部菜单视图;右边是标准iOS标准菜单视图
六、在触摸范围和系统网格之间存在的差异
iOS 和 Android 触摸范围略有不(iOS 最小触摸范围为44px @1x,Android 为48dp/48px @1x)。Android 规范议将所有元素以 8dp 作为规范基线来设计。
七、字体差异
iOS 系统默认体是 San Francisco 而 Android 系统默认体则是 Roboto。Noto 是能在 Android 所有界都适用体,括那些不支持 Roboto 体语。正是为有异,所以需要密切关注不平台排版和布局规范。
△ 左边是Android体; 右边 是iOS体
八、交互细节差异
用户第印象常都是立在设计层。
建立户的第一印象对产来说很重要。在 APP 开发设计过程中,我们可通过做好微交互和画来为户创建一个有吸引的体验。
让确下个的交互和动画的规则和建议,并查官方给出的一些标准示例。
焦点优先级——交互设的目的将用户的注意力集中应用中对他真重的事, 两平台都不鼓励滥用动画,因过多的动画易分散用户的注意力,也会让用户感到焦虑。
一致和级结构——请务必住,互设计最重要的是通确定元素之间的级关系,帮助用户在应用中找到他们想要的。贴心,流畅,不突兀的页面跳转才能证用户能轻松操。对一点来说,两个平台对动画规范做一合理的建议。
尽管 Android Material Design(材料设计规范)与 iOS Human Interface(交互规范)在使用动画规范常相似,仍有些明确异。 用户会习惯于特定平台动画跳转并认为有他们习惯那些才是最自然。
这就是为么要特别注意平台间的交互形式,这些小的细节可很好的升户体验,使得在同平台上都给户带来自然的体验。
九、iOS
iOS 户习惯于 iOS 中的微画,像平滑过渡,横竖屏转向及模拟物规律等等。当应现无意义的或者违反物识的画时,户就会感到困惑。 例如,户希望通过拉来刷界面,希望通过右滑来返。iOS 设计规范强烈议,除正在创诸如游戏类沉浸体验,否则是尽可能按照官出动画规范来设计。
十、Android
依照 Material Design 规范,个元素在转换过程分为传出,传入或常驻,不元素也会有不转换。
画够引导户的注意。当界面发生变时,画建立了过渡前后的连续性。导航的切换是界面中非重要的元素。它们通过清晰的结构来帮助户准自己的方向。例如,当一个 UI 元素展开填充整个屏幕时,展开后的界面是点开元素的子级,返可到父级。
△ 子父级切换的例子(Android设计规范)
在父界面上,嵌入的素会在点击抬起并在适当的位置展开。将过渡的重点放在界面上,确父之间的关系。
共享相同的父级界面(例如标签切换时的内)一致性的移动能够强化他们的关系。
标签选项卡固一置不变,内界面水平方向行移动。
在应用的最上,切换目标通常被分在主要任务(任务能彼此不相关)上。界面通改变不透明度和缩放值来进行适当的转换。
总结
当也有例外:一 iOS 应用遵循 Android 设计规范(比 Gmail)而一 Android 应用则遵循 iOS 设计规范(比 Instagram)。
△ 左边是iOS版的Gmail,右边是Android版的Gmail
△ 左边是iOS版的Instagram,右边是Android的Instagram
其实显而易见——使用两个平台系统自身组件设计应用,流程要快很多。此,最好是花些时了解下两个平台不设计规范,而不是混合 iOS 和 Android 组件模型,然后花很多力在开发上。
原链接:《Differences between Designing Native iOS Apps and Native Android Apps》 SteelKiwi Inc.
欢迎关注译者的公众号:「 彩云译计」