空状态-用户体验最被忽视的方面

本文概述

  • 什么是空状态?
  • 使用设计良好的空状态的好处
  • Shunned:UX设计的被遗忘的屏幕
  • 如何用目的填充空白屏幕
  • 空状态UX最佳实践–来自现场
  • 总结
尽管对用户体验很重要, 但空状态经常被忽略。知道它们是什么以及如何使用它们, 并应用UX最佳实践, 可以产生很多好处。
什么是空状态? 用户体验设计师有很多机会来创造愉悦而有意义的体验。一种经常被忽略的机会是” 空状态” 或空白屏幕。空状态是用户体验产品时无法显示的时刻。
以下是一些常见的空状态情况的示例:
  • 一个新的Dropbox屏幕, 其中未创建任何文件或文件夹。
  • 在待办事项列表管理器中完成所有任务后的结果屏幕。
  • 不支持命令时, 在Slack中显示错误屏幕。
  • 启动一个新的社交网络帐户, 并且没有任何连接。
  • 在Gmail中搜索内容, 但没有结果。
这些介于两者之间的时刻提供了改善用户体验并因此扩大商机的机会。对于UX设计人员而言, 抓住一切机会来改善用户体验并为业务增加更多价值是一件好事。
一个有用的空状态将使用户知道正在发生的事情, 发生的原因以及如何处理。这是良好的空状态UX设计的两个示例:
空状态-用户体验最被忽视的方面

文章图片
在首次启动产品时, Dropbox Paper为用户提供了良好的空状态UX设计。号召性用语按钮可帮助你轻松完成下一步工作。
空状态-用户体验最被忽视的方面

文章图片
当搜索查询不返回任何结果时, 这是一个空状态设计的好例子。该屏幕提供有用的参考, 并让用户知道发生了什么。
以下是一些机会错失的空状态设计示例:
空状态-用户体验最被忽视的方面

文章图片
这是一个空状态的UX设计, 可以提供一些反馈, 但是却错过了向用户提供任何其他指导或要采取的措施的机会。
空状态-用户体验最被忽视的方面

文章图片
在这种空状态设计中, 我们只是看到一个几乎空白的网页。图像本身很棒, 但是它不会引导用户沿任何特定路径前进, 也不会通知或指示用户。
空状态的类型
这是四种常见的空状态:
  • 首次使用–在没有其他内容可显示时, 例如新的Evernote或Dropbox帐户, 发生在新产品或服务上。
  • 用户已清除–在用户完成诸如清除其收件箱或任务列表之类的操作且结果为空白屏幕时发生。
  • 错误–发生错误时或由于网络问题而导致手机脱机等问题时, 会发生这些错误。
  • 无结果/无数据–在无内容显示时发生。如果有人执行搜索并且查询为空或没有可用数据显示(例如, 当过滤没有数据的日期范围时), 就会发生这种情况。
随着空状态设计受到越来越多的关注, UX设计人员发现从业务和用户体验的角度来看, 利用它们都有有益的结果。
用户尝试了许多应用程序, 但在前3到7天内决定要” 停止使用” 哪些应用程序。对于” 体面” 的应用程序, 保留了7天的大多数用户的停留时间更长。成功的关键是在关键的前3-7天时间内吸引用户。 – Ankit Jain
空状态-用户体验最被忽视的方面

文章图片
Gusto是用个性化和一些有趣的个性填充空白状态屏幕的一个很好的例子。
意象。有一种设计原则称为亲生物效应。从自然角度看, 这是一种减少压力和提高注意力的状态。添加一些风景图像(例如, 空状态错误屏幕的背景)可以带来更愉悦的用户体验。
空状态-用户体验最被忽视的方面

文章图片
围绕亲生物效应设计的空状态屏幕可通过减轻压力和帮助参与而对用户体验产生积极影响。
有用的指导。根据产品类型的不同, 可以使用空状态来指导用户。一个很好的例子是项目管理应用程序。使用新帐户后, 尚无任何项目在进行中, 这为帮助用户快速入门提供了潜在的绝佳机会, 从而减少了放弃的机会。这是一个例子:
空状态-用户体验最被忽视的方面

文章图片
Evernote在引导用户使用其空状态页面设计方面做得很好。
入门内容。有很多屏幕空白的时间足以让用户感到沮丧而离开。对于某些产品, 提供良好的入门内容有助于他们直观地了解正在发生的事情以及下一步可以做什么。
这是一个空状态屏幕的示例, 其中包含启动程序内容:
空状态-用户体验最被忽视的方面

