原文地址：腾讯CDC体验设计（公众号）

作者：腾讯CDC-bingna

导语：本文将以 AI-Design 项目版本迭代为主线，简述 AI-Design 的架构演进，结合项目实际发展路径，讨论智能设计工具/产品的技术选型和架构设计。

文章概览

本文共有3124字，大概需要8分钟阅读。

一、什么是 AI-Design

AI-Design，指通过AI技术来进行设计辅助的智能设计工具。

AI-Design核心的智能LoGo设计功能(AI-Logo)，通过AI技术生成 Logo 原型，帮助用户以较小的成本进行 Logo 设计。对于专业设计师，AI-Design可以提供设计素材和思路；对于没有设计经验的用户（比如我）则可以低成本完成 Logo 设计。

智能Logo设计同时提供品牌 VI 展示和电子名片生成等功能，实现多场景下的Logo 设计。

二、智能设计工具

AI-Design作为一款智能设计工具，具备以下特点：

服务稳定是一款线上产品的基础；

智能功能的部分，需要算法组件提供支持；

设计类产品注重结果展示，需要能够准确还原设计视图；

部分智能设计工具可能需要借助其他开源软件提供服务。

三、DEMO阶段

为了满足以上特点，AI-Design 的 MVP 版本具备如下模块：

python 实现的算法服务-NLP模块；

Go 实现的后端服务-调度服务；

Web端用户入口和提供设计还原的前端功能组件；

不同的后端服务之间，采用grpc协议进行通讯。

作为 MVP 版本，通过上述三个模块，实现了 AI-Design 的主体功能，用户输入品牌名，通过算法模块进行品牌解析，获取品牌相关的icon素材，根据用户选择的Logo风格，前端模块以特定布局模式，组合各种素材，产出Logo。其中调度服务提供一个简单的webserver，打通用户端和算法服务，以及提供静态素材给前端进行Logo 生成。

四、内部服务阶段

根据MVP版本的试验，AI-Design项目具备可行性，于是我们将继续加入“亿”点点细节，使之成为能够为内部用户使用的服务。

1、目标

算法服务不应该直接暴露给用户，算法服务本身作为底层服务与调度服务进行数据交互即可。

调度服务中增加素材管理功能，通过数据库去获取和记录icon使用情况，保存生成 Logo使用的信息组合。

增加用户服务，提供内网用户登录验证，记录请求事件。

服务完善日志系统，增加监控和部分关键数据采集。

于是，衍生出如下架构：

2、效果

内部服务版本在MVP版本基础上，进行了一些基础建设工作，做到了：

使AI-Design 脱离Demo阶段，正式成为一个产品；

Gate服务（即上一阶段中提到的调度服务）通过协议转换提供 HTTP 服务；

算法模块下沉，使之只与素材服务通信，实现基础的语义理解功能；

基础服务的数据存储、日志上报和监控告警能保证服务运行稳定；

新增的用户服务，为未来增加更多基于用户身份的个性化功能提供准备。

3、痛点

这个版本仍然存在一些较为严重的问题：

Gate服务仅提供协议转换，而素材服务是基于微服务的思路进行设计，只提供一些基础的功能；当面临一些复杂逻辑时，需要前端进行多次接口请求来实现数据获取。

前端需要按照如下流程组织逻辑，实现一次 icon素材的检索：

Logo渲染由前端（用户浏览器）完成，执行过程需要消耗大量资源，当用户频繁拉取时，导致内存暴增；另一方面，由于部分逻辑可能会由于用户浏览器版本的不同，导致最终产物的不同，前端则需要额外开发一些逻辑来进行浏览器适配。

不同浏览器的布局效果可能会产生差异：

由于生成 Logo只在前端完成，难以避免渲染逻辑和渲染素材外露。由于已购素材版权限制，暴露素材会带来一些法律风险和成本损失。

Logo中的 icon素材直接暴露，可以通过检查元素直接获得 icon素材 svg内容，造成数据损失。

在内部服务试运营一段时间后，为了解决上述问题和提供对外版本，AI-Design 架构再一次进行升级。

五、对外服务阶段

对外服务相比内部服务，用户容忍度相对比较低。当使用过程中出现问题时，内部用户更愿意加群或联系接口人反馈问题，而外部用户可能会直接流失，因此对于服务稳定性和用户体验有着更高的要求。

1、目标

希望扩充Gate调度服务能力，以减轻前端功能的负担。

