避免 iOS 和 Android 设计中的不良做法

已发表: 2022-03-11

您见过多少普通人同时使用 iOS 和 Android 设备? 根据这项研究,官方数字介于 10% 和 20% 之间,但该数字还包括 Mac 用户,而不仅仅是移动用户。 在实践中,人们倾向于在给定的时间内只使用一部手机或平板电脑。 如果他们碰巧使用两个设备,通常情况下,两者都将运行相同的操作系统。

这意味着没有必要为应用程序的 UI 设计制作像素完美的副本,试图适应两个平台,完成数十种不同的屏幕尺寸、纵横比和分辨率(我们甚至不要调出缺口、状态栏、导航栏、硬件按钮等)。

相反,即使用户同时在 iOS 和 Android 上查看同一个应用程序,他们也很可能更愿意在两者上体验原生的感觉。 这就是为什么许多项目经理和产品负责人在移动开发中采用的方法通常不是最理想的,需要进行微调。

为什么这仍然是一个问题?

但是为什么利益相关者和管理者仍然会做出经常降低用户体验的决策,从而破坏他们自己的产品呢? 在十年之初,每个人都还在掌握 iOS 和 Android 开发的时候,这是可以理解的,但这个恼人的问题一直持续到今天。

出现这种情况的主要原因可能是项目经理和移动开发人员表示担心,如果他们的用户在另一个平台上看到相同的应用程序,他们可能会感到困惑,并意识到它不能提供完全相同的感觉和 UI。 公平地说,在某种程度上,这种思路是有道理的,因为某种程度的相似性是必要的和受欢迎的。 然而,太过分了,在极端情况下,为不同平台制作应用程序的精确克隆实际上往往弊大于利。

最终目标应该是达到适当的平衡——不要强迫像素完美的一致性,而是坚持共同的设计理念,并保持两个平台的应用程序导航图相似; 提供相同的功能和相同的工作流程,但尽可能坚持原生行为。

每个人都喜欢随处可见的自定义按钮或精美的动画,但原生元素是人们习惯的,并且使用起来更容易、更直观。

关注用户,而不是外观

为了找到解决这一困境的好方法,我们应该从行尾——最终用户开始。 研究告诉我们,Android 和 iPhone 用户是非常不同的人,如果我们的目标是最佳用户体验,我们应该尝试了解他们的使用模式。

从人们决定每月在技术上花费的平均预算开始 iPhone:100.88 美元,Android:50.83 美元 ,通过他们每天在iPhone 上自拍的数量:12,Android:7以及他们每天发送的短信iPhone : 57, Android: 26 ,很容易发现差异很大,以至于我们可以得出结论,行为存在差异,这决定了人们使用设备的方式。

那么,在同时为两个平台设计应用程序时,我们应该关注什么?

首先,尽可能选择原生元素。 即使你使用的是跨平台框架,大部分组件都是基于纯原生视图; 所以除非你真的需要定制的东西——坚持基础。 人们喜欢使用他们习惯的东西,您将为更重要的功能(和代码审查!)节省一些开发时间。

自定义视图绝对可以为您的应用程序带来个性和独特性,只要它们保持与通用视图相同的一般想法和使用感觉 - 太少,您的应用程序很无聊,太多,它不必要地浮华且难以使用。

有时,即使是与自定义视图稍有不同的微小触摸也可能会改变您的应用程序的游戏规则,但如果您在所有屏幕上填充新元素供用户探索,他们可能会在寻找重要信息时不知所措并迷失方向。 这些细微的修饰被称为“抛光”绝非巧合!

如何处理不同的设计组件

