← 回到閱讀庫

Introducing Claude Design by Anthropic Labs

推出 Claude Design(Anthropic Labs 出品)

來源:anthropic.com/news/claude-design-anthropic-labs

作者:Anthropic(未署名個人)

原文日期:2026-04-17

翻譯日期:2026-04-18

抓取方式:playwriter

難度:B1(中級,矽谷產品發表文)

核心概念總覽

Anthropic 推出 Claude Design,讓使用者透過對話與 Claude 協作產出視覺作品。由 Claude Opus 4.7 視覺模型驅動,能自動套用團隊設計系統,涵蓋從初版生成、細緻調整、組織內協作到交接給 Claude Code 開發的完整流程。主打讓非設計師也能做出精緻的原型、簡報與設計稿,並附有 Canva、Brilliant、Datadog 三家公司的使用見證。

文章結構

  1. 開場:產品上線與適用方案
  2. Design with Claude:問題陳述、解法、6 種使用場景
  3. How it works:產品 6 項核心能力
  4. 客戶證言:Canva、Brilliant、Datadog
  5. Get started:訂閱與啟用細節

逐段拆解

全部切換:

點擊段落左側的 EN/中 按鈕切換語言,淡入淡出 300ms。預設英文,鼓勵先讀原文。

Today, we're launching Claude Design, a new Anthropic Labs product that lets you collaborate with Claude to create polished visual work like designs, prototypes, slides, one-pagers, and more.
今天我們推出 Claude Design,Anthropic Labs 的新產品,讓你與 Claude 協作產出精緻的視覺作品,例如設計稿、原型、簡報、單頁資料等。

新字:launch, collaborate, polished, prototype, one-pager

Claude Design is powered by our most capable vision model, Claude Opus 4.7, and is available in research preview for Claude Pro, Max, Team, and Enterprise subscribers. We're rolling out to users gradually throughout the day.
Claude Design 由我們最強大的視覺模型 Claude Opus 4.7 驅動,以研究預覽版的形式開放給 Claude Pro、Max、Team、Enterprise 的訂閱者使用。我們會在今天之內逐步開放給使用者。

新字:capable, vision model, research preview, subscriber, roll out, gradually

Design with Claude

與 Claude 一起設計

Even experienced designers have to ration exploration—there's rarely time to prototype a dozen directions, so you limit yourself to a few. And for founders, product managers, and marketers with an idea but not a design background, creating and sharing those ideas can be daunting.
即使是經驗豐富的設計師也得節制地探索——鮮少有時間同時做出十幾種方向的原型,於是只能侷限在幾個選項。而對於有想法但沒有設計背景的創辦人、產品經理、行銷人員來說,把想法做出來並分享出去更是讓人卻步。

新字:ration, exploration, a dozen, founder, daunting

句型解析

ration 當動詞的特殊用法。字面是戰時「配給糧食」,這裡把「探索時間」當成稀缺資源,比喻為「像配給食物一樣節制地分配」。把抽象概念具象化是高階英文常見修辭。

文化脈絡

a dozen 字面是 12 個,但英語口語中常用來泛指「很多、不少」,不一定真的是 12。像中文說「十幾個」,實際可能是 8 或 15。

Claude Design gives designers room to explore widely and everyone else a way to produce visual work. Describe what you need and Claude builds a first version. From there, you refine through conversation, inline comments, direct edits, or custom sliders (made by Claude) until it's right. When given access, Claude can also apply your team's design system to every project automatically, so the output is consistent with the rest of your company's designs.
Claude Design 讓設計師有空間廣泛探索,也讓其他人有方法產出視覺作品。描述你的需求,Claude 就會生出第一版。接著,你可以透過對話、在地註解、直接編輯、或使用 Claude 為你量身做的滑桿去調整,直到滿意為止。在取得授權之下,Claude 還能自動把你們團隊的設計系統套用到每個專案,讓產出與公司其他設計保持一致。

新字:refine, inline, slider, consistent

句型解析

