b端消息管理，b端设计和使用体验

来源：头条浏览：0 2022-12-03 21:42:01

消息通知是连接系统与用户的桥梁，但对于不同的系统来说，如何设计消息组件以促进用户与系统的交流呢？平台中用户与用户之间的交流应该采用什么样的交互方式呢？让我们看看各种消息组件中有什么。我们希望有助于创造更好的b侧设计。

b端消息管理，b端设计和使用体验

消息通知作为系统与用户之间交流的桥梁，有助于向用户呈现“当前操作状态、系统发布、用户交互”，因此在设计过程中非常重要。此外，您还需要使用不同的消息通知组件进行反馈，例如根据消息内容的不同，用户与用户之间的交互方式应该如何。那么，谈谈消息通知组件的具体使用。

一、消息通知的定义具体包括哪些组件是消息通知？在检查每个设计系统[1]时，我们发现所有对消息通知的定义都称为“反馈”，这意味着信息是一种向用户反馈的形式。该反馈的组件包括全局提示( Message )、通知提醒(通知提醒)、气泡确认框)、对话框)、抽屉)、进度条)、结果页) Result )

关于反馈的内容，系统中存在积极、消极、普通三种反馈情绪。例如，如果你的账户过期了，对系统来说他会提供负面的消息通知组件。因此，我将简单分类消息通知的类型。

正向主要是全局提示( Message )、通知提醒)、气泡确认框( Popcomfirm )负向主要是警告提醒)、对话框)、通知提醒) Modal )当然

[1]在调查的设计系统中，包含了Element、Arco、Ant、Lightning…

二、消息通知的设计消息通知是否有设计形式，便于所有同学快速直接理解消息通知？我们去了“测评”，查看了当前所有的消息通知组件。然后，通过“操作干扰度、反馈消息强弱、出现位置”三个维度对消息通知进行分类，在消息通知设计中，它们之间的区别在哪里？

信息提示量：

信息提示量表示组件可以承载多少信息内容。由于组件不同，使用环境本身也不同，因此根据原子[2]的划分，可以大致分为图标、文本、链接、按钮、容器的不同

操作干扰度：

操作干扰度主要是操作在用户中是否受到干扰。例如，在全局提示和对话框中，对用户的影响度完全不同，因此使用干扰度进行判断。

当然，操作干扰度这一维度只是主观的，细分为持续时间、是否屏蔽、信息源三个方面的持续时间。使用此组件来指示需要在页面中停留多久，有助于确定干扰程度。是否屏蔽：页面中是否显示用于屏蔽用户注意力的掩码。这也是判断噪声程度的重要指标。信息源：该内容主要分为来自哪里、系统、用户两种来源方式。

出现位置：

通过主要考虑它们的调用方法和相应的演示内容，可以快速了解此组件显示在哪里。

1 .全局提示当用户执行操作时，全局提示会在不中断当前用户操作的情况下通知短消息。在整个B端系统中使用非常频繁。例如，填写表格可以获得全局提示。修改信息后，可以得到全局提示。

在使用中，它具有以下特点：

信息提示量：

全局提示是一种非常简单的组件类型，只显示图标、容器和提示文本，相对来说显示的内容较少。

在实际工作中，由于其内容少，向用户提示的多是正确的操作，如添加成功、编辑成功、保存成功等正面情绪。

操作干扰度：

关于干扰的程度，正如刚才说明的那样，共有3个判断根据，所以从这3个方面来判断具体提示的干扰程度。

出现位置：

全局提示由于内容很少(图画文字)，所以经常需要出现在引人注目的位置。使用全局提示时，它基本上位于页面顶部的中央。通常，距顶部的距离为40-60px。这个位置是顶部导航和页面内容的交叉点的概率很高，不影响用户的使用。

注意事项：

关于注意事项，其实是我们在实际工作中，还需要考虑的几个小知识点。我来总结这个。

)1)全局提示有五种类型：指导提示( Info )、普通提示(成功提示)、成功提示( Success )、警告提示( Warning )和失败提示( Error )。

这时，认真的同学说：“老师，刚才讲全局提示不是代表了正面的结果吗？怎么会出现警告和失败等信息呢？其实这个原因主要是“失败也有很多种。仿佛是我们的失败/偷笑”，如“小操作时，你确实无法提供对应的功能，可以发出警告信息。下图”

)2)全局消息“常规”不存在关闭(入口 )。由于自动消失，所以不提供关闭给用户)入口，通知他该通知本身也会自动消失。所以在很多情况下，关闭入口这个选项可以忽略。

3 )其停留时间可以在设计系统中的API中定制，一般为3 s5s。在编写组件时，必须查看组件的相应开发文档，以了解该组件支持哪些定制功能(拒绝被开发迷惑)

)4)全局提示可以在短时间内多次提升，多次提示时，按照优先顺序从上到下排列

2 .警告提示Alert警告提示驻留在页面上，用于连续性提示信息。多用于危险、警告、紧急等负面情绪。在实际工作中，由于其特殊性，一般用于系统、全局的危险通知。您的订阅时间过期、客户团队解散等通知上。

信息提示量：

此处的警告提示比全局提示显示更多的信息。主要包括图标、提示文本、辅助文本、按钮和关闭入口

操作干扰度：

