VibeCoding

【Vibe Coding】Claude Skills 新手教學：讓 AI 助手學會你的工作方式

Claude 新功能 Skills，教 AI 學會你的工作流程，從品牌設計到程式開發，打造個人化 AI 助手。

什麼是 Skills？一個比喻讓你秒懂

簡單來說

想像一下，你剛雇用了一位新員工（Claude）。這位員工很聰明，但不了解你公司的具體工作流程。Skills 就像是給新員工的「工作手冊」，告訴他：

公司的品牌顏色是什麼
報告要用什麼格式寫
跟客戶溝通要用什麼語氣
特定任務的標準操作流程

技術定義

Skills（技能） 是一個包含指令、腳本和資源的資料夾，Claude 可以動態載入這些內容，來提升在特定任務上的表現。

專有名詞解釋：

動態載入：意思是 Claude 不會一次把所有 Skills 都讀進去，而是根據你的需求，自動挑選需要的 Skill 來使用
腳本（Script）：就是一段程式碼，可以自動執行某些操作
資源（Resources）：包括文件、圖片、範本等參考資料

Skills 能幫你做什麼？實際應用場景

企業應用

品牌一致性
- 自動套用公司的品牌顏色、字體、Logo 位置
- 範例：「幫我做一份 Q3 報告的 PPT，用公司的品牌風格」
標準化文件
- 自動產生符合公司格式的會議記錄、狀態報告
- 範例：「寫一份給客戶的週報，用我們的標準格式」
工作流程自動化
- 在專案管理工具（JIRA、Asana）中按照團隊慣例建立任務
- 執行公司特定的數據分析流程

創意設計

生成式藝術：使用 p5.js 創作藝術作品
設計規範：按照設計哲學創建視覺素材
動畫製作：製作符合 Slack 尺寸限制的 GIF

技術開發

程式碼測試：用 Playwright 測試網頁應用
文件處理：創建和編輯 Excel、Word、PowerPoint、PDF
API 整合：建立 MCP 伺服器連接外部服務

個人應用

自訂你的工作流程
讓 Claude 配合你的習慣工作

Skills 的三大類型

Anthropic 官方 Skills（內建技能）

什麼是 Anthropic？ Anthropic 就是開發 Claude 的公司。

這些是 Anthropic 官方開發和維護的 Skills，包括：

Excel 試算表創建和處理
Word 文件專業製作
PowerPoint 簡報生成
PDF 創建和處理

使用方式：開啟「程式碼執行」功能後，Claude 會在需要時自動使用，你不用特別叫它。

自訂 Skills（Custom Skills）

你或你的組織自己創建的 Skills，用於：

專門的工作流程
特定領域的任務
公司內部的標準化作業

社群 Skills（Community Skills）

由其他使用者或合作夥伴創建的 Skills，例如：

Notion Skills：教 Claude 更好地使用 Notion
GitHub 上的開源範例

如何在 Claude 中使用 Skills

誰可以使用？

還想看更多嗎？完整內容只對註冊用戶開放喔！
點下方的免費 Subscribe，馬上加入我們～

Skills 功能適用於：

Pro 方案用戶
Max 方案用戶（最高級個人方案）
Team 方案（團隊方案）
Enterprise 方案（企業方案）
Claude Code 用戶（Beta 測試中）
API 用戶

啟用 Skills 的步驟

在 Claude.ai 網站上

前往設定頁面
- 點擊右上角頭像
- 選擇「Settings」（設定）
- 點擊「Capabilities」（功能）
開啟必要功能
- 確保「Code execution and file creation」（程式碼執行和文件創建）已開啟
- 這是使用 Skills 的前提條件
啟用 Skills
- 捲動到「Skills」區塊
- 用開關按鈕開啟你想用的 Skills
上傳自訂 Skills
- 點擊「Upload skill」按鈕
- 上傳包含你 Skill 資料夾的 ZIP 檔案

在 Claude Code 中

# 1. 添加 Skills 市集（Marketplace）
/plugin marketplace add anthropics/skills

# 2. 安裝文件處理 Skills
/plugin install document-skills@anthropic-agent-skills

# 3. 安裝範例 Skills
/plugin install example-skills@anthropic-agent-skills

使用範例：

"用 PDF Skill 從 documents/form.pdf 中提取表單欄位"

透過 API 使用

參考官方文件：Skills API 快速開始

自己動手做：創建第一個 Skill

Skill 的基本結構

一個 Skill 就是一個資料夾，裡面至少要有一個 SKILL.md 檔案。

🎓

實作課程：Claude Code Podcast 自動剪輯實戰
想看一個完整、可直接複用的 Skill 案例？這堂課會提供 Podcast 剪輯 Skill，示範如何把逐字稿判斷、剪輯清單與執行流程整理成固定工作方式。
查看 Claude Code Podcast 自動剪輯實戰課程

