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

分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友 微信微信
查看查看117 回复回复4 收藏收藏 分享淘帖 转播转播 分享分享 微信
查看: 117|回复: 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

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

图9,在一开始启动应用就弹出评分要求是很糟糕的时机

你可以在用户已经使用该应用程序一段时间并完成一定的任务目标后发出评分请求。Dan Counsell在关于征求用户反馈的正确时机上有一些值得关注的见解。这是他关于Clear(一个待办事项应用)的说法:“Clear在ios系统上的评分信息对话框是基于一定的条件才会弹出的。首先,用户必须已使用该App几个星期;其次,Clear只会在用户已经清掉列表上所有的提醒事项后才会出现评分请求。这是一个询问用户反馈的极好时机,因为此时他们刚刚清空了待办事项列表,准备退出应用程序。”

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

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

图10,选择最佳时机,特别是在用户与应用程序有良性互动之后  图片来源:CLEAR

请求用户反馈并没有错,但是请记住你要给用户提供一个很棒的体验。




3、结论

人们对于应用程序有很高的期望,而且标准越来越高。因此你需要努力去达到这些期望,并且使你的应用程序更加令人愉悦,而不是令人厌烦。提高用户体验不是一次性的任务,它是一个持续性的工作。




作者:NICK BABICH

都看到这里了,就把这篇资料推荐给您的好朋友吧,让他们也感受一下。

回帖是一种美德,也是对楼主发帖的尊重和支持。您的赞赏是我前进的方向。

*声明:敏捷大拇指是全球最大的Swift开发者社区、苹果粉丝家园、智能移动门户,所载内容仅限于传递更多最新信息,并不意味赞同其观点或证实其描述;内容仅供参考,并非绝对正确的建议。本站不对上述信息的真实性、合法性、完整性做出保证;转载请注明来源并加上本站链接,敏捷大拇指将保留所有法律权益。如有疑问或建议,邮件至marketing@swifthumb.com

*联系:微信公众平台:“swifthumb” / 腾讯微博:@swifthumb / 新浪微博:@swifthumb / 官方QQ一群:343549891(满) / 官方QQ二群:245285613 ,需要报上用户名才会被同意进群,请先注册敏捷大拇指

评分

参与人数 1金钱 +10 贡献 +10 专家分 +10 收起 理由
Anewczs + 10 + 10 + 10 32个赞!专家给力!

查看全部评分

乔大爷 发表于 2016-8-27 18:39:56 | 显示全部楼层
Nice
rightnow 发表于 2016-8-28 23:35:50 | 显示全部楼层
多平台用户界面设计,就是要开发好几套UI了
h5lover 发表于 2016-8-28 23:46:33 | 显示全部楼层
自适应的Web页面怎么办?

怎么写CSS才可以做到“安卓使用Roboto字体,iOS使用San Francisco字体系列”?

难道要去后台判断不同的客户端再分发不同的CSS?
昏戏湿 发表于 2016-8-29 00:51:26 | 显示全部楼层
遇到有死胡同逻辑的App,我一般都是直接删除卸载的
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

淘帖专辑
我要发帖

分享扩散

都看到这里了,就把这资料推荐给您的好朋友吧,让他们也感受一下。
您的每一位朋友访问此永久链接后,您都将获得相应的金钱积分奖励
热门推荐

合作伙伴

Swift小苹果

  • 北京治世天下科技有限公司
  • ©2014-2016 敏捷大拇指
  • 京ICP备14029482号
  • Powered by Discuz! X3.1 Licensed
  • swifthumb Wechat Code
  •   
快速回复 返回顶部 返回列表