根据经验,请始终记住每个平台都有自己的设计指南。 Android 的套路是踩着 Material Design,而 Apple 则信赖 Human Interface Design。 进入我们在规划设计时应该考虑的特定组件,有几个主要部分需要关注:

  1. 一般风格:除非我们谈论的是跨平台应用程序,否则我们应该考虑遵循每个平台的一般风格指南。 总体而言,iOS 设计倾向于更扁平化,而 Android 则采用更分层的方法。

    从历史上看,移动平台已经相互影响了十年或更长时间,你可以很容易地在 iOS 中发现一些 Android 概念,反之亦然。 例如,当指纹传感器开始出现在移动世界中时,制造商正在(并且仍在)试验传感器的尺寸和位置,试图让尽可能多的用户感到舒适。 同时,设计师和开发人员也在适应新功能,因此最终,两个平台的视觉元素和反馈基本相同(除了一些奇特的方法)。

  2. 硬件细节和导航模式:这可能是彻底克隆您的应用程序的负面影响的最引人注目的例子之一。 大多数 Android 设备仍然有一个额外的导航栏(无论是不同设备上的硬件还是软件),包括一个后退按钮。 由于 iOS 不提供该功能,因此应用程序必须考虑在何时何地提供后退按钮,通常位于每个屏幕的左上角。

    菜单按钮(本例中的方形按钮)还可以为 Android 应用程序提供附加功能。 这在哪里相关? 例如,当打开设置菜单或类似的导航功能时。

    iOS和Android导航对比

    直到最近,iPhone 还配备了 Apple 的传统 Home 按钮,但自从 iPhone X 推出以来,它一直被边缘化,iOS 中的流程现在基于手势。 如果滑动是您的应用程序的重要组成部分,请确保在应用程序容器的边缘和您允许的滑动区域之间提供足够的缓冲,以避免棘手的滑动巧合。

    如果您的应用程序依赖于特定于硬件的功能,例如蓝牙、NFC 或有线耳机,您应该始终考虑您支持的不同硬件规格的范围。 当用户尝试与特定功能交互时,尝试向他们提供适当的反馈。 如果出于某种原因,您只需要为两个平台之一提供特定于硬件的功能,请务必告知您的用户不同之处。

  3. 全局元素(状态栏、标题等):出现在您设计的所有页面上的组件,如状态栏、导航标题等,应该严格旨在提供原生感觉,所以我们不应该改变这些条的高度和样式。 两个平台上的全局元素样式存在细微差别。 例如,Android 使用左对齐文本,而 iOS 使用居中标题。 状态栏是一个原生组件,因此您无需担心它,但在规划应用的顶部时请记住不同的凹槽和屏幕纵横比。

    iOS 和 Android 状态栏和标题
  4. 导航: Google 的旧 Material Design 指南建议在 Android 应用程序中使用抽屉式菜单导航,底部导航落后,但仍然是一个可行的选择。 iOS 倾向于只使用标签栏,这可能会限制您的顶级导航选项,但可以同时提供所有选项的清晰视图。 在这种情况下,两个操作系统都提供了类似的组件,可以根据应用程序的复杂程度使用这些组件,但是两个系统的视觉差异自然会引导你——例如,Android 中的全局导航栏和 iOS 中缺乏的导航栏。

    近年来移动硬件的快速发展带来了许多变数和未知数:全屏手机、不同形状和大小的凹口、手势在设备范围内导航的使用增加等等。 所有这些变化都为用户提供了前所未有的力量,但当我们试图找出应用程序中给定屏幕的所有用例时,可能会很痛苦。 考虑到这些担忧,避免用户混淆的一个好方法是保持导航模式简单且一致,而不会使应用程序因过多的手势、条形和多方向滑动选项而过载。

    iOS 和 Android 中的导航
  5. 排版:两个平台都有它们的默认字体——iOS 的San Francisco和 Android 的Roboto 。 除非您要使用与您的一般应用程序样式紧密匹配的自定义字体,否则您应该坚持使用默认字体。 请记住,用户可能会更改他们的默认系统字体,这不会影响您使用特定字体自定义的任何视图。

    例如,如果阅读障碍用户已将默认字体替换为专门满足其需求的字体,他们可能无法在您的应用中度过最佳时光。 如果您支持可能使用非拉丁字体(如西里尔文、阿拉伯文等)的用户,请确保您的自定义字体也提供这些额外字符。 如果您喜欢游戏,您可能会看到俄罗斯玩家获得的高分排行榜,这些玩家的名字因字体不同而脱颖而出。 这只是在开发阶段犯的一个小错误,并不是针对特定玩家的“功能”,虽然它可能不会让用户放弃你的应用,但它肯定会导致用户体验下降或导致投诉或差评。

    iOS 和 Android 中的字体和字体
  6. 其他组件:按钮、屏幕转换、动画、微交互、操作表、警报和所有其他类型的流程控制超出了本文的范围,但它们应该遵循我们迄今为止应用于其他设计元素的一般原则——两个平台都不鼓励过多的自定义元素,因为它们可能会分散和混淆用户的注意力; 在设计方面,第一印象通常是许多用户的最后印象,这就是为什么从一开始就吸引用户的注意力并让他们有宾至如归的感觉如此重要的原因。

