错误屏幕和提示:用户体验设计实践

任何通往成功的道路都不仅有成就,也有失败和错误。对于数字产品来说,它的工作方式是一样的:只有在完美的世界中,人和应用程序才能没有错误、误解、技术故障和不可预测的场景进行交流。好吧,我们没有人在那里,我们在现实世界中。在这里,各种错误是任何用户体验不可或缺的一部分,因此设计人员和开发人员没有机会避免处理它们。让我们做好准备:今天我们收集了一篇文章,专门讨论 Web 和移动用户界面中的各种错误。在这里,我们将讨论错误的类型和原因,以及减少它们可能带来的负面影响的设计策略和实践。

什么是接口错误

界面错误是应用程序无法执行用户想要的操作时的状态或条件。它通常发生在三种典型情况下:

  • 应用程序无法执行请求的操作(字面上,就像没有这样的技术可能性或功能)
  • 应用无法理解用户的输入(或输入无效)
  • 用户尝试组合无法协同工作的操作(这通常是因为用户不知道应用程序内部的进程)

当然,错误是用户体验中令人讨厌甚至令人沮丧的一部分。然而,没有办法避免它们,因此设计师、开发人员和 UX 作家必须考虑如何使这种交互更加用户友好和流畅。为什么这很重要?因为除了在现实生活中,虚拟错误也很重要心理影响并形成负面情绪背景。例如,研究测量由智能手机互动引起的心理压力表明出现的错误消息与皮质醇水平之间存在直接联系,皮质醇水平是已知的压力生物标志物。它会增加焦虑感,并促使用户在他们开始分析原因之前停止尝试与产品互动。那么,让我们看看如何处理这些情况。

这是在我们网站上填写订阅表格的错误的样子

错误的最佳用户体验实践

错误就像打架:最好的就是从未发生过的。有不同的错误预防策略,例如工具提示, 提示, 教程, 方向线索、建议、亮点、限制等。但是,对于已经遇到错误的用户,您应该怎么做?让我们介绍一些可以有效设计错误的要点,这些错误不会使用户立即转回您的应用程序。

使错误立即引人注目

这可能看起来很明显,但不要被它欺骗:看起来很明显的事情必须考虑两次。关于错误可能发生的最糟糕的事情是用户完全不了解正在发生的事情并且在过程中迷失了方向。始终对用户诚实,不要试图掩盖错误。就算界面超级好极简主义者任何外来元素都会伤害你完美主义设计师的眼睛和灵魂。如果它不起作用,美丽也无所谓。

例如,如果用户正在填写由 10 个不同字段组成的表单,不要只是告诉他们该表单没有正确填写,不要让他们从一个字段搜索到另一个他们犯错的字段,也不要'希望他们会这样做。使出错的字段超级可见,节省用户的精力和时间。

使用公认的视觉标记

了解心智模型和众所周知的用户行为模式,用户体验设计师可以减少认知负担。这在默认情况下非常令人不快的错误情况下尤其重要。错误屏幕和消息可能不是进行实验的最佳位置,因此请考虑大多数用户可以快速识别的标记。红色和感叹号仍然是吸引用户注意错误的最流行方式之一。但是,使用颜色作为标记错误的唯一方法时要小心:检查它是否适用于色盲用户。此外,请注意不同设备上的高度可读性。

以下是在 ArtStation 上标记注册错误的方式:系统用颜色标记字段并用文本提示解释问题。

解释发生了什么

无论错误的原因是什么,您可能会感到不想解释任何事情,只是继续解决问题。这是一个错误。首先,您可能会一次又一次地让用户回到这种错误情况,因为他们不明白他们的操作或应用程序响应出了什么问题。其次,我们已经提到过,错误确实会引发焦虑的心理状态,你可能无法预测这个错误是否会成为错误互动模式的一部分。因此,一定要找到一种方法来快速解释错误的性质并让用户了解情况。例如,不要只是通知(“您无法登录应用程序”),而是将消息解释为(“用户名或密码不匹配”)。

