在新用户引导流程中,如何用好空状态界面?

今天的文章,我们将会提供一些使用空状态来优化新用户引导的策略和技巧。


今天的文章,我们将会提供一些使用空状态来优化新用户引导的策略和技巧。

在新用户引导流程中,如何用好空状态界面?

当新用户打开你的APP的时候,最初的几个界面将会直接影响用户对你的网站的预期。为了确保用户不会在第一次打开之后就卸载APP,你应该用好最初的空状态页面,通过引导,帮助用户完成关键性任务,获得成就感,达成目标,并不断回来,成为你的APP的回头客。换句话说,要在第一次交互之后,成功吸引用户,让他们流连忘返。

新用户引导流程是这当中的关键。创造第一印象,你只有一次机会。今天的文章,我们将会提供一些使用空状态来优化新用户引导的策略和技巧。

什么是空状态

对于许多APP而言,内容是它的核心价值。无论是新闻类APP,还是效率类应用,均是如此,因为对于用户而言,绝大多数时候是为了内容而使用引用。这样一来,一开始使用的时候所面对的空状态界面,就显得至关重要了:当用户还没有看到内容也没有内容填充APP的时候,它将如何引导用户完成从无到有的过程?

对于默认为空的状态,或者仅仅只有基本默认设定的设置界面,也非常适合引导新用户熟悉产品。除了给用户对内容的期待之外,空状态界面还适合教用户使用APP。即使新用户引导流程在这里被压缩到一个步骤,它也能够称职地引导用户做正确的事情。

在新用户引导流程中,如何用好空状态界面?

在 Expensify 这个APP当中,空状态教会用户如何起步,让他们安全地使用产品。

引导流程中空状态的价值

作为用户首次使用所打开的界面,空状态界面对于用户熟悉产品有这毋庸置疑的价值。你应该利用这个机会尽可能地吸引用户,教育用户。

教育用户

首先,空状态界面应该帮助用户了解上下文情况,让用户熟悉当前的状况,为什么会发生这样的情况,安抚用户的情绪。此时应该这样展现信息:向用户展示界面有内容时候的样子,或者向他们告知此时应该如何操作来获取内容。

提供行动指示

绝大多数空状态界面会告诉你,为什么会遭遇这样的情况。但是真正有效的空状态,会告诉你下一步要做什么。教育你的用户很重要,但是在用户最初遭遇空状态的时候,你要驱动他们前进,前进了才是初步的成功。空状态界面就是最佳的起点,你可以通过设计来鼓励用户前进。

创造愉悦的体验

虽然绝大多数的APP都是功能性的(解决具体问题),也是可用的(易于学习,易于使用),同时它也应该是令人愉悦的。空状态是你的APP同用户构建起情感联系、塑造个性的绝佳机会。

如何设计绝佳的空状态

空状态能够吸引用户,但是在产品和UI设计的过程中,常常会忽略它的这一属性,甚至会忽略对空状态的设计。因为在绝大多数时候,我们所设计的都是填充好内容的界面,布局都被精心挑选的内容塞满了。但是,当内容还未来得及加入界面的时候,我们要如何展现界面呢?空状态界面,其实是展现创造力和可用性的优秀舞台。

避免走入死胡同

当用户进入空界面之后,发现整个交互和操作都走入了死胡同,不管怎么操作都无法改变现状,这才是最糟糕的局面。且不说陷入这样的僵局给用户带来的混乱感和无效的多余操作,它本身的不可用让用户对APP所产生的失望情绪,才是最致命的。

看看 Modspot 两个界面设计案例吧。第一个界面是用户首次使用的空状态页面,巧妙的借助这个界面来引导用户发布作品:

在新用户引导流程中,如何用好空状态界面?

而第二个界面则是忽略空状态界面设计时候的样子,没有演示,没有引导,也没有说明,对于不会主动尝试的用户而言,这就是个死胡同。

在新用户引导流程中,如何用好空状态界面?

让空状态界面视觉上简单清晰

空状态本身内容并不多,即使加上说明和指引,也应该足够简单。将最重要的引导和说明突出展示,减少无关内容,降低干扰。简而言之,需要将清晰直观的文案,和强引导性的视觉设计结合起来。下面iOS版 Dropbox 的离线文件空状态界面,就非常值得学习,简单清晰的文本加上有趣的插画,让用户瞬间明白了这个功能如何使用。

在新用户引导流程中,如何用好空状态界面?

让空状态具备直觉性

