Anthropic 正式宣战设计工具赛道

Claude Design 产品封面

Anthropic 今天推出了一个新产品:Claude Design

不是代码助手,不是写作工具。是一个设计工具——你描述需求,它给你出设计稿,然后你继续对话来迭代,直到满意为止。

底层由 Claude Opus 4.7 提供支持,这是 Anthropic 目前视觉能力最强的模型。今日起正式向 Claude Pro、Max、Team 和 Enterprise 用户开放研究预览。


Anthropic 官网公告截图

▲ Anthropic 官网今日发布公告:Claude Design 正式进入研究预览阶段


[!info] 阅读导览
第 1 章 被"理性克制"的探索——Claude Design 解决什么问题 → 第 2 章 它怎么用 → 第 3 章 品牌系统一键接入 → 第 4 章 设计稿直接变代码 → 第 5 章 合作伙伴说的数字 → 第 6 章 Anthropic Labs 是什么 → 第 7 章 被动摇的不只是 Figma → 第 8 章 对我们意味着什么

这件事的意义,远不止于"又一个 AI 发布了新功能"。

设计这件事,长期以来都是 AI 难以真正深入的领域。 写作有 ChatGPT,代码有 Claude Code 和 Cursor,但"帮我做一张活动页面"或者"给我出一套产品原型",AI 一直做得很笨拙。Claude Design 是 Anthropic 第一次认真回答这个问题。


1. 被"理性克制"的探索

Anthropic 发布公告里有一段话,说得很准:

就算是有经验的设计师,也不得不克制自己的探索冲动——时间不够,不可能把十几个方向都做成原型,只能压缩成两三个。

这是设计师日常工作里一个真实的摩擦点。一个想法出来了,你其实不确定哪个方向最对,但把三个方向都做出来要花两天,截止日期明天到,于是你只能凭直觉选一个,然后心里一直有个问号:另外两个方向是不是更好?

还有另一类人——创始人、产品经理、市场人员——他们脑子里有想法,但没有设计背景,不会用 Figma,请外包要等两周,找设计师资源来不及……最后要么硬着头皮用 PPT 凑,要么把想法压下去。

Claude Design 是为这两类人同时服务的。

更深一层说,这两类人其实代表了同一个困境:想法比执行快,但工具链总是拖后腿。 AI 以前一直在帮人快速执行,但在设计这个领域,执行本身就是一门专业技能——你不只是需要时间,还需要懂工具、懂规范、懂视觉语言。Claude Design 试图绕过这道门槛,让想法本身重新成为出发点

说到底,这是一个关于探索成本的问题。好的产品决策往往需要在多个方向上做足够的探索,但设计的物质成本一直让这种探索受到约束。探索不是免费的,所以大多数人在探索阶段就开始理性克制,提前排除那些"感觉不会赢"的方向——不是因为他们真的知道那个方向不好,而是因为做出来太贵了。Claude Design 正在对这个约束动刀。


2. 它怎么用

基本流程是这样的:描述你要什么,Claude Design 给你出第一版。然后你继续对话来迭代——直接在内容上点评,或者拖动自定义调节滑块来调整间距、颜色、布局,或者就用普通对话说"这个按钮颜色改深一点,左边留白再多一些"。

输入不只是文字,支持多种形式:

  • 上传图片和文档(Word、PPT、Excel)
  • 直接让 Claude 读取你的代码库
  • 使用内置的网页捕捉工具从产品官网截取元素

这样做出来的原型,视觉上就是真实产品的样子,不是那种"AI 风格的示意图"。


Claude Design 工作流示意图

▲ Claude Design 的工作流:从代码文件和设计资产出发,自动构建出包含色彩、字体和组件库的完整品牌设计系统


做好的设计可以在组织内共享,也可以导出为 PPTX、PDF、独立 HTML 文件,或者直接发到 Canva 继续编辑。

你的同事可以一起进来,和 Claude 展开群组对话,多人协作一个设计稿。设计评审会直接在工具里进行,不需要先发稿、再收意见、再改、再发

Anthropic 在公告里列了几个具体使用场景:

场景 说明
交互原型 把静态 mockup 变成可分享的交互原型做用户测试,无需走代码评审或 PR 流程
产品线框图 产品经理快速画出功能流程,交给 Claude Code 实现或传给设计师精修
融资演示稿 创始人从草稿大纲直接出一套有品牌感的完整 PPT,导出 PPTX 或发布到 Canva
市场物料 营销团队出落地页、社交素材和活动视觉,设计师做最终打磨
前沿设计 支持声音、视频、着色器、3D 和内置 AI 的代码驱动原型

前沿设计(Frontier Design)这个方向有点超出常规的"出设计稿"范畴,更像是在说:Claude Design 可以用来构建那些传统设计工具做不了的东西。


3. 品牌系统一键接入

这个细节值得单独说:在初始配置时,Claude Design 会读取你的代码库和现有设计文件,自动为你的团队构建一套设计系统——颜色、字体、组件,全部提取出来,之后每次生成的内容都自动应用这套规范。


Claude Design 品牌系统截图

▲ Claude Design 从已有的代码库和设计文件中提取品牌规范,自动构建出色彩体系、字体规则和 UI 组件库


这解决了一个很实际的问题。过去 AI 出的设计稿大多有一个致命伤:看起来很通用,不像"你们公司的风格"。现在不一样了——Claude Design 生成的第一版,用的就是你们自己的品牌规范,不需要每次都手动告诉它主色、字体、圆角参数

一个团队可以维护多套设计系统——比如 B2B 产品一套,官网一套,内部工具一套——在不同项目里切换调用。

这背后还有一个不那么明显但同样重要的价值:迫使团队把品牌规范真正写清楚。过去很多公司的设计规范停在一个 Notion 文档里,或者只活在某一个设计师的脑子里——Claude Design 要读取你的文件,倒逼你把那些东西真正整理出来,变成机器能理解的形式。

  • 对大公司设计团队:新来的设计师不需要花两周"熟悉品牌规范",Claude Design 帮你守住了品牌一致性。
  • 对早期创业团队:没有专职设计师,AI 生成的东西,从第一天起就有品牌感。

4. 设计稿直接变代码

设计完了之后怎么办?这是过去 UI 工具里一个永远摩擦不断的环节:设计师交稿,开发拿到稿子,开始争论间距究竟是 12 还是 16,字体是不是真的用了 SF Pro,这个颜色是不是有一个对应的 CSS 变量……

Claude Design 加了一个交接功能:设计稿确认完成后,它会把所有资产打包成一套完整的交接文件,你一条指令发给 Claude Code,Claude Code 直接接手,开始实现。


Claude Design 交接功能截图

▲ Claude Design 的"交接"功能:设计稿打包成交接文件,一条指令传递给 Claude Code,直接进入开发实现阶段


这个打通让我想到一件事:Anthropic 在悄悄连接一个工作流——

Claude.ai(写作)→ Claude Design(设计稿)→ Claude Code(代码实现)

三个工具,一套底层模型,理论上一个复杂项目的不同阶段可以在同一个生态里完成。

flowchart LR
    A[Claude.ai 写作] --> B[Claude Design 设计稿]
    B --> C[品牌系统自动接入]
    C --> D[对话迭代至满意]
    D --> E[交接包打包]
    E --> F[Claude Code 代码实现]

微软一直在尝试用 Office 做这个整合,Adobe 一直在试,Figma 也在往代码方向走。但 Anthropic 的路径不一样——它是从语言模型出发,往上延伸到所有创作形式,而不是从具体工具出发,往旁边整合。

对设计师来说,这个交接功能的意义不只是省时间。它解决的是一个长期存在的心理摩擦:设计师做完稿子之后,从来没有真正放手过。开发在实现过程中发现不对,找回来讨论;产品经理看到最终实现和设计稿有出入,又拉进来对齐。一个功能从设计到上线,设计师被反复卷入的次数,往往比预期多出一倍。

Claude Design 的交接包让设计意图第一次有机会以机器可读的方式传递,而不是靠人传人。


5. 合作伙伴说的数字