When given access, Claude can also apply... 是省略的被動式。完整形是 When Claude is given access,英文常把「主詞 + be 動詞」省略,只留下過去分詞。相同結構:If approved, the request will proceed.(若獲核准,請求會繼續)。A1 讀者看到 given 開頭常誤以為是過去式,其實是被動分詞。

Teams have been using Claude Design for:
目前團隊使用 Claude Design 做以下用途:

句型解析

have been using 是現在完成進行式,表示「從過去某時間點開始一直使用到現在、且還在持續」。與單純的 use(泛泛陳述)或 are using(只描述當下)不同,強調「一段時間以來累積的事實」。

Realistic prototypes: Designers can turn static mockups into easily-shareable interactive prototypes to gather feedback and user-test, without code review or PRs.
擬真原型:設計師可以把靜態的設計稿變成容易分享的互動式原型,用來蒐集回饋、做使用者測試,不用走 code review 或發 PR。

新字:static, easily-shareable, interactive, gather, feedback, user-test

Product wireframes and mockups: Product Managers can sketch out feature flows and hand them off to Claude Code for implementation, or share them with designers to refine further.
產品線框圖與設計稿:產品經理可以勾勒出功能流程,接著交給 Claude Code 實作,或分享給設計師進一步打磨。

新字:sketch out, feature flow, hand off, implementation

Design explorations: Designers can quickly create a wide range of directions to explore.
設計探索:設計師可以快速產出多種方向來探索。
Pitch decks and presentations: Founders and Account Executives can go from a rough outline to a complete, on-brand deck in minutes, and then export as a PPTX or send to Canva.
提案簡報:創辦人與業務人員可以在幾分鐘內,把粗略大綱變成完整且符合品牌調性的簡報檔,再匯出成 PPTX 或傳到 Canva。

新字:pitch deck, Account Executive, rough outline, on-brand

文化脈絡

on-brand 是行銷/品牌圈常用形容詞,意指「符合品牌調性的、貼合品牌形象的」。反義是 off-brand(偏離品牌)。矽谷公司會用它評價一份設計稿:"This is very on-brand" 表示「這很有我們的品牌味」。

Marketing collateral: Marketers can create landing pages, social media assets, and campaign visuals, then loop in designers to polish.
行銷宣傳素材:行銷人員可以製作 landing page、社群媒體素材、行銷活動視覺,然後再把設計師拉進來潤飾。

新字:collateral, landing page, asset, loop in, polish

文化脈絡

loop in 是辦公室常用片語動詞,「把某人加進群組、納入討論」。原意來自 email 的 cc(carbon copy),引申為「讓某人加入這個迴圈、不要漏掉他」。"Can you loop her in?" 就是「可以把她也納入嗎?」

Frontier design: Anyone can build code-powered prototypes with voice, video, shaders, 3D and built-in AI.
前沿設計:任何人都能打造由程式碼驅動、帶有語音/影片/著色器/3D/內建 AI 的原型。

新字:frontier, code-powered, shader, built-in

句型解析

code-powered 是複合形容詞,用連字號把兩個字串成一個形容詞。科技英文很常見:AI-driven(AI 驅動的)、user-facing(面向使用者的)、cloud-based(基於雲端的)。

How it works

運作方式

Claude Design follows a natural creative flow.
Claude Design 遵循自然的創作流程。

Your brand, built in.

品牌特性,直接內建

During onboarding, Claude builds a design system for your team by reading your codebase and design files. Every project after that uses your colors, typography, and components automatically. You can refine the system over time, and teams can maintain more than one.
初次設定時,Claude 會讀取你的程式碼庫與設計檔案,為團隊建立一套設計系統。之後每個專案都會自動套用你們的配色、字體與元件。你可以隨時間精修這套系統,團隊也能同時維護不只一套。

新字:onboarding, codebase, typography, component, maintain

Import from anywhere.

從任何地方匯入