由于上文中提到的，避免渲染逻辑和渲染素材外露，则需要将 Logo 渲染功能进行服务化改造，使之成为后端基础服务提供渲染能力，对数据进行保护；同时避免不同浏览器版本对渲染结果产生影响，通过渲染功能后端化来保证渲染效果唯一。

扩充用户服务能力，增加多端登录，用户信息记录等功能。

增加素材更新模块：由于icon素材数量和来源增加，需要有相应的模块去维护这些素材，统一进行标准化和入库操作以节省人力成本。

架构图如下：

2、效果

Gate调度服务功能扩展

对于简单的接口，可以直接提供gRPC到HTTP的协议转换，避免增加相应的HTTP-API代码。

对于复杂的接口，Gate服务使用接口组合的方式，对下层rpc服务进行封装，避免前端处理复杂逻辑进行多次对后端的HTTP请求。

统一进行鉴权验证，所有流量都要经过Gate服务，避免下层服务需要额外进行用户身份校验。

渲染服务后端化

渲染功能独立为一个基础服务，能够保护我们的素材资源不被恶意拉取，同时可以保证每一个生成的Logo可追溯、可还原，避免产生版权风险。

渲染功能作为独立的功能，可以脱离AI-Design项目作为单独的基础服务，提供素材-模版-渲染的解决方案。

渲染服务本身也是整个业务流程中性能损耗最严重的部分，将渲染服务抽离出来，可以灵活部署和扩缩容，提高可用性和性能。

用户服务功能扩展

增加下载/收藏等与用户身份关联的功能，提高产品的完整性。

为未来的个性化服务和付费服务做准备。

架构整体优化

AI-Design服务中存在的多语言场景，通过protobuf+gRPC实现接口定义同步。

区分上下层微服务：如NLP模块，渲染模块，素材更新模块等不需要直接面对用户的服务，统一作为下层微服务管理，只与上层微服务产生数据交互，调度服务不会直接与之通信；上层微服务（素材服务，用户服务）则可以直接与调度服务进行通信。

有分有合

合是指将接口收敛到Gate服务，分包括渲染功能后端化和微服务层级拆分。

合带来的好处是需要维护的模块减少，随之产生问题的概率也会降低，并且每次增加新功能所需的代码变更量也会降低。

分则可以大幅优化容器资源的利用，降低成本。

3、可优化点

目前对外服务的AI-Design已经上线半年左右，根据实际用户体验和反馈，服务侧还可以从以下方面进行优化：

AI语义理解作为AI-Design的功能亮点之一，目前还不够完善，需要更多的用户数据进行进一步优化，以推送更加准确的关键词、icon素材和Logo布局风格。

后续AI-Design将提供多场景展示AI-Design产物的功能，帮助用户预览Logo制品的实际使用效果，提升用户使用体验。

AI-Design未来将会围绕Logo产物增加分享、收藏、推荐、评分等功能，记录用户的每个作品，便于用户实时查看和使用。

六、总结和展望

1、总结

随着AI-Design版本推进，功能复杂度提高的同时，在得益于架构升级，耦合度降低而数据安全性提升。各版本特性对比如下：

根据AI-Design的经验，实际上可以总结出符合0 智能设计工具的一般开发方案和架构设计：

使用高性能语言作为主框架，提供基础服务功能。

根据业务实际需求，选择最适合的实现方式对业务核心功能进行实现。

以 AI-Design 为例，算法功能使用python实现，就有良好的开发效率和可维护性；渲染功能采用typescript实现，方便前端同学参与调试和开发；而素材更新模块作为定时任务，因为可能会频繁变更逻辑，则使用脚本语言开发。

在微服务外侧增加粘合层（调度服务），实现接口组合和协议转换。

接口组合能够使业务逻辑更加灵活，同时不需要频繁变更底层功能服务的逻辑。

协议转换兼具HTTP和gRPC功能，既可以提供接口服务，也可以提供底层调用。

粘合层更建议使用node，php等语言实现，相比golang更加灵活，符合粘合层的功能要求。

最重要的，通过gRPC协议实现通信。

统一，方便，稳定。

2、展望

AI-Design从demo到 正式对外上线经历了多次架构演进，逐步完善，其中包含了很多探索和尝试，例如多语言服务之间的数据交互、算法服务和渲染服务的性能优化、以及对基础功能拆分和组合，提高代码复用、降低开发成本等。在此基础上，可以说是形成了一套针对智能设计工具的开发路线和方法。当然，技术方案总会随着需求增加而改变，AI-Design架构可能还会不断迭代更新，拥有更为坚实的基础，以成为一个更好的产品。