3 提示小红点_No.005-提示引导设计小结

f381617ecbd27986c843b00eee280b80.png

一. 什么是提示引导

提示引导在产品中使用范围非常广泛,其主要目的是为提示和引导用户,以达到特定的目的。提示引导的形式不是固定的,可以是气泡,也可以是是小红点,从这点上讲,提示引导与按钮等可标准化控件有本质上的区别,所以本文对提示引导有如下约定:

提示引导是产品中的“辅助”部分,不属于应用产品功能架构中的主要组成部分,换言之,如果没有“提示引导”,产品功能架构依然是完整的,不会因为提示引导的缺失而对用户的使用造成重大影响(最多是用户体验不友好),因此提示引导有以下几点特征:

  • 提示引导不属于产品的主要功能架构的组成部分,是一种“辅助性”的元素
  • 提示引导会在特定条件下出现,又会在特定条件下消失,具有较为明显的“时效性”和“临时性”
  • 提示引导的形式多样,不固定,但一般来说内容和形式都是非常简洁扼要的

如下图红色框内为支付宝中基金图标上的红色气泡就是一种常见的提示引导,如左图所示用户进入财富模块后基金图标右上角出现“有红包”字样的气泡,点击进入基金模块后气泡消失,如下右图红色框内所示。如果没有这个红色气泡,基金图标入口以及功能架构依旧是完整的,用户对基金模块的使用不受任何实质性的影响。

b2fc7ccaba4784a7bf26cc8e0ea14fab.png

二. 提示引导的目的是什么

尽管提示引导算是产品中“可以没有的”的“辅助”元素,但依然有着其明确的设计目的性——“提示和引导”用户,级通过提示引导来引导和提示用户,如利用提示引导使用户快速了解产品功能和相关的操作,从而降低产品的使用成本,提升产品的使用体验,吸引更多的活跃用户以及其他产品的目标等(如活跃度,新用户等)。因此从产品和用户的角度来说,可以将提示引导的目的归纳为如下几点:

  • 向用户传递一定的“信息”,从而达到一定的产品目标,如吸引用户参加某种运营活动
  • 向用户说明产品的功能和操作说明,减少用户的使用成本,提升产品的使用体验,如产品中的新功能的操作引导说明
  • 提示引导本身不带有具体的信息,主要利用提示引导的形式来吸引用户的注意力和关注度,从而使用产品中的功能或模块,如产品中常见的小红点提示引导或桌面图标角标提示

三. 提示引导的基本组成要素

产品是提示引导的载体,用户是提示引导的目标对象,可以说产品和用户是对提示引导影响最大的两个因素,如下图所示为产品,用户和提示引导三者之间的关系示意图,产品为提示引导提供了“场景环境”,用户是提示引导的直接接受者和操作者,以及决定了提示引导目的的实现程度,因此产品和用户产品共同决定了提示引导的展现形式和逻辑结构。

e3b4b95feb1471609b5f5f09128b6a98.png

上图仅说明了提示引导,用户和产品三者之间的简单关系,但在实际中,一个产品中可能会有多个提示引导,每一个提示引导的特性都是不一样的,如所属的产品模块,目的和针对的目标用户,如下图所示,产品中包括3个提示引导,这3个提示引导相互独立,关联产品不同的模块或功能,且针对不同的用户群体,其中提示引导1针对用户群体B,提示引导2针对用户群体A,提示引导3同时针对用户群体A和B。

0de7535bc70b3bfaa8cbe1b345de4b9b.png

提示引导逻辑和结构与产品其他其他功能模块一样,在用户使用产品过程中,会与用户进行“互动”,据此将提示引导的逻辑流程归纳为如下图所示,包括用户使用产品,出现提示引导,用户“操作”提示引导(包括用户理解和处理提示引导),提示引导消失和用户继续使用产品5个环节。

b783b8b881188cfe3a9ffbe895ca5c01.png

