wehub-resource-sync
881 lines
61 KiB
Markdown
881 lines
61 KiB
Markdown
<!-- WEHUB_ZH_README -->
|
||
> [!NOTE]
|
||
> 本文档由 WeHub 基于上游 README 翻译整理，属于社区翻译，非官方中文文档。
|
||
> [English](./README.en.md) · [原始项目](https://github.com/rampstackco/claude-skills) · [上游 README](https://github.com/rampstackco/claude-skills/blob/HEAD/README.md)
|
||
> 原作者、版权与许可证归属以原始项目及本仓库 LICENSE 文件为准。
|
||
|
||
<div align="center">
|
||
|
||
<img src="docs/rampstack-complete-banner.jpg" alt="覆盖完整 Web 生命周期的 Claude 技能。构建、发布、审计、优化。" />
|
||
|
||
# Claude 品牌构建技能
|
||
|
||
**一套完整且立场鲜明的 [Claude Skills](https://docs.claude.com/en/docs/agents-and-tools/agent-skills/overview) 库，覆盖品牌与网站从构建、上线、运营到增长的完整生命周期。**
|
||
|
||
[](LICENSE)
|
||
[](CONTRIBUTING.md)
|
||
[](#the-103-skill-catalog)
|
||
[](https://claude.ai)
|
||
|
||
[](https://rampstack.co)
|
||
[](https://linkedin.com/company/rampstack/)
|
||
[](https://x.com/RampStackco)
|
||
[](https://facebook.com/rampstack)
|
||
|
||
</div>
|
||
|
||
<!-- COUNT_INTRO:START -->
|
||
> 103 个与技术栈无关的技能，涵盖品牌、设计、内容、SEO、开发、运维、增长与研究。包含由 Ahrefs MCP 驱动的 SEO 审计套件。可在 Next.js、WordPress、Shopify、Webflow、纯 HTML 或任何其他环境中使用。
|
||
<!-- COUNT_INTRO:END -->
|
||
|
||
*收录于 [awesome-claude-skills](https://github.com/ComposioHQ/awesome-claude-skills) 的 Business & Marketing 分类。*
|
||
|
||
---
|
||
|
||
## 在 Claude Code 中安装
|
||
|
||
添加 marketplace，然后安装你需要的插件：
|
||
|
||
```
|
||
/plugin marketplace add rampstackco/claude-skills
|
||
|
||
# full catalog (103 skills)
|
||
/plugin install rampstack-skills@rampstack
|
||
|
||
# focused subsets
|
||
/plugin install rampstack-starter@rampstack
|
||
/plugin install rampstack-seo@rampstack
|
||
/plugin install rampstack-pm@rampstack
|
||
```
|
||
|
||
更倾向于只列出精选子集（不含完整目录）的轻量 marketplace？请改用 `rampstackco/plugins`，并从那里安装相同的三个插件：
|
||
|
||
```
|
||
/plugin marketplace add rampstackco/plugins
|
||
/plugin install rampstack-starter@rampstack
|
||
```
|
||
|
||
技能按需加载：每个技能在 Claude 需要之前，大致只会贡献其名称和描述。
|
||
|
||
---
|
||
|
||
## 目录
|
||
|
||
- [什么是 Claude Skills？](#what-are-claude-skills)
|
||
- [本库包含什么](#what-is-in-this-library)
|
||
- [精选技能](#featured-skills)
|
||
- [实际效果](#see-it-in-action)
|
||
- [Logo 设计实战](#logo-design-in-action)
|
||
- [参考构建实战](#reference-build-in-action)
|
||
- [入门指南](#getting-started)
|
||
- [快速示例](#quick-example)
|
||
- [技能如何组合](#how-they-compose)
|
||
- [目录如何关联](#how-the-catalog-connects)
|
||
- [使用场景](#surfaces)
|
||
<!-- COUNT_TOC:START -->
|
||
- [103 个技能目录](#the-103-skill-catalog)
|
||
<!-- COUNT_TOC:END -->
|
||
- [推荐的 MCP](#recommended-mcps)
|
||
- [编写约定](#authoring-conventions)
|
||
- [仓库结构](#repository-structure)
|
||
- [信任与安全](#trust-and-security)
|
||
- [贡献指南](#contributing)
|
||
- [致谢](#acknowledgments)
|
||
- [资源](#resources)
|
||
- [许可证](#license)
|
||
|
||
---
|
||
|
||
## 什么是 Claude Skills？
|
||
|
||
Claude Skills 是可复用的能力包，它们教会 Claude 如何用一致的框架、术语和输出格式来处理特定类型的任务。每个技能是一个文件夹，其中包含 `SKILL.md`（指令加 YAML 元数据）以及可选的参考文件（模板、检查清单、示例）。当用户请求与技能描述匹配时，Claude 会自动加载该技能。
|
||
|
||
技能可在 [Claude.ai](https://claude.ai),、[Claude Code](https://docs.claude.com/en/docs/claude-code/overview), 和 [Anthropic API](https://docs.claude.com/en/api/agent-skills). 上使用。编写一次技能后，即可在三者之间移植。
|
||
|
||
官方深入阅读，请参阅 [Anthropic 的 Agent Skills 文档](https://docs.claude.com/en/docs/agents-and-tools/agent-skills/overview).
|
||
|
||
---
|
||
|
||
## 本库包含什么
|
||
|
||
这不是对他人技能的精选列表。它是一个统一的、有明确取向的库，其中每个技能都遵循相同的结构和约定，因此技能可以在真实项目生命周期中顺畅地组合使用。
|
||
|
||
你将获得：
|
||
|
||
<!-- COUNT_WHATYOUGET:START -->
|
||
- **103 个技能**，分布在 16 个类别中，每个技能都配有完整的 `SKILL.md` 和至少一个参考文件
|
||
- **490 个参考文件**（模板、检查清单、决策矩阵、示例）
|
||
<!-- COUNT_WHATYOUGET:END -->
|
||
- **与技术栈无关。** 适用于任何 Web 技术栈。唯一点名工具的例外是 SEO 审计套件，它假定使用 Ahrefs MCP。
|
||
- **面向未来。** 原则优先于工具。稳定概念优先于流行技巧。引用持久规范（W3C、WHATWG、Schema.org、MDN、NN/g、WCAG），而非随每次算法更新而过时的内容。
|
||
- **统一结构。** 每个技能使用相同的章节顺序、相同的语气和相同的编写约定。输入可预期，输出也可预期。
|
||
- **可组合。** 技能之间相互引用。`creative-brief` 指向 `brand-voice`。`incident-response` 指向 `monitoring-and-alerting`。每个技能的「When NOT to use」会告诉你哪项相邻工作更适合由哪个同级技能承担。
|
||
|
||
重点类别：品牌策略与识别、设计系统、内容生产（完整覆盖 Tier 1 与 Tier 2）、完整 SEO 套件（基础部分加上由 Ahrefs MCP 驱动的审计套件）、产品管理（含实验与缺口补齐 track）、面向互动式 Web 工具的增长工具、付费媒体规范、前端开发与无障碍、性能与 QA、发布与事故运维、UX 研究，以及一个教你如何编写自有技能的原技能（meta-skill）。
|
||
|
||
---
|
||
|
||
## 精选技能
|
||
|
||
<!-- FEATURED_SKILLS:START -->
|
||
六个入口技能，每个受众 track 各一个。可单独运行其中任意一个，也可与目录中的其余技能组合使用。
|
||
|
||
| 技能 | 作用 |
|
||
|---|---|
|
||
| [`creative-direction`](skills/creative-direction/SKILL.md)（品牌与创意） | 四轴 brief（语气、美学、受众、感官野心），为所有下游技能提供连贯方向 |
|
||
| [`experiment-design`](skills/experiment-design/SKILL.md)（PM，实验） | 从假设到决策：样本量、持续时间、分群分析，以及会导致错误上线决策的失败模式 |
|
||
| [`feature-launch-playbook`](skills/feature-launch-playbook/SKILL.md)（PM，缺口补齐） | 妥善发布一项功能的规范：定位、内部对齐、客户沟通、赋能、 rollout、监控 |
|
||
| [`pillar-content-architecture`](skills/pillar-content-architecture/SKILL.md)（内容） | 枢纽-集群式主题权威：支柱选题、集群规划、内链、更新规范 |
|
||
| [`landing-page-copy`](skills/landing-page-copy/SKILL.md)（营销） | 落地页、销售页，以及从 hero 到 CTA 的高转化文案流程 |
|
||
| [`funnel-flow-architecture`](skills/funnel-flow-architecture/SKILL.md)（增长工具） | 跨工具转化流程架构，匹配受众与漏斗阶段 |
|
||
<!-- FEATURED_SKILLS:END -->
|
||
|
||
---
|
||
|
||
## 实际效果
|
||
|
||
<strong><a href="https://rampstack.co/showcase/creative-direction" target="_blank" rel="noopener">creative-direction 技能以实时 showcase 呈现 →</a></strong>
|
||
|
||
四十二个虚构品牌，均基于使用同一技能撰写的 brief 生成。每一个都是完整配样式的品牌站点，而非 mockup。该 showcase 展示了四轴框架在实践中能产生什么，并允许你按轴位置筛选，查看各组合如何呈现。
|
||
|
||
<p align="center">
|
||
<picture>
|
||
<source media="(max-width: 640px)" srcset="assets/showcase/creative-direction-highlight-mobile.jpg">
|
||
<img src="assets/showcase/creative-direction-highlight-desktop.jpg" alt="Creative Direction 技能亮点示意图。海军蓝标题卡片显示「Impactful Creative Direction」，副标题为「Direction for art, taste, and style」。下方四个象限展示：Framework Axes 4（Tone、Aesthetic、Relationship、Sensory）、Framework Positions 16（每个轴组合成 16 个不同位置）、Example Treatments 42（Pulse、Bloom、Forge、Observatory 及其他 38 个），以及 Possible Compositions infinity（Motion：Static、Light、Medium、High）。说明文字为「No templates, only guided outputs.」">
|
||
</picture>
|
||
</p>
|
||
|
||
<p align="center">
|
||
<img src="assets/showcase/showcase-grid-hero.png" alt="品牌原型展示网格，包含 Pulse、Volt、Anode、Drift 等，卡片上方有类型与动效强度筛选标签。" />
|
||
</p>
|
||
|
||
### 按任意轴位筛选
|
||
|
||
该 skill 定义了四个轴：tone（语气）、aesthetic（美学）、relationship（关系）、sensory（感官）。展示页允许你按任意组合筛选，并查看哪些示例与之匹配。预筛选 URL 可从 [SKILL.md](skills/creative-direction/SKILL.md) 和 [axes-explained reference](skills/creative-direction/references/axes-explained.md) 深度链接进入，便于你阅读某一轴位后直接跳转到对应的渲染示例。
|
||
|
||
<p align="center">
|
||
<img src="assets/showcase/showcase-filter-active.png" alt="展示网格按 Tone 等于 Provocative、Sensory 等于 Resonant 筛选，显示八张匹配的品牌卡片，轴位详情已自动展开。" />
|
||
</p>
|
||
|
||
### 空状态即启示
|
||
|
||
该框架是生成式的（generative）。展示页是说明性的（illustrative）。大多数罕见但有力的组合都是有效的创意选择，只是尚未被构建出来。将 Provocative + Editorial Restrained + Coach + Resonant 组合筛选后，网格将为空。
|
||
|
||
<p align="center">
|
||
<img src="assets/showcase/showcase-empty-state.png" alt="展示网格将四个轴位筛选均设为 Provocative、Editorial Restrained、Coach 和 Resonant，显示零个匹配示例及空状态文案：No example yet. The framework allows this combination, it just hasn't been built as one of the thirty worked examples." />
|
||
</p>
|
||
|
||
### 框架的表达广度
|
||
|
||
同一个 skill、同一份 brief 格式。四种完全不同的视觉体系。注意 Pulse 与 Bloom 占据相同的轴位，却呈现出截然相反的视觉语言。其余差异由参考品牌与美学诠释承担。
|
||
|
||
<table>
|
||
<tr>
|
||
<td width="50%"><img src="assets/showcase/archetype-pulse.png" alt="Pulse 音乐流媒体品牌。饱和渐变主视觉，标题为 'Sound that moves with you'，下方为粉青双色均衡器条形图。" /></td>
|
||
<td width="50%"><img src="assets/showcase/archetype-forge-fitness.png" alt="Forge 精品健身工作室。深色工业风主视觉，强烈字体与激励文案。" /></td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Pulse</strong> · music streaming<br/><em>Sound that moves with you.</em><br/>Playful / Expressive Maximalist / Companion / Resonant<br/><a href="https://rampstack.co/showcase/creative-direction/pulse-music" target="_blank" rel="noopener">查看 Pulse 演示示例 →</a></td>
|
||
<td><strong>Forge</strong> · boutique fitness<br/><em>Show up. Get hammered.</em><br/>Provocative / Expressive Maximalist / Coach / Resonant<br/><a href="https://rampstack.co/showcase/creative-direction/forge-fitness" target="_blank" rel="noopener">查看 Forge 演示示例 →</a></td>
|
||
</tr>
|
||
<tr>
|
||
<td><img src="assets/showcase/archetype-bloom-soda.png" alt="Bloom 适应原苏打水品牌。桃色渐变主视觉，三色标题 'Soda that loves you back'，配草莓环绕苏打罐的产品照。" /></td>
|
||
<td><img src="assets/showcase/archetype-observatory-editorial.png" alt="Observatory Editorial。奶油色纸张质感主视觉，克制衬线标题 'An observability tool for the engineers who already know what they are doing'。" /></td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>Bloom</strong> · adaptogenic soda<br/><em>Soda that loves you back.</em><br/>Playful / Expressive Maximalist / Companion / Resonant<br/><a href="https://rampstack.co/showcase/creative-direction/bloom-soda" target="_blank" rel="noopener">查看 Bloom 演示示例 →</a></td>
|
||
<td><strong>Observatory Editorial</strong> · observability tool<br/><em>An open-source tool that respects engineer time.</em><br/>Conversational / Editorial Restrained / Peer / Considered<br/><a href="https://rampstack.co/showcase/creative-direction/observatory-editorial" target="_blank" rel="noopener">查看 Observatory 演示示例 →</a></td>
|
||
</tr>
|
||
</table>
|
||
|
||
<p align="center">
|
||
<strong><a href="https://rampstack.co/showcase/creative-direction" target="_blank" rel="noopener">查看展示页中的所有品牌 →</a></strong>
|
||
</p>
|
||
|
||
### 在你的自有品牌上运行
|
||
|
||
creative-direction skill 位于 [`skills/creative-direction/`](skills/creative-direction/)。安装它（见下文），向 Claude 提供项目名称和几个灵感参考，该 skill 会引导你产出一份可供下游 skill 消费的 brief。展示页中的品牌站点正是由这种形态的 brief 构建而成。
|
||
|
||
---
|
||
|
||
## Logo design 实战
|
||
|
||
logo-design skill 在 rampstack.co 上呈现为两个并行界面。变体探索器（variant explorer）一次深入一个品牌：主标识、跨架构变体、应用场景。分类图库（taxonomy gallery）横向覆盖架构空间：十个虚构标识展示八种标识架构（wordmark、lockup、monogram、letterform-as-symbol、abstract、pictorial、combination、emblem）。同一 skill，两种不同视角。
|
||
|
||
<p align="center">
|
||
<picture>
|
||
<source media="(max-width: 640px)" srcset="assets/showcase/logo-design-highlight-mobile.jpg">
|
||
<img src="assets/showcase/logo-design-highlight-desktop.jpg" alt="Logo Design skill 亮点示意图。海军蓝标题卡片写着 'Bespoke Logo Design'，副标题为 'Bringing brands to life.'。标题下方为模拟构造指南：网格线上的风格化字母 B，叠加黄金比例、Primary Curve 与 Secondary Shape 标注、Kerning 标记及六色色板。底部三列分别为：Verticals（Tech、Finance、Healthcare、Retail）、Brand Voice（Trustworthy、Innovative、Premium、Approachable）、Architectures（Monogram、Wordmark、Emblem、Abstract）。">
|
||
</picture>
|
||
</p>
|
||
|
||
### 按品牌深入
|
||
|
||
<strong><a href="https://rampstack.co/showcase/logo-design" target="_blank" rel="noopener">变体探索器 →</a></strong>
|
||
|
||
每个品牌都有一个主标识，以及跨架构与应用场景的变体。logo-design skill 会引导你掌握选择一种架构，并在品牌实际使用的体系中一致呈现它的方法。
|
||
|
||
<p align="center">
|
||
<picture>
|
||
<source media="(max-width: 640px)" srcset="assets/showcase/logo-design-showcase-mobile.png">
|
||
<img src="assets/showcase/logo-design-showcase-desktop.png" alt="Logo design 变体探索器，三行两列展示六张虚构品牌卡片：Whitfield Carter（法律顾问 lockup）、Wren and Bough（消费品 lockup）、Highline（酒店 wordmark）、Sentinel（科技与 AI 纯符号）、Lacuna（时尚 wordmark）、Roost（餐厅 lockup）。每张卡片含主标识及 architecture、typographic register、category 三个分类标签，附注四变体与五应用场景。">
|
||
</picture>
|
||
</p>
|
||
|
||
品牌可按 architecture、typographic register 和 category 筛选。其意图是参考作品，而非可直接套用的模板。
|
||
|
||
### 架构分类法
|
||
|
||
<strong><a href="https://rampstack.co/showcase/logos" target="_blank" rel="noopener">标识图库 →</a></strong>
|
||
|
||
十个虚构标识涵盖八种标识架构：wordmark、lockup、monogram、letterform-as-symbol、abstract、pictorial、combination、emblem。该分类法通过并排展示全部八种架构使区分具体化，并以三种 typographic register 下的三个 wordmark 说明：执行层面的差异往往比架构标签本身更重要。
|
||
|
||
<p align="center">
|
||
<picture>
|
||
<source media="(max-width: 640px)" srcset="assets/showcase/marks-showcase-mobile.png">
|
||
<img src="assets/showcase/marks-showcase-desktop.png" alt="标识图库，三行两列展示六张虚构品牌卡片：knurl（小写衬线 wordmark，带滚花纹理）、TARSUS（大写无衬线 lockup，叠层条形标识）、PLINTH（古典衬线置于双线徽章框内）、Caval（斜体马形剪影加斜体 wordmark 组合）、Ostend（流动 OS 字母组合连成单一字形）、GLINT（高对比 Didone wordmark，细线 I 横杠）。每张卡片含品牌名、描述及 mark architecture、vertical、brand voice 三个分类标签。">
|
||
</picture>
|
||
</p>
|
||
|
||
按架构、垂直领域或品牌调性筛选；点击任意标识卡片查看其设计依据。
|
||
|
||
---
|
||
|
||
## 参考构建实例
|
||
|
||
完整目录以四阶段参考构建的形式呈现：从空白 brief 到已部署、经审计的上线站点。Threshold 是一款虚构的 PLG（Product-Led Growth）onboarding 分析产品，但其中的研究、品牌基础、构建与审计发现均为真实内容。该参考构建是目录端到端展示各 skill 如何组合运用的最强示范。
|
||
|
||
<p align="center">
|
||
<picture>
|
||
<source media="(max-width: 640px)" srcset="assets/showcase/reference-build-highlight-mobile.png">
|
||
<img src="assets/showcase/reference-build-highlight-desktop.png" alt="参考构建主视觉卡片。海军蓝标题卡片显示「Reference Build」，副标题为「A fictional B2B SaaS launch, end-to-end.」。下方为四张白色阶段卡片，呈 2x2 网格排列：Phase 01 Strategy and Research，说明文字为「Real Ahrefs research applied to a fictional brief」；Phase 02 Brand and Design，说明文字为「Working brand system with live tokens and components」；Phase 03 Build and Ship，说明文字为「Deployed launch microsite at /demo/threshold」；Phase 04 Audit and Optimize，说明文字为「Real audit findings with applied fixes.」。页脚说明为「Threshold is fictional. The methodology is not.」">
|
||
</picture>
|
||
</p>
|
||
|
||
### 四个阶段
|
||
|
||
**[阶段 1：策略与研究 →](https://rampstack.co/walkthroughs/saas-launch-research-and-strategy)**
|
||
将真实的 Ahrefs 关键词研究、竞品分析、内容缺口审计和外链机会映射应用于虚构的 B2B SaaS brief。实时数据表来自 Ahrefs API。
|
||
|
||
**[阶段 2：品牌与设计 →](https://rampstack.co/walkthroughs/saas-launch-brand-and-design)**
|
||
Logo 体系、色彩与字体排版 token、可用的品牌组件原语。品牌体系在导览页上以真实字体和 token 实时渲染，而非仅作文字描述。
|
||
|
||
**[阶段 3：构建与发布 →](https://rampstack.co/walkthroughs/saas-launch-build-and-ship)**
|
||
使用阶段 2 的品牌基础，用 Next.js 构建的实际上线微站。线上地址：[rampstack.co/demo/threshold](https://rampstack.co/demo/threshold). 持久演示横幅；noindex；仅本地的 waitlist 表单。
|
||
|
||
**[阶段 4：审计与优化 →](https://rampstack.co/walkthroughs/saas-launch-audit-and-optimize)**
|
||
对已部署站点进行真实审计，使用目录的审计套件（axe-core、Lighthouse、人工检查）。真实发现含严重程度分级，应用真实修复，呈现真实前后对比指标。目录在此收官章节审计自身产出。
|
||
|
||
### 已部署成果
|
||
|
||
四个阶段组合为一个可运行的微站，地址：[rampstack.co/demo/threshold](https://rampstack.co/demo/threshold). 真实的 Next.js 代码，通过跨路由 import 引用阶段 2 的真实品牌基础，真实可用的多步骤 waitlist 表单（不存储数据），持久演示横幅，以及审计后优化阶段产出的内联数据可视化。
|
||
|
||
<p align="center">
|
||
<picture>
|
||
<source media="(max-width: 640px)" srcset="assets/showcase/threshold-demo-screenshot-mobile.png">
|
||
<img src="assets/showcase/threshold-demo-screenshot-desktop.png" alt="已部署 Threshold 演示站点 rampstack.co/demo/threshold 的全页截图。顶部持久海军蓝演示横幅显示「Demonstration · Threshold is a fictional product built to illustrate how the catalog composes from blank brief to deployed launch microsite.」。下方 hero 区展示衬线标题「Know how new users actually get to value」，旁侧为风格化产品仪表盘 mockup，含 KPI 磁贴、激活漏斗图和近期 cohort 对比。页面下方依次为：虚构 cohort 信任条、「The gap」问题区块、含内联漏斗与首次价值时间图表的 wedge 区块、与 Mixpanel/Amplitude/Heap 及 Pendo/Userpilot 的对比表、「How it works」三卡片串联区块、多步骤 waitlist 表单，以及 FAQ 区块。">
|
||
</picture>
|
||
</p>
|
||
|
||
### 为何使用虚构产品
|
||
|
||
真实客户工作无法开源；作品集声明会在面试和咨询沟通中引发利益冲突顾虑。以文档化 brief 搭配真实研究、真实品牌基础、真实可运行代码和真实审计发现的虚构产品，可产出教学范例，展示方法论而不宣称客户关系。Threshold 是一款并不存在的测量工具；构建它的方法论，则是目录端到端运转的真实体现。
|
||
|
||
---
|
||
|
||
## 快速上手
|
||
|
||
根据你使用 Claude 的方式，skill 可安装到三个不同位置。选择与你的工作流程匹配的平台。
|
||
|
||
### 选项 1：Claude.ai（网页与桌面端）
|
||
|
||
若你的 Claude.ai 套餐支持自定义 Skills：
|
||
|
||
1. 前往 **Settings → Capabilities → Skills**。
|
||
2. 将所需的 skill 文件夹作为 `.zip` 上传（每个 skill 文件夹一个 zip，其中包含 `SKILL.md` 和 `references/` 子文件夹）。
|
||
3. 在聊天界面中启用该 skill。
|
||
|
||
当你的请求与其描述匹配时，Claude 会自动加载该 skill。
|
||
|
||
有关当前套餐可用性与确切上传界面，请参阅 [Anthropic 的 Skills 用户指南](https://docs.claude.com/en/docs/agents-and-tools/agent-skills/overview).
|
||
|
||
### 选项 2：Claude Code（推荐）
|
||
|
||
Skills 在 Claude Code 中是一等公民。将其放入 skills 目录，Claude Code 会自动识别。
|
||
|
||
**用户级 skills**（在所有项目中可用）：
|
||
|
||
```bash
|
||
# macOS / Linux
|
||
mkdir -p ~/.claude/skills
|
||
cp -r skills/* ~/.claude/skills/
|
||
|
||
# Windows (PowerShell)
|
||
New-Item -ItemType Directory -Force -Path "$HOME\.claude\skills"
|
||
Copy-Item -Recurse skills\* "$HOME\.claude\skills\"
|
||
```
|
||
|
||
**项目级 skills**（仅在特定项目中可用）：
|
||
|
||
```bash
|
||
mkdir -p .claude/skills
|
||
cp -r path/to/this-repo/skills/* .claude/skills/
|
||
```
|
||
|
||
启动（或重启）Claude Code。Skills 会自动加载。
|
||
|
||
有关当前确切路径与配置标志，请参阅 [Claude Code 文档](https://docs.claude.com/en/docs/claude-code/overview).
|
||
|
||
### 选项 3：Anthropic API
|
||
|
||
通过在 API 调用中引用 Skills，以编程方式使用。须先将 Skills 上传至你的工作区（通过 Console 或 API），再在创建消息时按 ID 引用。
|
||
|
||
有关当前 API 接口、请求格式与限制，请参阅 [Agent Skills API 文档](https://docs.claude.com/en/api/agent-skills).
|
||
|
||
### 只想安装部分 skills？
|
||
|
||
你不必安装全部 103 个。按工作需求选择对应类别即可。该库采用模块化设计：每个 skill 均可独立使用。
|
||
|
||
---
|
||
|
||
## 快速示例
|
||
|
||
安装后，skills 会根据你的请求自动触发。你无需点名 skill，也无需改变与 Claude 的对话方式。
|
||
|
||
**你提问：**
|
||
|
||
> "Our organic traffic dropped 30% last week. Help me figure out why."
|
||
|
||
**实际流程：**
|
||
|
||
Claude 识别该请求匹配 `seo-traffic-diagnosis`，加载该 skill，并按其 5 层根因分析框架推进：确认变化是否真实 → 定位变化范围 → 页面级分析 → 技术分析 → 外部分析。最终你将得到假设陈述、证据与行动计划，且每次结构一致。
|
||
|
||
**其他自然触发示例：**
|
||
|
||
- "Help me write a creative brief" → `creative-brief`
|
||
- "Audit my homepage for SEO" → `seo-onpage`
|
||
- "We need a backlink audit" → `seo-backlink-audit`
|
||
- "Plan our content roadmap for Q3" → `seo-content-gap-audit` 加 `content-strategy`
|
||
- "Postmortem template for last night's incident" → `after-action-report`
|
||
- "How do I write my own skill?" → `skill-creation-walkthrough`
|
||
|
||
你也可以显式调用某个 skill："Use the `seo-audit-orchestration` skill to run a full audit on example.com."
|
||
|
||
---
|
||
|
||
## 组合方式
|
||
|
||
这些 skills 可组合为完整项目流程：
|
||
|
||
```
|
||
brand-discovery → brand-ideation → brand-identity → brand-style-guide → brand-voice
|
||
↓
|
||
creative-brief → information-architecture → content-strategy → design-system
|
||
↓
|
||
seo-keyword → seo-content-audit → content-and-copy → landing-page-copy
|
||
↓
|
||
seo-onpage → seo-technical → seo-aeo-geo → seo-offpage → seo-competitor
|
||
↓
|
||
frontend-component-build → accessibility-audit → performance-optimization
|
||
↓
|
||
code-review-web → qa-testing → security-baseline → launch-runbook
|
||
↓
|
||
domain-strategy → monitoring-and-alerting → backup-and-disaster-recovery
|
||
↓
|
||
incident-response → after-action-report
|
||
↓
|
||
analytics-strategy → cro-optimization → ux-research → usability-testing → journey-mapping
|
||
```
|
||
|
||
SEO 审计套件（由 Ahrefs MCP 驱动）围绕 SEO 基础技能构建：
|
||
|
||
```
|
||
seo-audit-orchestration
|
||
├── seo-site-health-audit
|
||
├── seo-backlink-audit
|
||
├── seo-keyword-gap-audit
|
||
├── seo-content-gap-audit
|
||
├── seo-traffic-diagnosis (also runs standalone for incident-style work)
|
||
└── seo-rank-tracking (ongoing, feeds the others)
|
||
```
|
||
|
||
目录还包含四条受众轨道（audience tracks），可与基础生命周期组合使用。每条轨道都有其内部流程：
|
||
|
||
**付费媒体（营销轨道）：**
|
||
|
||
```
|
||
paid-media-strategy → ads-creative-development → ads-performance-analytics
|
||
```
|
||
|
||
与 rampstack.co 集成目录中的付费媒体平台配对（Google Ads、Meta、LinkedIn、TikTok，以及作为多平台聚合器的 Synter）。
|
||
|
||
**增长工具（交互式 Web 工具）：**
|
||
|
||
```
|
||
funnel-flow-architecture (orchestrator)
|
||
├── lead-magnet-design (capture)
|
||
├── calculator-design (capture / activate)
|
||
├── quiz-and-assessment-design (capture / activate)
|
||
├── multi-step-form-design (activate)
|
||
├── chatbot-flow-design (activate)
|
||
├── onboarding-wizard-design (activate)
|
||
├── interactive-product-tour (activate / convert)
|
||
├── upgrade-flow-design (convert)
|
||
├── scheduler-and-booking-design (convert)
|
||
├── comparison-tool-design (convert)
|
||
└── product-configurator-design (convert)
|
||
```
|
||
|
||
`funnel-flow-architecture` 是编排器（orchestrator）：它会按受众和漏斗阶段排序适合的交互式工具，并区分匹配型漏斗（matched-funnels）与「大杂烩」型漏斗（kitchen-sink-funnels）。
|
||
|
||
**二级内容生命周期：**
|
||
|
||
```
|
||
content-strategy → pillar-content-architecture → content-brief-authoring
|
||
↓
|
||
content-and-copy / long-form-content-frameworks / email-sequences
|
||
↓
|
||
editorial-qa → content-distribution → programmatic-seo
|
||
↓
|
||
content-refresh-system → content-repurposing → content-migration
|
||
```
|
||
|
||
`ai-content-collaboration` 是贯穿各阶段而非单一步骤的工作流层。`documentation-strategy` 与其余部分并行持续运行。
|
||
|
||
**二级产品管理（两条并行轨道）：**
|
||
|
||
```
|
||
Experimentation track:
|
||
experiment-design → feature-flagging → experimentation-platform-orchestrator
|
||
↓
|
||
experimentation-analytics → data-warehouse-experimentation
|
||
|
||
Gap-closing track:
|
||
pm-spec-writing → roadmap-planning → feature-launch-playbook
|
||
↓
|
||
beta-program-management → product-analytics-setup → integration-orchestrator
|
||
```
|
||
|
||
实验轨道以统计学纪律交付变更；补缺轨道以运营纪律交付功能。二者均与上述基础生命周期组合使用。
|
||
|
||
运营、横切与团队技能（`stakeholder-communication`、`documentation-strategy`、`vendor-evaluation`、`team-onboarding-playbook`、`dependency-management`、`cost-optimization` 等）贯穿所有轨道。
|
||
|
||
你也可以单独抽取某项技能完成一次性工作。只需要反向链接审计？使用 `seo-backlink-audit`。需要撰写创意简报？使用 `creative-brief`。每项技能均可独立使用。
|
||
|
||
---
|
||
|
||
## 目录如何连接
|
||
|
||
这些技能可与团队现有工具组合。中心是 103 项技能；通过 MCP 向外辐射 6 个集成类别下的 35 项集成。
|
||
|
||
<p align="center">
|
||
<picture>
|
||
<source media="(max-width: 640px)" srcset="docs/architecture-mobile.jpg">
|
||
<img src="docs/architecture-wide.jpg" alt="RampStack 架构图。中央海军蓝枢纽卡片展示 RampStack 标识，副标题为「与栈无关的方法论」。六张类别卡片向外辐射：Workflow 含 6 项集成（Jira、Linear、Notion、Figma、GitHub），Experimentation 含 11 项集成（Statsig、PostHog、Optimizely、Amplitude），SEO Intelligence 含 3 项集成（Ahrefs、Semrush、Similarweb），Paid Media 含 5 项集成（Google Ads、Meta Ads、LinkedIn、TikTok、Synter），Content and SEO 含 5 项集成（Webflow、Contentful、Frase、Profound、AirOps），Data and Analytics 含 5 项集成（BigQuery、Snowflake、Mixpanel、dbt、Hex）。">
|
||
</picture>
|
||
</p>
|
||
|
||
---
|
||
|
||
## 产品触点
|
||
|
||
<!-- SURFACES:START -->
|
||
本目录是开源方法论层。[rampstack.co](https://rampstack.co) 上的商业化产品触点对其进行了扩展：
|
||
|
||
- **[技能目录](https://rampstack.co/skills)**. 每项技能都有精选落地页，包含受众轨道、搜索与分类导航。
|
||
- **[演练指南](https://rampstack.co/walkthroughs)**. 端到端编排技能集群的多技能配方。当单项技能不够、需要打包序列时使用。
|
||
- **[集成目录](https://rampstack.co/integrations)**. 精选的 MCP、API 与工具，供技能接入。
|
||
- **[案例展示](https://rampstack.co/showcase)**. 用这些技能构建的真实品牌站点，并附产生各站点的简报。
|
||
|
||
本仓库中的技能保持免费、开源且与技术栈无关。上述产品触点是将同一方法论以产品形态交付的方式。
|
||
<!-- SURFACES:END -->
|
||
|
||
---
|
||
|
||
## 设计原则
|
||
|
||
claude-skills 遵循 [Agent Skills Specification](https://agentskills.io), 这是可移植 AI 智能体技能的开放标准，最初由 Anthropic 开发，并已在 AI 工具生态中广泛采用（截至 2026 年初，包括 Claude Code、OpenAI Codex、Gemini CLI、GitHub Copilot、Cursor、VS Code、Goose、Spring AI 及 30 多个其他平台）。
|
||
|
||
除格式本身外，目录围绕三项原则设计，与 Anthropic 在 [Building effective agents](https://www.anthropic.com/engineering/building-effective-agents): 中发布的指南一致：
|
||
|
||
**简洁性。** 每项技能只覆盖一项聚焦能力，而非试图成为多用途文档。路线图规划技能负责规划路线图；关键词研究技能负责研究关键词。将它们组合可产生复杂工作流；混在同一项技能内则不可靠。
|
||
|
||
**透明性。** 每项技能在机器可读的 YAML frontmatter 中声明其范围、依赖与预期行为。目录可供工具检视，而不仅供人阅读正文。
|
||
|
||
**通过工具保障质量契约。** 结构与内容质量通过自动化检查（运行 `python .github/scripts/lint_skills.py`）强制执行，而非仅靠约定。每项技能均按 schema 校验；每次目录变更均在 CI 中校验。
|
||
|
||
本目录中的技能旨在组合成 Anthropic 文档中的常见智能体工作流模式：提示链（prompt chaining，顺序步骤）、路由（routing，分类与导向）、并行化（parallelization，分段或投票）、编排者-工作者（orchestrator-workers，动态委派），以及评估者-优化者（evaluator-optimizer，迭代精炼）。
|
||
|
||
由于目录符合开放的 Agent Skills 标准，技能可在支持该规范的任何平台上无需修改即可使用。
|
||
|
||
## 家族仓库
|
||
|
||
claude-skills 是父级目录。精选子集与配套仓库聚焦特定领域：
|
||
|
||
| 仓库 | 聚焦领域 | 技能数 |
|
||
|---|---|---|
|
||
| [claude-skills](https://github.com/rampstackco/claude-skills) | 完整目录（当前所在） | 103 |
|
||
| [claude-skills-starter](https://github.com/rampstackco/claude-skills-starter) | 通用精简版 | 14 |
|
||
| [claude-skills-seo](https://github.com/rampstackco/claude-skills-seo) | SEO 咨询 | 12 |
|
||
| [claude-skills-pm](https://github.com/rampstackco/claude-skills-pm) | 产品管理 | 12 |
|
||
| [claude-skills-widgets](https://github.com/rampstackco/claude-skills-widgets) | UI 模式 + 组件 | 65 + 32 |
|
||
| [awesome-claude-skills](https://github.com/rampstackco/awesome-claude-skills) | 精选发现列表 | n/a |
|
||
|
||
各家族仓库均采用 MIT 许可证，符合 Agent Skills Specification，且与技术栈无关。需要广度时使用完整目录；专注单一领域时使用专项子集。
|
||
|
||
---
|
||
|
||
<!-- COUNT_CATALOG_HEADER:START -->
|
||
## 103 项技能目录
|
||
<!-- COUNT_CATALOG_HEADER:END -->
|
||
|
||
<!-- COUNT_CATALOG_INTRO:START -->
|
||
全部 103 项技能均已随附交付。每项技能均包含完整的 SKILL.md，以及至少一份参考文件（模板、检查清单或操作手册）。
|
||
<!-- COUNT_CATALOG_INTRO:END -->
|
||
|
||
<!-- AUTO-GENERATED CATALOG: do not edit by hand. Run scripts/generate_readme_catalog.py --write -->
|
||
<!-- CATALOG:START -->
|
||
### 策略与发现 (5)
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`brand-discovery`](skills/brand-discovery/SKILL.md) | 受众调研、竞争扫描、定位领域探索 |
|
||
| [`creative-brief`](skills/creative-brief/SKILL.md) | 在工作开始前对齐利益相关方的项目简报 |
|
||
| [`creative-direction`](skills/creative-direction/SKILL.md) | 四轴美学简报（语气、美学、受众、感官诉求），用于跨技能一致性 |
|
||
| [`information-architecture`](skills/information-architecture/SKILL.md) | 站点地图、导航、URL 结构、内容类型、分类体系 |
|
||
| [`content-strategy`](skills/content-strategy/SKILL.md) | 编辑策略、内容日历、主题权威规划 |
|
||
|
||
### 品牌 (7)
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`brand-ideation`](skills/brand-ideation/SKILL.md) | 命名、定位领域、情绪方向、叙事角度 |
|
||
| [`brand-identity`](skills/brand-identity/SKILL.md) | 标识体系、色彩、字体、影像、图标、动效 |
|
||
| [`brand-style-guide`](skills/brand-style-guide/SKILL.md) | 完整品牌体系的权威参考文档 |
|
||
| [`brand-voice`](skills/brand-voice/SKILL.md) | 声音属性、语气变化、词汇、配对示例库 |
|
||
| [`brand-archetype-system`](skills/brand-archetype-system/SKILL.md) | 18 个垂直领域中的 12 种原型默认配置：色彩、字体、声音、影像起点 |
|
||
| [`logo-design`](skills/logo-design/SKILL.md) | 多种架构下的标识变体（字标、组合标、字母组合标、字母形符号），附设计理由与应用规范 |
|
||
| [`creative-brief-selector`](skills/creative-brief-selector/SKILL.md) | 基于实时参考的创意简报，并对照既往构建进行发散性校验 |
|
||
|
||
### 设计 (4)
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`design-system`](skills/design-system/SKILL.md) | 组件库、设计令牌（design tokens）、设计系统文档 |
|
||
| [`design-standards`](skills/design-standards/SKILL.md) | 生产级页面与组件设计标准 |
|
||
| [`art-direction`](skills/art-direction/SKILL.md) | 摄影、插画与活动视觉指导 |
|
||
| [`vertical-site-conventions`](skills/vertical-site-conventions/SKILL.md) | 按体验标准构建的垂直页面与站点版式 |
|
||
|
||
### 内容 (13)
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`pillar-content-architecture`](skills/pillar-content-architecture/SKILL.md) | 枢纽级内容架构：支柱主题选择、集群规划、内链、URL 结构、支柱页与集群页结构、主题权威信号、更新纪律 |
|
||
| [`content-brief-authoring`](skills/content-brief-authoring/SKILL.md) | 单篇编辑简报：目标关键词、意图、受众、大纲、实体覆盖、内链、成功标准，以及区分有用简报与臃肿废话的纪律 |
|
||
| [`content-and-copy`](skills/content-and-copy/SKILL.md) | 网站文案、博客内容、内容生产框架 |
|
||
| [`landing-page-copy`](skills/landing-page-copy/SKILL.md) | 落地页、销售页、从主视觉到 CTA 的流程 |
|
||
| [`email-sequences`](skills/email-sequences/SKILL.md) | 引导流程、生命周期营销活动、事务性文案 |
|
||
| [`programmatic-seo`](skills/programmatic-seo/SKILL.md) | 设计可落地的程序化 SEO（pSEO）方案：数据源、模板设计、规模化质量控制、内链、抓取预算、AEO/GEO 模式、更新纪律，以及何时适合/不适合采用 pSEO |
|
||
| [`editorial-qa`](skills/editorial-qa/SKILL.md) | 发布前 QA 框架：简报遵循、声音一致性、事实准确性、AI 内容审计、AEO/SEO 合规、规模化抽样，以及区分真正发现问题与流程表演的 QA 工作流 |
|
||
| [`ai-content-collaboration`](skills/ai-content-collaboration/SKILL.md) | 人与 AI 在内容工作流中的协作方式：参与边界、混合模式、声音归属、AI 低质内容（AI slop）问题、披露与透明度、团队校准，以及诚实 AI 辅助生产的伦理 |
|
||
| [`long-form-content-frameworks`](skills/long-form-content-frameworks/SKILL.md) | 单篇长文结构模式（案例研究、白皮书、研究报告、权威指南、宣言、电子书、长文教程），区分出版级作品与博客式冗长填充或学术臃肿 |
|
||
| [`content-refresh-system`](skills/content-refresh-system/SKILL.md) | 系统化内容更新：季度审计、更新优先级、更新/合并/删除决策，以及区分有意规划与设置后放任衰减的生命周期纪律 |
|
||
| [`content-repurposing`](skills/content-repurposing/SKILL.md) | 跨格式内容改编：一篇变多篇（博客系列、邮件、社交、网络研讨会、播客、视频），按格式适配而非忽视媒介约束的群发轰炸 |
|
||
| [`content-distribution`](skills/content-distribution/SKILL.md) | 内容分发纪律：自有、赢得与付费渠道与受众及内容类型匹配。渠道适配决策、分发节奏，以及「到处刷屏」或「祈祷见效」之外的策略性替代方案 |
|
||
| [`evidence-based-reviews`](skills/evidence-based-reviews/SKILL.md) | 证据层级、方法论披露、诚实的评测主张 |
|
||
|
||
### SEO 基础 (7)
|
||
|
||
与工具无关的 SEO 技能。这些技能定义概念框架。下方的 SEO 审计套件则补充由 Ahrefs MCP 驱动的执行层。
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`seo-onpage`](skills/seo-onpage/SKILL.md) | 单页审计与优化，覆盖 8 个维度 |
|
||
| [`seo-technical`](skills/seo-technical/SKILL.md) | 可抓取性、可索引性、渲染、结构化数据（schema）、页面体验 |
|
||
| [`seo-keyword`](skills/seo-keyword/SKILL.md) | 发现、意图分类、聚类、优先级排序 |
|
||
| [`seo-competitor`](skills/seo-competitor/SKILL.md) | SERP 重叠、内容缺口、外链缺口、技术对比 |
|
||
| [`seo-offpage`](skills/seo-offpage/SKILL.md) | 外链建设、数字公关、引用、可链接资产 |
|
||
| [`seo-content-audit`](skills/seo-content-audit/SKILL.md) | 全站保留/更新/合并/重定向/删除决策 |
|
||
| [`seo-aeo-geo`](skills/seo-aeo-geo/SKILL.md) | AI 搜索优化、llms.txt、便于提取的内容 |
|
||
|
||
### SEO 审计套件（由 Ahrefs MCP 驱动）(7)
|
||
|
||
端到端 SEO 审计工作流，从 Ahrefs MCP 拉取数据并产出具体交付物。这些技能假定已连接 Ahrefs MCP。
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`seo-audit-orchestration`](skills/seo-audit-orchestration/SKILL.md) | 主协调器：编排整套流程，产出汇总报告 |
|
||
| [`seo-backlink-audit`](skills/seo-backlink-audit/SKILL.md) | 档案健康度、锚文本组合、有毒链接、回收、缺口分析 |
|
||
| [`seo-keyword-gap-audit`](skills/seo-keyword-gap-audit/SKILL.md) | 竞品关键词缺口，含机会评分与聚类 |
|
||
| [`seo-content-gap-audit`](skills/seo-content-gap-audit/SKILL.md) | 缺失主题、薄弱覆盖、过时内容、衰减诊断 |
|
||
| [`seo-traffic-diagnosis`](skills/seo-traffic-diagnosis/SKILL.md) | 通过五层根因分析诊断流量下跌、停滞或增长 |
|
||
| [`seo-site-health-audit`](skills/seo-site-health-audit/SKILL.md) | 按 SEO 影响而非严重程度对 Ahrefs Site Audit 发现项进行分诊 |
|
||
| [`seo-rank-tracking`](skills/seo-rank-tracking/SKILL.md) | 设置、基线、细分、告警、仪表盘 |
|
||
|
||
### 产品 (13)
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`pm-spec-writing`](skills/pm-spec-writing/SKILL.md) | PRD、用户故事、验收标准、开发简报 |
|
||
| [`roadmap-planning`](skills/roadmap-planning/SKILL.md) | 季度规划、优先级排序、依赖映射 |
|
||
| [`integration-orchestrator`](skills/integration-orchestrator/SKILL.md) | 跨阶段、关卡、交接与 QA 验证编排创意指导（creative-direction）工作 |
|
||
| [`experiment-design`](skills/experiment-design/SKILL.md) | 从假设到决策：样本量、时长、细分分析、解读，以及导致错误上线决策的失败模式 |
|
||
| [`feature-flagging`](skills/feature-flagging/SKILL.md) | 将功能开关作为生产基础设施：类型、命名、生命周期、定向、灰度发布、过期开关清理、治理 |
|
||
| [`experimentation-analytics`](skills/experimentation-analytics/SKILL.md) | 不误读结果面板：置信区间、p 值、多重检验、序贯检验、CUPED、比率指标、网络效应、仪表盘对账 |
|
||
| [`experimentation-platform-orchestrator`](skills/experimentation-platform-orchestrator/SKILL.md) | 选择合适实验平台、选错时迁移、多平台时协调：面向 Statsig、PostHog、GrowthBook、Optimizely、Amplitude、Eppo、Kameleoon 的决策框架 |
|
||
| [`product-analytics-setup`](skills/product-analytics-setup/SKILL.md) | 正确搭建产品分析：事件分类体系、属性、命名规范、模式版本控制、漏斗、留存队列、北极星指标选择，以及缺乏纪律会不断累积的埋点债务 |
|
||
| [`data-warehouse-experimentation`](skills/data-warehouse-experimentation/SKILL.md) | 基于数据仓库运行实验：SQL 分配、曝光日志、dbt 指标定义、统计分析、CUPED 方差缩减、序贯检验，以及与平台方案的运营权衡 |
|
||
| [`feature-launch-playbook`](skills/feature-launch-playbook/SKILL.md) | 妥善上线功能的运营纪律：定位、内部对齐、客户沟通、销售赋能、支持就绪、发布策略、监控与上线后度量 |
|
||
| [`jtbd-framing`](skills/jtbd-framing/SKILL.md) | 待完成任务（Jobs-to-be-Done，JTBD）框架。任务陈述、挣扎时刻、雇佣/解雇标准，功能思维与任务思维的区别。坦诚说明 JTBD 何时真正有用、何时流于形式 |
|
||
| [`okr-design`](skills/okr-design/SKILL.md) | OKR 设计纪律。成果陈述、关键结果、评分、季度中重新校准。区分保底 OKR（总能达成、毫无用处）、幻想型 OKR（不可能、令人沮丧）与拉伸型 OKR（真正雄心且季度可问责） |
|
||
| [`beta-program-management`](skills/beta-program-management/SKILL.md) | 运行能产生真实信号的 Beta：参与者筛选、结构化反馈、Beta 到 GA 决策。区分软启动（无结构）、大杂烩（全员参与）与结构化 Beta（经过校准的队列与有意设计的反馈闭环）
|
||
|
||
### 开发（4）
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`code-review-web`](skills/code-review-web/SKILL.md) | PR 评审、构建错误诊断、安全与质量检查 |
|
||
| [`frontend-component-build`](skills/frontend-component-build/SKILL.md) | 组件架构、props 设计、从一开始就考虑无障碍（accessibility） |
|
||
| [`accessibility-audit`](skills/accessibility-audit/SKILL.md) | WCAG 合规审计及修复方案 |
|
||
| [`performance-optimization`](skills/performance-optimization/SKILL.md) | Core Web Vitals、资源优化、渲染性能 |
|
||
|
||
### 质量保证（1）
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`qa-testing`](skills/qa-testing/SKILL.md) | 上线前 QA、回归测试、跨浏览器检查 |
|
||
|
||
### 运维（9）
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`launch-runbook`](skills/launch-runbook/SKILL.md) | 上线运行手册、DNS 切换、部署日流程 |
|
||
| [`incident-response`](skills/incident-response/SKILL.md) | 事故分级、沟通、缓解、升级 |
|
||
| [`after-action-report`](skills/after-action-report/SKILL.md) | 事后复盘、回顾、经验文档 |
|
||
| [`domain-strategy`](skills/domain-strategy/SKILL.md) | DNS 架构、重定向、注册商、多域名组合 |
|
||
| [`monitoring-and-alerting`](skills/monitoring-and-alerting/SKILL.md) | SLO 设计、可用性检查、告警路由、值班轮换 |
|
||
| [`backup-and-disaster-recovery`](skills/backup-and-disaster-recovery/SKILL.md) | RPO/RTO 目标、备份策略、恢复演练 |
|
||
| [`security-baseline`](skills/security-baseline/SKILL.md) | HTTPS、安全响应头、CSP、密钥管理、漏洞扫描 |
|
||
| [`email-deliverability`](skills/email-deliverability/SKILL.md) | DMARC、SPF、DKIM、发件人信誉、送达率监控 |
|
||
| [`media-asset-management`](skills/media-asset-management/SKILL.md) | 图片流水线、视频托管、资源库、格式选择 |
|
||
|
||
### 增长（2）
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`analytics-strategy`](skills/analytics-strategy/SKILL.md) | 度量框架、仪表盘设计、事件分类体系 |
|
||
| [`cro-optimization`](skills/cro-optimization/SKILL.md) | 假设驱动测试、转化优化 |
|
||
|
||
### 增长工具（12）
|
||
|
||
将访客转化为线索的交互式 Web 工具。引流磁铁、计算器、测验、多步表单、聊天机器人，以及统筹这些工具的跨工具漏斗架构。
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`lead-magnet-design`](skills/lead-magnet-design/SKILL.md) | 设计能换取邮箱的 gated content。区分 thin-bait（过度承诺、交付不足）、kitchen-sink-resource（什么都塞、什么都帮不上）与 earned-value-magnet（提供独立价值的同时筛选线索） |
|
||
| [`calculator-design`](skills/calculator-design/SKILL.md) | 设计能提供决策支持价值并筛选线索的交互式计算器。区分 vanity-calculator（无真实价值）、lead-trap（把答案藏在邮箱门后）与 transparent-decision-tool（提供真实价值、诚实获取线索） |
|
||
| [`quiz-and-assessment-design`](skills/quiz-and-assessment-design/SKILL.md) | 设计能产生可执行分群的测验与评估。区分 clickbait-quiz（只为互动）、vanity-result（有趣但无用）与 actionable-segmentation（真实分类并驱动下一步推荐） |
|
||
| [`multi-step-form-design`](skills/multi-step-form-design/SKILL.md) | 设计尊重认知负荷同时保持完成意愿的多步表单。区分 kitchen-sink-single-page（信息过载）、progress-theater（有步骤却无真实分阶段）与 genuinely-staged（每一步都配得上独立页面） |
|
||
| [`chatbot-flow-design`](skills/chatbot-flow-design/SKILL.md) | 为网站上的聊天机器人与 AI agent 设计对话流程。区分 scripted-bot（僵化树状结构、边缘情况失效）、hallucinating-bot（无结构的 LLM、凭空编造）与 structured-guided-conversation（有意图架构与回退纪律的 LLM 驱动对话） |
|
||
| [`funnel-flow-architecture`](skills/funnel-flow-architecture/SKILL.md) | 架构与受众和阶段匹配的跨工具转化流程。区分 silo-funnels（每个工具各自为政）、kitchen-sink-funnels（所有受众挤进同一路径）与 matched-funnels（架构匹配受众与阶段） |
|
||
| [`onboarding-wizard-design`](skills/onboarding-wizard-design/SKILL.md) | 设计产品首次使用的引导向导。区分 tutorial-overload（一次性倾倒全部内容）、skip-friendly-empty（跳过引导导致弃用产品）与 earned-progressive-disclosure（在正确时刻呈现正确内容） |
|
||
| [`interactive-product-tour`](skills/interactive-product-tour/SKILL.md) | 设计产品内导览与情境化帮助。区分 tooltip-spam（每个按钮都有导览停靠点）、one-and-done（导览只显示一次、再也不见）与 contextual-when-needed（在产生摩擦的时刻呈现帮助） |
|
||
| [`upgrade-flow-design`](skills/upgrade-flow-design/SKILL.md) | 设计免费到付费的转化流程。区分 paywall-everywhere（处处激进设限）、free-forever-trap（没有升级路径露出）与 value-triggered-upgrade（在价值被证明的时刻露出付费墙） |
|
||
| [`scheduler-and-booking-design`](skills/scheduler-and-booking-design/SKILL.md) | 设计排程与预约流程。区分 any-time-friction（无筛选、仅给预约链接）、interrogation-gate（筛选过多吓跑用户）与 qualified-fast-path（刚好足够的筛选以做好通话准备） |
|
||
| [`comparison-tool-design`](skills/comparison-tool-design/SKILL.md) | 设计帮助用户做决定的对比工具。区分 feature-list-dump（每行罗列功能、无决策支持）、hidden-recommendation（偏袒对比却假装中立）与 honest-comparison-with-guidance（真实对比加明确推荐） |
|
||
| [`product-configurator-design`](skills/product-configurator-design/SKILL.md) | 设计交互式产品配置器。区分 infinite-options（选项过多导致决策瘫痪）、canned-bundles-only（无真实定制）与 guided-configuration（智能默认、有意义约束与逃生出口） |
|
||
|
||
### 营销（3）
|
||
|
||
付费媒体（paid media）纪律：策略、创意与效果分析。与 rampstack.co 上 /integrations 目录中的付费媒体平台配套使用。
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`paid-media-strategy`](skills/paid-media-strategy/SKILL.md) | 从假设到花费：渠道选择、预算分配、受众定向、出价策略、归因现实，以及会烧掉代理级预算的失败模式 |
|
||
| [`ads-creative-development`](skills/ads-creative-development/SKILL.md) | 钩子模式、格式选择、视频节奏、变体体系、测试方法、疲劳检测，以及区分广告与杂讯的平台特定创意规范 |
|
||
| [`ads-performance-analytics`](skills/ads-performance-analytics/SKILL.md) | 读懂付费媒体仪表盘而不自欺：归因模型、平台报表怪癖、ROAS 与 LTV、多平台对账、增量测试，以及会叠加成浪费预算的解读失误 |
|
||
|
||
### 研究（6）
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`ux-research`](skills/ux-research/SKILL.md) | 研究规划、用户访谈、定性综合 |
|
||
| [`usability-testing`](skills/usability-testing/SKILL.md) | 测试设计、主持、发现报告 |
|
||
| [`journey-mapping`](skills/journey-mapping/SKILL.md) | 客户旅程图、服务蓝图、摩擦分析 |
|
||
| [`discovery-research-synthesis`](skills/discovery-research-synthesis/SKILL.md) | 将客户访谈、研究笔记与支持工单综合为可执行的 PM 决策。区分 data-dump（无综合）、insight-theater（过度打磨的叙事）与 actionable synthesis（决策级清晰度） |
|
||
| [`user-feedback-aggregation`](skills/user-feedback-aggregation/SKILL.md) | 跨渠道收集并综合用户反馈，形成持续决策信号。分流纪律区分 loudest-voice（谁抱怨最多听谁的）、averaged-noise（所有信号等权）与 triaged-synthesis（按来源质量与决策相关性加权） |
|
||
| [`competitor-experience-audit`](skills/competitor-experience-audit/SKILL.md) | 垂直领域内的跨站体验模式与差距
|
||
|
||
### 横切工作流（5）
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`form-strategy`](skills/form-strategy/SKILL.md) | 表单设计、校验模式、垃圾信息防护、转化率优化 |
|
||
| [`content-migration`](skills/content-migration/SKILL.md) | 平台迁移并保留 SEO 资产 |
|
||
| [`internationalization`](skills/internationalization/SKILL.md) | 区域策略、hreflang、翻译工作流、RTL 设计 |
|
||
| [`dependency-management`](skills/dependency-management/SKILL.md) | 包更新、安全补丁、锁文件维护 |
|
||
| [`cost-optimization`](skills/cost-optimization/SKILL.md) | 基础设施支出审计、规模调优、合同谈判 |
|
||
|
||
### 流程与团队（5）
|
||
|
||
| Skill | 功能说明 |
|
||
|---|---|
|
||
| [`stakeholder-communication`](skills/stakeholder-communication/SKILL.md) | 状态更新、高管汇报、项目沟通 |
|
||
| [`documentation-strategy`](skills/documentation-strategy/SKILL.md) | 文档体系、应记录内容、维护节奏 |
|
||
| [`vendor-evaluation`](skills/vendor-evaluation/SKILL.md) | 使用结构化评分标准进行工具与供应商选型 |
|
||
| [`team-onboarding-playbook`](skills/team-onboarding-playbook/SKILL.md) | 新员工与外包人员的 30-60-90 入职计划 |
|
||
| [`skill-creation-walkthrough`](skills/skill-creation-walkthrough/SKILL.md) | 元技能：如何编写你自己的自定义技能 |
|
||
<!-- CATALOG:END -->
|
||
|
||
---
|
||
|
||
## 推荐 MCP
|
||
|
||
当 Claude 能实时访问你的数据与工具时，技能组合效果最佳。[Model Context Protocol (MCP)](https://modelcontextprotocol.io/)) 服务器提供这一桥梁。本库中的技能无需任何 MCP 也能使用，但与合适的 MCP 搭配后，它们会从「Claude 遵循的框架」升级为「Claude 在你的真实系统上执行的工作流」。
|
||
|
||
以下是按技能领域划分的 MCP 精选清单。这些都不是必需的（SEO 审计套件所需的 Ahrefs MCP 除外）。均为分类推荐：同一用途若有多种选择，请挑选符合你技术栈的那一款。
|
||
|
||
### SEO、竞争情报与搜索数据
|
||
|
||
SEO 审计套件（技能 23-29）以 Ahrefs 为主要后端；基础 SEO 技能（16-22）可与任何等效工具配合。竞争情报类 MCP（Ahrefs、Semrush、Similarweb）覆盖重叠但不同的数据形态：外链与关键词、流量估算、受众行为。组合使用可获得最强信号。
|
||
|
||
**关于 MCP 成本的说明**：许多 MCP 只是对你已通过订阅付费的 API 的封装，调用 MCP 不会产生额外边际成本。另一些（Ahrefs、Semrush、Similarweb、DataForSEO）按调用消耗付费 API 额度，针对这些平台的长时 agent 会话可能很快消耗可观额度。各集成的成本模型见 rampstack.co/integrations 上对应落地页。适用处会标明免费但有速率限制（Google Search Console、PageSpeed Insights）。如有疑问，在运行数小时 agent 工作流前，请先查看平台的 API 定价。
|
||
|
||
**外链与关键词数据**
|
||
|
||
- **Ahrefs MCP** - 审计套件的主要后端；外链概况、关键词数据、内容探索、站点审计。被 `seo-audit-orchestration` 及 6 项审计套件技能（外链、关键词差距、内容差距、流量、站点健康、排名追踪）明确引用。按调用计费。
|
||
- **Semrush MCP** - Ahrefs 的替代或补充，美国关键词数据更强，并提供 Ahrefs 未覆盖的 SEO-PR 功能（Topic Research、品牌监测）。可与 `seo-keyword`、`seo-competitor`、`seo-content-gap-audit` 搭配。编写时请核实官方 MCP 端点；Semrush 已发布第一方 MCP 工具。按调用计费。
|
||
- **DataForSEO MCP** - 以开发者友好定价提供程序化 SEO 数据（SERP、关键词、外链）；当方法论决策取决于数据一致性时，可作为第三数据源用于交叉验证。按调用计费（提供免费套餐）。
|
||
|
||
**流量估算与竞争情报**
|
||
|
||
- **Similarweb MCP** - 竞争流量估算、受众人口统计、渠道构成（自然、付费、直接、引荐、社交、邮件）、行业基准、受众重叠分析。可与 `seo-competitor`、`seo-traffic-diagnosis`（外部因素层）、`brand-discovery`（竞争扫描）、`analytics-strategy`（行业基准）搭配。Ahrefs 回答「他们如何排名」，Semrush 回答「哪些关键词驱动什么」，Similarweb 则回答「流量多少、来自哪里、来自谁」。按调用计费。
|
||
|
||
**Search Console 与 Core Web Vitals**
|
||
|
||
- **Google Search Console MCP** - 免费、官方 Google 数据；对 `seo-traffic-diagnosis` 及任何需要真实点击与展示数据的审计至关重要。免费但有速率限制。
|
||
- **PageSpeed Insights MCP** - 免费，与 `performance-optimization`、`seo-site-health-audit` 搭配获取 Core Web Vitals 现场数据。免费但有速率限制。
|
||
|
||
### 开发与代码
|
||
|
||
- **GitHub MCP** - 与 `code-review-web`、`pm-spec-writing`、`roadmap-planning`、`incident-response` 搭配。让 Claude 阅读 PR、创建 issue、搜索代码并引用真实提交。
|
||
- **Filesystem MCP** - 本地文件与代码操作；可与大多数开发与内容技能搭配
|
||
- **Sentry MCP** - 与 `monitoring-and-alerting`、`incident-response` 搭配。真实错误数据将通用事故框架转化为具体诊断。
|
||
|
||
### 托管与基础设施
|
||
|
||
- **Cloudflare MCP** - 与 `domain-strategy`、`security-baseline`、`performance-optimization` 搭配。DNS 记录、重定向、页面规则、安全头。
|
||
- **Vercel MCP** - 与 `launch-runbook`、`incident-response` 搭配。部署、环境变量、构建日志。
|
||
- **Supabase MCP** - 与 `code-review-web`、`pm-spec-writing`、`backup-and-disaster-recovery` 搭配。Schema、查询、边缘函数。
|
||
|
||
### 分析与监控
|
||
|
||
- **PostHog MCP** - 与 `analytics-strategy`、`cro-optimization`、`journey-mapping` 搭配。基于真实数据的事件分类审查与漏斗分析。
|
||
- **Datadog MCP** - 与 `monitoring-and-alerting`、`incident-response` 搭配。针对实际指标进行 SLO 设计与告警路由。
|
||
|
||
### 沟通与项目管理
|
||
|
||
- **Slack MCP** - 与 `incident-response`、`stakeholder-communication`、`after-action-report` 搭配。读取频道上下文、起草更新、发布事故通报。
|
||
- **Linear MCP**（或 Jira MCP）- 与 `pm-spec-writing`、`roadmap-planning` 搭配。基于真实 issue 跟踪器撰写规格，而非通用模板。
|
||
|
||
### 研究与搜索
|
||
|
||
- **Web search**（在多数环境中已内置于 Claude）- 与 `brand-discovery`、`seo-keyword`、`seo-competitor`、`ux-research` 搭配
|
||
- **Tavily MCP** 或 **Brave Search MCP** - 用于更深入研究工作流的替代方案
|
||
|
||
### 在哪里找到它们
|
||
|
||
- [modelcontextprotocol.io/servers](https://modelcontextprotocol.io/servers)) - MCP 服务器的权威目录
|
||
- Claude.ai 内的 Connectors 目录（Settings → Connectors）
|
||
- Claude Code 中的 `claude mcp add`，用于直接安装
|
||
- 供应商官网的第一方服务器（多数主流 SaaS 工具现已提供官方 MCP）
|
||
|
||
### 构建你自己的 MCP
|
||
|
||
若本库中某技能需要尚不存在的工具集成，[MCP 文档](https://modelcontextprotocol.io/)) 会介绍如何构建。`seo-audit-orchestration` 技能是一个完整示例，展示如何围绕特定 MCP 的能力设计技能套件。
|
||
|
||
---
|
||
|
||
## 编写约定
|
||
|
||
每个技能遵循相同结构。完整规范见 [SKILL_AUTHORING.md](SKILL_AUTHORING.md)。
|
||
|
||
要点：
|
||
|
||
- **与栈无关。** SKILL.md 中不写具体框架版本。栈相关模式放在参考文件中。以 Ahrefs 驱动的审计套件是唯一点名工具的例外。
|
||
- **面向未来。** 引用持久规范（W3C、WHATWG、Schema.org、MDN、NN/g、WCAG）。避免追逐热点文章。
|
||
- **统一结构。** 每个 SKILL.md 章节顺序相同：何时使用、何时不使用、必需输入、框架、工作流、失败模式、输出格式、参考文件。
|
||
- **篇幅紧凑。** SKILL.md 少于 250 行。参考文件少于 400 行。
|
||
- **语气干脆。** 短句。具体示例胜过抽象建议。
|
||
|
||
---
|
||
|
||
## 仓库结构
|
||
|
||
```
|
||
skills/
|
||
skill-name/
|
||
SKILL.md
|
||
references/
|
||
template.md
|
||
checklist.md
|
||
example.md
|
||
SKILL_AUTHORING.md (the authoring guide)
|
||
CONTRIBUTING.md (how to contribute)
|
||
MAPPING.md (origin notes for skills ported from existing work)
|
||
README.md (this file)
|
||
LICENSE (MIT)
|
||
```
|
||
|
||
---
|
||
|
||
## 信任与安全
|
||
|
||
技能（Skills）是在代理（agent）权限下运行的指令与代码，因此目录（catalog）如何维护至关重要。变更仅能通过带有签名提交（signed commits）与线性历史（linear history）的拉取请求（pull requests）到达 `main`。每个技能会哈希写入校验和清单（`SKILLS.lock`），你可据此核验，并在合并前依据已记录的安全检查清单进行审查。
|
||
|
||
该流程可捕获已知类别的不安全内容，并让你确认某技能与经审查版本一致。这并不保证任何技能毫无风险。完整流程及问题上报方式见 [SECURITY.md](SECURITY.md)。
|
||
|
||
---
|
||
|
||
## 贡献
|
||
|
||
欢迎贡献。无论你是想修正错字、添加参考文件，还是提议全新技能，标准相同：遵循统一结构、保持文风一致，并证明该技能物有所值。
|
||
|
||
完整流程见 [CONTRIBUTING.md](CONTRIBUTING.md)。
|
||
|
||
最快路径：直接使用 [`skill-creation-walkthrough`](skills/skill-creation-walkthrough/SKILL.md) 技能本身。它讲授全部 103 个技能所共用的同一套编写规范，并附有实例与空白模板。
|
||
|
||
---
|
||
|
||
## 致谢
|
||
|
||
感谢 [@IgnacioChiaravalle](https://github.com/IgnacioChiaravalle) 提供的社区反馈，促成了 [PR #36](https://github.com/rampstackco/claude-skills/pull/36): 中对 CONTRIBUTING.md 的错字修正、SKILL.md 与其参考文件之间的交叉链接梳理，以及 accessibility-audit 技能新增的 [ARIA 模式参考](skills/accessibility-audit/references/aria-patterns.md)。
|
||
|
||
---
|
||
|
||
## 资源
|
||
|
||
### Anthropic 官方文档
|
||
|
||
- [Agent Skills 概览](https://docs.claude.com/en/docs/agents-and-tools/agent-skills/overview) - 权威参考
|
||
- [Anthropic 关于 Skills 的工程博客](https://www.anthropic.com/engineering) - 设计背景
|
||
- [Claude Code 文档](https://docs.claude.com/en/docs/claude-code/overview) - 多数技能将在此运行
|
||
- [Anthropic API 参考](https://docs.claude.com/en/api/getting-started) - 供程序化调用
|
||
|
||
### 其他值得了解的技能库
|
||
|
||
- [Anthropic 官方技能仓库](https://github.com/anthropics/skills) - Anthropic 发布的示例与基础组件
|
||
- [Awesome Claude Skills (Composio)](https://github.com/ComposioHQ/awesome-claude-skills) - 社区技能精选索引，本库收录于 Business & Marketing 分类
|
||
|
||
### 相关概念
|
||
|
||
- [Model Context Protocol (MCP)](https://modelcontextprotocol.io/) - 本库引用的 Ahrefs MCP 及其他工具集成所依托的协议
|
||
- [WCAG 快速参考](https://www.w3.org/WAI/WCAG22/quickref/) - accessibility audit 与 design 技能引用的无障碍标准
|
||
- [Schema.org](https://schema.org/) - SEO 套件各处引用的结构化数据词汇表
|
||
|
||
---
|
||
|
||
## 许可证
|
||
|
||
[MIT](LICENSE)。随意使用。Fork 它。用它交付产品。
|