交互流程_今日头条智能客服体验及核心交互流程拆解

一、体验今日头条智能客服体验的目的：

了解今日头条智能客服PC端和APP端的功能体验，然后对其智能客服核心交互流程进行分

析拆解和学习了解，以便我们在设计智能客服产品的时候，对核心交互流程以及前端页面交

互有足够的了解。

二、PC端智能客服体验：

2.1 今日头条智能客服的入口：

2.2 选择问题类型：

2.3 PC端智能客服的交互页面：

下面的截图是今日头条的在线客服的会话页面，我们标注了数字1到7，下面我们来详细讲

1到7的功能和作用。

2.3.1、智能客服页面的TITLE。

今日头条的默认TITLE是"在线客服"，这个一般在IM后台可以自定义修改这个TITLE或者

前端应用在接入IM的时候可以传参数修改这个页面的TITLE标题。

2.3.2、机器人的头像。

这个一般在后台也是可以配置智能客服前端页面展示什么样的机器人头像。

2.3.3、智能客服的默认欢迎语。

这个一般是标准的机器人欢迎语话术的配置，可以自定义配置。

2.3.4、常见问题列表区域。

常见问题列表一般是可以根据用户的渠道入口以及用户的标签来智能的给用户推荐一些问题

列表。这个问题列表一般是根据前端传过来的一些参数，后端机器人智能的根据用户的一些

标签进行智能匹配，然后输出对应的问题列表返回给前端IM页面，IM做页面渲染然后呈现

给用户。这个地方如果用户标签足够精准，可以做到在这个页面常见问题千人千面。

2.3.5、上传图片的图标。

点击这个图片可以上传图片。

(备注：一般机器人模式下，机器人识别图片然后给你返回答案比较困难，所以在在机器人

会话模式上，这个图片上传的功能是不可用的，当你点击的时候会给你提示请输入文字或进

入到人工客服模式才可以上传图片。)

2.3.6、用户的问题输入框。

在这个地方用户可以输入自己想咨询的问题，然后与智能机器人或人工客服进行在线会话沟

通。

2.3.7、转人工客服按钮。

用户点这个按钮，IM会尝试将当前用户与智能机器人的会话转入人工客服。当然不是你点

转人工客服就一定会接入到人工客服的。IM转人工的时候，会做一系列的逻辑判断，首先

会判断当前请求转人工的时间是否是在人工客服的工作时间，其次需要判断当前需要转入的

技能组客服是否有空闲人员，如果没有空闲的客服，就会出现排队的情况的，页面会给你展

示前面有多少人在排队，需要大概等待多少分钟等。这个里面我就不详细说了，大家可以脑

补一下，想一下。

2.4 与智能机器人对话：

在输入框输入您想咨询的问题，例如输入：身份信息已绑定，怎么办，然后点击发送。

你发送之后，IM系统会请求机器人后端接口去查询智能机器人知识库，匹配与这个问题相

关的答案，然后把打分最高的答案筛选出来，返回给IM系统，IM渲染后，把这个问题对应

的最佳答案返回给您。

三、今日头条APP端智能客服体验：

3.1 APP在线咨询的入口

3.2 APP端在线客服的页面：

以下是今日头条APP端在线客服的页面截图，我们标注了数字1到7，下面我们来讲一下1到

7的功能或作用。

3.2.1 返回按钮。

用户点这个返回按钮，会从在线客服页面离开，返回之前的页面。

3.2.1 机器人的头像。

(头像可配置，且PC与APP端，或其他应用可以设置不同的头像，一般一个企业头像基本使

用一样的。)

3.2.3 机器人的欢迎语。

欢迎语可以配置，因为我们明显可以看到PC端的机器人欢迎语与APP端的机器人欢迎语明

显不一样，这个是一个标准化的功能，他肯定是有这个功能的。

3.2.4 猜你想问(常见问题)

这个猜你想问就是根据您的用户标签，然后给您推送的常见问题列表，每个人都可能看到不

同的问题推荐。另外PC端，APP端或其他应用入口，也是可以配置不同的常见问题，可以

推测他这个地方的猜你想问，或叫做常见问题是在后台配置的，然后前端应用在用户进来的

时候，携带了用户标签，然后请求后台的机器人接口，获取了与这个用户标签想匹配的一些

高频问题，然后展示给用户，期望各精准的解决用户想问的问题。

3.2.5 发现更多

这个就是引导用户去查看更多的常见问题分类，然后查找自己的问题分类及相关答案，引导

用户自助解决遇到的问题。

3.2.6 气泡。

因APP端的H5页面比较有限，不能像PC端那样展示特别多的内容，他这个地方将高频的问

题进行分类总结在一起，以分类的形式汇总，以气泡的形式可以展示。用户点击文字气泡，

然后会自动的给展示与之相关的问题分类，如下截图所示：(账号相关)

3.2.7 聊天文字输入框。

在这用户可以输入文字然后进行发送，智能机器人进行应答。例如输入：收不到短信验证

码，机器人给推送了一个答案。