因此结合产品,用户,提示引导三者之间的关系和提示引导的逻辑流程,可以从用户,产品和提示引导本身3个角度对提示引导的组成要素进行具体分析。

用户角度:用户对提示引导的影响主要体现在用户群体上,不同的提示引导针对的是不同的用户群体,不可能所有提示引导针对的都是全体用户。例如,产品更新提示引导针对的应该是老用户,可以快速帮助老用户了解新功能和老功能之间的区别,降低使用成本,而新安装用户就无需这种更新提示引导,因为所有功能对新用户而言都是“新”功能。因此在设计过程中,需要确定提示引导针对的具体用户群体,这样不仅能使提示引导的效果达到最佳,而且能提升用户的使用体验。

产品角度:从产品的角度来分析提示引导,第一个需要考虑的要素就是提示引导的目的,即想通过提示引导达到什么样的“效果”,例如目的是增加用户使用某功能模块的频次,还是吸引新用户。在“产品,用户和提示引导的具体关系示意图”中已经说明了产品中不同的结构结构模块会有不同的提示引导,甚至在比较复杂的情况下一个产品结构模块会有多个提示引导或者一个提示引导与多个不同的产品模块相关联,因此从产品角度分析提示引导的另一个要素就是提示引导逻辑中所关联对的产品模块。

提示引导本身角度:根据提示引导的逻辑流程可知,提示引导逻辑流程中的第一个环节是用户使用产品,然后产品相向用户展示提示引导,这一过程涉及到提示引导组成要素是提示引导出现的逻辑,即提示引导的触发条件;其次在提示引导出现之后,用户或多或少会被提示引导所“吸引”,进而会对提示引导做出一定的“操作”,这里涉及到的是提示引导的“展现”。在提示引导的逻辑流程中最后一个环节是提示引导的“消失”,即提示引导如何从产品页面中消失。所以,从提示引导本身的角度,可以归纳出提示引导组成要素有“触发条件”,“结束条件”和“展示形式”。

因此从用户,产品和提示引导本身3个角度来分析,可以将提示引导的组成要素归纳为目标用户,需求目标,关联模块,触发条件,展现形式,结束条件和展现次数7个要素,如下图所示。

7b05f1688ef4039e116957a268a5c809.png
  1. 需求目标:提示引导预期能够达到的目标

需求目标指的是产品希望提示引导最终能达到目标和效果,提示引导的需求目标对具体设计和规划有着很大的影响。设计前需要对提示引导的目标进行深入的分析和挖掘,这一点与普通的产品设计需求没有区别。

  1. 目标用户:展现给具体用户群体

目标用户是提示引导中重要的要素,因为用户的具体特征不可能都是一样的,不能以同样的方法来设计。以老用户和新用户为例,老用户对产品比较熟悉,一般的功能不需要提示引导就可以使用;而新用户恰恰相反,基本上对产品的功能和结构都是不熟悉的,需要花费一定的“使用成本/代价”来熟悉产品,因此如果有有提示引导针对新用户,就可以降低用户的使用成本/代价。用户群体的划分有很多维度,在实际中可以根据需求目的以及用户具体特征来划分,如根据用户使用频次划分,可以分为高频用户,低频用户和非目标用户(即完全不使用该功能);根据地区划分,可以分为上海用户,北京用户等;还可以根据用户的具体属性划分,如年龄,性别,文化程度。在设计前就需要确定好目标用户,才能有的放矢,有针对性,确保提示引导的最终实现效果。

  1. 关联模块:提示引导“针对”产品的哪些功能模块

关联模块指的是提示引导的目标产品模块,即提示引导“针对”产品的哪些功能模块。在实际设计过程中,需要慎重对待提示引导和产品模块之间的关联逻辑,如上文中支付宝中的气泡信息提示的关联模块就是支付宝的基金模块,而不是口碑或其他模块。

  1. 触发条件:提示引导在何时展现给用户

