本文概述
- 为什么这仍然是一个问题?
- 关注用户而不是外观
- 如何处理不同的设计组件
- 正确执行跨平台方法
- 良好的设计尊重用户的习惯
这意味着无需为应用程序的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。进入设计规划时应考虑的特定组件, 有几个主要部分需要关注:
【避免iOS和Android设计中的不良做法】一般样式:除非我们谈论跨平台应用程序, 否则应考虑遵循每个平台的一般样式准则。总体而言, iOS设计趋于扁平化, 而Android则采用了更加分层的方法。从历史上讲, 移动平台已经相互影响了十年或更长时间, 你可以轻松地在iOS中发现一些Android概念, 反之亦然。例如, 当指纹传感器开始出现在移动世界中时, 制造商正在(并且仍在)尝试传感器的尺寸和位置, 以使它尽可能多地适合用户。同时, 设计人员和开发人员也都在适应新功能, 因此最终, 两个平台上的视觉元素和反馈几乎都是相同的(除了一些特殊的方法)。
硬件细节和导航模式:这可能是彻底克隆你的应用程序的负面影响最明显的例子之一。大多数Android设备仍然具有附加导航栏的舒适性(无论是不同设备上的硬件还是软件), 包括后退按钮。由于iOS并未提供该功能, 因此应用程序必须考虑何时何地提供” 后退” 按钮, 通常在每个屏幕的左上角。
菜单按钮(在此示例中为方形按钮)还可以为Android应用提供其他功能。这和哪里有关系?例如, 当打开设置菜单或类似的导航功能时。
文章图片
直到最近, iPhone仍然具有Apple传统的Home按钮, 但是自从iPhone X推出以来, 它一直处于边缘状态, iOS中的流程现在基于手势。如果滑动是应用程序的重要部分, 请确保在应用程序容器的边缘和滑动区域之间留出足够的缓冲空间, 以免发生棘手的滑动重合。
如果你的应用依赖于特定于硬件的功能(例如蓝牙, NFC或有线耳机), 则应始终考虑所支持的不同硬件规格的范围。当用户尝试与特定功能进行交互时, 请尝试向用户提供适当的反馈。如果出于某种原因你仅需要为两个平台之一提供特定于硬件的功能, 请确保将差异告知你的用户。
全局元素(状态栏, 标题等):出现在设计的所有页面上的组件(例如状态栏, 导航标题等)应严格地旨在传递一种自然的感觉, 因此我们不应更改这些栏的高度和样式。在两个平台上设计全局元素的方式都存在细微差异。例如, Android使用左对齐文本, 而iOS使用居中标题。状态栏是本机组件, 因此你不必担心它, 但是在计划应用程序的顶部时, 请记住不同的标记和屏幕宽高比。
文章图片
导航:Google很好的旧版Material Design指南建议在Android应用程序中使用抽屉式菜单导航, 而底部导航会在后面, 但仍然是可行的选择。 iOS倾向于仅用于选项卡栏, 这可能会限制你的顶级导航选项, 但同时提供所有视图的清晰视图。在这种情况下, 两个操作系统都提供了可以根据应用程序的复杂性使用的相似组件, 但是两个系统之间的视觉差异自然会引导你进行操作-例如, Android中的全局导航栏以及iOS中的全局导航栏。
近年来, 移动硬件的飞速发展带来了许多变数和未知数:全屏电话, 不同形状和大小的槽口, 在整个设备范围导航中更多地使用手势等。所有这些更改为用户提供了空前的功能, 但是当我们尝试找出应用程序中给定屏幕的所有用例时, 可能会很痛苦。考虑到这些问题, 一种避免对我们的用户造成混淆的好方法是保持导航模式简单且一致, 而不会因过多的手势, 横条和多方向滑动选项而使应用程序过载。
文章图片
字体:这两个平台都有其默认字体-iOS的旧金山和Android的Roboto。除非你要使用与常规应用风格紧密匹配的自定义字体, 否则应坚持默认设置。请记住, 用户可能会更改其默认系统字体, 这不会影响你使用特定字体自定义的任何视图。
例如, 阅读障碍的用户如果将默认字体替换为专门满足其需求的字体, 则他们可能不会在你的应用中拥有最佳时间。如果你正在支持可能使用非拉丁字体(例如西里尔字母, 阿拉伯字体等)的用户, 请确保你的自定义字体也提供了这些额外的字符。如果你是游戏玩家, 你可能会看到俄罗斯球员获得的高分榜, 他们的名字因字体不同而脱颖而出。这只是在开发阶段犯的一个小错误, 不是针对特定玩家的” 功能” , 虽然它可能不会使用户放弃你的应用程序, 但肯定会导致用户体验下降或投诉或评价不佳。
文章图片
其他组件:按钮, 屏幕过渡, 动画, 微交互, 操作表, 警报和所有其他类型的流控制不在本文的讨论范围之内, 但它们应遵循到目前为止我们应用于其他设计元素的一般原理, 两个平台都不鼓励过多的自定义元素, 因为它们可能分散用户的注意力并使用户感到困惑;在设计方面, 第一印象通常是很多用户的最后印象, 这就是为什么从一开始就吸引用户的注意力并让他们有宾至如归的感觉如此重要的原因。
在现实世界中, 你可以看到我们讨论的规则的一些非常流行的例外情况-遵循Material Design准则的iOS应用程序以及适用于Apple的Human Interface准则的某些Android产品, 但是这些应用程序都有自己的成熟风格。用户熟悉应用程序及其设计, 对他们来说, 提供稍微自定义的感觉是有意义的。
正确执行跨平台方法 另一方面, 如果你的项目基于跨平台解决方案(例如React Native, Flutter, Xamarin等), 则应考虑什么是你要关注的主要平台并从那里开始。
近年来, 这些新框架在跨平台应用程序开发中提供了巨大的生产力提高。越来越多的公司开始转向这种开发模式, 因为它提供了更短的上市时间, 更高的成本效益以及更少的技术壁垒, 关键缺点是有限的功能支持和某些情况下的次优用户体验。
尽管几乎所有用于跨平台开发的较旧解决方案都是基于Web视图的, 因此在许多设备上都遇到了响应速度方面的严重问题, 但如今, 即使在跨平台方法中, 我们也可以使用本机组件。这一重大改进已从许多方面影响了市场, 并使所有移动平台朝着统一各种设备和平台上的用户视觉体验迈进了一步。
如果你决定采用跨平台解决方案, 则可以通过构建应用程序框架来像在标准本机应用程序中一样开始。一旦确定并运行了主要优先事项(设置基本依赖关系, 构建MVP, 达到特定项目的里程碑, 发布了你的第一个版本等), 便可以使用以下平台轻松地将两个应用程序的主要设计分开:每个框架提供的特定工具。根据团队的规模和可用的时间框架, 你甚至可以考虑在版本1中包括这些调整, 只是为了避免将来在给定平台版本中看起来不再相同时出现混乱。
说完一切之后, 你应该评估其中哪些原则对你的应用有效。就像我们行业中几乎所有的工作一样, 你应该尝试遵循准则, 同时根据自己的特定需求进行一些调整。例如, 如果抽屉导航对于你的简单五屏应用真正有意义, 那么你无需为每个平台提供复杂的解决方案。用户可以轻松, 轻松地识别你的自定义按钮和工具, 无论它们是关键组件还是仅是次要的自定义项。
良好的设计尊重用户的习惯 总而言之, 我们可以重复一下我们已经知道的事情:好的设计是一种在每个操作系统中都要尊重用户习惯的设计。最后只需稍加修饰, 就可以使普通应用和出色应用之间有所不同。
很多时候, 你的应用程序将无法提供足够的独特功能来仅凭内容吸引用户。大多数人会形容他们选择一种产品时会带有” 直觉” 的决定。这类用户的选择主要基于他们在使用应用程序时的感受, 即通过隐式评估他们在屏幕上看到的响应度, 常规样式选择, 调色板和单个视觉组件。
因此, 请尝试确保你的产品不仅凭借其惊人的功能而脱颖而出, 而且还具有高档包装以匹配其提供的服务质量。
推荐阅读
- 在React Native中使用Redux,RxJS和Redux-Observable构建响应式应用程序
- 保持加密,确保安全(使用ESNI,DoH和DoT)
- Spring的ApplicationContext学习
- SQLite----Android Studio3.6.3 当前最新版本数据库查找与导出方法
- Fiddler+雷电模拟器进行APP抓包
- 知识圈APP开发记录
- 安卓强弱指针分析与测试
- 深入解析丨母婴App如何迅速收割2W新用户()
- 华为Android三面成功通过,面试官都问了什么()