在交互设计中,一种系统,无论是应用程序、网站还是硬件(从一个系统中的任何东西)智能手表恒温器),应始终让用户了解情况,通过提供适当的反馈。确保系统的状态始终可见是其中之一10界面设计的10个可用性启发式. 有关系统状态的信息(如错误消息和系统活动通知)允许用户完全了解当前上下文。

传达系统状态的最佳方式取决于几个关键因素:

  • 所传达的信息类型
  • 信息的紧迫性—用户立即看到信息的重要性
  • 用户是否需要根据信息采取行动

三种常见的状态通信方法包括验证、通知和状态指示器。这些术语有时在产品设计中可以互换使用,但它们代表了在不同情况下应该使用的不同的通信方法。了解它们之间的差异将有助于您通过为每种需求选择最佳选项来提高对用户的反馈。

指标

指示符是一种生成页面元素的方法(无论是内容还是用户界面的一部分)脱颖而出,通知用户有特殊的东西值得用户注意。通常,指示符将表示该元素所表示的项发生了一些更改。

虽然我们将在稍后看到,但是,指示器被频繁使用以发信号验证错误或通知,它们也可以自己使用。指标是视觉提示,旨在吸引用户对特定内容或UI元素的注意力本质上的关注。(如果有些东西总是看起来一样,这不是一个指标,无论它是如何设计的。)

实施指标至少有三种可能的方法:

  • 通常,但并非总是,指标的实施方式如下:图标. 容易可识别的图标可以成为非常有效的沟通工具。
  • 排版变体也可用作指示符;例如,如果股票的价格发生了实质性的变化,则在投资账户中使用粗体未读电子邮件或彩色编码股票符号的常见惯例。
  • 虽然不常见,但放大了大小动画(例如振动)也可用于使某些项目从人群中脱颖而出,从而作为一个指标。
Yelp在搜索结果中使用了一个绿色标签指示器来表示茶叶市场有一个特殊的交易。该指标传达了有关茶叶市场的更多信息。

指标特征:

  • 指标是上下文. 它们与一个UI元素或一段内容相关联,并且应该显示在该元素附近。
  • 指标是条件-它们并不总是存在,而是根据特定的条件出现或改变。例如,一个股票绩效指标,如下面美国世纪的例子,可能会改变,以表明股票价格是上升还是下降。此外,上面的Yelp示例中的标记指示符仅在该企业有交易时出现。
  • 指标是被动的. 它们不要求用户采取行动,而是作为一种交流工具来提示用户注意到一些事情。
American Century Investments使用条件指标来提供有关特定股票表现的信息。当日变化为负值时,指示灯是一个向下的红色箭头。当日变化为正值时,显示一个向上的绿色箭头。股票表现的状况影响了价格旁边显示的指标。

指示器会给整个界面带来噪音和混乱,可能会分散用户的注意力,因此在设计中考虑使用多少(如果有的话)指示器是很重要的。

在决定指标是否合适时,请考虑以下因素:

  • 信息对用户有多重要?是否值得占用页面空间来通知用户?
    • 信息多久使用一次?
    • 用户希望看到这些信息吗?
    • 如果不提供会不会错过?
  • 用户发现信息对应用程序有多重要?

验证

验证消息是错误消息与用户的输入有关:他们传达刚刚输入的数据是不完整的还是不正确的。例如,在电子商务系统中,验证消息通常涉及诸如姓名、帐单地址和信用卡信息之类的信息。

Cobragolf.com网站提供了一条验证消息,明确指出了哪个字段出错。然而,这个信息是复杂和混乱的。更好的信息可能是“请输入有效的电子邮件地址。”

验证特点:

  • 用户需要采取措施清除验证消息。
  • 验证消息中的信息是上下文的,适用于具有问题的特定用户输入。

验证的实现方式因表单的独特需求而异。但是,一般来说,如果用户的输入不正确,系统应该通过提供一个可识别和清晰的信息来通知用户,以帮助纠正错误。验证消息应遵循错误消息指南他们应该告诉用户如何修复它,而不是简单地识别问题。例如,请勿状态“字段为空”。请输入您的街道地址“更有礼貌并指导解决方案。

由于验证是上下文,因此使用一个有助于图标指示器以及验证消息,以帮助传达哪些输入丢失或需要更正。

百思买网站提供了一条有用的验证消息,告诉用户如何解决问题,还使用了图标指示器和不同的颜色来吸引用户对需要更正的字段的注意。

通知

通知是信息邮件提醒用户系统中的一般事件。与验证不同,通知可能不直接与用户输入绑定或者甚至用户在系统中的当前活动,但它们通常会通知用户系统状态的更改或可能感兴趣的事件。在电子邮件、社交网络和移动电话应用程序中,甚至可以在用户离开应用程序时发送通知。

通知可以是上下文- 申请特定的UI元素或全球的-适用于整个系统。

Facebook应用程序在新闻提要中使用了上下文通知,告知提要中添加了较新的故事。此通知不要求用户采取操作。

通知特征:

  • 它们不是由用户的即时操作触发的。
  • 他们宣布对用户具有一些重要意义的事件。