Start from a text prompt, upload images and documents (DOCX, PPTX, XLSX), or point Claude at your codebase. You can also use the web capture tool to grab elements directly from your website so prototypes look like the real product.
你可以從文字指令開始,也可以上傳圖片或文件(DOCX、PPTX、XLSX),或讓 Claude 直接讀取你的程式碼庫。另外還能使用網頁擷取工具,從你們自己的網站抓取元素,讓原型看起來就像真正的產品。

新字:prompt, upload, capture, grab

Refine with fine-grained controls.

用細緻的控制項調整

Comment inline on specific elements, edit text directly, or use adjustment knobs to tweak spacing, color, and layout live. Then ask Claude to apply your changes across the full design.
針對特定元素加上在地註解、直接編輯文字,或用調整旋鈕即時微調間距、顏色與版面。接著讓 Claude 把你的修改套用到整份設計。

新字:fine-grained, adjustment, knob, tweak, spacing, layout, apply

句型解析

fine-grained:字面「細顆粒的」,引申為「細緻的、精細到每個小項目都能控制的」。反義是 coarse-grained(粗顆粒的)。科技英文常用來描述「控制的細膩程度」,例如 fine-grained permissions(細緻的權限控制)。

Collaborate.

協同作業

Designs have organization-scoped sharing. You can keep a document private, share it so anyone in your organization with the link can view it, or grant edit access so colleagues can modify the design and chat with Claude together in a group conversation.
設計檔具備組織範圍的分享機制。你可以將文件設為私人,也可以分享給組織內有連結的人瀏覽,或授予編輯權讓同事修改設計,並在群組對話中與 Claude 一起協作。

新字:organization-scoped, grant, modify, colleague

Export anywhere.

匯出到任何地方

Share designs as an internal URL within your organization, save as a folder, or export to Canva, PDF, PPTX, or standalone HTML files.
設計檔可以作為組織內部 URL 分享、存成資料夾,或匯出成 Canva、PDF、PPTX、獨立 HTML 檔。

新字:export, standalone

Handoff to Claude Code.

交接給 Claude Code

When a design is ready to build, Claude packages everything into a handoff bundle that you can pass to Claude Code with a single instruction.
當設計準備好進入開發階段,Claude 會把所有東西打包成交接套件,讓你用一句指令就能交給 Claude Code。

新字:handoff, bundle, instruction

文化脈絡

handoff 原意是接力賽的「交棒」。軟體業借用來指「設計完成後交給工程師實作的流程」。設計師做完 Figma,交給工程師就是 design handoff。這裡延伸為 Claude Design → Claude Code 的交接——設計工具產出包裹可被開發工具直接接手。

Over the coming weeks, we'll make it easier to build integrations with Claude Design, so you can connect it to more of the tools your team already uses.
在接下來幾週,我們會讓大家更容易為 Claude Design 打造整合功能,讓你能把它連接到團隊已經在用的其他工具。

新字:integration, connect

客戶證言

原文以 blockquote 呈現三段合作夥伴與顧客的見證

"We've loved collaborating with Anthropic over the past couple of years and share a deep focus on making complex things simple. At Canva, our mission has always been to empower the world to design, and that means bringing Canva to wherever ideas begin. We're excited to build on our collaboration with Claude, making it seamless for people to bring ideas and drafts from Claude Design into Canva, where they instantly become fully editable and collaborative designs ready to refine, share, and publish."
「過去幾年我們很享受與 Anthropic 合作,雙方都堅信『把複雜變簡單』。在 Canva,我們的使命一直是讓全世界的人都能做設計,這意味著要把 Canva 帶到想法萌芽的地方。我們很期待在與 Claude 的合作上更進一步,讓大家能無縫地把 Claude Design 裡的想法與草稿帶到 Canva,它們會立刻變成完整可編輯、可協作的設計,準備好精修、分享與發佈。」

— Melanie Perkins, Co-Founder and CEO, Canva

Melanie Perkins,Canva 共同創辦人兼執行長

新字:empower, mission, seamless, draft, instantly, editable, publish