当然,空状态页面要漂亮,但是它不仅仅要具备视觉美,它还需要恰到好处地让用户明白上下文场景。即使它只是新用户引导的一个环节,你也要让它的信息传达价值最大化,比如告诉用户如何让界面状态从空变为非空。

下面以Google Photos 这个应用为例简单说明一下。作为Google的产品,它在视觉上做的相当棒,精美的布局和漂亮的图形都非常不错。然而,它的空状态并不足以帮助用户了解上下文背景,也没有回答下面的问题:

  • 合集(Collection)是什么?
  • 我如何能获得一个合集?

在新用户引导流程中,如何用好空状态界面?

空状态界面不应该为用户创造更多的问题,而是要尽量解决问题。告诉用户当前界面是什么,以及要如何获得更多。

强化个性

个性化的设计让你的APP更加令人难忘。虽然在空状态界面中能呈现出的“个性”看起来并不多,但是即使是微小的个性化设计,都能让你的界面看起来和同类产品截然不同,它会让用户从这里开始体会到你的产品的不同之处。你可以看看Khaylo Workout 是如何在空状态界面中借助文案和插画来体现个性的。

在新用户引导流程中,如何用好空状态界面?

拳击手套插画和Challenge 这个主题相互映衬,文案着重引导用户创建新的Challenge ,强化交互。

鼓励用户操作

你的首要目的是说服用户做点什么。在空状态界面中引导用户交互,不仅仅是告诉他们如何操作,还需要告诉他们这么做有什么好处。

来看看 Facebook Massenger 的空状态页面吧,当用户抵达这一页面的时候,页面中萌翻的吉祥物会鼓励用户使用 Messenger 拍摄视频和照片,并告诉他们有多少好友正在做同样的事情,可以在此分享内容。直接点击安装就可以解除这一空状态。用户在此可以选择了解这一服务,也可以选择直接安装,无论是哪个导向,都是有利于开发者的。

在新用户引导流程中,如何用好空状态界面?

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

个性化的内容服务本就是为了让你的产品和用户需求更好的匹配,而个性化的服务本身就是你的产品值得炫耀的价值所在。

所以,当用户初次探索你的产品的时候,应该可以根据他们登录帐号或者其他的信息,为他们提供个性化的内容推荐、定制服务。就像下面这个阅读APP一样,在空状态页面中为用户提供推荐的图书:

在新用户引导流程中,如何用好空状态界面?

在界面中注入情感

空状态还能为你展示你的产品富有人性的一面。积极的情绪刺激能够让你和用户之间构成情感联系。想要在空状态下呈现什么样的感觉,传达什么样的感情,都取决于你的目的,你想要达成的目标。作为一款社交软件,Google Hangouts 的目的很明显,是要引导用户尽量分享、交流和沟通,所以它所传递的情感也更加社交化。

在新用户引导流程中,如何用好空状态界面?

当然,这种采用负面情绪的空状态是有风险的,有些人会在这种情形下进行更多社交行为以规避它,有的用户则会讨厌这种方式。但是没关系,有情感反应总比没有来的好。

巩固交互

当用户在空状态界面的引导下,完成任务的时候,同用户一起庆祝,告诉他们做的很好,是构建情感联系的可行方案。当用户达成任务的时候,你可以趁热打铁,让用户做更多,来维持状态。

在新用户引导流程中,如何用好空状态界面?

比如在 Writeupp 这个应用中,用户需要达成列表中一系列任务。当用户完成全部任务之后,APP会给出“Well Done!”这样的祝贺语。为了巩固用户的成就,APP会提供后续的步骤和任务,让他们继续前进。

结语

当你在设计UI的时候,空状态页面从来都不应该是空的,它应该作为用户引导流程的一个起点,整个产品体验的重要一环而存在,推动用户前进,是你的产品服务的重要入口。

 

原文作者:NICK BABICH

原文地址:smashingmagazine

译者:@陈子木

译文来自:优设

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

(0)
CatherineCatherine
上一篇 2017-05-01 22:23
下一篇 2017-05-02 00:33