提示引导的触发条件不仅关乎到提示引导的展示,还对用户的使用体验有较大的影响。因为用户使用产品时的操作是不可预测的(如用户会点击哪一个按钮等),而且不同的提示引导其目的等都是不同的,不可能采用同样逻辑或形式,因此为了保证提示引导的效果和用户的使用体验,就必须在一个合适的“时机”来向用户展示提示引导。常见的提示引导触发条件可以大致分为两类:第一种是用户主动触发,即在用户在进行特定的操作后展现提示引导,比如在用户点击某个按钮3次后出现提示引导;第二种是产品内在逻辑直接设定,用户被动接受,如打开App时出现的参加活动的消息弹窗。

  1. 展示形式:以什么样的形式展现给用户以及提示引导的具体“内容”

提示引导的展现形式承载了提示引导的向用户传递的所有信息以及传递信息的形式,是用户接受到提示引导的主要部分,在很大程度上影响和决定了提示引导最终效果。其中常见的提示引导的载体形式有弹窗,气泡/浮层,小红点,交互动画引导等;提示引导的“内容”主要取决于具体的提示引导需求,不同的提示引导其包含的“内容”是不同。提示引导“内容”的表现形式也是多变的,常见的有文字,动画,图标等,具体的会在后续结合“常见提示引导”进行分析。

  1. 结束条件:在何时结束提示引导的展示(展示时长以及用户触发条件手动结束)

大多数情况下提示引导会打断用户的产品使用流程,会对用户体验造成一定的负面影响,因此必须确保提示引导在一定条件下会“消失”以使用户能够的回到正常的产品使用流程中,所以提示引导的结束条件就是非常重要的了。提示引导的结束条件可以大致分为2种,第一种是用户主动结束,即在提示引导出现展示后,当用户进行特定的操作后,提示引导会消失,如点击按钮;第二种是产品设定好逻辑,不需要用户进行任何操作,在一定条件后提示引导就会消失,如提示引导展示3s后自动消失。相比较而言,第一种提示引导的结束条件更为常见,因为通过用户的操作来结束提示引导的展示,可以确保用户在一定程度上已经“浏览过”了提示引导且达到了一定的效果(用户不操作,提示引导就会一直不会消失),而第二种提示引导在一些情况下所包含的“信息”可能传递不到用户而被忽略。

  1. 展示次数:是否会在不同的条件下重复展示,包括最短时间间隔

有时候产品为了达到长期的“提示引导”效果,提示引导会在不同的条件下会多次出现。需要多次展示的提示引导需要注意的是提示引导再次出现的时间间隔(即为了保证用户的使用体验同一个提示引导多次出现最好设定一个最小时间间隔,否则很可能会导致提示引导在短时间内多次重复出现,这很容易引起用户的反感)和再次出现的触发条件(提示引导是否每次出现的触发条件都是一致的)。常见设计中,提示引导都默认出现一次,但是我们可以根据需要来设定提示引导出现的次数。

应用中每一个提示引导,或目标用户不同,或触发条件不同,但基本上都可以分解为上述的组成要素,提示引导的每一个组成要素都是不可或缺的,都对提示引导的最终效果和用户的使用体验都有着很大的影响,因此我们需要认真设计提示引导的每一个组成要素。

四. 常见的提示引导

相对比较其他的标准控件,提示引导的设计相对比较灵活多变,但在主流应用中常见的提示引导的种类也并不多,常见的有弹窗,气泡浮层,交互式引导,小红点/角标和替换元素等几种,接下来将从内在逻辑和外在形式等方面对这几种常见的提示引导进行一些简单的分析和总结。

1. 弹窗

弹窗样式的提示引导是最为常见的一种提示引导,该类型的提示引导的逻辑和形式等方面与弹窗标准控件的逻辑和使用规范基本一致,具有如下特点:

