移动体验设计禁忌 Mobile UX Design What Not to Do

分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友 微信微信
查看查看131 回复回复4 收藏收藏 分享淘帖 转播转播 分享分享 微信
查看: 131|回复: 4
收起左侧

移动体验设计禁忌 Mobile UX Design What Not to Do

[复制链接]
射鸡狮 发表于 2016-8-26 02:32:45 | 显示全部楼层 |阅读模式
快来登录
获取优质的苹果资讯内容
收藏热门的iOS等技术干货
拷贝下载Swift Demo源代码
订阅梳理好了的知识点专辑

我们一开始为什么去安装应用程序?是为了使我们的生活更方便。但当一个应用无法满足这一要求时,用户肯定就会离它而去。一个应用的成功是受多种因素影响的,其中整体移动用户体验是最重要的影响因素。绝佳的用户体验是一个应用程序成功的关键。

就移动用户体验设计而言,不断地实践是检验其好坏的一条必经之路。在这篇文章中我们聚焦于基础。我们需要去解决的是如何避免打断用户或者强迫用户思考的问题。

移动体验设计禁忌 Mobile UX Design What Not to Do 0

移动体验设计禁忌 Mobile UX Design What Not to Do - 敏捷大拇指 - 移动体验设计禁忌 Mobile UX Design What Not to Do 0





1、多平台用户界面设计

界面是能使应用的用户体验脱颖而出的一个重要的因素。大多数的开发人员都希望在不同终端上发布他们的应用。当你为多平台规划应用时,请记住每个平台都有自己规范和特质。适用于一个平台的完美设计决策可能会在另一个平台上显得格格不入。



1.1、请勿盲目模仿其它平台的UI元素和字体

当你在iOS或安卓平台上创建应用时,不要从其他平台上照搬有鲜明主题的UI元素,也不要模仿它们的特定行为。因为如果你从一个平台上复制元素到另一个平台,就极有可能影响用户体验和转换率。

输入框、复选框、开关以及其他的功能控件的选择应该基于本平台的特征。尽可能的使用原生控件,以便让用户知道如何使用它们。用户在录入敏感数据或支付细节时才会更加信任你的应用。下面的例子是iOS和安卓平台中相同内容的显示差异:

移动体验设计禁忌 Mobile UX Design What Not to Do 1

移动体验设计禁忌 Mobile UX Design What Not to Do - 敏捷大拇指 - 移动体验设计禁忌 Mobile UX Design What Not to Do 1

图1,安卓中的UI元素(上)和iOS中的UI元素(下)

相比于Material design,iOS应用通常外观扁平,不使用厚度和阴影。 iOS版也有一个纯文本样式的按钮,但它与安卓的全大写字母不同,并且字体更纤细。

移动体验设计禁忌 Mobile UX Design What Not to Do 2

移动体验设计禁忌 Mobile UX Design What Not to Do - 敏捷大拇指 - 移动体验设计禁忌 Mobile UX Design What Not to Do 2

图2,安卓的MATERIAL DESIGN(左)VS. IOS(右),图片来源:TUTSPLUS

字体也需要遵循每个平台的标准:安卓使用Roboto字体,iOS使用San Francisco字体系列。

移动体验设计禁忌 Mobile UX Design What Not to Do 3

移动体验设计禁忌 Mobile UX Design What Not to Do - 敏捷大拇指 - 移动体验设计禁忌 Mobile UX Design What Not to Do 3

图3,根据不同字体便可以判断你所使用的是安卓的应用还是iOS的应用

如果你想自定义应用中的界面元素,请仔细根据你的品牌来设计,而不是把另一个不同平台的规范作为依据。



1.2、不要照搬平台特定的图标

每个平台通常都提供成套的常用功能图标,例如分享、新建文档或删除。当你把应用程序迁移到另一个平台时,应该把对应的图标替换成当前平台的特定图标。

你也应该注意到每个平台自身独特的风格:安卓系统图标通常使用较粗的笔触,而iOS乐于使用笔画较细的线形图标。以下是几个图标的对比图:

移动体验设计禁忌 Mobile UX Design What Not to Do 4

移动体验设计禁忌 Mobile UX Design What Not to Do - 敏捷大拇指 - 移动体验设计禁忌 Mobile UX Design What Not to Do 4

图4,安卓常用功能图标(上) iOS常用功能图标(下)



1.3、不要把网站的体验复制到应用程序上

用户对移动应用的交互模式和界面元素有特殊的期待。当网页端的设计出现在移动应用时就显得很奇怪,这并不是因为哪里出错了,而是用户对于网页和移动应用的期望是不同的。举个例子:比如带下划线的链接。你应该避免去使用带下划线链接的文字,这属于网页而不是移动应用(移动应用使用按钮不使用链接)。

下面的案例是关于TD银行iOS端应用的登录表单。它明显看起来像是手机网页的设计而非手机应用。结果表明,他们只是把网页代码复制上去后封装成应用程序:链接是带下划线的,甚至在界面上还有版权声明!

移动体验设计禁忌 Mobile UX Design What Not to Do 5

移动体验设计禁忌 Mobile UX Design What Not to Do - 敏捷大拇指 - 移动体验设计禁忌 Mobile UX Design What Not to Do 5

图5,TB银行APP缺乏一个应用程序应有的特质




2、用户流程



2.1、你的应用程序里都不应该有“死胡同”

用户体验设计本质上就是在设计流程,而流程在多数情况下是用来完成用户目标的。你应该避免在应用程序出现死胡同,因为这会给用户带来困惑并且导致不必要的操作。有时候,设计师会把错误消息和空状态作为空页面处理,但实际上这是一个提供有用信息的好机会。就拿Spotify的这种错误状态页面举例:

移动体验设计禁忌 Mobile UX Design What Not to Do 6

移动体验设计禁忌 Mobile UX Design What Not to Do - 敏捷大拇指 - 移动体验设计禁忌 Mobile UX Design What Not to Do 6

图6,死胡同空页面,图片来源:SPOTIFY

它完全没有帮助用户理解情况,也没有回答用户:“我到底该做什么?”这个问题。

空白状态(尤其是错误状态)不应该是一个死胡同的状态,它应该告诉用户需要怎样操作才能看到相应内容,从而使应用程序正常运行。

移动体验设计禁忌 Mobile UX Design What Not to Do 7

移动体验设计禁忌 Mobile UX Design What Not to Do - 敏捷大拇指 - 移动体验设计禁忌 Mobile UX Design What Not to Do 7

图7,AZENDOO的错误状态有一个简单的“如何解决问题”的说明



2.2、不要把用户引向浏览器

用户在使用应用程序时,所有操作都应该在该应用程序中进行。如果应用程序缺少某些功能和内容,尝试使用一些嵌入应用的浏览器;但是不要调出手机的浏览器,这样会导致用户失去方向并无法返回原先的应用程序。这会提高用户抛弃应用的概率从而转化率会降低。

移动体验设计禁忌 Mobile UX Design What Not to Do 8

移动体验设计禁忌 Mobile UX Design What Not to Do - 敏捷大拇指 - 移动体验设计禁忌 Mobile UX Design What Not to Do 8

图8,FACEBOOK安卓版APP里的“忘记密码?”按钮



2.3、不要在用户下载应用程序后立即要求评分

没有人想要被打断,尤其是当一些没用的东西出现在显示重要内容的中间位置时。避免打断用户,让这些最近才下载App或者只用过寥寥几次的用户为你的应用程序评分。相反,等到用户被证明是多次使用者,他们将更有可能为您的应用程序评分并提供更有价值的反馈。

移动体验设计禁忌 Mobile UX Design What Not to Do 9