关于我们
uesdTo.灵感博客是为包装界服务的设计创意平台。倡导包装业通过创新制造能力和设计推动兼具美学的可持续商业包装解决方案的发展。
加入我们
暗黑

通知设计综合指南

作者:SARA VILAS SANTIAGO

原文地址:https://www.toptal.com/designers/ux/notification-design

数字产品中的外围消息(统称为通知)永远不会损害用户体验。相反,他们必须为有助于人们实现目标的体验做出贡献。在产品设计过程中尽早处理通知设计将产生更好的结果。

想象一下,一群建筑师设计了一个三层楼的房子,花了几个月的时间来设计蓝图。令人印象深刻!很美丽!但是,当他们接近完成图表时,其中一位惊呼道:“等等!人们如何从一楼到三楼?他们忘记了楼梯!

同样,产品设计师倾向于最后考虑小的但重要的UX增强功能。与空状态一样,设计人员倾向于将通知的设计(警报,错误消息,确认,公告和确认)保留到最后。当开发人员问“我们如何处理错误?因为这是事后的想法,所以这种固定方法经常会产生草率的“ frankendesigns”,这会伤及用户体验。

为避免这种情况,最好使用集成方法进行通知设计以增强用户体验。即使设计人员可能没有触手可及的所有信息,但在产品设计生命周期中设计一个全面的通知​​框架仍将有助于为不可预见的用例准备产品。

在进行通知设计时,要牢记的基本设计原则是,它们必须帮助(而不是阻碍)人们执行任务。必须尽早测试产品原型并确定用例,在这些用例中外围消息传递对协助交互很有用。但是,与用户交流的最佳方式会有所不同,并取决于以下几个关键因素:

  • 传达的信息类型
  • 信息的紧迫性-是否需要立即查看
  • 该信息是否要求用户采取措施

除了通知的样式和行为之外,还需要通过UX copy确定其音调。通知上的所有副本都必须清晰,简洁且有用。精心设计的通知系统在设计时还考虑到了可访问性,并具有适应不同语言的灵活性。

用于通知的术语趋于相似,但各个团队和项目之间的术语会略有不同。设计人员有责任确定通知框架的术语(称为“什么”),并同步每个人的使用理由:什么,在哪里以及如何使用

通过更好的通知设计来提高可用性

通知在产品可用性方面起着至关重要的作用。“系统状态的可见性”是Nielsen Norman集团在“用户界面设计的10种可用性启发法”列表中的第一名。该规则指出:“系统应始终在合理的时间内通过适当的反馈使用户了解发生的情况。

通知系统是数字产品UX的重要组成部分,如果没有它,产品就会感觉好像被遗漏了一些东西。如果没有“系统状态的可见性”和反馈,则类似于在没有仪表板的情况下驾驶汽车。

汽车的仪表板上充满了仪表,图标和指示灯,旨在提供对汽车操作系统的可见性并确保安全可靠的可操作性。当我们开车时,会发出一系列有关发动机温度,电池运行状况,机油压力,灯,刹车,安全气囊等的读数和通知,使我们随时了解情况。当我们要转弯时,转向信号灯会闪烁,同时还有咔嗒声,这两者都为我们提供了反馈。我们还有一个油箱压力表,用于指示油箱何时处于低位。

它与数字产品的工作方式相同。当涉及到可用性时,系统状态和反馈的可见性是基础,而可用性是良好的用户体验的基础。

建立有用的通知框架

为了很好地设计通知框架,从“信号强度”的角度考虑通知可能会有所帮助。哪些外围消息需要或多或少的注意?例如,可能具有破坏性的交互需要“更大声”的通知,而非破坏性的交互则需要“更安静”的通知。

向人们发送适当数量的通知是一种平衡的行为,而过分这样做会带来危险。该产品可能会得到很多负面反馈,或者最坏的情况是使人们疏远到放弃它的程度。因此,设计人员需要仔细考虑UX,仅发送具有明确定义目的的消息。给予用户灵活性以关闭所有或至少一些通知也是一个好主意。

通知设计的初始方法需要在三个级别上进行分类:高关注度,中关注度和低关注度,即“严重性级别”。然后,需要通过这三个级别上的特定属性进一步定义通知类型,无论这些属性是警报,警告,确认,错误,成功消息还是状态指示符。

标识了通知属性后,就该对构成该框架的各种通知进行分类。以下绝不是详尽的列表-通知的类型将根据产品,用例和其他变量而有所不同。(请注意:如前所述,不同的团队使用多种术语。例如,我们称“确认”为通知,需要用户批准才能进行破坏性的交互。某些团队可能将“确认”用作术语成功消息。)

高关注度

  • 警报(需要立即关注)
  • 错误(需要立即采取措施)
  • 异常(系统异常,某些功能无效)
  • 确认(可能需要用户确认才能进行的破坏性操作)

中等注意

  • 警告(无需立即采取措施)
  • 致谢(用户操作的反馈)
  • 成功讯息

低注意力

  • 信息性消息(又名被动通知,某些内容可供查看)
  • 徽章(通常在图标上,表示自上次互动以来的新内容)
  • 状态指示器(系统反馈)

设计Great Notification UX

要设计具有出色UX的产品,设计人员需要列出所有可能有用通知的用例清单。建议与开发人员合作完成此过程,因为在大多数情况下,开发人员可以保持公正并能够帮助解决设计师可能未曾考虑过的情况。

设计人员还应记录用户测试期间的所有交互,其中通知可能会提供增强UX的价值。

一旦有了列表,下一步就是根据所需的关注级别和属性对通知进行分类。同样,由于通知不应具有侵入性,因此需要谨慎进行。在此过程中要问的一些问题是:

  • 什么会触发通知?
  • 正在传达哪种类型的反馈?
  • 通知将出现在哪里以及如何显示?
  • 哪个通知需要立即互动?
  • 通知是持久的还是非持久的?

