如何设计用户引导:提示和实践

没有第二次机会给人留下第一印象,这在竞争激烈的条件下变得更加重要。在用户界面领域,当您使早期交互和产品入门变得直观且引人入胜时,这意味着吸引和说服用户走得更远的机会比仅仅迈出第一步的可能性更大。所以,今天我们想分享一个简短的指南,其中包含从第一步开始获得积极用户体验的有效用户引导技巧。

考虑到用户,尤其是初次使用的用户,不会花太多时间试图了解产品的工作原理,用户入门的一个重要问题是确定明确的优先级。用户不仅准备用于学习新产品的时间有限,而且工作记忆的容量也有限。即使有很多关于产品的信息,也不要一味地把所有东西都集中在访客身上。设置优先级,设计者和利益相关者决定特定阶段需要的信息量:教程、向导、工具提示、说明等应首先显示最重要的信息。

狭义上,我们一般认为在初次打开应用时跳出的几张介绍应用功能的页面叫做引导页;从广义上来说,在用户使用某个功能前就达到帮助用户理解和使用,降低用户学习成本功能的页面或存在引导属性弹窗的页面都可以称为引导页

养蜂应用程序的入职屏幕

入职目标

用户体验设计师努力通过引导屏幕和功能实现三个基本目标。

  • 问候:精心设计的入职流程以自然吸引人的方式开始产品与用户的沟通
  • 信息:在那个阶段,告诉用户该应用程序将如何帮助他们或改善他们的生活是至关重要的
  • 参与度:入职有助于建立情感吸引力并鼓励用户学习和尝试更多

因此,从逻辑上讲,您可以为初次使用的用户使用入职屏幕和大多数元素,但不要用他们已经知道的信息来惹恼已经使用它的人。

入职要素

一般的入职体验有不同的元素和技巧。

应用教程又名初体验:一组屏幕,可以为新手快速介绍产品并说服用户尝试

欢迎消息:欢迎/启动屏幕上的短消息,以迎接用户并设置通信;一种非常典型的启动入职流程的方式;通常具有 CTA 元素

进度条和指标:基于人类完成任务的自然冲动的技巧。用户界面中包含的进度指示器(点、破折号等)刺激用户完成入职并了解其当前处于哪个阶段

解释视频:产品优点和功能的视频评论向用户解释主要要点,可以作为快速介绍产品的动态有效方式。

上下文和动作驱动的工具提示:提示与特定布局元素或用户操作相关的消息,通常出现在模式窗口而不是单独的屏幕中

空状态提示:这些可能会出现在未来将填充用户创建的内容的区域中,但是当它们是空的时,空间可以用于提供良好且信息丰富的提示

清单:以及进度条,这种入职技术激励用户完成初始步骤集。甚至,它可能成为游戏化 (例如,您完成完整的积分列表并获得成就或打开更多功能)

Behance 使用清单策略指导用户完成其个人资料

 

热点:这个引导元素将注意力吸引到重要的区域或控件上,这些区域或控件可能会被没有经验的用户忽略或忽视。

个性化入门:该方法建立在从一开始就设置用户偏好的基础上,通常可以在基于与大量不同内容(如 Behance 或 Pinterest)交互的产品中找到

Perfect Recipes 应用程序的个性化入门体验可帮助用户通过这种方式设置目标和限制,从而根据他们的特定需求调整应用程序性能

 

当然,这个列表并不意味着所有这些都必须集成到任何产品中。在每种特定情况下,用户体验设计师都必须找到平衡点,并选择对用户和产品背后的业务目标都有效的要点。此外,为了正确组织引导,通过用户研究和可用性测试探索目标用户的心理模型:这样您将能够更准确地预测用户何时何地需要帮助和提示。

 

引导页设计实践

在 App 教程中使用图像

大多数人比文字更快地感知和解码图像。对于必须快速提供信息的应用程序教程,它使插图的使用合乎逻辑和合理。在专门讨论插图在 UI 中的好处的文章中,我们提到在教程的情况下,插图,无论是照片还是原始绘制的图像,都充分展示了它们在解释和澄清方面的潜力。选项可以完全不同,从简单的图标到艺术和复杂的艺术品。这种插图成为提高可用性的好方法,最大限度地减少在屏幕上使用副本的必要性。他们在面向儿童和青少年的应用程序中特别有效,因为他们通常觉得这种解释更加人性化。

 

设计趋势 展示了为特定界面创建的自定义插图越来越受欢迎。应用教程成为各种风格和方法的有利场所。在许多情况下,插图成为构图的中心,其目的是以有吸引力且易于解码的方式呈现特定特征或好处。另一种流行的方法是应用吉祥物,这是一个模仿与用户真实交流并建立情感纽带的角色。更重要的是,您可以使图像工作方向线索 帮助用户更容易理解导航和布局。

Finance Tracker 应用程序的入门屏幕具有自定义插图,不仅时尚且引人注目,而且还可以作为方向提示与箭头一起使用,以吸引用户对核心交互元素的关注

 