檔案結構範例

my-brand-skill/          ← 資料夾名稱
├── SKILL.md            ← 核心檔案（必需）
├── resources/          ← 資源資料夾（選用）
│   ├── logo.png
│   └── color-palette.pdf
└── scripts/            ← 腳本資料夾（選用）
    └── format-doc.py

SKILL.md 檔案內容

---
name: company-brand-guidelines
description: 將公司品牌色彩和字體應用到所有簡報和文件中
version: 1.0.0
---

# 公司品牌指南 Skill

## 概述
這個 Skill 提供我們公司的官方品牌指南，用於創建一致且專業的文件。
當製作簡報、文件或行銷素材時，請套用這些標準。

## 品牌顏色

我們的官方品牌色彩包括：
- **主色**：#FF6B35（珊瑚紅）
- **次色**：#004E89（海軍藍）
- **強調色**：#F7B801（金黃色）
- **中性色**：#2E2E2E（炭灰色）

## 字體規範

- **標題**：Montserrat Bold（蒙特塞拉特粗體）
- **內文**：Open Sans Regular（Open Sans 常規體）
- **字體大小指引**：
  - H1 大標題：32pt
  - H2 副標題：24pt
  - 內文：11pt

## Logo 使用規則

- 在淺色背景上使用全彩 Logo
- 在深色背景上使用白色 Logo
- Logo 周圍至少保持 0.5 英吋的留白空間

## 何時套用此 Skill

請在創建以下內容時套用品牌指南：
- PowerPoint 簡報
- 對外分享的 Word 文件
- 行銷素材
- 客戶報告

## 參考資源

更多細節請參閱 resources 資料夾中的 Logo 檔案和字體下載。

必填欄位說明

YAML 前置資料（Frontmatter）：用 --- 包起來的那段

---
name: skill-name              # 技能名稱（小寫，用連字符）
description: 清楚描述這個 Skill 的用途  # Claude 用這個判斷何時使用
---

專有名詞解釋：

YAML：一種簡單的資料格式，用冒號分隔名稱和值
Frontmatter：檔案開頭的設定區塊

打包你的 Skill

確認資料夾名稱 與 Skill 名稱一致
壓縮成 ZIP 檔
檢查 ZIP 結構：確保資料夾是 ZIP 的根目錄

正確結構：

my-skill.zip
└── my-skill/
    └── SKILL.md

錯誤結構：

my-skill.zip
└── SKILL.md    ← 錯誤！缺少資料夾層級

進階技巧：讓你的 Skill 更強大

漸進式揭露（Progressive Disclosure）

這是 Skills 的核心設計原則。什麼意思？

想像一本教科書：

目錄（第一層）→ Skill 的 name 和 description
章節內容（第二層）→ SKILL.md 的完整內容
附錄詳細資料（第三層）→ 其他參考檔案

Claude 只會在需要時逐層讀取，不會一次把所有內容塞進記憶體。

添加參考檔案

當 SKILL.md 內容太多時：

my-skill/
├── SKILL.md              ← 核心指引
├── REFERENCE.md          ← 詳細參考資料
├── advanced-features.md  ← 進階功能說明
└── examples/
    ├── example1.md
    └── example2.md

在 SKILL.md 中這樣引用：

## 進階功能

需要了解進階功能時，請參考 `advanced-features.md` 檔案。

## 實際案例

查看 `examples/` 資料夾中的範例。

添加可執行腳本

有些任務用程式碼執行

範例：PDF 表單欄位提取

# scripts/extract_pdf_forms.py
import PyPDF2

def extract_form_fields(pdf_path):
    """提取 PDF 中的所有表單欄位"""
    with open(pdf_path, 'rb') as file:
        pdf = PyPDF2.PdfReader(file)
        fields = pdf.get_fields()
        return fields

在 SKILL.md 中說明：

## 工具

### 提取 PDF 表單欄位

使用 `scripts/extract_pdf_forms.py` 腳本來提取 PDF 表單欄位。

