夜雨聆风做过产品的人都知道一个痛苦：
产品经理出了需求，设计师画了稿，开发说"还原不了"。
来来回回三方扯皮，一个页面改三轮。
腾讯刚公测的这个工具，想解决的就是这个问题。
Ardot 是什么？
Ardot（读作 "ahr-dot"）是腾讯推出的 AI 驱动设计工具，官网地址：ardot.tencent.com。
它的定位不是"给设计师用的画图软件"，而是打通产品、设计、开发三个角色的协作平台。核心能力一句话概括：
用一句话描述需求 → AI 生成可编辑设计稿 → 一键转成代码
现在是公测阶段，注册即可获得 1000 Credits 免费额度，不需要付费。
支持平台：网页端 + macOS 客户端。（Windows 暂无桌面端，但网页端可用。）
注册和进入
第一步：访问官网 ardot.tencent.com，点击「免费使用」或「立即体验」。
第二步：用手机号或企业微信登录，填写基本信息后进入工作台。
第三步（可选）：如果是团队使用，可以创建「团队空间」，邀请成员进入，所有设计稿共享在团队资产库里。
核心功能一：一句话生成设计稿
这是 Ardot 最直接的功能。
操作步骤：
进入工作台后，点击「新建项目」 选择项目类型（移动端 App / 网页端 / 海报 / 小程序等） 进入编辑器后，点击左侧「AI 生成」入口 在输入框中填写你的需求，点击「生成」
关键：怎么写提示词效果最好？
用这个公式：产品类型 + 页面模块 + 风格调性 + 适配端
举个例子：
简约风电商App首页，包含顶部搜索栏、轮播Banner、商品卡片列表、底部导航栏，白色主色调蓝色辅助，移动端适配 或者更简单：
企业官网首页，科技感，深色风格，PC端 AI 会在 3 秒内生成多套初稿，每套布局稍有不同，你选一个最合适的继续调整。
生成的设计稿不是一张图片，而是每个元素都有独立图层、可以单独选中修改的可编辑稿。
核心功能二：导入 Figma 文件
如果你已经有 Figma 里的设计稿，不需要重新画。
操作步骤：
在 Figma 里导出文件（支持 .fig格式）在 Ardot 工作台点击「导入 Figma 文件」 上传后，原有的布局、样式、组件全部保留，可以直接在 Ardot 里继续编辑
这个功能对已经有 Figma 积累的团队特别有价值——迁移成本极低，不需要推倒重做。
核心功能三：调用自有组件库
如果你的团队已经有了一套设计规范或组件库，Ardot 可以让 AI 直接调用它生成符合规范的设计稿，而不是给你生成一个"看起来差不多"的东西。
怎么操作：
将团队的设计元素（按钮、卡片、导航栏等）在 Ardot 中保存为「组件」 设置颜色、字体、间距等全局样式 之后每次使用 AI 生成时，AI 会优先调用已有组件，生成符合你们规范的初稿
还可以用 AI 搜索来找组件：在搜索框输入"蓝色圆角按钮"或"移动端导航栏"，AI 直接帮你找到并插入。
核心功能四：一键转代码
设计稿定稿之后，如何交付给开发？
传统方式：设计师截图标注 → 开发对着图手写代码 → 来回沟通细节 → N 轮还原修改。
Ardot 方式：
设计定稿后，点击顶部「开发交付」按钮，进入交付模式 页面自动显示所有元素的尺寸、间距、颜色、字体等标注信息 选中任意元素或页面 → 右侧「代码导出」→ 选择代码类型 点击「复制代码」，直接粘贴到开发工具里
支持导出的代码类型：CSS、iOS、Android。
官方说还原度可以达到 98%，不用再靠"眼睛估"了。
进阶功能：接入 CodeBuddy / Cursor / Claude Code
这是 Ardot 真正打开了"设计到代码全自动"的功能——MCP 接入。
如果你用 CodeBuddy（腾讯自己的 AI 编程工具）或者 Cursor、Claude Code，可以通过 MCP 协议让 AI 直接在 Ardot 的画布上生成设计稿，然后无缝转成前端代码，全程基本不需要手动操作。
配置步骤：
第一步：下载 Ardot macOS 桌面端（MCP 功能优先支持桌面端）
第二步：在 Ardot 中打开「MCP 集成」面板
第三步：选择你用的工具（CodeBuddy / Cursor / Claude Code / Gemini CLI 等），点击一键连接即可
如果你的工具不在列表里，也可以手动配置，把这段 JSON 加到工具的 MCP 配置文件里：
{ "ardot": { "url": "http://127.0.0.1:50501/api/v1/mcp" } } 配置完之后能干什么？
你只需要对 AI 说一句话，比如：
使用 Ardot MCP 生成一个知识分享平台的 UI 设计，科技感深色风格， 包含：顶部导航栏、内容卡片列表、侧边 AI 助手面板。 AI 会自动在 Ardot 画布上绘制设计稿，同时生成 Design Tokens，再自动输出 React + Tailwind 代码，设计稿和代码保持同步，改一处，两边都变。
这套链路完全跑通后，从"一句需求"到"可以运行的前端页面"，整个过程不需要人工介入。
多人协作功能
Ardot 支持多人在线实时协作，产品、设计、开发都能进同一个文件。
几个实用的功能点：
- 实时评论
：直接在设计稿上点击位置留评论，不用再截图发微信 - 标注反馈
：标注哪里不对、要改成什么，所有人都能看到 - 版本对比
：修改前后的版本可以直接对比，哪里改了一目了然 - 权限分级
：管理者 / 可编辑 / 仅查看，外部合作方可以给「访客权限」，只看不动 - 操作日志
：所有修改有记录，支持回溯，防止改乱了找不到原版
哪些人适合用？
| 产品经理 | |
| UI 设计师 | |
| 前端开发 | |
| 独立开发者 | |
| 创业团队 |
总结
一句话评价：Ardot 要解决的不是"设计好不好看"，而是"设计稿怎么从想法变成代码，中间少扯皮"。
对于普通用户，最实用的用法是：用一句话生成设计稿初稿，再自己调整细节——省去了从零画布局的时间。
对于开发者，最值得试的是：MCP 接入 + 一键转代码——让 AI 帮你完成设计这一步，你专注写逻辑。
现在公测免费，注册就有 1000 Credits，去 ardot.tencent.com 试试。
内容根据腾讯官方信息及公开体验报告整理，功能以官网最新版本为准。
