技术资讯
空状态设计是提升产品用户体验的不错的方法
2018-08-23 09:00:26
从用户进入到与APP交互的过程中,空状态设计都是提升产品用户体验的不错的方法。空状态是指没有数据的页面,尽管如此,空状态也可以提供有趣的用户体验。
空状态是指没有数据的页面,也就是说,在用户进行某些动作后,页面将会展示其产生的内容。尽管如此,空状态也可以提供有趣的用户体验。事实上,空状态完全可以用于指导用户的操作,向他们介绍你的产品或展示产品品牌的个性。
什么是空状态?
空状态是APP中的内容无法显示的页面状态,用“空”来描述其实是不恰当的,因为空状态页面中还有一些内容的。事实上,空状态可以显示多种不同的内容来提升用户体验,接下来我们就会着重介绍这一点。
例如:如果你曾经使用过一款允许你把你喜爱的内容添加到收藏夹里的APP,你就会对空状态有所了解。或者你使用搜索,有过没有搜索结果的经历…
以Instagram为例:当你进入没有添加任何照片的收藏夹时,你可能会看到一个空状态,并告诉你还没有添加任何照片。
由于没有数据内容,因此只能展示空状态或无数据。

Instagram的空白状态
但是,Instagram的收藏页面并没有空状态说明,相反,它是空白的页面。因此,他们错过了一次引导用户去与APP互动的机会。
设计空状态的原因多种多样,最常见的原因有以下几种:
1、用户清空了所有的数据(如:清空收件箱);
2、用户是新用户,并且刚刚才登录APP成功;
3、用户遇到了某种错误(如:没有WIFI连接)。
使用空状态的好处
Spotify的用户体验专家Tamara Hilmes提醒设计师们时说,空状态是一个展示产品个性化的机会,因此,在进行空状态设计时,需要认真考虑品牌和用户的目标和背景。
Deliveroo的产品设计师Ryan Cordell同意Tamara Hilmes的观点,并进一步说:
“设计好文字和视觉界面,是产品与用户互动并最终实现他们目标的关键一步。设计团队应该投入足够多的时间、耐心和精力来设计任何场景下的文案。”
同样,即使不是特别重要的页面,告知用户下一步如何操作也有着不错的效果。如果不这样做,空状态就不能提供任何价值,其也就成为了化妆品添加剂,毫无用处。
空状态设计的最佳案例
如果你打算设计一个空状态,那么请记住这些好的做法,以便能够帮助到用户去达到他们的目标。
告诉用户该怎么做
如上所述,空状态是鼓励用户与产品互动的绝佳机会,你也不希望把用户进入页面后,一脸茫然而不知所措。
例如,你可以在空状态页面上放一个具有引导性的按钮,以一款刚下载的社交APP为例来说明。

这款APP有通讯录标签,但目前是空的。一个好的引导性按钮可以告诉用户去查找并添加自己的朋友,这样能够让他们也参与到你的APP中。你的引导能够完整的告诉用户,如何把空空的通讯录转变成好友众多的页面,可以看看Facebook是如何做的(上图)?
空状态要保持个性化
空状态设计中,个性与绝望、无畏和欲望之间有着非常细微的界限,若无法很好的平衡这两者之间的关系,就会把展示品牌个性变成了展示绝望、无畏和欲望啦。
但是,空状态设计仅仅只是产品展示个性化的一个小例子,个性并不总代表着有趣,为页面添加幽默的元素时,需要格外谨慎。某个笑话在今天可能很受欢迎,但是明天就会有用户不再喜欢了,给人以过时的感受。
在空状态设计中,使用友好且合适的文案能够带来意外的效果。兼具特制和适合特性的插图,可以帮助你设计出一个成功的空状态。

如果你决定要使用插图和文案,请确保它们要有层次感,不会相互影响。一个好的插图能够为页面带来足够的乐趣和参与度,此时,你可以使用简单且常用的文案。来看看Google是如何平衡两者之间的关系的?
Google的Material Design 指南中规定,如果打算使用图片,请遵循以下规则:
1、使用中性或幽默的语气;
2、与产品的品牌风格保持一致
文案需要遵循的规则:
1、文案传达出有用的信息;
2、在不需要操作的情况下,告诉用户页面的作用。
使用空状态来培养用户
你可以使用空状态来告知用户如何使用产品,空状态在用户首次体验产品时扮演着重要角色。
如果你想留住用户,那么良好的首次体验是至关重要的,这有利于构建产品与用户之间持久的关系。
近期更新
- [2023-07-26 14:17:28] 为品牌赋能,海外官网品牌数字化
- [2023-05-06 10:32:26] 青岛网站建设公司,品牌网站定制,一站式网站服务——力图数字科技
- [2023-04-27 13:47:54] 品牌定制网站建设——从满足预期到走向超预期
- [2023-04-11 09:17:49] H5页面设计开发——移动端传播利器
- [2022-11-16 10:11:43] windows2012程序在哪
- [2022-04-14 11:01:47] 力图数字科技配套网站服务支持
- [2021-05-18 10:14:11] 青岛网站建设的流程
- [2021-04-29 10:14:38] 企业定制化官网建设项目
- [2021-03-05 10:34:45] 移动互联时代房地产行业的微信小程序解决方案
- [2021-01-22 17:29:38] 微信小程序有哪些优势?为什么要开发微信小程序?
- [2021-01-08 17:28:04] 网站建设最容易忽略的人性化设计
- [2020-12-16 16:55:32] 建设一个常规的公司网站建设成本大概是多少?
延伸阅读
- [2009-02-24 09:19:00] 地图网站的需求功能与体验
- [2008-08-29 12:11:00] 简洁的网页设计帮你拉顾客
- [2014-12-06 13:44:42] 扁平化网页设计的颜色搭配使用
- [2019-08-15 10:12:31] 从零开始的响应式web设计
- [2015-09-05 09:44:32] 响应式网站效果与案例欣赏
- [2011-12-03 23:07:54] 新做的网站如何获取高质量的外链
- [2009-02-01 15:07:00] 设计简单性与完整性的矛盾
- [2013-02-24 16:47:11] dede列表页及文章页下的调用图集里的所有图片
- [2009-03-13 08:51:00] 给网站界面预留退路
- [2012-02-21 22:36:55] 反馈表单的输入优化
- [2012-02-02 11:40:05] WEB表单设计分析及重要性
- [2012-01-26 21:46:03] 如何添加nofollow
