如何设计一个理想的「空状态」?

重视空状态,因为它们不是用户体验的临时或次要部分。


重视空状态,因为它们不是用户体验的临时或次要部分。

如何设计一个理想的「空状态」?

什么是“空状态”?

页面内容为空时,我们把它称为“空状态”,也就是说应用程序没有用户内容的那些时刻。即使指引只有一个步骤,也会让用户放心的使用。

如何设计一个理想的「空状态」?

目的

  1. 确保用户首次使用不会删除应用
  2. 告知用户如何完成核心任务
  3. 首次引导要吸引用户,成功完成任务

新人使用期间,“空状态”的价值

  1. 在使用一个新的东西或者功能时,我们要利用屏幕来教育吸引用户,把一无所有的页面,变得饱满。
  2. 设置要发生的事情的期望。一般是文字+视觉的表达。

创建愉快的用户体验:功能(解决用户问题)、可用(容易学习,易于使用)、愉快的(空状态是创建愉快的绝好机会,个性化的设计点)

如何设计一个理想的“空状态”?(创造性/可能性)

1、避免死角

用户在使用一个产品 完成一个从未用过的功能,不能让用户进入死胡同,造成额外和不必要的错误。

没有示例 – 只有一个死胡同。

如何设计一个理想的「空状态」?

通过引导用户沿着箭头将使其开始的动作,来减少摩擦。

如何设计一个理想的「空状态」?

2、保持“空状态”视觉上是简单的

一个伟大的空状态设计的美丽是它的简单。您应该使用极简设计方法,以便将最重要的内容放在最前面,并尽可能减少干扰。文案的精心描写与恰当的视觉结合。

如何设计一个理想的「空状态」?

3、要直观

不要忘记,“空状态”不仅仅是视觉美学。他们还应该帮助用户理解上下文。即使它只是一个临时的步骤,您应该为用户最大化其传递价值,并提供如何将“空状态”更改为“活动状态”的说明。

要告诉用户:当前页面是什么?改如何获得?

如何设计一个理想的「空状态」?

4、鼓励用户执行

说服用户尽快做某事,提现好处+引导操作

Facebook Messenger的安装屏幕。当用户到达此屏幕时,他们会受到鼓励 – 屏幕让用户知道产品的优点(用户可以使用Messenger拍照或录制视频),并告诉他们有多少Facebook的朋友已经在使用该应用程序。“安装”按钮引导用户进行清除空状态所需的下一步。用户根本没有其他选择,只需触摸安装。

如何设计一个理想的「空状态」?

5、如果可能,提供个性化内容

当您为用户个性化您的应用时,您会更快地展示您的产品的价值。个性化的主要目标是提供符合特定用户需求或兴趣的内容,而不需要目标用户的努力。请考虑提供初始内容,以便用户立即浏览您的应用。

如何设计一个理想的「空状态」?

例如,书阅读应用,首次打开为用户提供几本书。让用户更快的了解你的软件,体验看书的方式。

6、情感进入

空状态可以帮助您显示您的业务或产品的人性化方面。积极的情绪刺激可以建立与用户的互动感。什么样的感觉,你的空状态传达,取决于你的应用程序的目的。

要避免错误的情感传达,尽量避免和用户情感冲突。下图的情感视觉太过兴奋,情感表达错误。

如何设计一个理想的「空状态」?

下图是关于加载错误的“空状态”,情感表达准确。

如何设计一个理想的「空状态」?

7、介绍成功状态

第一次用户完成重要任务的时刻是您创建他们与您的产品之间积极情感联系的绝佳机会。让您的用户知道,他们做得很好,承认他们的进步,庆祝成功与用户。

成功状态是一个惊人的机会,祝贺用户完成的工作,并提示他们新的互动。

例如,在苹果市场中的应用Writeupp,清除任务列表肯定是用户的一个积极的成就。应用程序提供祝贺,“做得好!”作为积极的加固。这种成功状态令用户满意,并提供了继续使用的后续步骤。

如何设计一个理想的「空状态」?

总结

你的“空状态”不应该是空的。不要让用户在第一次打开应用时面对空白屏幕。重视空状态,因为它们不是用户体验的临时或次要部分。事实上,他们与其他设计组件一样重要,当他们刚刚注册,让用户充满了潜在的驱动、参与和喜悦。

希望大家多多交流,有问题可以及时指出。

 

