模型選擇指南
Sonnet / Opus / Haiku 各自適合什麼？
基礎工具與功能
Connectors / Projects / Research Mode
進階工具介紹
Skills / Cowork / Plugins / Claude Code
多數日常任務
Sonnet — 日常主力夥伴
快速、能幹、CP 值高。寫作、分析、整理資料、發想創意、日常任務，大部分的對話都應該在這裡發生。
複雜任務
Opus — 深度思考者
Claude 最強智能模型。財務分析、長篇研究、複雜程式碼、複雜任務。可搭配 Extended Thinking 使用，觀察它的推理過程。
簡單任務
Haiku — 速度型選手
快速、輕量、免費可用。適合快速查詢、簡單分類、輕量編輯。
內容參考整理自 @ZHUSTUDIO / AI Edge on X
建議優先設定
Connectors — 讓 Claude 連接你常用的工具
連上 Notion、Slack、Google Calendar 等，不需要另外打開其他視窗，在對話裡就能查行程、找文件、發訊息。
Customize → Connectors
建議優先設定
Projects — 你在 Claude 裡的專屬工作室
把相關的檔案、文件、背景資料都上傳進去，且只需設定一次，不論之後開多少對話，全部都共享同一個背景脈絡。
左側導覽列 → Projects
Custom Styling — 自訂你的寫作風格
選預設風格或把自己的寫作習慣餵給它，每次回覆都會更像你想要的語氣。
主介面 → 對話框左下角選 + 號 → Use Style
內容參考整理自 @ZHUSTUDIO / AI Edge on X
Claude Skills — 指令和工作流程一次設定
把常用知識、規則、流程整理成可重複使用的能力模組。適合固定語氣、輸出格式、任務步驟與專業背景。
品牌文案風格統一
固定簡報架構
特定產業知識整理
重複性工作流程自動化
Customize → Skills
需 Pro 方案或以上
Cowork Plugins — 角色化自動化
將 Skills、Connectors 與 Sub-agents 整合單一套件，讓 Cowork 能依任務需求展開更完整的操作流程與角色分工。
將多種能力整合成單一插件
涵蓋行銷、法律、財務等領域
開箱即用
已內建多個可直接使用
桌面版 Claude 應用程式 → Customize → Plugins
需 Pro 方案或以上
Claude Cowork — 最接近「AI 自動幫你做事」的功能
在背景執行、自主存取檔案、排程任務，你只需要設定好，剩下交給它。
背景自主執行任務
建立與管理 Plugins
排程工作流程
支援複雜多步驟任務
桌面版 Claude 應用程式 → Cowork
需 Pro 方案或以上
Claude Code — 最強 AI 程式開發工具
從補全到建構，寫程式、建網站、除錯，整個開發流程都能處理。
寫程式、建網站
理解整個專案結構
除錯與錯誤處理
支援多種語言與框架
桌面版 Claude 應用程式 → Claude Code
內容參考整理自 @ZHUSTUDIO / AI Edge on X
CLI 安裝與設定
安裝 Claude Code、CLAUDE.md 設定檔
Vibe Coding 工作流
用自然語言驅動程式碼產出的完整流程
搭配 Figma MCP
設計稿轉前端的關鍵連接與常見問題
安裝 Claude Code
npm install -g @anthropic-ai/claude-code
claude --version
claude
CLAUDE.md — 專案設定檔
在專案根目錄放一個 CLAUDE.md，Claude Code 每次啟動時自動讀取，等於幫專案設定好背景脈絡。
專案：玉山銀行信貸購車活動頁
技術：HTML + CSS + jQuery
設計稿：Figma 連結（透過 Figma MCP 讀取）
規範：
- 使用 BEM 命名
- Mobile First 響應式
- 主色 #86A697
- 繁體中文，台灣用語
常用 Slash Commands
/init 初始化 CLAUDE.md
/clear 清除對話紀錄
/compact 壓縮對話記憶
/cost 查看目前用量
/doctor 診斷連線問題
/plugin 管理插件
所謂 Vibe Coding，就是用自然語言描述你想要的東西，讓 AI 幫你寫程式碼。以下是設計師的典型流程：
cd ~/projects/loan-landing-page
claude
> 請讀取 Figma 連結裡的 page3 frame，
轉換成 HTML + CSS 頁面，
使用 jQuery 做 tab 切換，
圖片先用 placeholder。
> 把標題字體改大一點，按鈕顏色改成 #86A697
> 幫我整理程式碼，加上註解
安裝 Figma MCP 後，Claude Code 可以直接讀取 Figma 設計檔案的結構與樣式，是設計轉前端的關鍵連接。
> 請讀取這個 Figma 連結
https://www.figma.com/file/xxxxx
把 "Hero Section" frame 轉成 HTML
常見踩坑：如果出現「enterprise plan required」錯誤，通常是環境變數中有衝突的 ANTHROPIC_API_KEY。請先執行 unset ANTHROPIC_API_KEY 再重試。
Gemini
Gemini API 與 Gemini CLI 使用指南 — 即將上線
Antigravity
Antigravity 圖形化 Figma 轉前端工具指南 — 即將上線