接下来,需要确定颜色编码和图标,并将其放入设计系统(或样式指南)中。在执行此过程时,设计人员需要考虑将出现通知的每个实例,并确保它们在所有背景上均正确呈现。

甚至著名的UI工具箱也使用不同的通知设计框架和术语。(来源

通知的位置也是关键。为了避免混淆界面,冒着表明明显的风险,通知应该出现在UI的顶部或底部或附近。此外,如果设计具有响应能力,则设计人员需要使用各种视口测试通知的外观。当错误消息可以通过响应的移动表格显示时,这一点尤其重要。

设计通知框架并不容易。需要考虑在不同情况下发生的许多小细节。除了可访问性和易读性之外,还需要牢记将来的本地化。在德语或日语平台上使用时,英语看上去很完美的通知系统可能会完全崩溃。

作为全局导航的一部分,B2B仪表板上显示的警报应保持可访问性。

有关定义通知行为的其他问题:

  • 如果要持续发出警报或警告,那么设计师如何确保人们离开初始屏幕后仍然可以访问它们?
  • 是否需要合并带有徽章的警报图标,以便可以看到通知档案?
  • 如果通知是非持久性的,则通知会消失多长时间,并且应该有一种在通知消失之前将其关闭的选项吗?

对于移动应用程序,不仅需要精心设计应用程序内通知,而且还必须精心设计推送通知(系统级,应用程序外部)。它们主要是中断,因此查看通知的副本以及如何以及何时请求发送它们的许可至关重要。使用过多,他们可能会阻止人们使用该应用程序。太多不必要的通知会使用户沮丧,他们可能随后使通知静音或完全停止使用该应用程序。

设计师还应该考虑可行的通知,这些通知可以使人们无需打开应用程序即可提高工作效率。使用户无需进入应用程序即可完成小任务,这可能是增强UX的强大工具。

对于移动推送通知,UX最佳实践是延迟任何形式的通知(请求访问某个人的位置,发送推送通知等),直到人们有机会稍微探索一下该应用程序为止。

需要谨慎安排移动推送通知的时间,以免疏远用户。

优秀UX的通知最佳做法

遵守以下最佳实践将确保人们将通知视为提供价值,而不是打扰,从而增强了用户体验。在设计通知系统并将其放入设计系统之前,请考虑以下基本最佳实践:

  • 通过前面讨论的三个注意级别对通知进行分类。然后,在这三个级别内定义各种形式的通知的分类法。
  • 为通知系统创建样式指南时,请以将要使用的所有语言指定通知的最大字符长度。
  • 要特别注意适应性和灵活性,以适应不同的内容类型和文本长度。
  • 为三个注意级别以及一致的图标创建一致的配色方案。
  • 创建简明易懂的通知,以提供有用的信息。
  • 仔细考虑发送什么以及何时发送。在移动设备上,延迟在新下载的应用程序上发送通知,以免疏远人们。仔细检查上下文和用例。
  • 错误地显示较少的通知,无论是警报还是警告,或其他中高关注度状态更新。相反,把它们放在一个列表中的人可以访问时,他们希望看到他们(通过图标徽章在UI表示)。
  • 考虑一个带有标记通知“不再显示”的选项的系统。
  • 诸如“小吃店”之类的非持久性确认应在最少四秒钟至最多八秒钟后从屏幕上消失,并可以选择将其尽快撤消并在适当的情况下“撤消”。
  • 对于移动设备上的高关注度通知,请尽可能考虑声音和触觉反馈。
  • 请确保在通知上以及通知显示的背景之间保持适当的对比,以提高可读性。请注意,采用流畅的响应式设计时,背景可能会在通知下转移。
移动应用公告,成功消息和确认。

错误消息的最佳做法

  • 错误消息应该简单直接,最好是可操作的,并以易于阅读和理解的语言编写。
  • 避免使用晦涩的代码和缩写,例如“收到的响应成功为假”。
  • 提供有关问题的简洁明了的描述,而不是“已发生错误” 
  • 避免责怪别人或告诉他们他们做错了事,例如,说这是“非法命令”。
  • 提供上下文中的建设性错误消息,以便人们可以解决此问题。
  • 避免仅通过将字段更改为红色来指示错误。它并没有使残疾人可以使用它。最好总是包括色盲可以看到的其他视觉提示。
  • 对表单上的输入字段使用内联验证
  • 在人们解决问题之前,错误消息不应消失。
表单上的在线验证(又称实时错误检查和清除消息)增强了UX。

概括

通知有助于提供帮助人们实现目标的体验,应该像对待其他任何数字产品组件一样对待通知。但是,通知可以双向进行。如果处理得当,它们可以提高用户体验并有助于参与度,但是如果执行不佳,则有可能成为烦人的事情。争取适当的平衡是关键。

通知不应被视为事后的想法。为了正确执行它们,设计人员必须及早解决用例,在产品设计生命周期中定义各种形式,并进行广泛的测试。

快速回顾设计通知的正确方法:

  • 尽早开始通知设计,而不是事后思考。
  • 按三个注意级别对通知进行分类:高,中和低。
  • 进行颜色编码,分配图标并确定位置。
  • 按类型分类:持久或非持久,弹出窗口,横幅,对话框等。
  • 将它们合并到设计系统中。

了解何时以及如何使用通知对于提供出色的可用性和建立产品消息传递的一致性至关重要。通过仔细评估需要在适当时候显示的外围消息,设计人员可以提高产品的效率并增强其用户体验。

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注

上一篇

不该做的–不良产品设计的美

下一篇

保持敏锐度-工作消退时如何提高创造力

相关文章