移动端用户体验设计中错误状态设计分析和实践

金无足赤，人无完人，在我们的日常生活中，在我们使用APP的过程中都难免会发生错误。错误有些时候是人为原因造成的，有些时候是系统原因造成的。不管是什么原因造成的，我们如何认识这些错误以及怎么处理这些错误，都对APP的用户体验有很大的影响。

我们常常忽视了错误状态的设计，一个不用心的错误处理或者糟糕的错误信息提示会让用户感到无比挫败，致使他们不再使用你的APP。而相反，一个处理妥当的错误状态设计能让情况转危为安。在这篇文章中，我们会探讨如何设计才能尽可能地避免用户遇到不必要的错误，以及如何设计一个好的错误提示信息。

什么是错误

错误（或者说错误状态）发生在APP无法完成预想的功能的时候，例如：

• APP没有理解用户的输入
• APP崩溃了
• 用户进行了两个不能同时进行的操作

错误已经成为了用户使用APP过程中的一个重要阻力点。幸运的是，我们可以通过精心的设计来减少这个阻力。

避免用户错误

如果你在设计一款APP，你应该熟悉设计的边界条件。举个例子，如果手机的网络环境很差，用户将很难完成提交一个表单或者同步一个数据。所以，在设计一款对用户好用的APP时，你必须考虑这些边界条件，从而减少错误的不良影响。换句话说，作为设计师你最好能通过向用户提供建议，利用边界条件和弹性机制来把错误扼杀在摇篮里。

推特对推文有严格的字数限制，当输入字数超过字数限制时，系统用红字提醒超出的字数

让错误提示信息具有引导性和一致性

尼尔森的十大可用性原则中有一条建议，优雅而清晰地告知用户发生错误的情况。一个有效的错误提示信息包括以下信息：

• 清晰地告知用户发生了什么
• 解释用户如何解决问题
• 尽可能保存用户已输入的信息

用户表单输入错误

用户确认提交表单信息后，意味着APP与用户建立了对话关系，系统有义务在用户遇到错误和不确定状况的时候能帮助他们渡过难关。这个过程应该更加情感化，而不是充满冷冰冰的技术术语。

关于输入错误最重要的原则是：“主动跟用户交流！当错误发生时告知他们！”一般来说，一个好的表单包括三个要点：

• 在恰当的时间和地点告知错误
• 恰当的提示文本颜色
• 简洁的提示信息语言

这三个要点都有一个共同的目标——避免困惑。

在恰当的时间和地点告知错误 （内联检验）

用户不喜欢他们填完所有表单，然后提交后系统才告知他们填写错误。最好的时机是用户刚填完信息就告知他们是否填写正确，实时表单验证能帮助我们实现这个功能。

实时内联检验系统，能立即告知用户刚输入的数据是否正确。实时检验后，如果填写区域有明显的错误提示，提交按钮将无法点击直到错误被改正。实时检验能帮助用户更快地纠正错误，而不是让他们点完提交按钮后才知道错误的发生。

下面是几个内联检验的例子：

• 用户名已注册

图片来源：Material Design

• 超过字数限制

恰当的颜色（符合直觉的设计）

在设计验证效果时颜色是最好的工具。因为它能触发人的本能反应，红色的信息表示错误，黄色的信息表示警告，这种暗示效果是非常显著的。错误提示信息的颜色要与背景色作好对比使它更易读，但要保证你的产品的界面颜色对所有用户的可及性（accessible），这是一个好的视觉设计中的重要组成部分。

让所有用户都能注意到提示信息。

清晰易懂的提示内容（告知用户发生了什么）

你要让错误提示信息，像是一个有血有肉的人写出来的。为了达到这个目标，你应该使用和用户同样的语言，避免一些技术术语，提示信息应该清晰地描述：

• 发生了什么错误以及可能的原因。
• 用户应该如何修正错误。

第一个错误案例中只告知用户数据验证错误而没有告知用户为什么发生错误（是拼写错误？还是已占用？）。图片来源：Material Design

APP自身的错误

这种错误跟用户输入无关，是系统因某种原因无法呈现给用户他们想要看到的结果。这种情况就应该向用户解释，为什么没有结果以及相应的解决方法。

数据同步错误/无法加载

当数据连接中断，信息无法加载的时候，我们应该直接告诉他们具体情况。由于我们无法呈现信息，我们可以设计一个空白状态页来填补这个空白。可惜大多数空白状态页都看起来太……空白了。就像下面这个案例，错误信息只说明了“系统发生了一个错误”，并没有提供任何有帮助的信息。

将你设计的错误信息想象成一次跟用户的交谈，在用户遇到挫折时，你用友好、具有帮助的话语来帮助用户了解基本情况并鼓励他们解决这个问题。

遇到错误时就像置身于孤岛一般感到迷惑和不安？没关系！请遵循系统的建议，保持冷静，点上火把，然后下拉刷新。

如果合适的话，你也可以在空白状态页放上按钮或链接来帮助用户完成任务。但要注意的是，你提供的选项要确保是奏效的。举个例子，你知道用户点击“再试一次”的按钮后仍无法解决错误，这时就应该去掉这个选项。

永远不要使用生硬的技术语言来描述错误。

这个错误提示是程序员写给程序员看的

不要自以为是地认为用户了解错误发生的原因或认为他们懂技术，你要用通俗易懂的语言来描述错误。

不相容状态错误

不相容状态错误发生在当用户尝试运行两个互相冲突的操作时，例如在飞行模式打电话或是在没有网络的情况下看在线视频。你应该清楚地告知用户他们正在选择的状态是怎样的，以防止发生不相容状态的错误。简单来说，就是不要让他们开始他们不能完成的操作。

阐明问题发生的原因和来源。

结论

关于错误状态的设计，最好的解决方案就是不让错误发生，我们要尽可能地在用户犯错之前引导用户通往正确的道路。如果错误无法避免要发生，一个设计良好的错误状态设计，不仅能教导用户如何使用app，还不会让用户认为自己很愚蠢。

本文来自成都品牌网站建设网站设计制作公司-创新互联 

标签：创新互联,手机建站,响应式网站

当前题目：移动端用户体验设计中错误状态设计分析和实践
文章源于：/news/164455.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有用户体验等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联