用法：
```bash
python scripts/extract_pdf_forms.py path/to/form.pdf


---

## 實戰案例：從 Anthropic 官方範例學習

### 🎨 創意類 Skills

#### 1. **algorithmic-art**（演算法藝術）
- **用途**：用 p5.js 創作生成式藝術
- **功能**：種子隨機性、流場、粒子系統
- **適合誰**：藝術家、設計師、創意工作者

#### 2. **slack-gif-creator**（Slack GIF 製作器）
- **用途**：創建符合 Slack 尺寸限制的動畫 GIF
- **功能**：自動優化檔案大小
- **適合誰**：需要製作團隊溝通素材的人

### 💼 企業類 Skills

#### 1. **brand-guidelines**（品牌指南）
- **用途**：自動套用 Anthropic 的品牌色彩和字體
- **功能**：確保品牌一致性
- **適合誰**：行銷團隊、設計師

#### 2. **internal-comms**（內部溝通）
- **用途**：撰寫內部溝通文件
- **包括**：狀態報告、電子報、常見問題解答
- **適合誰**：專案經理、團隊領導

#### 3. **theme-factory**（主題工廠）
- **用途**：為 Artifacts 套用 10 種預設專業主題
- **功能**：也可以即時生成自訂主題
- **適合誰**：需要快速製作專業視覺內容的人

### 🔧 技術類 Skills

#### 1. **artifacts-builder**（組件建構器）
- **用途**：使用 React、Tailwind CSS、shadcn/ui 建立複雜的 HTML artifacts
- **適合誰**：前端開發者

#### 2. **webapp-testing**（網頁測試）
- **用途**：用 Playwright 測試本地網頁應用
- **功能**：UI 驗證和除錯
- **適合誰**：QA 測試人員、開發者

#### 3. **mcp-builder**（MCP 建構器）
- **用途**：創建高品質的 MCP 伺服器
- **功能**：整合外部 API 和服務
- **適合誰**：後端開發者

**專有名詞解釋：**
- **MCP（Model Context Protocol）**：一個協定，讓 Claude 可以連接外部服務和資料來源
- **Artifacts**：Claude 在對話中產生的可互動內容（如網頁、圖表等）

### 📄 文件處理 Skills（Anthropic 官方）

這些是實際用於 Claude 生產環境的 Skills：

1. **DOCX Skill**
   - 創建、編輯、分析 Word 文件
   - 支援修訂追蹤、註解、格式保留

2. **PDF Skill**
   - 提取文字和表格
   - 創建、合併、拆分 PDF
   - 處理表單

3. **PPTX Skill**
   - 創建、編輯 PowerPoint 簡報
   - 支援版面配置、範本、圖表

4. **XLSX Skill**
   - 創建、編輯 Excel 試算表
   - 支援公式、格式化、數據分析

⚠️ **注意**：這些文件 Skills 是時間點快照，主要作為參考範例，展示如何處理複雜的二進位檔案格式。

---

## Skills vs. 其他 Claude 功能

### 🆚 Skills vs. Projects（專案）

| 特性 | Skills | Projects |
|------|--------|----------|
| **載入方式** | 動態載入（需要時才用） | 靜態載入（永遠在背景） |
| **用途** | 特定任務的程序知識 | 背景知識和情境資訊 |
| **適用範圍** | 整個 Claude 平台 | 只在該專案內 |
| **比喻** | 工作手冊 | 專案資料夾 |

### 🆚 Skills vs. MCP

| 特性 | Skills | MCP |
|------|--------|-----|
| **功能** | 提供指令和工作流程 | 連接外部服務和資料 |
| **類型** | 程序性知識（怎麼做） | 工具和資料存取 |
| **可以合用** | ✅ 可以！ | Skills 教 Claude 如何使用 MCP 工具 |

### 🆚 Skills vs. Custom Instructions（自訂指令）

| 特性 | Skills | Custom Instructions |
|------|--------|---------------------|
| **範圍** | 任務特定 | 適用所有對話 |
| **啟用方式** | 需要時自動啟用 | 永遠啟用 |
| **適合場景** | 專門工作流程 | 一般性偏好設定 |

---

## 常見問題與疑難排解

### ❓ 看不到 Skills 功能？

**解決方法：**
1. 確認你是付費用戶（Pro/Max/Team/Enterprise）
2. 檢查「程式碼執行」功能是否已開啟
3. 企業用戶：聯絡管理員確認組織層級是否已啟用

### ❓ Claude 沒有使用我的 Skill？

**可能原因和解決方法：**

1. **Skill 沒有開啟**
   - 檢查：設定 > Capabilities > Skills 區塊
   - 確認開關是開啟狀態

2. **描述不夠清楚**
   - Claude 用 description 判斷何時使用
   - 改進：明確說明使用時機
   - 範例：
     - ❌ 模糊：「處理文件」
     - ✅ 清楚：「當需要創建符合公司品牌的 PowerPoint 簡報時使用」

3. **指令不夠明確**
   - 試著在提問時明確提到 Skill
   - 範例：「用品牌指南 Skill 來做這份簡報」

### ❓ 上傳 Skill 失敗？

**常見原因：**

1. **ZIP 檔案太大**
   - 檢查檔案大小限制
   - 移除不必要的大檔案

2. **資料夾名稱不符**
   - 資料夾名稱必須與 Skill name 一致

3. **缺少 SKILL.md**
   - 確保根目錄有 SKILL.md 檔案

4. **名稱中有無效字元**
   - 只用小寫字母、數字、連字符（-）

### ❓ Skills 顯示為灰色無法使用？

**解決方法：**
- 檢查「程式碼執行」是否啟用
- 企業/團隊用戶：確認組織管理員已啟用 Skills
- 個人用戶：在設定中手動開啟

---

## 最佳實踐：打造優質 Skill 的秘訣

### ✅ 1. 從簡單開始

**新手建議：**
- 先從幾行簡單指令開始
- 測試成功後再逐步添加功能
- 不要一開始就想做複雜的 Skill

### ✅ 2. 專注單一任務

**好的做法：**
- 一個 Skill 做好一件事
- 創建多個專注的 Skills，而非一個萬能 Skill

**範例：**
- ✅ 分開：「品牌顏色 Skill」+「報告格式 Skill」
- ❌ 合併：「公司所有標準 Skill」（太龐雜）

### ✅ 3. 寫清楚的描述

**description 欄位是關鍵！**

**好的描述範例：**
```yaml
description: 當需要創建符合 Acme 公司品牌指南的 PowerPoint 簡報時使用，自動套用官方色彩、字體和 Logo