发布公告里有三家合作伙伴的证言,其中有两个具体数字值得记一下。

在线教育平台 Brilliant 的高级产品设计师 Olivia Xu 说:

Brilliant 的页面有复杂的交互和动画,原型制作一直很痛苦。Claude Design 把静态设计稿转成可分享的交互原型,对我们来说是一次质变。以前在其他工具里,我们最复杂的页面要用 20 多次提示词才能还原,在 Claude Design 里只需要 2 次

从 20+ 次到 2 次,压缩比超过 10 倍。

Datadog 的产品经理 Aneesh Kethini 说:

现在我们能在对话进行时直接做出在线设计,会议还没散就已经有了能用的原型。以前从简报到 mockup 再到评审轮,前前后后要一周。现在一个对话里就全搞定了。


传统流程 vs Claude Design 工作流对比

▲ 左:传统设计迭代流程——反复修改、版本混乱。右:Claude Design 的对话式工作流——单次对话完成原型,直接拿出结果


当然,这些是合作伙伴提供的证言,有一定宣传成分。但一周变一次对话这个量级的变化,即使打五折,也已经很显著了。

Canva CEO Melanie Perkins 也给出了表态,不过更多是在宣布合作关系——Claude Design 做出来的东西可以一键发到 Canva,变成可继续编辑和发布的正式设计稿。这对 Canva 来说是在前端获客,对 Claude Design 来说是扩大了内容的生命周期。双赢的整合,不像竞争。

这种生态打法也给了我们一个信号:Anthropic 不打算在所有环节上都自建,而是在关键路径上占位,然后用合作伙伴的能力填满周边。Canva 在内容发布,Claude Code 在代码实现,未来可能是 Figma 在组件库,Adobe 在像素级输出。


6. Anthropic Labs 是什么

Claude Design 挂的是 Anthropic Labs 的牌子,不是直接放进 Claude 主产品线里。这个定位值得注意。

Anthropic Labs 是 Anthropic 的实验产品部门,专门用来跑那些"想法还在探索阶段、还没有准备好进主产品的东西"。这次是研究预览(Research Preview),意味着它现在还在测试:功能可能变,策略可能调整,有些边角案例可能处理得不完美。

用 Labs 品牌来发布是一种明智的做法。Google 的 NotebookLM 最初也是类似的定位,后来长成了一个拥有数千万用户的独立产品。Anthropic 在看:Claude Design 能不能长成同一类东西。

还有另一层含义:Anthropic Labs 的定位意味着 Anthropic 正在用真实用户来测试一个方向,而不是在内部推演。研究预览阶段的 Claude Design,会把真实设计师的反馈直接输入产品迭代循环——这个循环的速度,通常比关门研发要快得多。

从 Anthropic 的角度,这也是在回答一个关于产品边界的问题:AI 辅助设计这件事,该做成功能,还是该做成独立产品?研究预览是一种不表态的方式,让市场来告诉他们答案


7. 被动摇的不只是 Figma

这款产品一出,最先被拿来比较的当然是 Figma。Figma 今年也一直在加 AI 功能——Figma AI 可以生成界面、自动补全图层、翻译设计稿。但两者的切入点截然不同:

  • Figma AI:让 Figma 用户用起来更快
  • Claude Design:让根本不懂 Figma 的人也能出设计稿

这是两个不同的切入点,短期内不一定正面冲突。Figma 的核心用户——专业设计师——现在还不会放弃 Figma,它的图层系统、组件库、团队库、版本历史,仍然是 Claude Design 目前没法直接替代的。

维度 Figma AI Claude Design
切入点 让 Figma 用户用起来更快 让不懂 Figma 的人也能出设计稿
目标用户 专业设计师(核心用户) 设计师 + 创始人/PM/市场人员
核心资产 图层系统、组件库、团队库、版本历史 对话式生成 + 品牌系统自动提取
出稿方式 在 Figma 内 AI 辅助 自然语言对话直接生成
交接开发 传统交付流程 交接包一键交给 Claude Code

