Ardot

什么是Ardot？

Ardot 是由腾讯云 CodeBuddy 团队开发的协作设计平台，目前处于公开测试阶段。它连接产品经理、设计师和开发者，让用户从文本描述生成完全可编辑的界面设计文件——不是静态图片，而是分层的、基于组件的设计文档。Ardot 基于媲美 Figma 的专业矢量编辑引擎，增加了 AI 生成、动态布局系统、设计系统管理和一键代码导出功能。它还支持通过 MCP 协议与 CodeBuddy、Cursor 和 Claude 等 AI 编程智能体集成，实现从设计到前端代码的闭环工作流。

主要功能

• 文本生成界面

  用自然语言描述界面需求，Ardot 即可实时流式生成完全可编辑的设计稿——包含独立图层、可替换组件、可编辑文本和可调整颜色，而非扁平化的图片。

• 图片转设计

  上传任意图片——手绘草图、竞品截图或产品海报——Ardot 会智能解析为结构化、可编辑的设计文件，并自动分层。

• 专业矢量编辑

  功能完整的矢量编辑器，支持倾斜、3D 旋转、增强形状工具、Grid 布局、百分比定位和真实比例锁定，适配不同屏幕尺寸的响应式设计。

• 一键代码导出与 MCP 集成

  直接从设计稿生成 CSS、iOS 和 Android 代码，或通过 MCP 协议连接，让 CodeBuddy 和 Cursor 等 AI 编程智能体直接读取和操作设计文件。

• 设计系统管理

  组件、颜色样式和文本样式在项目中全局同步。团队可构建可复用的组件库，并基于自身业务组件标准生成新的界面设计。

• 团队协作与企业安全

  支持多人实时协作、行内评论、版本对比、细粒度权限控制、完整操作审计日志，以及离职成员权限自动回收。

使用场景

• 快速界面原型设计 : 产品经理和设计师可在几分钟内从文字需求生成完整、可编辑的界面草稿，大幅缩短初期线框图和原型制作时间。
• 设计到代码交付 : 开发团队可查看标注规范，并直接从设计文件复制生产级 CSS、iOS 或 Android 代码，消除实现过程中的反复沟通。
• 从 Figma 迁移 : 当前使用 Figma 的团队可完整导入 .fig 文件——保留布局、样式和组件——无需重建现有工作即可切换到 Ardot。
• 品牌一致的资产生成 : 设计团队可通过引用现有组件库，生成全套风格匹配的矢量图标和界面组件，确保输出符合团队标准而非通用模板。
• 智能体设计工作流 : 使用 AI 编程智能体的工程团队可通过 MCP 连接 Ardot，实现设计与代码的双向同步，让智能体自主读取设计文件并生成前端代码。

常见问题