"Brilliant's intricate interactivity and animations are historically painful to prototype, but Claude Design's ability to turn static designs into interactive prototypes has been a step change for us. Our most complex pages, which took 20+ prompts to recreate in other tools, only required 2 prompts in Claude Design. Including design intent in Claude Code handoffs has made the jump from prototype to production seamless."
「Brilliant 網站細緻的互動與動畫過往做起原型來非常痛苦,但 Claude Design 把靜態設計轉成互動原型的能力,對我們來說是一次跳躍式的進步。我們最複雜的頁面,在其他工具要下 20 個以上的 prompt 才能重建,用 Claude Design 只要 2 個。把設計意圖直接納入 Claude Code 的交接流程,讓從原型跳到正式產品這一步變得無縫。」

— Olivia Xu, Senior Product Designer, Brilliant

Olivia Xu,Brilliant 資深產品設計師

新字:intricate, interactivity, animation, historically, painful, step change, recreate, intent, production

文化脈絡

step change 是商業英文慣用語,意指「階梯式的跳躍進步」。想像樓梯——不是斜坡那樣漸進,而是一階一階跳上去。與 incremental improvement(漸進式改善)相對。矽谷談論 AI 能力時很常用:"GPT-4 was a step change from GPT-3"(GPT-4 比 GPT-3 是跳躍式的進步)。

"Claude Design has made prototyping dramatically faster for our team, enabling live design during conversations. We've gone from a rough idea to a working prototype before anyone leaves the room, and the output stays true to our brand and design guidelines. What used to take a week of back-and-forth between briefs, mockups, and review rounds now happens in a single conversation."
「Claude Design 讓我們團隊的原型製作速度大幅提升,還能在對話中即時設計。我們可以從一個粗略的想法出發,在任何人離開會議室前就產出能運作的原型,而且產出完全符合我們的品牌與設計規範。過去要花上一週的來回——簡報、設計稿、審核回合——現在在一場對話內就完成。」

— Aneesh Kethini, Product Manager, Datadog

Aneesh Kethini,Datadog 產品經理

新字:dramatically, enable, guideline, back-and-forth, brief, review round

句型解析

What used to take a week... now happens in a single conversation. 這個句型很漂亮:What 引導名詞子句當主詞,used to(過去習慣)對比 now(現在),形成時間對比的強烈修辭效果。適合用在「過去 vs 現在」的成就敘事。

Get started

開始使用

Claude Design is available for Claude Pro, Max, Team, and Enterprise subscribers. Access is included with your plan and uses your subscription limits, with the option to continue beyond those limits by enabling extra usage.
Claude Design 開放給 Claude Pro、Max、Team、Enterprise 的訂閱者。功能已包含在你的方案內,使用量會計入你的訂閱額度,超出後可以透過啟用額外用量繼續使用。

新字:subscription, limit, enable, usage

For Enterprise organizations, Claude Design is off by default. Admins can enable it in Organization settings.
對 Enterprise 組織而言,Claude Design 預設為關閉,管理員可在組織設定中啟用。

新字:by default, admin

Start designing at claude.ai/design.
前往 claude.ai/design 開始設計。

整段組合

讀完逐段後,用整段組合快速複習。點擊切換英中。

Today, we're launching Claude Design, a new Anthropic Labs product that lets you collaborate with Claude to create polished visual work like designs, prototypes, slides, one-pagers, and more.

Claude Design is powered by our most capable vision model, Claude Opus 4.7, and is available in research preview for Claude Pro, Max, Team, and Enterprise subscribers. We're rolling out to users gradually throughout the day.

Design with Claude

Even experienced designers have to ration exploration—there's rarely time to prototype a dozen directions, so you limit yourself to a few. And for founders, product managers, and marketers with an idea but not a design background, creating and sharing those ideas can be daunting.

Claude Design gives designers room to explore widely and everyone else a way to produce visual work. Describe what you need and Claude builds a first version. From there, you refine through conversation, inline comments, direct edits, or custom sliders (made by Claude) until it's right. When given access, Claude can also apply your team's design system to every project automatically, so the output is consistent with the rest of your company's designs.