通知有两种主要类型,根据是否要求用户对通知采取行动而有所不同:

  • 行动所需的通知提醒用户需要用户操作的事件的用户。从这个意义上讲,它们类似于验证,但由于它们不会被用户自己的行动引发,因此它们需要不同的设计。

需要操作的通知通常是紧急的,应该是侵入性的;例如,它们可以实现为模式弹出窗口,打断用户,强制立即注意并要求取消操作。

MAC操作系统使用通知来告知用户可用的系统更新。用户必须通过选择安装更新或在稍后的时间再次提醒用户,用户必须从屏幕中明确地解雇它。这是一种侵入式通知,要求用户采取行动。
  • 被动通知是信息性的;它们报告不需要任何用户操作的系统事件。移动应用程序中的许多通知都是被动的:它们通常会宣布用户可能感兴趣的事件。

被动通知通常不是紧急的,应该少一些干扰。被动通知的典型实现可能是屏幕一角的徽章图标或小型非模态popover。被动通知很容易丢失,因为它们不需要用户操作。当通知提供的信息是理解系统的关键时,容易被忽视的被动通知可能会有问题。

adobecreativecloud使用非侵入式被动通知通知用户可用的应用程序更新。这个通知在屏幕上出现了几秒钟后就消失了。用户不需要对其执行任何操作。

优衣库网站使用非侵入式被动通知提供商品已添加到购物车的反馈。不需要采取任何行动来驳回通知。这种通知有时会给没有注意到简短消息的电子商务购物者带来问题。错过该消息的用户可能会通过多次向购物车中添加项目,或者中断购物流程来检查购物车以查看添加了哪些项目。

通知在设计上面临的挑战是,它们不是特定用户操作的直接和明显的结果。相反,用户可能正在做一些不同的事情,并且可能没有考虑通知引起的问题。这需要通知建立更多的上下文,并为用户提供足够的背景信息,以了解通知的内容。

(In contrast, with a validation, the user has just done the thing that needs to be corrected. Thus, the validation message doesn’t need to educate users about the task at hand. For example, if an e-commerce checkout form has a field for a credit-card expiration date that was left blank, the validation message doesn’t need to say“请提供您要支付29.90美元的信用卡的有效期,以支付您正在购买的蓝色无袖连衣裙的费用优衣库网站.”然而,第二天的通知,礼服已经从仓库运出,将需要说明更多“您的包裹已发货。”)

如果通知是上下文的,并且与界面中的特定元素相关,那么元素上的图标指示器可以在通知应用的位置进行通信,并引起用户的注意。例如,移动应用图标上的指示牌显示用户已收到来自相应应用的通知。

iPhone消息传递应用程序创建了一个通知,告知收到了新消息。在通知的同时,在消息应用程序图标上放置了一个指示牌,用于告知通知的应用位置。要清除指示器,用户必须查看消息。

薄荷网使用一个指标和一个通知来传达一个帐户需要注意。警告指示灯(1)出现在紧靠账户摘要的地方,需要引起注意,同时通知(2)出现在页面的中心区域,其他重要信息。但是,通知消息中的实际文本可能会更有帮助。

选择正确的沟通方式很重要

使用错误的通信方法可能对用户的体验产生负面影响。让我们参阅上面的方案,其中yelp在搜索结果中使用了绿色标签指示器,以表明茶市场有特殊交易运行。这些信息对于专门搜索有茶点的用户来说是语境性和重要的。

您可以认为,提醒用户潜在的茶叶交易的替代方式是在此类交易可用时发送通知。错误!发送的通知,无论当前的用户目标可能会被忽略,甚至可能惹恼用户,因为它会扰乱其当前的任务并与当前需求无关。

(一般来说,任何类型的广告都会被忽视,除非它与用户的目的和心态有关.)

或者,一个toast(一个小的非模态弹出窗口,几秒钟后消失,如新故事一个由Facebook应用程序使用),虽然适用于被动通知,但将是实现错误消息的不良方式,但它是验证或其他方式。事实上,我们的一个移动用户之一花了5分钟等待一些内容仅加载,因为她没有注意到屏幕底部呈现的小错误消息,在5秒后快速消失。

Allmodern.com网站使用动作要求通知传达产品已保存为收藏夹。对于正在将大量项目保存到收藏夹的用户来说,这可能是一种提供反馈的烦人且具有侵入性的方式。这可以通过在屏幕的一角显示一个可以看到的被动非模态popover来进行更好的沟通,但是不需要用户采取措施来清除它。

结论

请记住,这三种沟通方法的主要区别是:

  • 指示符提供关于动态内容或UI元素的补充信息。它们是有条件的——也就是说,它们可能在特定条件下出现或改变。
  • 验证与用户的操作或输入相关。
  • 通知的重点是与系统相关的事件。

这些差异总结在下表中:

验证

通知

指标

全局与上下文:与全局系统事件或特定页面元素相关

上下文

全局或上下文

上下文

被动与用户动作

需要采取的行动

行动需要或被动

被动的

由用户操作与系统事件触发

用户操作

系统事件

用户操作或系统事件

了解何时以及如何使用这些反馈工具中的每一个都很重要,以便在与用户的通信中构建一致性。通过评估交付的信息类型,我们可以确定使用的正确机制。