/note-it
Capture implementation notes after code implementation and review/fix. Records design decisions, deviations, tradeoffs, and open questions to docs/issue#XXXX.html. Triggers on: /note-it, 记录笔记, implementation notes.
$ npx -y skills add smallnest/goal-workflow --skill note-it --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
- You can call itInvoke it directly when you want it.
- Slash command
/note-it
Context preview
The summary Claude sees to decide when to auto-load this skill.
Capture implementation notes after code implementation and review/fix. Records design decisions, deviations, tradeoffs, and open questions to docs/issue#XXXX.html. Triggers on: /note-it, 记录笔记, implementation notes.
SKILL.md
note-it.SKILL.mdname: note-it
description: "Capture implementation notes after code implementation and review/fix. Records design decisions, deviations, tradeoffs, and open questions to docs/issue#XXXX.html. Triggers on: /note-it, 记录笔记, implementation notes."
user-invocable: true
Implementation Notes
After completing implementation and review/fix for an Issue, capture a running implementation notes file that documents how the implementation diverges from or interprets the spec.
Triggers
Use when:
- After `/goal` implementation and `/review-it` are both complete
- User says "记录笔记", "implementation notes", "note-it", "/note-it"
- Before `/ship-it` (as a final checkpoint)
- Any time the user wants to capture design rationale
The Job
1. Determine the Issue number from context (branch name, `/goal` target, or user input) 2. Review the implementation against the Issue spec / PRD 3. Generate an HTML notes file at `docs/issue#XXXX.html` 4. Present a summary to the user
Notes Structure
The HTML file must cover these four categories. If a category has nothing to report, write "None" with a brief explanation.
1. Design Decisions
Choices made where the spec was ambiguous or silent:
- What was the ambiguity?
- What choice did you make?
- What was the rationale?
2. Deviations
Places where you intentionally departed from the spec:
- What did the spec say?
- What did you implement instead?
- Why was the deviation necessary or better?
3. Tradeoffs
Alternatives you considered and why you picked what you did:
- What were the viable alternatives?
- What were the pros/cons of each?
- Why did the chosen approach win?
4. Open Questions
Anything you'd want confirmed or revised:
- What assumption are you unsure about?
- What should the user verify?
- What might need follow-up?
Output
- **Format:** HTML
- **Location:** `docs/`
- **Filename:** `issue#XXXX.html` (where XXXX is the zero-padded Issue number, e.g., `issue#0042.html`)
HTML Template
Use this exact HTML structure:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Implementation Notes — Issue #XXXX</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
background: #FAF9F6;
color: #1a1a1a;
padding: 2.5rem 2rem;
line-height: 1.7;
}
.container { max-width: 800px; margin: 0 auto; }
h1 { font-size: 1.375rem; font-weight: 700; margin-bottom: 0.25rem; }
.meta { color: #8B8680; font-size: 0.8125rem; margin-bottom: 2rem; }
h2 {
font-size: 1rem;
font-weight: 600;
margin-top: 2rem;
margin-bottom: 0.75rem;
padding-bottom: 0.375rem;
border-bottom: 1px solid #E8E4DE;
display: flex; align-items: center; gap: 0.5rem;
}
.dot {
width: 8px; height: 8px; border-radius: 50%; display: inline-block;
}
.dot.design { background: #5B8A72; }
.dot.deviation { background: #D97757; }
.dot.tradeoff { background: #4A6FA5; }
.dot.question { background: #D4A843; }
.item {
background: #FFFFFF;
border: 1px solid #E8E4DE;
border-radius: 8px;
padding: 1rem 1.25rem;
margin-bottom: 0.75rem;
box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.item h3 { font-size: 0.875rem; font-weight: 600; margin-bottom: 0.375rem; }
.item p { font-size: 0.8125rem; color: #4A4540; margin-bottom: 0.375rem; }
.label {
display: inline-block;
font-size: 0.6875rem;
font-weight: 500;
padding: 0.125rem 0.5rem;
border-radius: 4px;
margin-right: 0.375rem;
}
.label-design { background: #F5F8F6; color: #5B8A72; border: 1px solid #5B8A72; }
.label-deviation { background: #FFF5F0; color: #D97757; border: 1px solid #D97757; }
.label-tradeoff { background: #F0F4F8; color: #4A6FA5; border: 1px solid #4A6FA5; }
.label-question { background: #FDF8F0; color: #D4A843; border: 1px solid #D4A843; }
.none { color: #B0AAA4; font-style: italic; font-size: 0.8125rem; }
.footer {
text-align: center; margin-top: 2.5rem; color: #B0AAA4;
font-size: 0.6875rem;
}
</style>
</head>
<body>
<div class="container">
<h1>Implementation Notes</h1>
<p class="meta">Issue <a href="{{ISSUE_URL}}">#{{ISSUE_NUMBER}}</a> — {{ISSUE_TITLE}} — {{DATE}}</p>
<h2><span class="dot design"></span> Design Decisions</h2>
<!-- One .item per decision, or .none if none -->
<h2><span class="dot deviation"></span> Deviations</h2>
<!-- One .item per deviation, or .none if none -->
<h2><span class="dot tradeoff"></span> Tradeoffs</h2>
<!-- One .item per tradeoff, or .none if none -->
<h2><span class="dot question"></span> Open Questions</h2>
<!-- One .item per question, or .none if none -->
<p class="footer">Generated by goal-workflow /note-it</p>
</div>
</body>
</html>Example Item
<div class="item">
<h3><span class="label label-design">Decision</span> Used interface-based polymorphism instead of switch</h3>
<p><strong>Ambiguity:</strong> The spec said "handle different types" without specifying how.</p>
<p><strong>Choice:</strong> Defined a <code>Handler</code> interface with per-type implementations.</p>
<p><strong>Rationale:</strong> Adding new types requires no changes to existing code (Open/Closed Principle). A switch would grow unboundedly.</p>
</div>
How to Determine the Issue Number
1. If the user provides it directly (e.g., `/note-it #42`), use it 2. If on a branch named `feat/issue-42-*` or `fix/issue-42-*`, extract `42` 3. If the last `/goal` target was `#42`, use `42` 4. Otherwise, ask the user: "Which Issue number should I use for the notes file?"
Edge Cases
| Scenario | Handling | |----------|----------| | No Issue number found | Ask the user to specify | | `docs
Read more
name: note-it description: "Capture implementation notes after code implementation and review/fix. Records design decisions, deviations, tradeoffs, and open questions to docs/issue#XXXX.html. Triggers on: /note-it, 记录笔记, implementation notes." user-invocable: true
Implementation Notes
After completing implementation and review/fix for an Issue, capture a running implementation notes file that documents how the implementation diverges from or interprets the spec.
Triggers
Use when:
- After `/goal` implementation and `/review-it` are both complete
- User says "记录笔记", "implementation notes", "note-it", "/note-it"
- Before `/ship-it` (as a final checkpoint)
- Any time the user wants to capture design rationale
The Job
1. Determine the Issue number from context (branch name, `/goal` target, or user input) 2. Review the implementation against the Issue spec / PRD 3. Generate an HTML notes file at `docs/issue#XXXX.html` 4. Present a summary to the user
Notes Structure
The HTML file must cover these four categories. If a category has nothing to report, write "None" with a brief explanation.
1. Design Decisions
Choices made where the spec was ambiguous or silent:
- What was the ambiguity?
- What choice did you make?
- What was the rationale?
2. Deviations
Places where you intentionally departed from the spec:
- What did the spec say?
- What did you implement instead?
- Why was the deviation necessary or better?
3. Tradeoffs
Alternatives you considered and why you picked what you did:
- What were the viable alternatives?
- What were the pros/cons of each?
- Why did the chosen approach win?
4. Open Questions
Anything you'd want confirmed or revised:
- What assumption are you unsure about?
- What should the user verify?
- What might need follow-up?
Output
- **Format:** HTML
- **Location:** `docs/`
- **Filename:** `issue#XXXX.html` (where XXXX is the zero-padded Issue number, e.g., `issue#0042.html`)
HTML Template
Use this exact HTML structure:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Implementation Notes — Issue #XXXX</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
background: #FAF9F6;
color: #1a1a1a;
padding: 2.5rem 2rem;
line-height: 1.7;
}
.container { max-width: 800px; margin: 0 auto; }
h1 { font-size: 1.375rem; font-weight: 700; margin-bottom: 0.25rem; }
.meta { color: #8B8680; font-size: 0.8125rem; margin-bottom: 2rem; }
h2 {
font-size: 1rem;
font-weight: 600;
margin-top: 2rem;
margin-bottom: 0.75rem;
padding-bottom: 0.375rem;
border-bottom: 1px solid #E8E4DE;
display: flex; align-items: center; gap: 0.5rem;
}
.dot {
width: 8px; height: 8px; border-radius: 50%; display: inline-block;
}
.dot.design { background: #5B8A72; }
.dot.deviation { background: #D97757; }
.dot.tradeoff { background: #4A6FA5; }
.dot.question { background: #D4A843; }
.item {
background: #FFFFFF;
border: 1px solid #E8E4DE;
border-radius: 8px;
padding: 1rem 1.25rem;
margin-bottom: 0.75rem;
box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.item h3 { font-size: 0.875rem; font-weight: 600; margin-bottom: 0.375rem; }
.item p { font-size: 0.8125rem; color: #4A4540; margin-bottom: 0.375rem; }
.label {
display: inline-block;
font-size: 0.6875rem;
font-weight: 500;
padding: 0.125rem 0.5rem;
border-radius: 4px;
margin-right: 0.375rem;
}
.label-design { background: #F5F8F6; color: #5B8A72; border: 1px solid #5B8A72; }
.label-deviation { background: #FFF5F0; color: #D97757; border: 1px solid #D97757; }
.label-tradeoff { background: #F0F4F8; color: #4A6FA5; border: 1px solid #4A6FA5; }
.label-question { background: #FDF8F0; color: #D4A843; border: 1px solid #D4A843; }
.none { color: #B0AAA4; font-style: italic; font-size: 0.8125rem; }
.footer {
text-align: center; margin-top: 2.5rem; color: #B0AAA4;
font-size: 0.6875rem;
}
</style>
</head>
<body>
<div class="container">
<h1>Implementation Notes</h1>
<p class="meta">Issue <a href="{{ISSUE_URL}}">#{{ISSUE_NUMBER}}</a> — {{ISSUE_TITLE}} — {{DATE}}</p>
<h2><span class="dot design"></span> Design Decisions</h2>
<!-- One .item per decision, or .none if none -->
<h2><span class="dot deviation"></span> Deviations</h2>
<!-- One .item per deviation, or .none if none -->
<h2><span class="dot tradeoff"></span> Tradeoffs</h2>
<!-- One .item per tradeoff, or .none if none -->
<h2><span class="dot question"></span> Open Questions</h2>
<!-- One .item per question, or .none if none -->
<p class="footer">Generated by goal-workflow /note-it</p>
</div>
</body>
</html>Example Item
<div class="item"> <h3><span class="label label-design">Decision</span> Used interface-based polymorphism instead of switch</h3> <p><strong>Ambiguity:</strong> The spec said "handle different types" without specifying how.</p> <p><strong>Choice:</strong> Defined a <code>Handler</code> interface with per-type implementations.</p> <p><strong>Rationale:</strong> Adding new types requires no changes to existing code (Open/Closed Principle). A switch would grow unboundedly.</p> </div>
How to Determine the Issue Number
1. If the user provides it directly (e.g., `/note-it #42`), use it 2. If on a branch named `feat/issue-42-*` or `fix/issue-42-*`, extract `42` 3. If the last `/goal` target was `#42`, use `42` 4. Otherwise, ask the user: "Which Issue number should I use for the notes file?"
Edge Cases
| Scenario | Handling | |----------|----------| | No Issue number found | Ask the user to specify | | `docs
An AI-driven development workflow — from PRD to shipped code, all within Claude Code.
Other skills on goal-workflow-skills.
- /article-icons
Illustrate an article (Markdown, HTML, etc.) with animated-style icons from itshover.com/icons. Fetches icons as clean inline SVG and places them at section headings, key concepts, lists, and callouts. Triggers on: /article-icons, 配图, 给文章配图标, add icons to article, illustrate
Open skill - /code-to-spec
Reverse-engineer a SPEC document from an existing project. Analyzes code, config, tests, and structure to produce a comprehensive specification. Triggers on: code-to-spec, reverse spec, generate spec, 逆向规格, 生成规格文档, 生成设计文档, 生成设计方案, extract spec, document this project, what does
Open skill - /graph
Graph engineering for parallel task execution: convert a task, PRD, SPEC, or issue set into a dependency graph (DAG), layer it into supersteps, then implement each independent node concurrently with subagents — each node runs /goal → /review-it → /ship-it in an isolated git
Open skill - /humanize-it
对指定文档进行去 AI 味的改写。自动选择最合适的人性化策略(humanizer-zh / humanize-chinese / technical-writing), 迭代改写直到效果达标或迭代 42 次为止。适用于中文文本的去 AI 化处理,包括通用文章、技术文档、学术论文等。 Use when user says: "humanize this", "去AI味", "降AIGC", "人性化改写", "改成人话", "去除AI痕迹", "humanize document", "make text human-like", "去机器味",
Open skill - /insight-diagram
为任意项目生成 UML 图、架构图和流程图。分析代码库后让用户选择要生成的图表类型,使用 architecture-diagram skill 渲染为 HTML+SVG,保存到 docs/ 目录。适用于任何软件项目的文档可视化。
Open skill - /listenhub-tts
使用 ListenHub API 将文本转换为语音(TTS)。支持三种模式:快速合成(/v1/tts)、 多角色脚本(/v1/speech)、长文本流式合成(/v1/flow-speech/episodes)。 音色未指定时自动获取音色列表供用户选择,默认使用 chat-girl-105-cn(晓曼)。 Use when user says: "tts", "text to speech", "语音合成", "文字转语音", "朗读", "生成语音", "生成音频", "转音频", "text to audio"
Open skill