提示警告的一般场景：多用于警告、危险等情况，需要提醒用户，引起注意。例如，费用不够，提示需要充值

出现位置：

因为需要驻留，所以通常在设计时放在模块和模块之间进行展示。这样，您就可以驻留，而不会影响其他内容的显示。

注意事项：

全局提示主要显示警告、紧急消息通知，如果想通知一些常见消息，可以通过通知通知框进行提示。全局提示主要在模块和模块之间提示。

3 .通知提醒框通知提醒框在页面中，主要围绕交互式消息，全局提示通知提醒，及时有效地向用户传递信息。在实际工作中，通知提醒主要用于提示诸如交互等有价值的信息。

信息提示量：

此处的通知提示框主要包括标题、辅助字符、按钮、关闭入口

操作干扰度：

持续时间：常驻/3-5s消失是否中断：否信息源：用户与用户之间的交互、系统通知出现位置：

在使用通知提醒时，这些活动会集中显示在右上角，就像您在桌面上收到的消息一样，因为它们本身是通过用户交互生成的。这样不会对用户产生太大影响，也可以保证消息通知的即时性。

4 .气泡确认框Popconfirm气泡确认框是我们在工作中使用频率相对较低的组件。这可以通过组件中的插件实现与用户的快速交互，但在实际场景中，交互确认是一种需要很强提示的方式，因此在气泡确认箱的使用上，感觉有些矛盾。气泡重量轻，不易干扰用户，但对话框屏蔽的含义很强。

信息提示量：

首先从信息提示量来说，气泡确认框主要由触发器、气泡卡、图标、文本、按钮操作五部分组成。

气泡确认框本身需要设计得不要太复杂。否则，在一个气泡卡中，会显得特别拥挤。如果信息过多，请使用对话框考虑渲染和优化

操作干涉度

持续时间：用户点击触发器后即可展示，操作后可以消失。是否切断(否) (气泡卡不会切断) )出现位置)跟随触发器的位置调用时，通常显示在触发器上面，但如果触发器的位置离边缘近，可以考虑移动到其他位置进行调整。

5 .对话框Modal对话框在整个系统中非常重要。因为在整个系统中或多或少都有它的身影。例如，在典型的数据输入表单中，总体感觉类似于对话框。或者在梭箱里，也能发现有异曲同工，所以先看看对话框是什么吧。

对话框主要用于确认信息和输入信息，使用对话框会中断用户当前的任务流，稍微干扰用户，使用时请谨慎。

操作干扰度：

持续时间：常驻，操作信息后，是否必须点击提交才能消失。是的，用黑色口罩使用户聚焦于表单内部的信息源。根据事先设定的内容，显示出现位置。它位于整个页面的中央，主要目的是让用户聚焦于内容，减少分心。由于会显示一个对话框，用户必须先处理相应的信息，然后才能进入下一个阶段，因此在整个过程中非常重要。对话框类型：

在整个对话框的展示中，可以看到内容主要分为Header标题、Content内容和Footer底部操作三个部分。

其中由于用途不同，所以可以简单地分类为确认对话框、消息队列对话框、功能业务对话框

确认对话框：通过显示内容信息的二次确认，可以减少用户的误操作，降低操作风险。主要区别在于内容部分围绕操作过程中出现的问题进行展示。其本质是二次确认的过程，需要用户的判断，比气泡确认盒更重要，阻隔性也更高。

消息队列对话框)显示相应的状态队列。例如，删除知识库后，执行了这么重要的操作时，我可以通过消息队列对话框向你展示成功或失败的消息。它还可以让用户知道问题出在哪里。其本质是消息的状态通知，只是更重要。

功能业务对话框：用于优化Content内容部分以显示更多复杂信息，例如输入各种复杂信息(输入框、单选、多选) )和呈现各种信息。通过功能业务对话框，可以满足很多业务要求。

同时使用弹匣[3]的形式，可以在不脱离当前业务的情况下完成更多的操作。当然，在实际工作中，可以搭载的内容非常多，包括步骤栏、标签、各种选择的输入等。因此，我认为这种类型的对话框本质上是容器，可以包含很多内容。更多的注意事项是弹匣部分的内容，包括尺寸的宽度是多少、高度是多少、是否有口罩等。

三、几个组件的差异比较了解组件的差异为了让学生们能快速了解这些组件的差异，我们试着对刚才提到的很多组件进行相应的比较，分析其差异。

全局提示和警告提示首先，这两个组件的设计样式非常相似，本身的使用环境差别不大，因此容易混淆。其实我们可以从几个方面进行比较和区分：

不建议关闭全局提示入口全局提示优先级较低，主要提示非紧急通知；警告消息表示需要更多紧急用户立即操作的通知，全局消息在停留3-5s后自动消失。警告必须在操作后消失

气泡复选框和对话框差异这两个组件之间存在用户二次确认的组件类型，但在实际工作中存在重要的级别之间的关系。

气泡确认框适用于切断过程意义不强的情况，重量更轻。对话框反而气泡确认框多为对话框的二次确认方式，可以避免将弹匣套在弹匣上的尴尬局面

四.优化消息通知解除了传统组件以外的通知方式。理解消息通知时，不能只看到消息通知本身的组件格式。最终目的是帮助用户更快、更直观地了解他们感兴趣的内容。因此，在设计上可以进行对应的优化。