从17年到今天，做了近5年To B 的设计师。最初的最初我也迷茫的，To B 的设计师能做什么？

5年前刚刚接触To B的时候，B端的类型还比较少，多数是To C产品对应的商家端。随着AI行业的兴起，To B的诉求也越来越多，对设计师的要求也要越来越高，不仅要求有较强的专业性也需有比较强的逻辑思维能力（UI设计，不是线框仔哦～～·）

今天以智能客服为例，给大家分享一下这几年的经验。解读B端产品设计体系的构建，抛砖引玉，希望To B 的设计师能从中得到启发，找到自己的定位。

首先，你需要考虑下想传达给用户一个什么样的To B产品。

这个从2个方向出发：产品的定位和设计的定位

大部分的后台产品有着臃肿的布局，被冗rong杂功能所充斥，产品存在高度雷同性和操作不顺等问题

我也在思考，像智能客服这样一款定位明确 强调性能的产品 他的设计应该是什么样的？

在目前AI产业迅速发展和信息过载的大环境下 我应该做一个怎么样的产品来避免重蹈覆辙，并脱颖而出 ？

以智能客服的底层产品的改版为例，探索客服方向配置平台的设计

首先从全局分析，确定视觉和操作2个方向的设计目标

视觉上，在提升产品的专业度和设计感，同时创建具有垂类属性的设计语言

操作上则是优化操作步骤，提升效率

通过系统思考与全局规划 确定了智能客服 体系化设计的构建流程：

基于产品的全局分析，结合设计方法与原则 生成设计语言 并落地于项目产品加一验证

采用原子设计方法，通过抽象得到稳定且高复用性的内容构成“原子”与“分子”，根据客服的业务需求生成组件和功能模块，结合使用场景完成 整个界面的布局结构。

对话类产品应更具有亲和力，所以在元素的设计用采用圆角化处理的方式，一改中后台产品常用的直角、硬线条；让信息流动更顺畅，视觉更容易追随。

基于圆角矩形对于空间的限制性，让布局空间更具呼吸感，不像以往的后台产品界面那样局促，反而带给用户更友好与轻松的体验。这种风格的创立之初，就得到项目客户认可。

由于客服产品自身属性，往往会有一些复杂规则，如何拆解业务逻辑，给用户清晰的传达，就是设计重点。

当然，作为TOB的产品，少不了高效率的操作需求，所以在设计过程中做到信息层级清晰。只有做到层级清晰、结构清晰，才能让用户更简单高效的获取信息。

如图，根据业务场景的日常BOT维护页面，主要对未发布Bot 进行配置和发布，而已发布的只需要关注到当前状态 进行开关处理 无其他更多操作

所以在设计上 采取抽屉式卡片设计，将已发布的BOT收起，突出配置中的BOT操作与展示

这样在视觉突出主次、信息层级清晰，体验流畅简洁化的设计语言带来更沉静的设计体验

同样在Bot装配的设计上，将流程片段模块与会话树模块合并展示，

局部合并，主要是考虑页面跳转操作不便的问题 采用这种上下功能区的分割，选中的流程片段内容可以在当页面展示， 缩短操作路径，提高了效率

最终 通过大量探索与尝试，完成了智能客服底层配置平台关键页的统一改版

打造出具有智能客服行业属性的视觉风格，传达友好与亲和的体验

为了让新版风格更快更好的迭代 以及交互同学熟悉使用视觉样式

搭建了包含76组件样式的 智能客服垂直领域的组件库

综合7个产品的使用场景 整理输出智能客服 的设计规范和使用示例，并输出具有客服行业属性的对话式设计语言。

这样交互同学也可以在0视觉人力支持的情况下完成日常需求的输出

同时，也对PM和FE培训，目前PM可以完成基础页面面的输出，有效的节省了人力，提高效率

此外，也渗透到项目客户的产品，在关键词脱敏后输出给多项目客户。

对话式设计语言 在12个产品配置平台 验证，

在客服官网的搭建上，坚持用精细、一致的视觉语言，贯穿整个产品设计。增强用户对品

牌认知，增强用户的信任感。

同样这种设计语言也被用在 智能知识库的门户网站的改版上。

最后，希望百度智能客服的改版能够成为一个真正意义上的全场景融合系统，也希望这篇文章，能抛砖引玉，给To B设计师带来更多的信心，一起加油吧！