# Sketchry 與 Anthropic 的 frontend-design

> Anthropic 免費的 frontend-design Skill 給的是設計判斷，Sketchry 給的是做好的版型。差在哪、什麼時候該用哪一個。

原始網頁: https://sketchry.app/zh/compare/anthropic-frontend-design/

Anthropic 的 frontend-design 是一份免費的設計指引，它教 Claude 怎麼做視覺判斷，每次的結果都不一樣；Sketchry 的每一份 Skill 是一個已經決定好的版型，成品長什麼樣在頁面上先看得到。兩份都是純文字，可以同時留著。

## 一張表看完

項目Sketchryfrontend-design
價格月訂 US$6 起，終身 US$99免費，放在 anthropics/claude-code 這個公開倉庫裡它給你的是什麼一份做好的版型：區塊順序、字體、動態與檢查項目都定好了設計判斷：先想一版設計計畫（4 到 6 個色票、字體角色、版面概念），檢討過再開始寫程式每次跑出來一樣嗎一樣的結構，換成你的內容刻意不一樣，它要求每個案子有自己的視覺方向先看得到成品嗎可以，每一份都有成品圖，部分有不用登入的線上示範沒有成品可看，它是一份指引文件適用範圍網站、簡報、行銷影片與 App 設計，共 71 份任何前端介面，包含後台、設定頁這些沒有版型可套的東西附素材嗎部分附素材包與示範文案沒有。整個插件就是一份 SKILL.md、一個 README 與一個設定檔

2026-10-15 查核，對方的數字來自下面列出的頁面。

## Sketchry 做不到的事

- 要付錢，而 Anthropic 那一份不用
- 一份 Skill 等於一個方向，想要完全為你量身的視覺，它不是答案
- 只涵蓋網站、簡報、影片與 App 畫面，後台與設定頁這類東西沒有版型

## frontend-design 的限制

- 它給的是判斷，不是成品：跑完之前不知道會長什麼樣
- 同一句話跑兩次會得到兩個不同的設計，要重現上一次很難
- 沒有素材、沒有示範文案，內容還是要自己準備

## 誰該選哪一個

- 要做的東西沒有現成版型（後台、設定頁、工具介面），或你本來就要一個獨一無二的方向，用 Anthropic 的 frontend-design。
- 要做的是一個形狀已經很清楚的東西（產品單頁、餐廳網站、作品集、募資簡報），用 Sketchry 比較快，而且你先看得到成品。

## 一起用，或換過來

- 兩份可以同時留著，它們回答的是不同的問題，不會互相覆蓋。
- 常見做法是：網站用 Sketchry 的版型，App 畫面或後台交給 frontend-design。

## 資料來源

下面每一個數字都是 2026-10-15 當天在對方自己的頁面上讀到的。讀不到的就不寫。

- [github.com/anthropics/claude-code · plugins/frontend-design](https://github.com/anthropics/claude-code/tree/main/plugins/frontend-design) · 查核日 2026-10-15
- [frontend-design SKILL.md](https://raw.githubusercontent.com/anthropics/claude-code/main/plugins/frontend-design/skills/frontend-design/SKILL.md) · 查核日 2026-10-15
- [frontend-design README.md](https://raw.githubusercontent.com/anthropics/claude-code/main/plugins/frontend-design/README.md) · 查核日 2026-10-15

最後更新: 2026-10-15