关联模块:弹窗形式的提示引导关联的产品功能模块一般都是针对应用中的“整体”不会具体到单个元素,如整个页面或某个模块,因此弹窗形式的提示引导也多采用的模态弹窗形式,所以出现后基本上都会完全打断用户的操作流程,会对用户体验操作造成较大的负面影响。

触发条件:弹窗形式的提示引导触发条件比较简单,多是用户打开应用或进入某个特定的功能模块/页面后就出现,或是用户进行了特定的操作后出现,比如连续几次使用某个功能后出现分享的提示引导。

结束条件:由于弹窗形式的提示引导多为模态形式,因此基本上都需用户主动操作来结束“提示引导”展示,如点击提示引导中的按钮,但有时候为了保证用户的使用体验,会设定提示引导弹窗的展示时间,如展示5s后(用户一直未对提示引导进行响应操作)会自动消失。

一般来说弹窗形式的提示引导中至少有2个操作逻辑,一个是“提示和引导”的操作,即提示和引导用户干什么,比如点击按钮或图片进入活动页面;一个是“关闭/结束”提示引导弹窗,即允许用户“跳过”提示引导,回到应用的当前页面。通过这2个操作逻辑,提示引导都会消失,但结果却是不同的,前者用户会离开应用的当前页面进入提示和引导的的页面或功能模块,而后者仅仅关闭提示引导,停留在应用的当前页面。

展示次数:一般来说弹窗样式的提示引导仅会展示一次,即无论用户采取何种响应操作,一旦提示引导出现后就不会再次出现,因为弹窗样式会打断用户的操作流程,过多的展示会引起用户的反感。

展现形式:弹窗样式提示引导的展现形式大致有3大类,如下图所示。第1种为标准的弹窗控件样式,提示引导的“内容”多为纯文字,但也可以图文结合,用户通过按钮进行响应操作逻辑;第2种和第3种样式,可以视为标准弹窗的拓展样式,第2种样式中视觉形式不固定,提示引导的“内容”为图片(包括静态图片和动态图片)和文字结合的形式,用户通过按钮进行响应操作逻辑;第3种样式的特点是提示引导的“内容”为纯图片(包括静态图片和动态图片),用户通过点击图片进行响应操作逻辑。由于弹窗样式提示引导多为模态,全屏都可以展示引导的具体“内容”,因此在视觉展现形式上有很大的发挥空间,且提示引导也能够包含足够多的“内容信息”。

49a1ea6a80b3773d68f1d559d16e026b.png

总结:弹窗样式提示引导的优点是视觉形式多样,能满足不同的需求目的,提示引导包含的“内容信息”可以很丰富,产品,运营和设计师各方面的发挥空间都很大,但缺点也十分明显,由于其是模态弹窗,所以一定会打断用户的使用流程,会对用户的使用体验造成一定的负面影响。因此使用需要慎重和克制,如果使用的不合理,很容易造成用户的负面情绪。

2. 气泡/浮层

气泡/浮层样式的提示引导是一种量级轻但目的性很强的提示引导方式,本质上可算是弹窗样式提示引导的拓展,具有如下特点:

关联模块:气泡/浮层一般与应用中某个具体的元素或组件有较强的关联性,即提示引导指向某个元素或组件,比如某个按钮或个标签。

触发条件:气泡/浮层的触发条件相对来说比较宽松,大部分情况都是在用户进入某个页面或模块后后自动展示,跟用户具体的操作逻辑很少有关系。

结束条件:气泡/浮层提示引导一般会根据不同的需求来设置不同的结束条件。常见的结束条件有以下3种,第1种是用户点击联产品模块的元素/组件或点击非气泡区域提示引导就会消失;第2种是展示一段时间后自动消失,这类似于toast的展示逻辑;第3种是点击气泡/浮层提示引导中的“元素”,如按钮。一般来说,浮层/气泡样式的提示引导不会强制要求用户对气泡/浮层进行相应操作,为了防止提示引导长时间展示而影响使用体验,可以在结束条件中额外添加一个“自动消失”的逻辑,如24小时后用户不点击按钮则消失。