上述就是今日头条PC端智能客服用户侧的主要的交互过程了，希望您有一个大概的了解。

四、今日头条智能客服的交互过程简要总结：

产品应用系统里面放置一个或多个咨询客服入口--->用户点击咨询客服---->出现一个中间

页面，让你选择咨询的业务模块--->跳转 PC链接或H5的在线客服咨询问答页面---> PC或

H5的初始页面给你推荐一组常见问题列表或多组问题列表(多组一般用换一组的按钮让用户

自行切换常见问题列表组)--->用户在输入框中输入要咨询的问题--->智能机器人根据你的

问题智能匹配后台的FAQ知识库，然后给你返回对应的答案--->用户对当前的回答可以点

赞或点踩--->用户继续提问--->机器人继续回答--->多次之后，机器人界面或露出转人工

客服的入口--->用户点击后可以转接到人工客服--->人工客服与客户进行即时沟通问题。

五、今日头条智能客服交互时序图还原:

六、今日头条智能客服交互时序图详细讲解：

下面是我们拆解的智能客服核心交互流程，每一步的交互过程都写的非常详细，以下是详细

内容：

6.1 用户点击咨询客服按钮；

6.2 产品应用前端请求IM接口；

6.3 IM后端给产品应用端返回PC/H5的在线咨询的页面；

6.4 用户选择咨询分类；

6.5 IM根据用户想要咨询的产品分类、用户的标签等信息，请求智能机器人常见问题列表接

口；

6.6 机器人后台查询与这个用户匹配度最高的常见问题列表；、

6.7 机器人后台系统将满足条件的常见问题列表数据返回给IM系统后台；

6.8 IM前端渲染IM后端接收机器人系统返回的常见问题列表，做加载展示给用户；

6.9 用户点击某个常见问题；

6.10 IM前端请求智能机器人的智能问答接口；

6.11 机器人查询与这个问题相关的答案，且把得分值最高的答案给查询出来；

6.12 机器人将答案返回给IM系统；

6.13 IM将答案呈现给用户；

6.14 用户点词条答案下方的"已解决"、"未解决" (点赞，点踩)的操作；

6.15 IM前端请求机器人的问题反馈接口，将该词条用户的点赞点踩的行为发送给机器人系

统；

6.16 机器人后端数据库存储用户的点赞点踩的行为数据；

6.17 机器人返回问题反馈请求的响应结果给IM；

6.18 IM前端 已解决/未解决按钮置灰色，不可以再次点击；

6.19 用户在输入框输入某个问题；

这里又开始不断的重复6.9至6.18的过程，IM、机器人的交互过程是一样的，此处略去。

6.21 用户点词条下方露出的转人工按钮；

6.22 IM请求转人工客服；IM转人工的时候，会做一系列的逻辑判断，首先会判断当前请求

转人工的时间是否是在人工客服的工作时间，其次需要判断当前需要转入的技能组客服是否

有空闲人员，如果没有空闲的客服，就会出现排队的情况的，页面会给你展示前面有多少人

在排队，需要大概等待多少分钟等。(这个图上面我们略去逻辑，默认转人工成功)

6.23 用户与人工客服建立实时会话，相对在线聊天沟通解决问题；

6.24 用户或人工客服或系统自动结束会话后，IM系统自动的给用户推送在线服务的满意度

评价；

6.25 用户对本次服务进行评价；

6.26 IM系统存储用户对该在线会话的评价，评价结束；

6.27 会话结束。

七、总结：

1、智能客服产品要兼顾多渠道接入设计，统一接入API能力，多渠道可以快速接入，PC

端，H5，APP，微信，微博等等。

2、整体智能客服IM前端设计可以参考今日头条，页面做的比较简洁和清爽，功能也非常的

实用。

3、智能客服在线客服接入的页面设计要模块化，各页面的一些组件配置进行产品配置化，

满足各种渠道应用接入可以自定义的在IM后台修改各种常用的配置，例如: 机器人头像，机

器人昵称、在线咨询页面标题、机器人欢迎语，结束语，常见问题列表可配置等。

4、智能客服进入正式的初始问答页面之前，可以设计一个中间页面引导问题选择要咨询的

问题分类，可以进一步的过滤筛选用户，机器人可以更细分的回答用户的问题，后续转人工

也可以携带用户的标签转入到特定的人工客服技能组，客服人员接待用户，因事先机器人已

经为用户筛选了分类，客服人员能有效解决属于自己擅长业务板块的客户问题咨询，解决问

题更高效。

5、智能机器人的页面，尽可能的引导用户自助解决问题，例如根据用户的标签猜客户想

问，引导用户去更多里面查询问题分类及答案。

6、智能机器人的核心是构建智能机器人知识库，尽可能的减少转人工请求，提升机器人的

问题解决率。

7、智能机器人要有转人工兜底逻辑，在用户需要的时候可以转人工客服咨询，另外适当的

方式和位置露出转人工按钮也是需要认真考虑的事情。

以上是全部的分享内容，希望对您了解智能客服产品系统设计有所帮助，欢迎大家留言讨论

及交流。