不要啰嗦

在 编写用户界面,言语就是力量。然而,有两个简单的规则可以以最好的方式揭示这种力量:说得简短,让它们有用。现在是时候意识到写一个简短的信息句子比写一个长文本要困难得多。您必须找到一种正确的方法,不要浪费用户准备用于教程屏幕或工具提示的宝贵时间。一些创意团队会聘请专业文案来完成这项任务,以创建让每个字母都有意义的文本。不管是不是作者,都要花时间和精力来创建一个简洁、有吸引力和清晰的副本,应用吸引目标受众的语言并与产品背后的目标相对应。除了设计解决方案外,还应尽可能多地测试文案,以找到通知用户的捷径。

关于说明,你需要知道的主要事情是,没有人会阅读它们——至少在反复尝试'拖延'失败之前不会阅读。” 史蒂夫克鲁格曾经提到过,这就是要记住的重点。当您想表现自己的口才时,请不要在这里过分强调:工具提示、教程和说明不是适合它的地方。

另一件要记住的事情是,任何文本不仅是信息部分,也是设计的视觉元素。以及图标, 字段, 纽扣插图、切换按钮和其他布局元素,它确实像任何其他图形组件一样占据了屏幕或网页的一部分,并影响了一般的风格呈现。高效文案的成败不仅取决于信息和内容,还取决于设计方案作为选择类型和字体、背景,甚至文本的位置。所有影响水平的因素可读性,所以如果这些点没有经过深思熟虑,文案就会变得很弱,甚至是非常有意义的。

My Baby App 入门屏幕的简短标语表达了它解决的问题的本质,并将大部分屏幕空间留给漂亮的 3D 插图

 

关注用户需求

你有没有和父母介绍他们的孩子打交道?当他们开始讲述孩子的成就、强项和特点时,他们并不容易停下来。当您将产品介绍给新用户时,也会发生同样的情况。对您而言,它是想法、迭代、努力、时间、金钱、收益、有价值的功能以及更多其他内容的凝块。毫无疑问,说起它,你想分享那种感觉,尽可能多地揭开面纱。这是一种自然的诱惑,但坚持下去是错误的。对于用户来说,它只是另一个应用程序、工具或网站,向未知领域迈进了一步。因此,确定目标用户最需要哪些好处和功能,并以专注和省力的方式讲述它们,而不是试图立即用所有可能的方法压倒用户。

 

用动画添加生活

另一种不仅增加意义而且增加乐趣和参与度的方法是动画。动作使交互更加动态,它为界面注入了活力,创造了令人惊叹的效果,并吸引了用户的注意力。更重要的一点是动画可以使重要的细节更加引人注目。另一方面,运动会增加加载所需的时间和流量,因此应明智地应用它并在其技术实现方面与开发人员讨论。

 

允许跳过

要考虑的另一件事是选择跳过教程。并非所有用户都需要它,即使是第一次使用该产品,因此对于大多数产品,让他们能够跳过教程是合理的。必须在测试和分析的基础上做出关于此功能的决定。

 

注意上下文

上下文工具提示是在尝试界面功能的过程中支持用户的好方法。它们在界面探索的过程中一个接一个地出现,一个接一个地出现在一次性可关闭的模态窗口中,以解释使用特定功能或突出某个好处的方法。

 

使用空状态

对于用户积极与内容互动的产品,在早期阶段,他们经常处理空的空间,因为用户还没有用个性化的内容填充它们。例如,这些可能是心愿单、项目、收藏等的屏幕。虽然它们是空的,但使用它们进行登机提示和进一步参与是一个好主意。

Dropbox 空页具有有趣的插图和关于如何以及为什么使用此功能的简短写好提示

 

注意情绪水平

使数字产品变得情绪化与目标用户建立牢固连接是一个重要方面,设计是最灵活的方法之一。然而,请确保找到正确的方法来设置所需的情绪,并了解什么适合您的受众:用户研究从这个角度来看,扮演着非常重要的角色。不要设计登机和写副本直到您清楚地看到产品与用户沟通的语气和声音。不要太幽默,尤其是针对不同国家/地区的用户的产品:听起来有趣的是,对于您的用户来说,这听起来可能并不有趣,甚至令人反感。使登机情绪激动,但要小心。

不要过度玩

老实说,许多用户不需要说明或帮助所有的时间。所以,不要过分夸大你的帮助。当:

  • 有太多的人
  • 他们太分散注意力了
  • 他们不清楚
  • 用户无法跳过它们或解雇(如"不要再显示给我看")
  • 他们没有携带任何有用的信息。

因此,保持用户支持的良好平衡,绝不错过检查它的机会用户测试.

综上所述,不难看出,精心制作的船上是搭建产品与用户之间的桥梁,创造情感背景,快速呈现核心利益,并留下良好的第一印象的方式。

作者:Marina Yalanska

本页面最后更新于 2021年07月05日 10:35