展示次数:气泡/浮层形式的提示引导对使用体验的负面影响较小,常见也是展示一次,但也可以根据需要满足触发条件的时候,多次出现,但需要控制好频次。

展现形式:气泡/浮层样式的提示引导在视觉样式上多为“气泡/浮层”样式。如下左图所示,如纯文字样式,图片样式和文字+图片样式3种,这3种样式仅仅向用户传递特定的“信息”,都不带有任何操作逻辑,即用户无法对气泡/浮层本身进行操作;如下右图所示在“气泡”中带有操作逻辑,用户可以对气泡/浮层本身进行操作,逻辑上与非模态弹窗基本一致,这种样式的提示引导本质上可以视为非模态的弹窗样式的拓展延伸。

e4f7c1ec969948f200ea2bc57a13bdea.png

总结:气泡/浮层样式的属于一种“轻量级”的提示引导手段,不会明显的打断用户正常操作流程,对用户的使用体验的负面影响远远小于弹窗样式的提示引导。缺点是气泡/浮层样式的提示引导在设计和使用方面有一定的限制,气泡/浮层的尺寸大小一般来说都是较小的,不可以在页面中占据过大空间,建议不要超过屏幕的1/4,同理由于尺寸的限制,气泡/浮层中的“内容”丰富程度也有限制,无法传递较为丰富的“内容”,如上图中所示,文字字数有限,图片也不能过于“复杂”,具体的“内容信息”多为“概括性”的内容。

3. 交互式提示引导

交互式引导提示提示是“最重量级”的提示引导方式,在产品中并不经常使用,主要原因是一般的交互式提示引导的“过程”都会较长且复杂,用户通常需要经历多个提示和引导的步骤,每一个步骤都需要特定的交互操作才能进入下一引导步骤,甚至不可以“跳过”提示引导,因此交互式提示引导的使用有较大限制性,具有如下特点:

关联模块:交互式引导一般会关联应用的好几个模块,不仅可以单个元素,而且还可以是某个模块,甚至是整个应用,这也是交互引导流程较长的原因。

触发条件:一般来说交互式引导都是用户安装应用或更新后首次进入应用时触发提示引导。

结束条件:交互引导的过程一般都会分好几个步骤,每一个步骤都需要用户进行相关的操作才能进入下一个步骤,因此次交互引导的结束条件一定是用户按照提示引导中设定好的操作逻辑进行操作,提示引导才会结束,如先点击A按钮,再点击B按钮,提示引导才会消失。

展示次数:由于交互式引导的强制性和流程较长且复杂的特性,因此只会出现一次。

展现形式:由于交互式引导一般都会与应用页面/模块/控件元素之间有紧密关联性,所以常见的形式是使用模态气泡/弹窗的形式,如下图(仅示意)所示为一种简单的交互式提示引导,设计中需要对关联模块的地方进行较强的提示和引导,否则用户可能不知道如何结束提示引导或进入下一步骤的提示引导。

e00ab54271359f0f44b02fea70c015dc.png

总结

交互式提示引导的强制性和多步骤的特点,在实际设计中尽量不要使用,但这种方式比较常见于游戏设计中,如王者荣耀中,新用户第一次进入游戏时,用户必须完成熟悉游戏功能的交互引导操作,虽然交互引导的缺点明显,但其优点是能够帮助用户快速准确的了解应用的具体功能,极大降低用户的学习和使用成本,这也是其最明显的优点。

4. 小红点/角标

小红点/角标也是一种很常见的提示引导,相比较其他形式的提示引导,其“提示引导性”较弱,一方面是其视觉形式相对较弱,另外一方面是传递给用户的“信息”有限且较为笼统,但也正因为如此才使小红点/角标的使用场景和范围十分广泛。本文认为角标与小红点在形式上是类似的,区别在于细节逻辑,因此将它们归为一类。常见的小红点/角标提示引导具有如下特点:

关联模块:小红点/角标可以关联应用中一个单独模块,也可以关联多个模块,但如果关联多个模块,则这些模块之间在信息架构层面上有从属关系。小红点/角标与关联模块之间的关联性很强,有较强的指向性,与气泡/浮层类似,一般就出现在关联模块上或附近。

触发条件:如果小红点关联模块只有一个的话,那么只需要根据该模块设定好触发逻辑就可以了,与其他提示引导类似。如果小红点关联多个模块,那么需要为层级最低的模块设定好触发逻辑,如果层级最低的关联模块触发设定好的逻辑产生小红点,那么它的父级关联模块会在自动产生小红点。如一个小红提示引导关联3个模块A,B和C(信息架构上C属于B,B属于A),如果C模块因为更新产生了一个小红点提示(,那么在C模块出现小红点的同时,B和A模块也会自动产生小红点,即关联多个模块后,一个触发条件会同生产生多个小红点,因此小红点提示引导比较常见用于多层级页面/模块之间的提示引导,可以快速帮助用户定位深层次页面中的具体模块。由于时层级结构的复杂性以及关联模块数量(多个),因此顶级层级小红点的个数是可以累积的,当所有层级较低的小红点消失后,层级较高的小红点才会完全消失,如微信中新消息的小红点提示音引导就类似于这种逻辑,一条消息一个小红点,多条消息多个小红点,累计起来的表现形式是小红点带有数字指示。

结束条件:小红点提示引导的结束条件与触发条件紧密相关,如果只关联了一个模块,那么按照设定好的逻辑,对这个模块进行特定操作后,如点击,小红点就会消失;如果关联了多个模块,则用户必须按照设定好的逻辑对所有层级最低的模块进行操作,小红点才会消失。此外,如果用户不处理小红点,那么小红点是可以不自动消失的,主要因为小红点提示引导的视觉形式较弱,不会对用户使用体验造成较大伤害。

展示次数:小红点的展示次数一般是没有限制的,只要符合触发条件就可展示,如微信中消息的小红点逻辑就是有新信息就会有小红点提示引导出现。

展现形式:相比较于其他的提示引导,小红点的展现形式在视觉上是最弱的,一般就是一个小红点,如果关联多个模块,则小红点可以累计,在形式上可以加上数字指示。角标与小红点比较类似,逻辑上基本一致,可以视为小红点的拓展,区别在于样式,一般来说角标是在小红点中增加图形或文字以传递一定的“信息”,类似于小红点中增加数字指示。如下图所示为几种常见的小红点和角标提示引导的示例。其中蓝色圈1表示角标提示引导,2表示小红点+数字累积的样式,3是标准的小红点样式,且关联了应用中多个模块,即小红点关联了一级结构C模块的导航图标和二级结构中的列表选项1和2,因此蓝色圈3内的小红点同时由列表选项1和2产生的,当用户点了列表选项1后,其上小红点会消失,但模块C导航图标上的小红点不会消失,因为列表选项2的下红点还存在,因此必须等列表选项1会和2的小红点同时消失,C模块导航图标上的小红点才会完全消失。

442763a25c4f9022df705ae2ec011bc2.png

总结

小红点和角标提示提示引导是一种使用最为广泛的的提示引导形式,其优点是形式灵活多变,既可以针对单个页面元素,也可以针对应用的多层级结构中的模块进行提示引导,而且小红点的视觉形式较小,对用户的正常使用流程不会造成太大影响,缺点是由于视觉形式的限制,提示引导中传递的“信息”较为简单,一般只能用作最为宽泛的提示引导,而且现在应用中小红点已经因广泛使用而有泛滥的趋势,因此导致很多用户对小红点的提示引导已经相当“免疫”了。

5. 元素替换

元素替换也是一种常见的提示引导形式,经常是在特定的时间点用“新”视觉形式替换产品原有控件/元素的视觉形式,其本质就是利用“新的”,“不一样”的视觉形式来提示和引导用户,如在春节的时候,用带有新年气氛的logo替换标准logo。元素替换提示引导具有如下特点:

关联模块:元素替换提示引导与产品关联模块的逻辑比较简单,被替换的元素就是被关联的模块。实际中,不是所有的模块/元素都可以使用替换元素的方式来进行提示和引导用户,一般来说能够进行替换的元素在产品中必须是相对固定,层级结构相对较高,在页面中能够获得较好的用户视觉“焦点”比,如导航按钮,此外,像Banner图等经常更换的元素等也是不适合的,因为经常变化元素起不到提示和引导用户的目的。

触发条件:元素替换的触发条件一般来说都是设定时间逻辑,在特定的时间会自动出现的,如一些重要的时间节点,如周年庆,国庆节等。

结束条件:元素替换的结束条件与触发条件类似,比较简单,一般都是在特定时间后消失,即被替换的元素会变回原有的视觉形式。

展示次数:元素替换一般就展示一次,满足结束条件后就不再展示。

展现形式:元素替换的展现形式上就是用新的视觉形式替换原有的视觉形式,但这并不意味着能随意的使用新视觉形式,新视觉形式需要兼顾产品的形象和用户体验,所以建议设计中保持被替换元素的主要视觉形态不变,但可以改变视觉形态的属性,如颜色,或增加一些“装饰”元素等。

总结

元素替换可以同时达到一定程度的宣传运营和提示引导效果,其限制性就是提示引导的目的性也是比较弱的,使用场景范围相对较小。

6. 常见提示引导的比较

上述的几种提示引导的特点是不同的,有优点也有缺点,因此在设计过程中需要根据需求的目的以及产品的特点,采用不同的提示引导。比如要在提示引导中向用户传递较为丰富的“信息”,像小红点/角标形式的提示引导就不合适了,可以采用弹窗和气泡形式。如果要从传递的信息丰富程度,对用户的干扰程度,使用的限制性,提示引导的效果等方面来比较上述几种常见的提示引导形式,则大致如下图所示。

709236d6b977f9794867be75210d5cfa.png

五. 提示引导的一些设计建议

不同的提示引导,有不同的优缺点,可以起到不同的效果,但为了保证提示引导的有效性和用户的使用体验,我们需要仔细慎重地分析需求目的后再进行具体设计,在设计过程中可以对以下的几点建议结合具体设计进行思考。

1. 提示引导必须满足需求的目的

提示引导的形式和逻辑是多样的,但使无论是何种形式和逻辑都必须满足需求目的。如果提示引导不能满足需求的目的,无论其他方面多么出色,都不是合格的设计,所以在设计提示引导的视觉形式或内在逻辑时,一定要确保需求目的能够得到很好的满足。

2. 提示引导的“时机”恰当

提示引导的“时机”指的是提示引导的触发条件和展示时机。如果提示引导的展示时机不合理,则可能会导致提示引导的效果达不到预期,甚至会引起用户的反感。关于提示引导的“时机”有2点建议。第1点,在用户的“具体”使用产品过程中,不要向用户展示提示引导,这里的“具体使用过程”如用户输入文字或填写信息等“细节流程”,尽量选择“不重要的时机”来展示提示引导,如用户浏览页面;第2点尽量避免提示引导前置,即不在与提示引导无关的页面模块或无关的时间向用户展示提示引导,加强提示引导、需求目的、产品关联模块和用户操作行为之间的关联性,以确保提示引导的效果和用户体验。

3. 最大程度降低对用户的干扰程度最低

从上文对提示引导的分析来看,无论何种形式的提示引导,在一定的程度上都会打断用户使用产品的流程,会对用户的正常使用产品造成一定的干扰。因此在提示引导的设计过程中,所有相关的设计都需要尽量降低提示引导对用户的干扰程度,提示引导的所有组成要素都对用户的干扰成程度有一定的影响,在设计中合理规划设计提示引导的每一个要素。

4. 提示引导中的“信息”简练

提示引导会向用户传递提示和引导的“信息”,在设计中需要特别注意“信息”的度,一定要确保“信息”的简练,保证用户能够快速高效的理解提示引导中“信息”。建议尽量少使用文字,因为相对来说,用户对文字的认知理解成本较高,多使用图片形式,图片既可以快速传递“信息”,吸引用户更多的注意力,还可以增加提示引导的趣味性,相对降低用户的反感度。

5. 提示引导的操作逻辑简单且相关视觉元素布局必须合理

提示引导可能需要用户进行一些操作,但如果操作逻辑过于复杂,那就需要用户花费较大的“代价”来理解和操作,这样会对用户的体验造成损害,对提示引导的效果也会造成负面影响。因此在实际中建议提示引导的中操作逻辑应该简单明了,“具体”操作逻辑不要超过3个,即用户可点击/操作的元素。此外,提示引导的视觉元素布局也应该合理,符合用户认知,不能引起用户理解上的歧义,如关闭按钮就是关闭按钮,不要在关闭按钮上设定其他操作逻辑。如下图所示为提示引导的操作逻辑和视觉布局的简单示例,左图为合理的设计方案,中间图中有5个操作逻辑(4个按钮,1个关闭按钮),过于复杂,用户认知和使用成本较高,右图中关闭按钮布局在页面右上角,与提示引导的主体内容举例过远,布局不合理,后两者都是不合理的方案。

7a4f25540a78647a98d5377a631fcd82.png

六. 提示引导体系

上面都是在讲单个的提示引导,但在实际中,尤其是结构体系复杂的产品中的提示引导会有多个,因此不同的提示引导就组成了产品的提示引导体系。在设计过程中,我们不仅要考虑单个提示引导的设计,还要考虑不同提示引导之间的相互影响,比如触发条件相同时怎么展示提示引导,会不会在短时间内连续向用户展示不同的提示引导,因此需要设计师和产品经理根据产品的实际需求目标和用户体验等方面因素进行综合考虑,可以从下几个方面对产品中的提示引导体系做一些全局控制和规划。

1. 产品中提示引导的数量

产品中提示引导的总数量应该得到有效的控制,不是什么功能或者需求都可以使用提示引导,否则用户在使用产品过程中时不时的出现一个提示引导,很容易引起用户的反感。

2. 不同提示引导之间的相互影响

设计提示引导时需要注意不同提示引导的各个因素是否有冲突或影响。比如触发条件是否相同,如果相同,该怎么处理,哪个提示引导的优先级高,这些都是需要提前考虑的。

3. 向用户展示提示引导的频率

每个提示引导都有自己的触发条件,一旦满足展示条件,就会向用户展示,因此用户可能在短时间内就会“被展示”很多提示引导,这样既影响用户的使用体验,也会影响提示引导的效果。从系统层面讲,可以针对性设置产品全局提示引导的出现频率,如设置一个时间间隔,在间隔内就算满足触发条件,也不会展示提示引导,尤其是会多次出现的同一个/种提示引导的频率。

提示引导在产品中的重要性肯定比不上导航控件等主要功能结构模块,但提示引导的“辅助作用”也是不可缺少的。从产品方面讲,提示引导可以帮助产品进行各种“运营”,如提升用户活跃度,吸引新用户等;从用户方面讲,提示引导可以帮助用户快速了解产品功能逻辑,降低使用成本,提升用户体验,所以无论是提示引导的外在形式还是内在逻辑,都在要需要慎重思考和分析,以保证每一个提示引导对用户和产品都能发挥最大的作用。

作者现在是一名交互设计师,写的不好不正确的请见谅。记录,仅以此自勉。欢迎关注我的公众号notestudy,会定期写一些与设计相关的短文,谢谢支持。

f053a4b0b8d305ecf05fe3fe386d3bfc.png
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值