[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"article-figma-ai-agent-collaborative-canvas-zh":3,"article-related-figma-ai-agent-collaborative-canvas-zh":34,"series-tools-af025468-12fc-49c7-a6b3-62b5ee175f7a":85},{"id":4,"slug":5,"title":6,"content":7,"summary":8,"source":9,"source_url":10,"author":11,"image_url":12,"cover_image":12,"category":13,"language":14,"translated_content":11,"related_article_id":15,"keywords":16,"key_takeaways":26,"views":30,"created_at":31,"published_at":32,"topic_cluster_id":33},"af025468-12fc-49c7-a6b3-62b5ee175f7a","figma-ai-agent-collaborative-canvas-zh","Figma 把 AI 代理放進畫布","\u003Cp data-speakable=\"summary\">\u003Ca href=\"\u002Ftag\u002Ffigma\">Figma\u003C\u002Fa> 把 \u003Ca href=\"\u002Ftag\u002Fai-agent\">AI agent\u003C\u002Fa> \u003Ca href=\"\u002Fnews\u002Fvercel-zero-compiler-json-ai-agents-zh\">直接\u003C\u002Fa>放進協作畫布，讓設計師用文字提示生成、修改和迭代版面。\u003C\u002Fp>\u003Cp>說真的，這招很直接。Figma 不是再做一個聊天視窗，而是把 AI 放進 \u003Ca href=\"https:\u002F\u002Fwww.figma.com\u002F\" target=\"_blank\" rel=\"noopener\">Figma\u003C\u002Fa> Design 的核心工作區。\u003C\u002Fp>\u003Cp>它想處理的，不是單純生圖。它要碰的是版面、元件、間距，還有一堆設計師每天都在重複改的細節。\u003C\u002Fp>\u003Cp>而且時機很巧。Figma 公布 \u003Ca href=\"\u002Fnews\u002Fwhy-rust-is-winning-systems-programming-2026-zh\">2026\u003C\u002Fa> 年第一季營收 \u003Cstrong>3.334 億美元\u003C\u002Fstrong>，年增 \u003Cstrong>46%\u003C\u002Fstrong>。這代表它一邊賣軟體，一邊把 AI 往產品中心推。\u003C\u002Fp>\u003Ctable>\u003Cthead>\u003Ctr>\u003Cth>指標\u003C\u002Fth>\u003Cth>數值\u003C\u002Fth>\u003Cth>意義\u003C\u002Fth>\u003C\u002Ftr>\u003C\u002Fthead>\u003Ctbody>\u003Ctr>\u003Ctd>2026 Q1 營收\u003C\u002Ftd>\u003Ctd>3.334 億美元\u003C\u002Ftd>\u003Ctd>顯示 Figma 還在成長\u003C\u002Ftd>\u003C\u002Ftr>\u003Ctr>\u003Ctd>年增率\u003C\u002Ftd>\u003Ctd>46%\u003C\u002Ftd>\u003Ctd>代表需求還很強\u003C\u002Ftd>\u003C\u002Ftr>\u003Ctr>\u003Ctd>AI 落點\u003C\u002Ftd>\u003Ctd>Figma Design\u003C\u002Ftd>\u003Ctd>直接進核心產品\u003C\u002Ftd>\u003C\u002Ftr>\u003Ctr>\u003Ctd>相關工作流\u003C\u002Ftd>\u003Ctd>Claude Code、Codex\u003C\u002Ftd>\u003Ctd>設計和寫程式更接近\u003C\u002Ftd>\u003C\u002Ftr>\u003C\u002Ftbody>\u003C\u002Ftable>\u003Ch2>Figma 這次到底做了什麼\u003C\u002Fh2>\u003Cp>這次的新 \u003Ca href=\"\u002Ftag\u002Fagent\">agent\u003C\u002Fa>，直接跑在多人協作畫布裡。也就是說，它不是外掛，也不是旁邊的小\u003Ca href=\"\u002Fnews\u002Fanthropic-buys-stainless-sdk-deal-zh\">工具\u003C\u002Fa>。\u003C\u002Fp>\n\u003Cfigure class=\"my-6\">\u003Cimg src=\"https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1779474960294-xhm2.png\" alt=\"Figma 把 AI 代理放進畫布\" class=\"rounded-xl w-full\" loading=\"lazy\" \u002F>\u003C\u002Ffigure>\n\u003Cp>Figma 說，這個 agent 能根據自然語言提示生成新設計，也能改既有畫面。它還能同時處理多個任務，像是改文案、換版型、產生變體。\u003C\u002Fp>\u003Cp>講白了，Figma 想吃掉的是「反覆試版」那段最煩的工作。很多團隊不是卡在靈感，而是卡在一個畫面要改 20 次。\u003C\u002Fp>\u003Cul>\u003Cli>可用文字提示生成新版面。\u003C\u002Fli>\u003Cli>可直接修改既有畫面。\u003C\u002Fli>\u003Cli>可自動做多輪迭代。\u003C\u002Fli>\u003Cli>可同時跑多個任務。\u003C\u002Fli>\u003C\u002Ful>\u003Cp>這裡真正有意思的是「同時跑多個任務」。如果做得順，設計師就能把一個任務拆成三個。\u003C\u002Fp>\u003Cp>一個做 layout 變體，一個改 copy，一個測極端情境。這比一個 chatbot 慢慢陪你聊，實用多了。\u003C\u002Fp>\u003Ch2>為什麼 Figma 現在要推\u003C\u002Fh2>\u003Cp>因為設計工具市場已經很擠了。\u003Ca href=\"https:\u002F\u002Fwww.canva.com\u002F\" target=\"_blank\" rel=\"noopener\">Canva\u003C\u002Fa> 一直在補 AI 功能，\u003Ca href=\"https:\u002F\u002Fwww.adobe.com\u002F\" target=\"_blank\" rel=\"noopener\">Adobe\u003C\u002Fa> 也在把\u003Ca href=\"\u002Ftag\u002F生成式-ai\">生成式 AI\u003C\u002Fa> 塞進創作流程。\u003C\u002Fp>\u003Cp>Figma 如果只停在傳統協作工具，很容易被說成只是「做介面圖的那家」。但把 AI agent 放進畫布，它就能把自己重新定位成工作流程中心。\u003C\u002Fp>\u003Cp>更現實一點說，這是商業壓力。當競品都在講 AI，Figma 不能只靠老本。它得讓客戶覺得，留在 Figma 裡面比較省事。\u003C\u002Fp>\u003Cblockquote>“As building software gets easier, what matters most is setting direction: deciding what to work on, how it should function, what the experience should feel like,” Figma chief design officer Loredana Crisan said in a statement.\u003C\u002Fblockquote>\u003Cp>這段話很直白。AI 如果能幫你省掉畫圖和改稿時間，那人就該把時間放在方向、取捨和品味。\u003C\u002Fp>\u003Cp>我覺得這才是 Figma 真正想賣的東西。不是 AI 多強，而是你少做多少重複工。\u003C\u002Fp>\u003Cul>\u003Cli>Figma 先從核心產品 Figma Design 下手。\u003C\u002Fli>\u003Cli>之後再擴到其他產品線。\u003C\u002Fli>\u003Cli>它想把設計和程式開發拉近。\u003C\u002Fli>\u003Cli>它也要守住既有用戶和營收。\u003C\u002Fli>\u003C\u002Ful>\u003Ch2>跟 Figma 之前的 AI 做法差在哪\u003C\u002Fh2>\u003Cp>差別很大。之前的做法比較像接外部工具，現在是把 agent 直接塞進工作現場。\u003C\u002Fp>\n\u003Cfigure class=\"my-6\">\u003Cimg src=\"https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1779474960703-mut5.png\" alt=\"Figma 把 AI 代理放進畫布\" class=\"rounded-xl w-full\" loading=\"lazy\" \u002F>\u003C\u002Ffigure>\n\u003Cp>Figma 先前和 \u003Ca href=\"https:\u002F\u002Fwww.anthropic.com\u002F\" target=\"_blank\" rel=\"noopener\">Anthropic\u003C\u002Fa>、\u003Ca href=\"https:\u002F\u002Fopenai.com\u002F\" target=\"_blank\" rel=\"noopener\">OpenAI\u003C\u002Fa> 的合作，重點比較像把設計和 coding 接起來。像 \u003Ca href=\"https:\u002F\u002Fwww.anthropic.com\u002Fclaude-code\" target=\"_blank\" rel=\"noopener\">Claude Code\u003C\u002Fa> 和 \u003Ca href=\"https:\u002F\u002Fopenai.com\u002Fcodex\" target=\"_blank\" rel=\"noopener\">Codex\u003C\u002Fa>，都偏向開發流程。\u003C\u002Fp>\u003Cp>這次則不同。它要吃的是 ideation、iteration、cleanup。也就是從想法，到反覆修改，到最後收尾，這一整段中間流程。\u003C\u002Fp>\u003Cp>這段流程很值錢。因為很多團隊的時間，不是花在發想，而是花在修小地方。字距差 2px，都能讓人改半天。\u003C\u002Fp>\u003Cul>\u003Cli>合作路線：把設計接到 coding 工具。\u003C\u002Fli>\u003Cli>內建路線：agent 直接在畫布內工作。\u003C\u002Fli>\u003Cli>商業路線：Q1 營收 3.334 億美元。\u003C\u002Fli>\u003Cli>產品路線：先從 Figma Design 開始。\u003C\u002Fli>\u003C\u002Ful>\u003Cp>另外，Figma 也不是只有這一招。它還有 \u003Ca href=\"https:\u002F\u002Fwww.figma.com\u002Fweavy\u002F\" target=\"_blank\" rel=\"noopener\">Weavy\u003C\u002Fa>，以及新的影像編輯功能。\u003C\u002Fp>\u003Cp>這代表它不是單點加 AI，而是在把整個產品線往更完整的創作流程拉。\u003C\u002Fp>\u003Ch2>競品現在打到哪裡\u003C\u002Fh2>\u003Cp>如果看設計軟體市場，AI 早就不是加分題，而是基本配備。\u003Ca href=\"https:\u002F\u002Fwww.krea.ai\u002F\" target=\"_blank\" rel=\"noopener\">Krea\u003C\u002Fa>、\u003Ca href=\"https:\u002F\u002Fflora.com\u002F\" target=\"_blank\" rel=\"noopener\">Flora\u003C\u002Fa>、\u003Ca href=\"https:\u002F\u002Fdessn.com\u002F\" target=\"_blank\" rel=\"noopener\">Dessn\u003C\u002Fa> 這類 AI-first 工具，主打的就是更快出稿。\u003C\u002Fp>\u003Cp>Figma 的優勢，還是在協作和生態。很多公司不是只要一個會生圖的工具，而是要一個大家能一起改、一起看、一起交接的地方。\u003C\u002Fp>\u003Cp>但 Figma 也有壓力。AI-first 新創通常更敢砍掉舊流程，操作也更激進。Figma 要守住大客戶，就得證明 AI 不會搞亂既有工作習慣。\u003C\u002Fp>\u003Cul>\u003Cli>\u003Cstrong>Canva\u003C\u002Fstrong>：強在模板和簡單上手。\u003C\u002Fli>\u003Cli>\u003Cstrong>Adobe\u003C\u002Fstrong>：強在創作工具鏈和專業用戶。\u003C\u002Fli>\u003Cli>\u003Cstrong>Krea\u003C\u002Fstrong>、\u003Cstrong>Flora\u003C\u002Fstrong>、\u003Cstrong>Dessn\u003C\u002Fstrong>：強在 AI-first 體驗。\u003C\u002Fli>\u003Cli>\u003Cstrong>Figma\u003C\u002Fstrong>：強在協作畫布和產品設計流程。\u003C\u002Fli>\u003C\u002Ful>\u003Cp>如果用一句話比喻，競品是在做更快的工具。\u003C\u002Fp>\u003Cp>Figma 是想把工具變成工作場域本身。這差很多。\u003C\u002Fp>\u003Ch2>這件事放回產業脈絡看\u003C\u002Fh2>\u003Cp>設計軟體這幾年一直在變。以前比的是元件、元件庫、協作能力。現在比的是誰能把 AI 接進日常流程。\u003C\u002Fp>\u003Cp>這也跟 \u003Ca href=\"\u002Ftag\u002Fllm\">LLM\u003C\u002Fa> 的成熟有關。以前模型很會聊天，但不一定懂版面。現在大家開始把模型塞進特定場景，讓它讀得懂結構，也做得出可用結果。\u003C\u002Fp>\u003Cp>對台灣團隊來說，這很實際。很多新創和產品團隊都同時要做 UI、寫規格、接前端。若 AI 能少掉一半重工，交付速度就會差很多。\u003C\u002Fp>\u003Cp>但問題也很現實。AI 可以幫忙出草稿，卻不一定懂品牌、法規、可用性，還有那些會踩雷的細節。\u003C\u002Fp>\u003Cp>所以我比較同意 Figma 這次的方向，但不會把它吹太滿。它比較像一個很強的助手，不是設計師本人。\u003C\u002Fp>\u003Ch2>接下來要看什麼\u003C\u002Fh2>\u003Cp>接下來要看兩件事。第一，團隊會不會真的把它用在正式迭代。第二，Figma 能不能把 agent 的結果穩定到可交付。\u003C\u002Fp>\u003Cp>如果使用者只拿它做草稿，那它只是好玩的功能。如果它能真的縮短改版時間，那 Figma 就會多一個很硬的護城河。\u003C\u002Fp>\u003Cp>我會先觀察三個指標：使用頻率、產出採用率、以及設計到開發的交接時間。這三個數字，比任何宣傳詞都誠實。\u003C\u002Fp>\u003Cp>短期內，我猜很多團隊會先拿它做低風險任務。像是版面變體、文案替換、空白狀態設計。\u003C\u002Fp>\u003Cp>等到大家確認沒亂來，再慢慢把它放進正式流程。這才是比較務實的走法。\u003C\u002Fp>","Figma 把 AI agent 直接塞進協作畫布，讓設計師能用文字提示生成、修改與迭代版面，也把設計和程式開發流程拉得更近。","techcrunch.com","https:\u002F\u002Ftechcrunch.com\u002F2026\u002F05\u002F20\u002Ffigma-adds-an-ai-assistant-to-its-collaborative-canvas\u002F",null,"https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1779474960294-xhm2.png","tools","zh","a6260082-014e-4dd9-b323-5dfc84296e9e",[17,18,19,20,21,22,23,24,25],"Figma","AI agent","設計工具","協作畫布","LLM","UI設計","產品設計","Claude Code","Codex",[27,28,29],"Figma 把 AI agent 直接放進設計畫布，不是做成外掛。","這次主打生成、修改、迭代，重點是減少重複工。","Figma 也在回應 Canva、Adobe 和 AI-first 設計工具的競爭。",9,"2026-05-22T18:35:32.384604+00:00","2026-05-22T18:35:32.371+00:00","c3c88dd2-a940-438a-b359-0e5a24562273",{"tags":35,"relatedLang":44,"relatedPosts":48},[36,37,39,41,42],{"name":19,"slug":19},{"name":21,"slug":38},"llm",{"name":18,"slug":40},"ai-agent",{"name":20,"slug":20},{"name":17,"slug":43},"figma",{"id":15,"slug":45,"title":46,"language":47},"figma-ai-agent-collaborative-canvas-en","Figma puts an AI agent inside its canvas","en",[49,55,61,67,73,79],{"id":50,"slug":51,"title":52,"cover_image":53,"image_url":53,"created_at":54,"category":13},"63d8b456-ad6b-475e-86e9-d4677ca226aa","magenta-realtime-2-score-inside-daw-zh","Magenta RealTime 2 讓你在 DAW 裡即時改曲","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1781046204038-8tox.png","2026-06-09T23:02:55.9651+00:00",{"id":56,"slug":57,"title":58,"cover_image":59,"image_url":59,"created_at":60,"category":13},"f60261ff-a42e-4cfb-9f90-97785e633289","open-source-ai-tools-beat-claude-paid-tiers-zh","開源 AI 工具在價值上已經贏過 Claude 付費方案","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1781045266035-on7t.png","2026-06-09T22:47:20.195939+00:00",{"id":62,"slug":63,"title":64,"cover_image":65,"image_url":65,"created_at":66,"category":13},"8520cd4f-2531-4808-a95d-26f590239d7a","500-ai-agent-projects-show-where-agents-work-now-zh","500 個 AI agent 專案，現在能做什麼","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1781033591132-c0nh.png","2026-06-09T19:32:37.03924+00:00",{"id":68,"slug":69,"title":70,"cover_image":71,"image_url":71,"created_at":72,"category":13},"c557ef1c-7fde-4c86-918e-4fb9680ee9df","chocolatey-go-package-policy-installs-zh","Chocolatey 的 Go 安裝變成政策","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1781029110289-xkbh.png","2026-06-09T18:18:05.078435+00:00",{"id":74,"slug":75,"title":76,"cover_image":77,"image_url":77,"created_at":78,"category":13},"90b2df54-df6e-417d-9e16-91e9ad2f53d7","go-support-policy-turns-releases-into-a-checklist-zh","Go 支援政策把發版變清單","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1781028200122-3m4u.png","2026-06-09T18:02:49.50176+00:00",{"id":80,"slug":81,"title":82,"cover_image":83,"image_url":83,"created_at":84,"category":13},"119c23c6-8ae7-4c4e-820e-1eba0730d702","rustdesk-self-hosting-secure-remote-access-zh","RustDesk 自架遠端存取部署指南","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1781017373324-g7et.png","2026-06-09T15:02:24.118819+00:00",[86,91,96,101,106,111,116,121,126,131],{"id":87,"slug":88,"title":89,"created_at":90},"855cd52f-6fab-46cc-a7c1-42195e8a0de4","surepath-real-time-mcp-policy-controls-zh","SurePath 推出即時 MCP 政策控管","2026-03-26T07:57:40.77233+00:00",{"id":92,"slug":93,"title":94,"created_at":95},"9b19ab54-edef-4dbd-9ce4-a51e4bae4ebb","mcp-in-2026-the-ai-tool-layer-teams-use-zh","2026 年 MCP：團隊真的在用的 AI 工具層","2026-03-26T08:01:46.589694+00:00",{"id":97,"slug":98,"title":99,"created_at":100},"af9c46c3-7a28-410b-9f04-32b3de30a68c","prompting-in-2026-what-actually-works-zh","2026 提示工程，真正有用的是什麼","2026-03-26T08:08:12.453028+00:00",{"id":102,"slug":103,"title":104,"created_at":105},"05553086-6ed0-4758-81fd-6cab24b575e0","garry-tan-open-sources-claude-code-toolkit-zh","Garry Tan 開源 Claude Code 工具包","2026-03-26T08:26:20.068737+00:00",{"id":107,"slug":108,"title":109,"created_at":110},"042a73a2-18a2-433d-9e8f-9802b9559aac","github-ai-projects-to-watch-in-2026-zh","2026 必看 20 個 GitHub AI 專案","2026-03-26T08:28:09.619964+00:00",{"id":112,"slug":113,"title":114,"created_at":115},"a5f94120-ac0d-4483-9a8b-63590071ac6a","claude-code-vs-cursor-2026-zh","Claude Code 與 Cursor 深度對比：202…","2026-03-26T13:27:14.279193+00:00",{"id":117,"slug":118,"title":119,"created_at":120},"0975afa1-e0c7-4130-a20d-d890eaed995e","practical-github-guide-learning-ml-2026-zh","2026 機器學習入門 GitHub 實用指南","2026-03-27T01:16:49.712576+00:00",{"id":122,"slug":123,"title":124,"created_at":125},"bfdb467a-290f-4a80-b3a9-6f081afb6dff","aiml-2026-student-ai-ml-lab-repo-review-zh","AIML-2026：像課綱的學生實驗 Repo","2026-03-27T01:21:51.467798+00:00",{"id":127,"slug":128,"title":129,"created_at":130},"80cabc3e-09fc-4ff5-8f07-b8d68f5ae545","ai-trending-github-repos-and-research-feeds-zh","AI Trending：把 AI 資源收成一張表","2026-03-27T01:31:35.262183+00:00",{"id":132,"slug":133,"title":134,"created_at":135},"3ce6e6e2-bac5-463e-9f8d-45caabcc61f7","awesome-ai-for-science-research-tools-map-zh","AI 科研工具清單，開始像地圖了","2026-03-27T01:46:50.521945+00:00"]