作者:包子凯,一个来自草原的野生交互设计师,原华为在线交易平台交互设计师,从事过吉利汽车,中广核的相关设计工作。

本文由 @包子凯 原创发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/23904/

(0)
CatherineCatherine
上一篇 2017-05-06 23:47
下一篇 2017-05-07 01:36

相关推荐

  • 画交互原型方案前,你应该思考的三个点

    一个优秀的交互设计师,一定要从用户目标出发,了解用户的核心痛点,满足用户的需求,只有这样才能打造一个好的产品。

    2017-04-29
  • 开始自己的建筑笔记 | Sketch Journal 作品展示

    大家是否在网络时常看到精美的建筑师手绘本?是否也准备打造一本属于自己的建筑笔记?今天为大家带来笔者大一阶段的Sketch Journal。笔记虽不算精美,但却是自己一年辛勤努力后的结果,它记录的不只是这一年的想法,更是自己一年的学习历程。相信这也是大家在不断完成自己的建筑笔记时最享受的一个过程吧。建筑笔记的几点心得:慎用大尺度手绘本!笔者本科第一年的Sketch Journal选择了A3尺寸,结局是很悲惨的。你需要付出比常人多的时间去完...

    2018-04-21
  • 双十一之购物车体验

    今年的双十一,你剁手了吗?不管你剁不剁,反正我是剁了。剁手的同时,不妨来看看,电商购物车的哪些设计让你剁了还想剁。本文主要讲四个电商网站的购物车,分别是淘宝、京东、唯品会和聚美优品。

    2017-06-01
  • O2O/商场权限管理系统设计方案

    一、管理权限分级概览 二、管理账号管理逻辑 三、账号权限定义 管理账号预设角色分为四种:超级管理员、商场管理员(独立收银)、商场管理员(统一收银)、店铺管理员; 超级管理员: 具有商场后台所有功能的权限,…

    2017-12-28
  • 聊聊意见反馈,小功能也有大门道

    反馈是几乎所有应用的标配功能,往往藏在“设置”或者“关于”里面的小角落。意见反馈在产品开发中的作用是不能忽视的,这几乎是所有应用最好的用户意见收集入口,但是不同应用对意见反馈的处理各不相同。最近在做反馈系统的梳理工作,也包括意见反馈页面优化,将这一段的分析整理成此文。

    2017-06-01
  • 前车之鉴:一个视觉交互设计失败的案例

    最近在做产品设计时,遇到了一个非常典型的设计失败案例。这个案例反应了一些老生常谈的问题,我觉得非常有意思。

    2017-06-01
  • 杜蕾斯158张经典海报设计,你眼中的污都是它的精华液!

    90集PS视频教程,点击下面二维码获取:来源:  LOGO大师(ID:logods)引言:转眼间2017年已经走过了一半,今天大大君扒一下老司机杜蕾斯经过半年“辛苦耕耘”究竟污了多少次。废话不多说,快坐稳,要发车了!杜蕾斯的官博一直以来的形象都是“有点坏、有点情趣,有点流氓”的性情中人。他用轻松诙谐的手法传播普及性知识,特别是每次结合热点的海报作品,都能引发大家无尽的遐想。- 国际特别“日”篇 -#全球OK日# 无论大小,都OK!#世界...

    2018-03-07
  • 一个应届的交互设计毕业生应该具备哪些能力?

    作者:马力 @ 可能性与大设计   ( 上图来自Elizabeth Bacon ) 首先说,很多专业的同学都可以做交互设计(还有视觉设计,产品设计等等),既包括设计相关专业,如工业设计、建筑设计、园林设计等,也包括完全和设…

    交互专题 2017-08-07
  • 怎么理解信息架构,什么是信息架构?

      之前一直有朋友(初学者)问我什么是信息架构,什么是流程图等等,一直没有很好的答案回答对方。后来举例以下的例子,她说终于明白大概是什么意思了,在这里将回答分享给大家(或许可以帮助妹子们更好的理解…

    2015-11-18
  • 交互新人,请不要再犯这几个错误了!

    不知不觉,我已经正式在交互设计的路上越走越远,了解得越多,就觉得交互设计需要学习和掌握的知识越多;同时犯的错也会越多。然而犯错并不是一件坏事,怕的是犯过的错误不能够被积极地思考,我们不能及时把错误化作成长。根据目前我的一些浅薄经验,总结出了交互新人往往容易犯的一些错误,以及关于错误的一些思考。

    2017-05-22