真正被动摇的,是整个设计服务行业的周边——外包设计、模板服务、低代码建站工具,还有那些主要靠"帮客户出第一版设计稿"收费的 B 端设计顾问。当"出第一版"这件事可以在一次对话里完成,这类服务的定价基础就没了。

更被动摇的,是"设计感"这件事。过去"设计感"是稀缺资源,因为出设计稿需要人、需要时间、需要技能。当任何人都可以用一句话出一张合格的产品页,设计感的稀缺性就在往另一个维度转移:

转向那些懂得提出更好的问题、懂得判断好坏、懂得把品牌意图翻译成 AI 可以理解的语言的人。

这不是"设计师要被取代"的旧话——那个讨论太浅了。更准确的说法是:设计这个角色的价值密度在上移。手工出稿的执行层在 AI 面前越来越脆弱,但判断力、策略层、品味层在 AI 面前越来越稀缺。

  • 会用 Claude Design 出一张稿子,两周后每个人都会。
  • 懂得从十张稿子里选出那张最对的,并且能说清楚为什么——这个能力,AI 没有,模板没有,只有经过训练的人才有。

Figma 对这件事当然心里有数。它最近几年一直在做的,是让设计系统更规范化让设计资产可以更结构化地管理让设计和代码之间的接口更清晰。这些投资方向,在 AI 工具爆发的时代,显得越来越有战略眼光。

一个结构清晰、规范完整的 Figma 文件,是 AI 工具最好的原材料之一——Figma 不一定是被取代的那个,而有可能是让 Claude Design 这类工具运作得更好的那个基础层


8. 对我们意味着什么

我自己对这个产品最感兴趣的,不是"终于可以出设计稿了",而是它和 Claude Code 之间的那条线。

过去做一个功能的流程大概是这样:PM 写需求文档,设计师出稿,开发看稿写代码,再和设计反复对齐细节
现在理论上可以是:对着 Claude Design 把想法聊出来,稿子对了,一条指令交给 Claude Code,代码跑出来

中间不是没有人,但人的角色从"负责执行每一个步骤"变成了"负责对每一个步骤的输出做判断"。

这条链路现在还不完美,有很多节点是粗糙的。但方向是确定的,而且速度比大多数人预期的快。

8.1. 有三件事值得现在就开始想

8.1.1. 你的团队里谁负责"判断"

当生成的速度快到 30 秒出一个设计稿,你需要的不是能做稿子的人,而是能在 30 秒里判断这稿子好不好的人。这是一种不同的能力,值得现在就开始培养。

8.1.2. 你们的品牌系统是不是机器可读的

Claude Design 从代码库和设计文件里读取品牌规范,这意味着你们的颜色、字体、组件规则是不是真的写在某个文件里、是不是整理清楚了,决定了 AI 帮你生成的东西有多对路。

8.1.3. "研究预览"值得早用

这是早期版本,有 bug,有边界,但早进去用的人会得到两件事:对工具理解的先发优势,以及某种程度上在影响产品走向的机会。claude.ai/design 现在就能进去。


Anthropic 今天做的,是把设计这件事放进了 AI 的边界里。边界在哪里,还不知道。但它在扩张,比任何人预期的都快。


数据来源:Anthropic 官方公告,2026-04-17
原文链接:https://www.anthropic.com/news/claude-design-anthropic-labs

[!success] 核心要点

  • 产品:Claude Design,Anthropic Labs 首个设计产品,由 Claude Opus 4.7 驱动,2026-04-17 起向 Pro/Max/Team/Enterprise 开放研究预览
  • 服务两类人:专业设计师(降低探索成本)+ 非设计师(创始人/PM/市场,绕过入门门槛)
  • 品牌系统自动接入:从代码库与设计文件提取颜色、字体、组件,多套系统可切换
  • 交接闭环:设计稿 → 交接包 → 一条指令交给 Claude Code,设计意图以机器可读方式传递
  • 生态打法:不全面自建,Canva 管发布、Claude Code 管实现,在关键路径上占位
  • 竞争格局:不直接取代 Figma;被动摇的是外包设计、模板服务与"出第一版"的定价基础
  • 趋势:设计角色的价值密度上移——执行层脆弱,判断/策略/品味层稀缺