---
title: "Claude 三大目錄怎麼裝？Skills、Connectors、Plugins 設計師必裝清單"
slug: claude-directory-skills-connectors-plugins-essentials
url: https://rar.design/posts/claude-directory-skills-connectors-plugins-essentials
published_at: 2026-05-21
modified_at: 2026-05-21
author: "設計師 Riven"
category: "AI 設計"
access: public_access
---

# Claude 三大目錄怎麼裝？Skills、Connectors、Plugins 設計師必裝清單

> 2026/03/31 起 Claude 把擴充收進一個地方，三個 tab 對應三種強化路徑

By **設計師 Riven** - 資深數位產品設計師｜知名線上課程講師 | 2026-05-21

AI TOOLS · 2026 ▲ Claude 三大目錄：Skills 擴充 Claude 的專業能力、Connectors 連接你的工具與資料來源、Plugins 整合第三方服務與應用程式 QUICK ANSWER Claude 的擴充生態現在分三類，2026/03/31 起統一收在 claude.ai/directory：Skills 教 Claude 怎麼做事（SOP 包）、Connectors 給 Claude 連到外部 app（375+ 個 MCP 整合）、Plugins 把前兩者打包成整套職能套件。設計師的最小可行組合是七個：Skills 兩個（frontend-design、skill-creator）、Connectors 三個（Adobe for creativity、Notion、Google Drive）、Plugins 兩個（Design、Figma），裝完大約十分鐘。 CHAPTER 01 · A FIGMA WITHOUT EXTENSIONS 先想像一個沒有擴充的 Figma 你開檔案、畫框、拉幾條向量。要找一個 icon？打開瀏覽器、搜尋、下載 SVG、拖回 Figma。要對齊網格？手動。要批次重命名 layer？開個 Plugin 跑一輪。要把 component 交給工程師？截圖貼到 Notion，標註尺寸，等他來問。 Figma 的擴充其實一直是三種混在一起。教軟體做新動作的功能（像 Auto Layout、Variables）、把外部資料抓進來的插件（像 Unsplash、Iconify）、整合多步驟工作流的工具包（像 Figma to Code）。設計師早習慣這三層共存，分得清也用得順。 Claude 在 2026 年也走到這一步。三類擴充，三個 tab。 三月底 Anthropic 把所有擴充統一收進 claude.ai/directory，三個 tab 各管一件事：Skills 教 Claude 動作、Connectors 連 Claude 到資料、Plugins 把前兩者打包成完整工具箱。 這篇要把三類拆乾淨，整理設計師 2026 年該裝的最小可行組合。 CHAPTER 02 · THE THREE TABS Directory 的三個 tab，三種擴充 ▲ claude.ai/directory 側欄。Skills 是卷軸圖示、Connectors 是拼塊、Plugins 是插頭，視覺隱喻很直接。 三類各自的定位： Skills · 教 Claude 怎麼做事 一個 Skill 就是一個 SKILL.md 檔——告訴 Claude 遇到特定任務時要怎麼處理。寫 Word 文件用 docx skill、做投影片用 pptx skill、生 PDF 用 pdf skill。Anthropic 自家的 frontend-design skill 就是教 Claude 怎麼寫出有設計感的前端，而不是吐預設模板。 Connectors · 給 Claude 連到外面 基於 MCP（Model Context Protocol）的雙向通道。讓 Claude 可以讀寫你的 Google Drive、Notion、Adobe Creative Cloud、Figma 檔案。一鍵 OAuth 授權，沒有命令列。 Plugins · 整套打包好的職能套件 一個 Plugin 把多個 Skills、Connectors、slash commands、甚至 sub-agents 包成一個 install。Anthropic 在 2026/01/30 隨 Claude Cowork 上線這個概念，後續推了 Design、Figma、Legal 等多個職能套件。 生態系的成長速度比 Figma Plugin 當年還凶。看數字就懂： 375+ CONNECTORS 官方 directory 上 2026/05 已驗證的數量 1000+ SKILLS 官方加社群累計可安裝的 SKILL.md 數 16 個月 0 TO THREE TABS 從 MCP 首發到三類目錄統一 Figma 的 Plugin 生態從 0 到上萬個花了五年，Claude 16 個月就把擴充分成三層。這個速度差，背後是整個 AI 生態在押注 Claude 的開放標準會變成新世代的「工具接口」。 CHAPTER 03 · SKILLS Skills — 教 Claude 怎麼做事 ▲ Claude 設定介面的 Skills 區塊。每一項 skill 都是一個 SKILL.md 檔案，Claude 會在遇到對應任務時自動啟動。圖片來源：anthropic.com Skills 是三類裡面最容易被低估的。表面看就是個 Markdown 文件，實際上是教 Claude 在遇到特定任務時走特定 SOP——這跟 Figma 的 Auto Layout 是同一種思維。Auto Layout 不是新功能，是教 Figma 「frame 裡的元素該怎麼排」的規則包。Skill 就是教 Claude「遇到 X 任務該怎麼做」的規則包。 Skills 在 Claude.ai 介面的 Customize → Skills 裡可以瀏覽跟啟用。安裝後 Claude 會自動判斷什麼時候用得上，不用每次都 prompt 它。需要 Pro 以上方案，且要開啟 code execution。 SKILL · 01 frontend-design 類比：Figma 的 Variables ＋ 設計系統規範包 Anthropic 官方出的 skill。用一句話形容它的存在：讓 Claude 寫出來的前端，看起來不像 AI 寫的。沒裝這個的 Claude 會吐千篇一律的 Inter 字體 + 紫色漸層 + 圓角卡片。裝了之後它會根據品牌調性挑字體、配色、版式，產出有個性的介面。 對寫 HTML、做 landing page、或要 Claude 幫忙產出 prototype 的設計師來說，這是 Day 1 必裝。 SKILL · 02 skill-creator 類比：Figma 的 Component Builder 這個有點 meta：它是「教 Claude 寫新 Skill」的 Skill。當你發現自己重複跟 Claude 解釋同一套流程（「先檢查媒體、再驗證連結、再做 self-check」），就是該寫 Skill 的時候。 裝了 skill-creator 之後，你只要描述工作流，它會幫你產出標準 SKILL.md。我的部落格寫稿 SOP、社群發文 checklist、IG 輪播視覺模板，全都靠這個方式封裝起來。寫過一次，永遠不用再講第二次。 ▲ skill-creator 的官方示意：描述需求，Claude 自動產出一個新的 SKILL.md。圖片來源：anthropic.com CHAPTER 04 · CONNECTORS Connectors — 給 Claude 連到你的工具 ▲ Anthropic 官方 MCP 介紹頁的視覺隱喻：不同形狀的應用透過同一條協議連到 Claude。圖片來源：anthropic.com Connectors 是 MCP 在 Claude.ai 介面上的官方名字。MCP（Model Context Protocol）是 2024 年底 Anthropic 釋出的開放協議，產業類比是「AI 世界的 USB-C」。對應到 Figma 的話，就是 Unsplash、Iconify 這類「把外部資料抓進來」的 plugin——只是 MCP 是雙向的，Claude 可以讀也可以寫。 我精選三個。不是最熱門的，是 fit 設計師日常的： CONNECTOR · 01 · DAILY DRIVER Adobe for creativity 類比：Figma 的 Iconify ＋ Unsplash ＋ 跨檔案搜尋三合一 2026/04/28 隨「Claude for Creative Work」一起發。一個 connector 打通 50+ Adobe 工具：Photoshop、Illustrator、Lightroom、Firefly、Premiere、InDesign、Adobe Stock。 Anthropic 官方範例是「幫我從 Adobe 設計庫做一張 boutique sale 的 IG story，背景換掉再加動畫」，Claude 會自己跨 Adobe Express、Photoshop、動畫工具串完。免費版 Claude 就能用，這是 Anthropic 給創作者的入場禮。 ▲ Adobe for creativity connector 在 Claude 對話介面內的官方示意，設計師輸入 prompt，Claude 跨多個 Adobe 工具產出 IG story 設計。圖片來源：Adobe Blog CONNECTOR · 02 · SECOND BRAIN Notion 類比：Figma 的 Content Reel（外部資料庫雙向通） Notion connector 是 directory 最早期的標配，讀寫 page、查資料庫、新增記錄樣樣行。實用工作流：寫文章草稿在 Notion，修圖 reference 整理在 Notion，最後叫 Claude 從 Notion 抓內容組裝成正式稿。 類似 Figma 用 Content Reel 從 Google Sheet 抓真實資料填到 mockup 的概念——但因為是雙向，Claude 還會幫你把產出回寫進 Notion 資料庫。 CONNECTOR · 03 · ASSET LIBRARY Google Drive 類比：Figma 的 Unsplash（但抓的是你自己的素材） 讓 Claude 可以掃你 Drive 裡的素材庫、設計檔案、客戶資料夾。實用情境：寫完文章，叫 Claude 從 Drive 找上週做的 IG carousel 截圖，自動配對到合適段落。 每個設計師的 Drive 都是一座沒整理過的金山，MCP 把它接上 Claude，整理這件事就被外包出去了。 關於 Connectors / MCP 的完整背景，我寫過一篇MCP 完整指南，技術細節可以從那裡進；另一篇Adobe for creativity 深入拆解講 Adobe 那條線在做什麼。 CHAPTER 05 · PLUGINS Plugins — 整套打包好的職能套件 ▲ Claude Code 內 /plugin 指令管理介面，顯示已安裝的 plugins。Claude.ai 網頁版的 plugin 管理 UI 概念類似但更圖形化。圖片來源：claude.com Plugins 是三類裡最年輕的。2026/01/30 隨 Claude Cowork 上線，定位是「把 Skills + Connectors + slash commands + sub-agents 打包成單一可安裝套件」。對照 Figma，就是 Figma to Code 那種把多步驟工作流整合的整合型 Plugin。 Plugin 解的問題是「我每次都要組合一堆 skill 跟 connector 才能完成這類工作」。Anthropic 推的 Design Plugin 內含設計批評、UX 文案、無障礙審核、研究綜合、開發交接，全是設計師重複會做的事，但每件單獨拆出來都不夠。打包之後，一個 slash command 就到位。 PLUGIN · 01 Design Anthropic 官方推出，給設計工作流的整套職能套件 官方頁面：claude.com/plugins/design。內容含 design critique（設計批評）、design system management（設計系統管理）、UX writing（介面文案）、accessibility audits（無障礙審核）、research synthesis（研究綜合）、dev handoff（開發交接）。 用 slash command 觸發。例如做完一份 mockup 後打「/design-critique」，Claude 會走 critique skill 流程；要交付前端時打「/dev-handoff」，會跑 component 結構分析 + 設計 token 整理 + 標註生成。每一條都是一個 mini-agent 在背後跑。 PLUGIN · 02 Figma Figma 官方包：MCP connector ＋ Code to Canvas ＋ Dev Mode 整合 Figma 自家做的 Claude Plugin。讓 Claude 可以讀你 Figma 檔案的 component 結構、design token、變數，再把設計轉成 production-ready 的 React／Vue／Tailwind 程式碼。 反向也通：Claude Code 寫出來的 UI 可以一鍵變回 Figma frame——不是截圖，是真的可編輯 layer。對「設計交付」場景殺傷力最大。如果你的工作流主軸是 Figma，這個 Plugin 取代了你過去裝五六個 Figma plugin 才能搞定的事。 Plugins 還有不少值得試的——Anthropic 官方的 skill-creator、Superpowers、frontend-design 都是 Plugin 形式，社群也累積了幾百個。但對設計師主流工作流來說，Design 跟 Figma 兩個能涵蓋八成日常。 Anthropic 4 月底由 MCP 共同創造者 David Soria Parra 在 AI Engineer 大會的演講，標題就是「The Future of MCP」——這個演講雖然講的是 MCP（也就是 Connectors 那一層），但點到的方向其實貫穿三類：讓 AI 在你整套工具鏈裡走來走去，而不是停在某一個 app 內： ▲ The Future of MCP — David Soria Parra, Anthropic（2026/04） CHAPTER 06 · HOW TO CHOOSE 三類怎麼選：一張決策圖 三類目錄聽起來複雜，實際上判斷只要三句話： DECISION TREE · 三句話判斷 SKILL 你發現自己重複教 Claude 同一套流程 寫 Skill。或裝現成的（frontend-design、docx、pptx）。重複教三次以上就值得封裝。 CONNECTOR 你在 copy-paste 外部 app 的內容給 Claude 裝 Connector。Notion、Drive、Adobe 是設計師的 80% 場景。剪貼板用滿三次就該裝。 PLUGIN 你需要整套職能套件、跨多個 skill ＋ connector 裝 Plugin。Design 跟 Figma 兩個給設計師日常用，其他職能套件（Legal、Finance、HR）對應不同身份。 我自己的「設計師最小可行套組」就是文章開頭那七個：Skills 兩個（frontend-design、skill-creator）、Connectors 三個（Adobe、Notion、Drive）、Plugins 兩個（Design、Figma）。裝完十分鐘，覆蓋八成日常設計工作。 其他像 Slack、Linear、Gmail Connector，看你工作型態加。如果你不確定先裝什麼，我先前的 Claude 日常 Connectors 清單有更廣的工作型態建議。 最後一個提醒：MCP 不是「裝越多越好」。每多裝一個，Claude 的工具選項就變多一點，回應速度也會掉一點。建議從 3-5 個日常用的開始，不熟悉的工具想用再裝。 CHAPTER 07 · TAKEAWAYS 早裝早享受 Figma 的擴充生態從 0 到三層分明，花了五年。Claude 16 個月就走完同樣的路。 這個速度差有意義。意思是設計師現在跳上車，是 2019 年「Figma Plugin 還只有 100 個」那種早期紅利。你現在熟悉的工作流會變成兩年後業界的標配。 擴充剛開始流行時，沒裝的人會說「我手動處理也很快」。MCP 跟 Skills 現在也一樣。但工具不會等你準備好。設計師圈幾個月後就會有人開始講「我寫一個 prompt 它跨四個 app 處理完，還會自動把成品丟回 Notion 排版」，到那時候才開始裝就晚了。 裝吧。七個。十分鐘搞定。 SUBSCRIPTION · AIWAKEN AI 覺醒設計應用攻略 AI 工具每週都在更新，我幫你過濾雜訊，只整理對設計師真正有用的應用。 ✦ AI 工具實測與工作流 ✦ 設計師角度 Prompt 技巧 ✦ 每週 AI × 設計新知 了解訂閱方案 → FAQ · 常見問題 關於 Claude 三大目錄，設計師最常問的五個問題 Q1：Skills、Connectors、Plugins 到底差在哪？ Skills 是教 Claude 怎麼做事的 SOP 包；Connectors 是讓 Claude 連到外部 app（MCP 協議）；Plugins 是把前兩者打包成單一可安裝的職能套件。三類各管一件事，但功能會疊加——一個 Plugin 內含多個 Skills 跟 Connectors 是正常狀況。 Q2：免費 Claude 用戶能不能裝這三類？ Connectors 的 4/28 那批 9 個 creative connectors（含 Adobe）官方確認 free plan 也能用。Skills 需要 Pro 以上，且要開 code execution。Plugins 大部分需要 Pro，企業版 Plugin 需要 Team / Enterprise。預算有限的話，先從免費的 Adobe Connector 開始試手感。 Q3：MCP 安全嗎？我給 Claude 我的 Google Drive 不會被偷看吧？ Connector 走 OAuth，跟你授權任何第三方 app 連 Google Drive 是同樣機制。每個 connector 有自己的權限範圍（read-only 還是 read-write），裝的時候 Anthropic 會列出來。Claude 不會把你的資料拿去訓練模型，這是 Anthropic 的官方政策。但你還是要看清楚每個 connector 要的權限，跟看 App Store 權限請求一樣的態度。 Q4：Skill 跟 Figma 的 Auto Layout 真的可以這樣類比嗎？ 類比抓的是「規則包」這層意思——兩者都是教軟體「遇到 X 情境該怎麼處理」。但實際機制不同：Auto Layout 是 Figma 內建的版面引擎；Skill 是動態載入的 Markdown 指令，會被 Claude 模型「讀進去」當作 prompt 的一部分。類比方便理解，但不要當技術等價。 Q5：Plugin 跟 Cowork 是什麼關係？我沒用 Cowork 還是能裝 Plugin 嗎？ Plugin 概念是隨 Cowork 一起發的，但現在三個 Claude 介面（網頁、Desktop、Cowork）都支援。Claude.ai 網頁版用戶直接從 Customize → Plugins 安裝即可。Cowork 比較強的地方是 Plugin 可以調用本機檔案、跑長時間 agent，網頁版受限於沙盒環境。