相关推荐

  • 用户体验方法论的演变

    用户体验工作流程令人困惑,即使对大多数设计师而言也是如此。最初Donald A. Norman创造了用户体验设计的概念:“我发明了这个词,因为我认为人机交互和可用性太窄了。我想涵盖该系统的所有方面,包括工业设计图形,交互界面,面对面交互和使用手册。从那时起,这个词被广泛传播,以至于它开始失去意义。”而到2016年,Don Norman开始谈及对于这个词的误解有多严重。在彻底了解现代用户体验之前,我们需要回顾20世纪90年代以来设计和开发...

    2018-03-07
  • 来自腾讯交互设计师的分享:交互微动效设计指南

    本设计指南适用于UI界面中交互微动效,涵盖入场、出场动效,过渡动效和加载动效,在时间和缓动曲线的选择上提供了一些通用的设计建议,帮助设计师理清动效设计思路,提高设计效率。

    2017-05-02
  • 从单线走向双线,第三代用户体验即将到来?

    双十一在即,加之今年的新零售狂潮,零售业从线上到线下可以说纷纷摩拳擦掌。京东天猫剑指双十一已是老生常谈,值得注意的是,今年的双十一迎来了更多样化的全民购物盛事,比如飞凡推出的“2017飞凡狂逛节”。据了解,与京东天猫等电商大促有所区别的是,“2017飞凡狂逛节”重点是线下逛,与众多剁手党网上拼杀对比,着实令人耳目一新。新零售改革加速,用户体验核心发生质变可喜的是,我们看到零售业巨头和创业者们都在深挖线下。比如今年爆红的无人便利店和无人货...

    2018-02-03
  • 【交互大讲堂】当交互设计遇到装置艺术

    之前我们讲到的交互设计都是偏重于传统交互,与艺术的互动性没有这么强,通过现在媒体和交互设计,交互装置的互动性也会越来越强。上图这个工作室是日本的一个叫Teamlab工作室,他们致力于新媒体的装置艺术的设计的第一个作品。当用户进入这个身边周围都是球的环境的时候,触碰那个球,球会发出不同的声音。小孩子对绘画都是十分感兴趣的,当孩子进入这个工作室,画上一副自己喜爱的画,用打印投影仪把这些画全部扫描,扫描之后,会形成3D影响投放到媒体上面,这就...

    2018-05-03
  • JDC丨京东设计中心 - 电商大促攻略页设计指南

    通常我们看到的旅游攻略,游戏攻略等都是以文章资讯的形式呈现,只可阅读不可交互。而电商大促活动中的攻略页,可不仅仅是一篇资讯文章那么简单,除了要向用户传达促销信息,往往承载着引流,预约,发券,传播等营…

    2018-03-27
  • 设计师如何具有工程师思维?

    常常在提 design thinking, 让工程师有设计思维,但作为一个设计师,很多时候工作处理的都是交互层的东西,那如何像一个工程师一样理解一个项目呢?或者说如何具有工程师思维? 这个问题的简单回答是:根本没有“工…

    2015-05-24
  • AB测试告诉你,你以为的设计不是你以为的设计。

    用户体验设计不是忽悠,也许5分钟口水攻势能让前台小妹觉得你的设计非常高大上,但是要让每一个用户对着屏幕上的UI欲罢不能以身相许还需要数据支撑。

    2016-08-29
  • 窥探交互设计师成长之路指南!

    一部窥探交互设计师成长之路的实用指南!传授高效、靠谱的交互设计学习方法!IAMUE网站创始人倾力之作!

    2016-06-13
  • 全民关注用户体验的时代已经到来

    聚焦2018年全国两会,共有13位人大代表和政协委员提倡在相关领域内发展与提升用户体验,范围遍布于新能源汽车、互联网、通信、教育科研、传媒、版权保护、交通运输与医药等数十个行业,引起了社会各界的广泛关注。两会期间,全国政协委员叶友达向大会提交了《关于鼓励基于用户体验的设计创新,加速科技创新成果转化的提案》。叶友达建议,从国家层面启动基于用户体验的设计创新倡议,构建用户体验设计创新战略和行动纲领。同时要加大对基于用户体验的设计创新的宣传力...

    微信热点 2018-03-22
  • 画一本满满的Sketch Book,你有这样的执念吗?

    Sketch Book 到底对你意义为何我们收到过,看到过很多位插画师的速写本有随身的不到A5尺寸的也有十分大到A3的像作品集一样也收到过,很多后台询问可以推荐款速写本,可以推荐下用什么笔吗(这个真的,不重要 X3)你会发现,很多ins上国外插画师po出来完稿画作和平日速写本的风格截然不同对,速写本不是一本作品集需要每一页都是完整的,完美的它更像一个瞬时的思考把你的某一点切实地记录下来看看她们的速写本01 Eve尹光芒正在鲸字号 上海实...

    2018-03-26