文章图片
这是一个空状态启动器内容的好例子。它为用户提供了基础, 并减少了产品混淆和放弃的机会。
提供一个行动步骤。对于某些产品, 我们不需要提供指导或在屏幕上填满任何内容, 因为这没有任何意义。在这种情况下, 设计人员可以简单地提供一个动作步骤。
【空状态-用户体验最被忽视的方面】但是, 最好将动作降到最低。希克定律指出, “ 做出决定所需的时间随着选择的数量和复杂性而增加。” 因此, 当号召性用语最多保持一两个时, 用户可能会更快地采取行动。这是一个很好的例子:
空状态-用户体验最被忽视的方面

文章图片
这是一个很好的UX空状态设计的好例子, 它告诉用户采取措施, 但仍将其保持在最低水平。
另一个很好的例子是Instagram。当人们不熟悉该平台时, 他们还没有关注任何人(也没有人关注他们)。专注于Instagram的所有出色功能很容易, 但是例如, 一个良好的空白状态屏幕可以为他们提供” 吸引更多人关注” 的选项。
空状态-用户体验最被忽视的方面

文章图片
当首次使用该平台时, Instagram用户会以一种快速便捷的方式找到人。
空状态UX最佳实践–来自现场 托普塔尔在所有设计领域均拥有顶级的全球自由职业人才。这是几位srcmini UX设计师关于他们在设计空状态屏幕方面的经验的看法。
顶级设计师:塔玛拉·奥尔森(Tamara Olson)
设计学科:UX设计
空状态-用户体验最被忽视的方面

文章图片
塔玛拉·奥尔森(Tamara Olson)是一位与srcmini合作的用户体验设计师, 曾参与许多涉及空状态设计的项目。
你从事或见过的一些好的空状态设计是什么?
我观察到的好的, 现代的空状态设计通常分为两部分, 一部分是令人愉悦的。如果用户界面为空, 则这是UX设计人员的工作, 它可以帮助用户了解填充后空间中的内容。如果要填充用户的工作, 则消息中应包含有关操作方法的说明。 (例如, 在edtech产品中空的” 班级” 表中可能包含复制内容, 通知教师如何创建他们的第一堂课。)
我还看到许多应用程序使用空州的慷慨房地产作为注入一些愉悦和有趣的品牌个性的机会。你可能会说这是网站404页面的网络应用版本。
你是否曾经忽略空状态?如果是, 为什么?
当然, 这是一个简单的陷阱。当我们富有远见时, 我们会在应用和产品全面投放时为它们添加图片和用户图片。当我在Google工作时, 产品副总裁评论说产品就像飞机飞行;大多数问题发生在起飞和降落期间。
当用户首次进入你的产品时, 空状态是不可避免的, 我们不希望他们在进入产品之前就陷入僵局。我鼓励初级设计师设计一组单独的线性设计, 以显示用户的入职流程。
你是否看到使用空状态的客户端成功?如果是这样, 以什么方式?
最近, 我与《国家小说写作月》合作, 对他们的平台进行了重新设计, 这使用户可以设置和跟踪围绕其写作进度的目标。我们的产品团队在空状态下拥有绝对优势。这是介绍和嘲笑该平台的功能和个性并激发用户开始记录其进度的绝佳方法。
你所经历的空状态最成功的用途是什么?
作为” 零收件箱” , 我对Gmail应用程序中的空收件箱插图始终感到高兴:一个人在伞下, 在阳光下看书, 标题为” 你已完成!” 从技术上讲, 它打破了我提到的有关需要采取行动的空状态的规则, 但事实并非如此, 因为下层CTA是” 放下电子邮件, 尽情享受生活。” 我喜欢那个。
顶级设计师:Michael Clingerman
设计学科:SaaS产品设计
空状态-用户体验最被忽视的方面

文章图片
srcmini UX设计师Michael Clingerman专门研究SaaS产品设计。
如果你是为空状态设计的, 那么你最常看到哪种类型?
我最熟悉的空状态是404 /错误状态和用户已清除状态。
你是否看到使用空状态的客户端成功?如果是这样, 以什么方式?
是。我看到过空状态屏幕成为引人入胜且令人愉快的内容和通信策略的一部分的情况。在其他情况下, 客户利用他们来建立自己的品牌个性。
你所经历的空状态最成功的用途是什么?
我一直很喜欢Dropbox使用简单和单色的说明样式来建立公司品牌的个性, 基调和特征。
总结 在UX设计中很容易忽略空白状态(或空白屏幕), 因为它们很少发生并且并不总是很容易理解。但是, 将它们包含进来的好处被低估了, 因为它们可以增强用户体验并帮助创建更具凝聚力的产品。
? ? ?
在srcmini设计博客上进一步阅读
  • UI设计最佳做法和常见错误
  • 移动用户体验设计–最佳实践, 约束和与开发人员合作
  • 移动接口的启发式原理
  • 设计的影响力–色彩和情感指南
  • 设计原理及其重要性

    推荐阅读