AI 设计栈刚刚分化：Claude Design、Codex Sites、Figma、Lovart 与 MCPlato 控制室
一篇面向 2026 年的深度评测，覆盖 Claude Design、Sites in Codex、Figma、Lovart 和 MCPlato，并解释为什么 AI 设计现在属于 Web 体验栈，而不是赢家通吃的单一品类。
发布于 2026-06-05
2026 年，错误的问题是 “哪款 AI 设计工具最好？”
更准确的问题是：你要雇用 AI 完成哪项工作？ 创始人需要落地页概念；产品团队需要响应式 Web 体验；工程师需要托管 demo；增长团队需要活动视觉。“AI 设计”已经分化为视觉探索、托管 Web 创建、设计系统治理、营销创意，以及控制室式协同。
这就是为什么 Claude Design、Sites in Codex、Figma、Lovart 和 MCPlato 应该属于一个工作栈，而不是同一条排行榜。
从工作室工作区中浮现抽象响应式 Web 体验的高端编辑风封面图
图 1：AI 设计正在变成 Web 体验栈，而不是一个通用画布。
命名现实核查：Claude Design 是真实存在的；Codex Sites 是简写
Anthropic 于 2026 年 4 月 17 日推出了 Claude Design，定位为 Anthropic Labs research preview。1 它可以通过对话和直接细化来创建设计、交互式原型、视觉单页文档、营销素材，以及早期落地页概念。1 这使它成为真实的 2026 年产品方向，但它仍然是 preview，并不是专业设计治理的替代品。
Codex Sites 是有用的简写，但官方命名是 Sites 或 the Sites plugin inside Codex。OpenAI 的开发者页面标题是 “Sites – Codex”，并将该功能定义为一种通过 Sites plugin 从 Codex “build and deploy hosted sites”的方式。2 Sites 让 Codex 可以创建、保存、部署和检查由 OpenAI 托管的网站、Web app 和游戏。2
边界很重要。Sites 处于 preview，面向 ChatGPT Business 和 Enterprise 工作区开放；Business 默认启用，Enterprise 通过管理员 RBAC 控制。2 它的输出必须是兼容 Cloudflare Worker 的 ES modules，并且每一个 Sites deployment URL 都是生产部署。2 应把它当作托管 Web 体验工作流，而不是最终的生产级设计。
逐个产品评测
Claude Design 最适合在体验仍然模糊时作为起点。它可以帮助团队在承诺进入设计系统之前，探索 homepage、onboarding flow、产品叙事或原型可能呈现出的感觉。它的优势是速度和对话式细化。它的限制在于权威性：它可以建议品味，但团队仍然需要可访问性检查、品牌判断和下游所有权。
Sites in Codex 在目标产物是真正托管的 Web 界面时最有吸引力：落地页、内部工具、dashboard、交互式 demo、小型 Web app 或游戏。它适合已经拥有结构化需求、代码上下文，或想把现有项目暴露为可审阅 Web 体验的团队。OpenAI 的 Web development use-case collection 强化了 Codex 在 Web 工作中的角色，而 Codex changelog 更适合用来持续追踪平台变化。34 它的弱点是：生产 URL 可能带来一种已经完成的错觉。部署并不等于品牌、法律、性能或安全审批。
Figma 仍然是产品与 Web 设计的专业事实源。Figma Sites 为设计团队提供面向 Web 的创建路径，而 Figma Make 增加了 prompt-to-app 工作流，包含聊天、附件、point-and-edit、样式上下文、代码编辑器和 publishing beta。56 Figma Design AI 覆盖素材搜索、内容替换、交互、图层重命名、文本操作、图像工具、矢量化和 First Draft；Figma 的 AI agent 于 2026 年 5 月 20 日开始有限 beta 推出。78 这个 Web 栈仍然依赖设计系统纪律。9
Lovart 更适合被理解为创意与营销视觉代理。它的官方页面强调自然语言流水线、统一画布、图像和视频生成、图层级编辑、批量生成，以及 PNG/SVG 导出。10 这使它对活动世界观、情绪板、hero image 方向、产品照片概念和发布变体很有用。它不是治理响应式设计系统或检查托管站点的最佳位置。
MCPlato 适合控制室层。它不是专业设计画布、托管站点平台，也不是专门的营销图像工作室。当站点项目依赖研究、来源材料、长时间运行任务、审批、会话、产物纪律和交接时，MCPlato 才有用。MCPlato 围绕可观察办公 AI 工作的公开定位，使它成为协同 Claude Design、Codex、Figma 和 Lovart 周边工作的工作区，而不是它们的替代品。11
对比表：每个工具应该负责什么
| 产品 / 工作流 | 主要待完成任务 | 最擅长 | 较弱项 | 最佳输入 | 输出 / 产物 | 最适合用户 | 不适合 | 在工作栈中的建议角色 |
|---|---|---|---|---|---|---|---|---|
| Claude Design | 对话式视觉探索 | 概念、原型、落地页方向、单页文档 | 最终设计系统权威 | 简报、产品想法、参考风格、直接反馈 | 视觉概念、原型、体验草稿版式 | 创始人、PM、探索方向的设计师 | 像素级生产设计 | 体验构思层 |
| Sites in Codex | 托管 Web 体验创建 | 网站、Web app、游戏、dashboard、内部工具、demo | 视觉品味、治理、审阅纪律 | 需求、代码/项目上下文、约束、审阅标准 | 托管网站、Web app、内部工具、dashboard、落地页、交互式 demo | 工程师、技术运营者、产品团队 | 未经审阅的发布或全新品牌识别工作 | 托管原型与 Web 执行层 |
| Figma | 专业设计事实源 | 设计系统、协作、响应式 Web 设计、受治理素材 | 取代人的设计判断 | 组件、样式、产品需求、团队库 | 设计文件、原型、站点、品牌素材 | 设计与产品团队 | 非结构化研究编排 | 记录系统设计层 |
| Lovart | 营销创意探索 | 情绪板、活动视觉、品牌方向、批量创意 | 设计系统治理、站点检查 | 品牌提示、活动目标、视觉参考 | 图像、视频、分层创意素材、导出物 | 营销人员、创作者、品牌团队 | 产品 UI 事实源 | 创意探索层 |
| MCPlato | 可观察的跨材料工作协同 | 研究、审批、会话、产物、异步任务、交接 | 专业设计画布或托管 Web runtime | 来源、本地材料、任务计划、审批、简报 | 报告、大纲、任务轨迹、交付物 | 运营者、研究员、PM、管理工作的团队 | 取代 Figma、Codex、Lovart 或设计师 | 控制室层 |
AI 辅助 Web 体验工作流的高端半 3D 架构剖面图
图 2：这个工作栈把探索、受治理设计、托管执行、创意素材和协同分开。
场景推荐矩阵
| 场景 | 主要推荐 | 次要工具 | 原因 |
|---|---|---|---|
| 落地页视觉方向 | Claude Design | Lovart, Figma | Claude Design 加速早期探索；Lovart 扩展情绪和活动方向。 |
| 响应式站点设计 | Figma | Claude Design, MCPlato | Figma 应该负责组件、响应式行为、协作和可审阅决策。 |
| Prompt-to-web app 原型 | Sites in Codex | Figma Make, MCPlato | Sites in Codex 适合基于技术上下文生成托管 Web app 或 demo。 |
| 内部 dashboard/工具 | Sites in Codex | Figma, MCPlato | Codex 可以产出托管技术界面；Figma 治理 UX 模式，MCPlato 协同需求。 |
| 营销活动素材 | Lovart | Figma Buzz, Claude Design | Lovart 更适合创意多样性、情绪板和发布视觉；Figma Buzz 帮助批量素材。 |
| 建站前的跨材料研究 | MCPlato | Claude Design, Figma | MCPlato 是来源收集、笔记、审批和交接的中心。 |
| 现有项目转托管 demo | Sites in Codex | MCPlato | Codex Sites 可以把兼容的 Web 工作转成托管部署；MCPlato 追踪注意事项。 |
| 受设计系统治理的 Web 体验 | Figma | Sites in Codex | Figma 负责记录系统；Codex 可以暴露兼容实现以供审阅。 |
| 长周期站点项目协同 | MCPlato | Figma, Sites in Codex, Lovart | 多阶段站点工作需要可见的研究、决策、素材、部署说明和审批。 |
团队应该避免什么
首先，不要把托管 URL 当作最终批准。OpenAI 的 Sites 文档明确指出，每一个 deployment URL 都是生产部署。2 一个可工作的 demo 仍然需要来源审阅、可访问性审阅、品牌审阅、安全审阅和利益相关方签署。
其次，不要让简写混淆所有权。“Codex Sites”是一个方便标题，但官方功能是 Codex 内的 Sites。Figma 应该负责受治理的设计系统。Lovart 不应该成为产品 UI 的事实源。Claude Design 不应该被当作完成的生产级设计。MCPlato 应该协同材料和决策，而不是伪装成设计画布或托管层。
对比设计画布、托管 Web 对象、创意工作室和协同桌面的高端编辑风产品摄影图
图 3：当创意、设计、部署和协同界面保持区分时，Web 工作会更安全。
结论：胜出的工作流是一个工作栈
2026 年的 AI 设计栈不会收敛为一个赢家。它正在专业化。Claude Design 探索体验和视觉方向。Figma 治理设计系统和响应式协作。Lovart 创建活动视觉和品牌世界变体。Sites in Codex 把合适的想法和项目转化为托管 Web 体验。MCPlato 让研究、来源材料、审批、迭代和交接保持可观察。
最优秀的团队会分配所有权：在 Claude Design 中探索，在 Figma 中治理，在 Lovart 中生成活动素材，用 Sites in Codex 把合适项目变成托管 demo，并在证据和决策保持可见的地方协同长周期工作。