mcp

ArticleJune 15, 2026

用 Agentation 把 UI 註解直接餵給 AI agent

跟 AI coding agent 說「這個按鈕往左一點」、「這裡間距怪怪的」，最後往往變成一大段文字描述，模型還是抓錯元素。這篇主要想分享給：平常用 Cursor、Claude Code 改前端，但又懶得截圖標箭頭的人。 Agentation 的做法很直接——在瀏覽器裡點元素、留註解，輸出結構化 context 給 agent 讀。我最近在這個站的 Next.js 專案裝好了，從 React component 到 Cursor MCP 都走過一遍，紀錄如下。 ⸻ ▍Agentation 是什麼？ dev-only 的 React overlay。開發模式下你可以： - 點頁面上任何元素 - 寫要改什麼 - 複製 markdown，或同步到本機 MCP server 預設資料不會離開你的電腦。註解先留在瀏覽器，除非你手動複製，或接上 `localhost`。對設計師跟前端來說，跟 Cur

AiCursorNextjs

用 Cursor 一句話跑 Figma Weave 工具 — Figma 把 Weave 工具接上 MCP：在對話裡呼叫創作管線，不用再切 app。

Figma 8 月 11 日在 Release Notes 裡寫了一則更新，標題很直接： Starting today, you can run your Figma Weave tools from clients like ChatGPT, Claude, or Cursor using the Figma MCP server. Describe what you need and the agent finds the tool, runs it, and returns the result in your conversation. 這篇主要想分享給：已經在用 Cursor（或 Claude）做事，手上又有重複生成需求——mockup、icon、社群尺寸延展——的人。不是再介紹一次 Weave，而是把「這能力是什麼、怎麼接、現在值得先做什麼」寫清楚。 ⸻ ▍官方在講什麼公告列

FigmaWeaveMcp

Blog Posts(2)

用 Agentation 把 UI 註解直接餵給 AI agent

用 Cursor 一句話跑 Figma Weave 工具 — Figma 把 Weave 工具接上 MCP：在對話裡呼叫創作管線，不用再切 app。

Resources(1)

Mobbin MCP