不要添加更多需要的操作

您可能想做的另一件事是将所有错误放在单独的页面或弹出窗口中,以使它们尽可能吸引人。不要过度使用它:在大多数情况下,只需在交互区域中制作颜色对比标记就足够了,而不是弹出附加的模态窗口,并显示需要另一次不必要的点击才能让用户返回同一页面的消息。想象一下,您正在填写注册表并收到错误提示;毫无疑问,你会很快讨厌它。不要让您的用户体验到:旨在提供内联验证并将消息保持在错误字段附近。

但是,如果由于错误而需要将用户重定向到另一个页面,则弹出窗口将很有帮助。因此,对于每种情况,都要考虑所有利弊,并很好地针对您的解决方案。

当用户尝试在不添加电子邮件的情况下完成发送联系表单时,Tubik 网站中的错误就是这样标记的。

简单写

使错误消息尽可能简单明了至关重要。对目标用户清楚,而不是对创建该产品的设计师或开发人员而言。避免使用您可能与 QA 工程师一起使用的特殊术语和行话,例如(例如“发生错误 4.7”或“发生语法错误”)。不要使用长复杂的句子。不要做冗长华丽的介绍,这对他们来说不是最好的地方。快点切入正题,让它得体。

不要责怪用户

有一个简单的方法可以让糟糕的情况变得更糟:告诉用户他们不够聪明,无法与这个应用程序交互,这就是错误发生的原因。冒犯,不是吗?无论您以何种形式包装此消息,都会伤害已经担心事情不会按他们想要的方式进行的用户。所以,不要责怪用户,要有礼貌、友好和乐于助人,这对于设置正确的情境情感背景很重要。尝试使用明确的说明而不是责备:例如,说“输入有效的电子邮件地址”而不是“您输入了无效的电子邮件地址”。

有建设性

以正确的方式向用户告知错误是不够的:无论您丢失的信息是多么友好,如果您不知道下一步该做什么,它都不是超级有价值的。因此,请尽快让用户知道如何解决问题。一些流行的做法如下:

  • 如果这是一个网络界面,请提供移动到网站其他页面的选项,首先, 主页
  • 在手机界面,让后退一步或快速连接到错误点变得容易
  • 对于复杂的表格和流程,每一步都做,而不是在所有流程的最后做

考虑使用图像和图标

这不是人们感知和解码的秘密 图像比文字快. 所以,深思熟虑地使用图标 或者 图像在错误屏幕上可以使通信更快,节省用户的精力和好心情。更重要的是,图像具有很大的情感吸引力潜力,可以减少处理错误的紧张程度。

测试和分析

不要幻想错误呈现的工作在项目的 UI/UX 设计阶段就完成了。它永远不会停止,因为来自真实用户的反馈是改善用户流量的最佳方式。A/B 测试 不同的选项,仔细分析哪些是最脆弱的区域和交互,并使用调查结果在可能的情况下防止错误,并在错误不可避免的情况下使流程顺畅。

如果合适的话,增加乐趣

错误信息的页面或屏幕可以使用游戏化、互动内容或其他方式来增加乐趣,从而减少负面影响。一个很好的例子是 Dribbble 上的 404 页面:因为它​​的目标受众是设计师,该资源利用他们天生的创造性好奇心来为错误情况增添乐趣,因此用户可以看到流行设计的集合以及相似的调色板。在页面上,用户可以继续游戏并尝试其他颜色或使用集成在错误页面中的搜索字段搜索他们需要的内容。

做得好的错误清单

所以,总而言之,精心设计的错误宁愿坚持以下几点:

  • 可读的 并且清楚
  • 很容易被注意到
  • 建设性的
  • 省力
  • 礼貌友好
  • 合理的情绪化

作者:Marina Yalanska

本页面最后更新于 2021年07月15日 10:32