在现实世界中,您可以看到我们讨论的规则的一些非常流行的例外——遵循 Material Design 指南的 iOS 应用程序和一些遵循 Apple 人机界面指南的 Android 产品,但这些应用程序有自己的、经过验证的风格。 用户熟悉应用程序及其设计,对他们来说,提供稍微更自定义的感觉是有意义的。

跨平台方法做得对

另一方面,如果您的项目基于跨平台解决方案(如 React Native、Flutter、Xamarin 等),您应该考虑您想要关注的主要平台并从那里开始。

近年来,这些新框架极大地提高了跨平台应用程序开发的生产力。 越来越多的公司正在转向这种开发模式,因为它提供了更短的上市时间、卓越的成本效益和更少的技术障碍,主要缺点是有限的功能支持和在某些情况下不理想的用户体验。

虽然几乎所有用于跨平台开发的旧解决方案都基于 Web 视图,因此在许多设备上都遇到了严重的响应问题,但现在我们甚至可以在跨平台方法中使用本机组件。 这一重大改进在许多方面影响了市场,并使所有移动平台朝着统一各种设备和平台上的用户视觉体验迈进了一步。

如果您决定采用跨平台解决方案,则可以通过构建应用程序的骨架,从标准的原生应用程序开始。 一旦您的主要优先事项启动并运行(设置基本依赖项、构建 MVP、达到特定于项目的里程碑、发布您的第一个版本等),您可以使用平台轻松分离两个应用程序的主要设计 -每个框架提供的特定工具。 根据您团队的规模和可用的时间框架,您甚至可以考虑在版本 1 中包含这些调整,以避免将来在给定平台版本中看起来不再相同时出现混乱。

毕竟,您应该评估哪些原则对您的应用程序有效。 就像我们行业的几乎所有努力一样,您应该尝试遵循指南,同时稍微调整它们以适应您的特定需求。 例如,如果抽屉式导航对您的简单五屏应用程序真正有意义,那么您不需要为每个平台提出复杂的解决方案。 让用户轻松识别您的自定义按钮和工具,无论它们是关键组件还是次要自定义。

好的设计尊重用户习惯

总而言之,我们可以重复我们已经知道的东西——好的设计是在每个操作系统中尊重用户习惯的设计。 最后一点点润色可能会在普通应用程序和出色应用程序之间产生差异。

很多时候,您的应用无法提供足够的独特功能来仅靠内容赢得用户。 大多数人会用“直觉”来描述他们选择一种产品而不是另一种产品的决定。 这类用户的选择主要基于他们在使用应用程序时的感受,通过隐式评估他们在屏幕上看到的响应能力、一般样式选择、调色板和各个视觉组件。

因此,请尝试确保您的产品不仅凭借其惊人的功能而脱颖而出,而且还具有与其提供的服务质量相匹配的高档包装。