Teams have been using Claude Design for realistic prototypes, product wireframes and mockups, design explorations, pitch decks and presentations, marketing collateral, and frontier design with code-powered prototypes featuring voice, video, shaders, 3D and built-in AI.

How it works

Claude Design follows a natural creative flow. During onboarding, Claude builds a design system for your team by reading your codebase and design files. You can start from a text prompt, upload images and documents, or point Claude at your codebase. Comment inline on specific elements, edit text directly, or use adjustment knobs to tweak spacing, color, and layout live. Share designs as an internal URL, save as a folder, or export to Canva, PDF, PPTX, or standalone HTML files. When a design is ready to build, Claude packages everything into a handoff bundle that you can pass to Claude Code with a single instruction.

Over the coming weeks, we'll make it easier to build integrations with Claude Design, so you can connect it to more of the tools your team already uses.

Get started

Claude Design is available for Claude Pro, Max, Team, and Enterprise subscribers. Access is included with your plan and uses your subscription limits, with the option to continue beyond those limits by enabling extra usage. For Enterprise organizations, Claude Design is off by default. Admins can enable it in Organization settings.

Start designing at claude.ai/design.

今天我們推出 Claude Design,Anthropic Labs 的新產品,讓你與 Claude 協作產出精緻的視覺作品,例如設計稿、原型、簡報、單頁資料等。

Claude Design 由我們最強大的視覺模型 Claude Opus 4.7 驅動,以研究預覽版的形式開放給 Claude Pro、Max、Team、Enterprise 的訂閱者使用。我們會在今天之內逐步開放給使用者。

與 Claude 一起設計

即使是經驗豐富的設計師也得節制地探索——鮮少有時間同時做出十幾種方向的原型,於是只能侷限在幾個選項。而對於有想法但沒有設計背景的創辦人、產品經理、行銷人員來說,把想法做出來並分享出去更是讓人卻步。

Claude Design 讓設計師有空間廣泛探索,也讓其他人有方法產出視覺作品。描述你的需求,Claude 就會生出第一版。接著,你可以透過對話、在地註解、直接編輯、或使用 Claude 為你量身做的滑桿去調整,直到滿意為止。在取得授權之下,Claude 還能自動把你們團隊的設計系統套用到每個專案,讓產出與公司其他設計保持一致。

目前團隊用 Claude Design 做擬真原型、產品線框圖與設計稿、設計探索、提案簡報、行銷宣傳素材,以及結合程式碼、帶有語音/影片/著色器/3D/內建 AI 的前沿設計原型。

運作方式

Claude Design 遵循自然的創作流程。初次設定時,Claude 會讀取你的程式碼庫與設計檔案,為團隊建立一套設計系統。你可以從文字指令開始、上傳圖片或文件,或讓 Claude 直接讀取你的程式碼庫。針對特定元素加上在地註解、直接編輯文字,或用調整旋鈕即時微調間距、顏色與版面。設計檔可以作為組織內部 URL 分享、存成資料夾,或匯出成 Canva、PDF、PPTX、獨立 HTML 檔。當設計準備好進入開發階段,Claude 會把所有東西打包成交接套件,讓你用一句指令就能交給 Claude Code。

在接下來幾週,我們會讓大家更容易為 Claude Design 打造整合功能,讓你能把它連接到團隊已經在用的其他工具。

開始使用

Claude Design 開放給 Claude Pro、Max、Team、Enterprise 的訂閱者。功能已包含在你的方案內,使用量會計入你的訂閱額度,超出後可以透過啟用額外用量繼續使用。對 Enterprise 組織而言,Claude Design 預設為關閉,管理員可在組織設定中啟用。

前往 claude.ai/design 開始設計。

完整單字表

按文章出現順序排列,共 45 個。

開場(段 1-2)

Design with Claude(段 3-4 + 6 個 bullet)

How it works(6 個副標題段)

客戶證言(3 段)

Get started(2 段)

Insight

這篇學到什麼