Figma Config 2026 重點懶人包：六大發布、上線時間、設計師先學哪個？
2026年6月25日 下午 12:55
AI 設計FIGMA · CONFIG 2026 · 重點懶人包
QUICK ANSWER
Figma Config 2026 一次發表六項重點：Code Layers（設計圖層一鍵變程式）、Figma Motion（時間軸動畫進畫布）、Shader 填色與效果、生成式 plugin、Weave 工具、升級版 Figma agent。主軸只有一句：把所有創作材料都搬上 canvas。Motion 與 shader 今天起 open beta，Code Layers 七月 early access，其餘陸續開放。這篇是最短版整理，只給你「每項在幹嘛、何時能用、吃不吃付費、先學哪個」，想深入哪一塊文末有對應的完整解析。
Config 一落幕，矽谷設計圈的時間軸整晚都在轉同一張圖。今年 Figma 沒有東一個西一個地撒功能，整場只圍著一句話打：code 不是設計的對立面，它跟圖層、向量一樣，是一種「材料」。把六種新材料倒上同一塊畫布，讓它們能彼此組合、即時試玩——這就是 Config 2026 的全部故事。
「AI 把地板墊高了，但天花板沒有自己長高——那一直是設計師的活。」
—— Config 2026 主題演講核心論述
CHAPTER 01 · 六大發布
六項重點，一次看完
下面六張卡就是今年的本體。每張附一句話講它在做什麼，加一行上線狀態，掃過去就有全貌。
01 · CODE
Code Layers
任何設計圖層一鍵或一句 prompt 變成可互動程式圖層，能並排試多個方向，也能抽回成可編輯設計圖層再同步回 code。
▸ 七月 early access
02 · MOTION
Figma Motion
時間軸與 keyframe 直接進畫布，可疊在現有設計上或叫 agent 生起點，匯出 CSS／JSON／React／MP4／GIF。
▸ 今天起 open beta
03 · SHADER
Shader 填色與效果
用講的或丟參考圖，讓 agent 幫你生 shader。預設參數化、可堆疊，例如 Riso、Gradient map、Luminance 粒子。
▸ 今天起 open beta
04 · PLUGIN
生成式 plugin
描述你要的行為與參數就生出一個外掛，免本地開發環境、免懂 plugin API，先自己用再分享出去。
▸ 陸續開放
05 · WEAVE
Weave 工具
節點式生成工作流接進畫布，Transfer style 把來源圖風格整包套到目標圖，工作流可發布成模板給別人 remix。
▸ 陸續開放
06 · AGENT
Figma agent
昨天全面開放，長出 Skills、Connectors（Notion／Slack／GitHub 等）、Attachments；對話預設隊友可見，即將上 FigJam 與 Slides。
▸ 已開放
懶得讀字想直接看官方怎麼 demo？整場 keynote 在這。Dylan Field 那段「code 是材料」的論述大概在前三分之一。
▲ Config 2026 主題演講完整版，Dylan Field 主講。來源：Figma 官方 YouTube
CHAPTER 02 · 兩個最有感的
先看這兩塊就懂氛圍
六項裡最能代表今年走向的是 Code Layers 與 Shader。前者把「設計交付給工程」這段流程直接抹平——設計稿、可互動原型、真實 React 程式碼並排在同一塊畫布，中間那個 Run 鍵按下去是真的會跑。
後者更接近魔法：你不寫一行 GLSL，對著 agent 描述要的質感，它幫你生 shader，而且生出來預設就是參數化的，可以在畫布上拉滑桿即時調，還能對參數打 keyframe 做動畫。材料跟動態，是同一條工作流。
CHAPTER 03 · 上線狀態
什麼時候能用、吃不吃付費
好消息是很多功能已經開始上線，壞消息是進階用法大多綁付費方案跟 Full seat。先對一下你手上的方案吃不吃得到。
一個要記住的點：目前用 agent 生成 shader、motion 暫時不扣 AI credit，但官方明說等 agent 正式 GA 之後標準計費就會啟動，手動編輯成果不扣。另外 shader 現在還不會出現在 Dev Mode，這點官方說在研究了。
CHAPTER 04 · 為什麼重要
地板被墊高，天花板誰頂
這六項加起來，本質都在做同一件事：把以前分屬不同職位、不同軟體的材料，放到設計師伸手就拿得到的地方。Figma 賭的是當材料變便宜，稀缺的會是那個能把材料編成作品的人。
AI 墊高的地板
人人都生得出堪用結果
prompt 一下就有版面、動畫、shader。產出的下限被整個抬起來，這部分只會越來越便宜。
要設計師頂的天花板
品味、判斷、跨材料編排
知道何時該停、哪個方向對、怎麼把 code、motion、shader 編成一個有觀點的整體。這部分只會越來越貴。
所以這次別急著問「Figma 又要逼我學什麼」。先把 Motion 跟 shader 打開玩一輪，感受材料變多之後你的品味會被逼到哪。會 prompt 不再是優勢，那只是入場券；真正拉開差距的，是你能不能在一塊塞滿 code、motion、shader 的畫布上，做出別人一眼認得出是你的東西。
想深入哪一塊
挑一條往下鑽
這篇給的是全貌。想看哪一塊的完整拆解，下面三篇接著讀。
完整脈絡
六大發布全解析：code 是材料這句宣言怎麼落地 →
想搞懂整場論述與每項的設計師意義，從這篇開始。
動效專章
Figma Motion 原生動效完整解析與實戰 →
只想搞懂動畫在畫布裡怎麼做、怎麼匯出，看這篇。
外掛專章
生成式 plugin：用一句話做出專屬外掛 →
對自己生工具有興趣的人，這篇拆得最細。
FAQ · 常見問題
關於 Config 2026，你可能想問
Q：Config 2026 一共發表幾項重點？
A：六項——Code Layers、Figma Motion、Shader 填色與效果、生成式 plugin、Weave 工具、升級版 Figma agent。主軸是把所有創作材料都搬上 canvas。
Q：哪些功能今天就能用？
A：Figma Motion 與 Shader 從 6 月 24 日起 open beta；Code Layers 七月開 early access；生成式 plugin 與 Weave 工具陸續開放；Figma agent 已全面開放。
Q：這些功能要付費嗎？
A：Motion 與 shader 在可編輯檔案裡全方案都能用，但發布動態元件、用 agent 生成、匯出高解析影片需要付費方案的 Full seat；Weave 工具需 Professional 以上加 Full seat。
Q：會吃 AI credit 嗎？
A：目前用 agent 生成 shader、motion 暫時不扣，但官方明說等 Figma agent 正式 GA 之後標準 credit 計費就會啟動。手動編輯 agent 生成的成果不扣 credit。
Q：身為設計師，我該先學哪一個？
A：建議從 Figma Motion 跟 shader 入手，門檻最低、回饋最直接，能立刻擴張表達範圍。Code Layers 等七月 early access 開了再認真評估，特別是有在跟工程協作的人。
Q：Config 2026 的 keynote 在哪裡看回放？
A：Figma 官方 YouTube 已上架完整 keynote，由 CEO Dylan Field 主講，線上觀看免費。本文上方已嵌入。
延伸閱讀
再往外接兩篇
· 想理解 Code Layers 的前情提要，看 Figma Make 本地 code beta 怎麼運作。
· 想把「AI 墊地板、設計師頂天花板」落到實際工作流，看 AI 設計工作流的判斷地圖。