不好的描述範例：

description: 品牌工具  # 太模糊！

4. 提供範例

在 SKILL.md 中加入：

## 使用範例

### 範例 1：創建品牌簡報
輸入：「做一份 Q3 業績報告的 PPT」
輸出：自動套用品牌色彩和字體的專業簡報

### 範例 2：格式化文件
輸入：「把這份文件改成公司格式」
輸出：套用標準頁首、頁尾和排版

5. 版本控制

追蹤你的 Skills 版本：

---
name: brand-guidelines
description: 品牌指南
version: 1.2.0    # 主版本.次版本.修訂版本
---

版本號規則建議：

1.0.0 → 首次發布
1.1.0 → 新增功能
1.1.1 → 修正錯誤
2.0.0 → 重大改版

6. 測試再測試

測試清單：

[ ] 上傳前在本地檢查語法
[ ] 上傳後用不同提問測試
[ ] 觀察 Claude 的「思考過程」（如果可見）
[ ] 確認 Skill 在預期時機被啟用
[ ] 測試邊界案例（極端情況）

7. Skills 可以互相配合

強大的組合範例：

「品牌指南 Skill」+「簡報製作 Skill」
「資料分析 Skill」+「圖表視覺化 Skill」

Claude 可以自動判斷需要用哪幾個 Skills 來完成任務！

安全性注意事項

重要警告

只安裝來自可信來源的 Skills！

風險類型

提示注入（Prompt Injection）
- 惡意 Skill 可能操縱 Claude 執行非預期動作
資料外洩
- 惡意程式碼可能竊取資料
不安全的套件
- Skill 中的腳本可能安裝惡意軟體套件

保護措施

審查來自不可信來源的 Skills：

✅ 檢查清單：
1. 閱讀所有檔案內容
2. 檢查程式碼相依性（dependencies）
3. 注意連接外部網路的指令
4. 查看是否要求安裝額外套件
5. 確認 Skill 的實際功能與描述相符

安全最佳實踐：

❌ 不要在 Skill 中寫入 API 金鑰或密碼
❌ 不要下載來源不明的 Skills
✅ 定期審查已安裝的 Skills
✅ 使用 MCP 連接外部服務（更安全）

進一步學習資源

官方文件

Claude 說明中心

技術文件

開發者資源

總結：Skills 的未來

Anthropic 的發展計畫

根據官方部落格，未來的 Skills 將會：

自動創建
- Claude 可以在對話中自動生成 Skills
- 把成功的做法自動整理成可重用的 Skill
更好的分享
- 組織內部更容易分享 Skills
- 可能出現 Skills 市集
與 MCP 深度整合
- Skills 教 Claude 如何使用 MCP 工具
- 更強大的工作流程組合
AI 自我改進
- Claude 可以自己編輯和評估 Skills
- 將行為模式編碼成可重用能力

為什麼 Skills 很重要？

三個關鍵優勢：

可組合性: 像樂高積木一樣組合功能，不需要為每個用例建立客製化 AI
可擴展性: 不受限於上下文窗口大小，使用漸進式揭露技術
可移植性: Skills 是簡單的檔案和資料夾，容易分享、版本控制、備份

想讓 AI 成為你團隊的一員？

💡

如果你希望從 side project 邁向產品化實作，將「AI + 程式」變成真正的解決方案核心，而不是只停留在玩玩工具的階段，那你一定要深入了解 Vibe Coding 導入服務如何協助團隊實現目標。

立即了解導入案例