visualize-plan
Compare original and translation side by side
🇺🇸
Original
English🇨🇳
Translation
ChinesePlan Visualization
计划可视化
Render planned changes as structured ASCII visualizations with risk analysis, execution order, and impact metrics. Every section answers a specific reviewer question.
Core principle: Encode judgment into visualization, not decoration.
bash
/ork:visualize-plan # Auto-detect from current branch
/ork:visualize-plan billing module redesign # Describe the plan
/ork:visualize-plan #234 # Pull from GitHub issue将计划中的变更渲染为包含风险分析、执行顺序和影响指标的结构化ASCII可视化内容。每个部分都对应解答评审者的一个具体问题。
核心原则: 将判断逻辑融入可视化,而非仅做装饰。
bash
/ork:visualize-plan # 从当前分支自动检测
/ork:visualize-plan billing module redesign # 描述计划内容
/ork:visualize-plan #234 # 从GitHub议题中获取Argument Resolution
参数解析
python
PLAN_INPUT = "$ARGUMENTS" # Full argument string
PLAN_TOKEN = "$ARGUMENTS[0]" # First token — could be issue "#234" or plan descriptionpython
PLAN_INPUT = "$ARGUMENTS" # 完整参数字符串
PLAN_TOKEN = "$ARGUMENTS[0]" # 第一个参数——可以是议题编号"#234"或计划描述If starts with "#", treat as GitHub issue number. Otherwise, plan description.
如果以"#"开头,视为GitHub议题编号。否则,视为计划描述。
$ARGUMENTS (full string) for multi-word descriptions (CC 2.1.59 indexed access)
$ARGUMENTS(完整字符串)用于多词描述(CC 2.1.59 索引访问)
---
---CRITICAL: Task Tracking
重要:任务跟踪
python
TaskCreate(subject="Visualize plan: {PLAN_INPUT}", description="Plan visualization with ASCII rendering", activeForm="Analyzing plan context")python
TaskCreate(subject="Visualize plan: {PLAN_INPUT}", description="Plan visualization with ASCII rendering", activeForm="Analyzing plan context")STEP -1: Check Memory for Prior Plans
步骤-1:检查内存中的历史计划
python
undefinedpython
undefinedSearch for related prior visualizations
搜索相关的历史可视化计划
mcp__memory__search_nodes(query="plan visualization {PLAN_INPUT}")
mcp__memory__search_nodes(query="plan visualization {PLAN_INPUT}")
If found, offer to compare with previous plan
如果找到,提供与历史计划对比的选项
undefinedundefinedSTEP 0: Detect or Clarify Plan Context
步骤0:检测或明确计划上下文
First, attempt auto-detection by running :
scripts/detect-plan-context.shbash
bash "$SKILL_DIR/scripts/detect-plan-context.sh"This outputs branch name, issue number (if any), commit count, and file change summary.
If auto-detection finds a clear plan (branch with commits diverging from main, or issue number in args), proceed to Step 1.
If ambiguous, clarify with AskUserQuestion:
python
AskUserQuestion(
questions=[{
"question": "What should I visualize?",
"header": "Source",
"options": [
{"label": "Current branch changes (Recommended)", "description": "Auto-detect from git diff against main", "markdown": "```\nBranch Diff Analysis\n────────────────────\n$ git diff main...HEAD\n\n→ File change manifest (+A, M, -D)\n→ Execution swimlane by phase\n→ Risk dashboard + pre-mortems\n→ Impact summary (lines, tests, API)\n```"},
{"label": "Describe the plan", "description": "I'll explain what I'm planning to change", "markdown": "```\nPlan Description\n────────────────\nYou describe → I visualize:\n\n→ Before/after architecture diagrams\n→ Execution order with dependencies\n→ Risk analysis per component\n→ Decision log (ADR-lite format)\n```"},
{"label": "GitHub issue", "description": "Pull plan from a specific issue number", "markdown": "```\nGitHub Issue Source\n───────────────────\n$ gh issue view #N\n\n→ Extract requirements from body\n→ Map to file-level changes\n→ Generate execution phases\n→ Link back to issue for tracking\n```"},
{"label": "Quick file diff only", "description": "Just show the change manifest, skip analysis", "markdown": "```\nQuick File Diff\n───────────────\n[A] src/new-file.ts +120\n[M] src/existing.ts +15 -8\n[D] src/old-file.ts -45\n─────────────────────────────\nNET: +82 lines, 3 files\n\nNo risk analysis or swimlanes\n```"}
],
"multiSelect": false
}]
)首先,尝试通过运行自动检测:
scripts/detect-plan-context.shbash
bash "$SKILL_DIR/scripts/detect-plan-context.sh"该脚本会输出分支名称、议题编号(如果有)、提交次数和文件变更摘要。
如果自动检测到明确的计划(与main分支有提交差异的分支,或参数中包含议题编号),进入步骤1。
如果上下文模糊,通过AskUserQuestion明确:
python
AskUserQuestion(
questions=[{
"question": "我应该可视化什么内容?",
"header": "来源",
"options": [
{"label": "当前分支变更(推荐)", "description": "自动检测与main分支的git diff差异", "markdown": "```\n分支差异分析\n────────────────────\n$ git diff main...HEAD\n\n→ 文件变更清单(+新增、M修改、-删除)\n→ 按阶段划分的执行泳道\n→ 风险仪表盘 + 事前分析\n→ 影响摘要(代码行数、测试、API)\n```"},
{"label": "描述计划内容", "description": "我会说明自己计划进行的变更", "markdown": "```\n计划描述\n────────────────\n你描述内容 → 我生成可视化:\n\n→ 前后架构对比图\n→ 带依赖关系的执行顺序\n→ 各组件的风险分析\n→ 决策日志(ADR精简格式)\n```"},
{"label": "GitHub议题", "description": "从指定议题编号中获取计划", "markdown": "```\nGitHub议题来源\n───────────────────\n$ gh issue view #N\n\n→ 从议题正文中提取需求\n→ 映射到文件级变更\n→ 生成执行阶段\n→ 关联回议题以便跟踪\n```"},
{"label": "仅快速文件差异", "description": "仅展示变更清单,跳过分析", "markdown": "```\n快速文件差异\n───────────────\n[A] src/new-file.ts +120\n[M] src/existing.ts +15 -8\n[D] src/old-file.ts -45\n─────────────────────────────\n总计:+82行,3个文件\n\n无风险分析或泳道图\n```"}
],
"multiSelect": false
}]
)STEP 1: Gather Data
步骤1:收集数据
Run for precise counts:
scripts/analyze-impact.shbash
bash "$SKILL_DIR/scripts/analyze-impact.sh"This produces: files by action (add/modify/delete), line counts, test files affected, and dependency changes.
For architecture-level understanding, spawn an Explore agent on the affected directories:
python
Agent(
subagent_type="Explore",
prompt="Explore the architecture of {affected_directories}. Return: component diagram, key data flows, health scores per module. Use the ascii-visualizer skill for diagrams.",
model="haiku"
)运行获取精确统计:
scripts/analyze-impact.shbash
bash "$SKILL_DIR/scripts/analyze-impact.sh"该脚本会生成:按操作类型(新增/修改/删除)分类的文件、代码行数、受影响的测试文件,以及依赖变更情况。
为了理解架构层面的信息,在受影响的目录上启动一个Explore agent:
python
Agent(
subagent_type="Explore",
prompt="探索{affected_directories}的架构。返回:组件图、关键数据流、各模块的健康评分。使用ascii-visualizer skill生成图表。",
model="haiku"
)STEP 2: Render Tier 1 Header (Always)
步骤2:渲染一级标题(必选)
Use template. Load for field computation (risk level, confidence, reversibility).
assets/tier1-header.mdRead("${CLAUDE_SKILL_DIR}/references/visualization-tiers.md")PLAN: {plan_name} ({issue_ref}) | {phase_count} phases | {file_count} files | +{added} -{removed} lines
Risk: {risk_level} | Confidence: {confidence} | Reversible until {last_safe_phase}
Branch: {branch} -> {base_branch}
[1] Changes [2] Execution [3] Risks [4] Decisions [5] Impact [all]使用模板。加载计算相关字段(风险等级、置信度、可回退性)。
assets/tier1-header.mdRead("${CLAUDE_SKILL_DIR}/references/visualization-tiers.md")计划:{plan_name}({issue_ref}) | {phase_count}个阶段 | {file_count}个文件 | +{added}行 -{removed}行
风险:{risk_level} | 置信度:{confidence} | 可回退至{last_safe_phase}阶段
分支:{branch} -> {base_branch}
[1] 变更 [2] 执行 [3] 风险 [4] 决策 [5] 影响 [全部]STEP 3: Ask Which Sections to Expand
步骤3:询问需要展开的章节
python
AskUserQuestion(
questions=[{
"question": "Which sections to render?",
"header": "Sections",
"options": [
{"label": "All sections", "description": "Full visualization with all 5 core sections", "markdown": "```\n[1] Change Manifest [A]/[M]/[D] file tree\n[2] Execution Swimlane with phases\n[3] Risks Dashboard + pre-mortems\n[4] Decisions ADR-lite decision log\n[5] Impact Lines, tests, API, deps\n```"},
{"label": "Changes + Execution", "description": "File diff tree and execution swimlane", "markdown": "```\n[1] Change Manifest\n [M] src/auth.ts +45 -12\n [A] src/oauth.ts +89\n\n[2] Execution Swimlane\n Phase 1 ====[auth]========▶\n Phase 2 ----[blocked]--===▶\n```"},
{"label": "Risks + Decisions", "description": "Risk dashboard and decision log", "markdown": "```\n[3] Risk Dashboard\n MEDIUM ██░░ migration reversible\n HIGH ███░ API breaking change\n Pre-mortem: \"What if auth fails?\"\n\n[4] Decision Log\n D1: OAuth2 over JWT (security)\n D2: Postgres over Redis (durability)\n```"},
{"label": "Impact only", "description": "Just the numbers: files, lines, tests, API surface", "markdown": "```\n[5] Impact Summary\n ┌──────────┬─────┬───────┐\n │ Metric │Count│ Delta │\n ├──────────┼─────┼───────┤\n │ Files │ 12 │ +3 │\n │ Lines │ 450 │ +127 │\n │ Tests │ 8 │ +4 │\n │ API sfc │ 3 │ +1 │\n └──────────┴─────┴───────┘\n```"}
],
"multiSelect": false
}]
)python
AskUserQuestion(
questions=[{
"question": "需要渲染哪些章节?",
"header": "章节",
"options": [
{"label": "所有章节", "description": "包含全部5个核心章节的完整可视化内容", "markdown": "```\n[1] 变更清单 [新增]/[修改]/[删除]文件树\n[2] 执行流程 带阶段的泳道图\n[3] 风险分析 仪表盘 + 事前分析\n[4] 决策日志 ADR精简格式的决策记录\n[5] 影响评估 代码行数、测试、API、依赖\n```"},
{"label": "变更 + 执行", "description": "文件差异树和执行泳道图", "markdown": "```\n[1] 变更清单\n [M] src/auth.ts +45 -12\n [A] src/oauth.ts +89\n\n[2] 执行泳道图\n 阶段1 ====[auth]========▶\n 阶段2 ----[阻塞]--===▶\n```"},
{"label": "风险 + 决策", "description": "风险仪表盘和决策日志", "markdown": "```\n[3] 风险仪表盘\n 中等 ██░░ 迁移可回退\n 高 ███░ API破坏性变更\n 事前分析:“如果认证失败怎么办?”\n\n[4] 决策日志\n D1:选用OAuth2而非JWT(安全性考量)\n D2:选用Postgres而非Redis(持久性考量)\n```"},
{"label": "仅影响评估", "description": "仅展示数值:文件、代码行数、测试、API接口", "markdown": "```\n[5] 影响摘要\n ┌──────────┬─────┬───────┐\n │ 指标 │数量 │ 变化量│\n ├──────────┼─────┼───────┤\n │ 文件 │ 12 │ +3 │\n │ 代码行数 │ 450 │ +127 │\n │ 测试用例 │ 8 │ +4 │\n │ API接口 │ 3 │ +1 │\n └──────────┴─────┴───────┘\n```"}
],
"multiSelect": false
}]
)STEP 4: Render Requested Sections
步骤4:渲染请求的章节
Render each requested section following conventions. Use the corresponding reference for ASCII patterns:
${CLAUDE_SKILL_DIR}/rules/section-rendering.md| Section | Reference | Key Convention |
|---|---|---|
| [1] Change Manifest | (load | |
| [2] Execution Swimlane | (load | |
| [3] Risk Dashboard | (load | Reversibility timeline + 3 pre-mortems |
| [4] Decision Log | (load | ADR-lite: Context/Decision/Alternatives/Tradeoff |
| [5] Impact Summary | (load | Table: Added/Modified/Deleted/NET + tests/API/deps |
遵循的约定渲染每个请求的章节。使用对应的参考文件获取ASCII样式:
${CLAUDE_SKILL_DIR}/rules/section-rendering.md| 章节 | 参考文件 | 核心约定 |
|---|---|---|
| [1] 变更清单 | (加载 | |
| [2] 执行泳道图 | (加载 | |
| [3] 风险仪表盘 | (加载 | 可回退时间线 + 3项事前分析 |
| [4] 决策日志 | (加载 | ADR精简格式:背景/决策/备选方案/权衡 |
| [5] 影响摘要 | (加载 | 表格:新增/修改/删除/总计 + 测试/API/依赖 |
STEP 5: Offer Actions
步骤5:提供后续操作选项
After rendering, offer next steps:
python
AskUserQuestion(
questions=[{
"question": "What next?",
"header": "Actions",
"options": [
{"label": "Write to designs/", "description": "Save as designs/{branch}.md for PR review", "markdown": "```\nSave to File\n────────────\ndesigns/\n └── feat-billing-redesign.md\n ├── Header + metadata\n ├── All rendered sections\n └── Ready for PR description\n```"},
{"label": "Generate GitHub issues", "description": "Create issues from execution phases with labels and milestones", "markdown": "```\nGitHub Issues\n─────────────\n#101 [billing] Phase 1: Schema migration\n labels: component:billing, risk:medium\n#102 [billing] Phase 2: API endpoints\n labels: component:billing, risk:low\n blocked-by: #101\n```"},
{"label": "Drill deeper", "description": "Expand blast radius, cross-layer check, or migration checklist", "markdown": "```\nDeep Dive Options\n─────────────────\n[6] Blast Radius\n direct → transitive → test impact\n[7] Cross-Layer Consistency\n Frontend ↔ Backend endpoint gaps\n[8] Migration Checklist\n Ordered runbook with time estimates\n```"},
{"label": "Done", "description": "Plan visualization complete"}
],
"multiSelect": false
}]
)Write to file: Save full report to using template.
designs/{branch-name}.mdassets/plan-report.mdGenerate issues: For each execution phase, create a GitHub issue with title , labels (component + ), milestone, body from plan sections, and blocked-by references.
[{component}] {phase_description}risk:{level}Store in memory: Save plan summary to knowledge graph for future comparison:
python
mcp__memory__create_entities(entities=[{
"name": "Plan: {plan_name}",
"entityType": "plan-visualization",
"observations": [
"Branch: {branch}",
"Risk: {risk_level}, Confidence: {confidence}",
"Phases: {phase_count}, Files: {file_count}",
"Key decisions: {decision_summary}"
]
}])渲染完成后,提供下一步操作选项:
python
AskUserQuestion(
questions=[{
"question": "下一步操作?",
"header": "操作",
"options": [
{"label": "写入designs/目录", "description": "保存为designs/{branch}.md用于PR评审", "markdown": "```\n保存到文件\n────────────\ndesigns/\n └── feat-billing-redesign.md\n ├── 标题 + 元数据\n ├── 所有渲染的章节\n └── 可直接用于PR描述\n```"},
{"label": "生成GitHub议题", "description": "从执行阶段创建带标签和里程碑的议题", "markdown": "```\nGitHub议题\n─────────────\n#101 [billing] 阶段1:Schema迁移\n 标签:component:billing, risk:medium\n#102 [billing] 阶段2:API端点开发\n 标签:component:billing, risk:low\n 依赖于:#101\n```"},
{"label": "深入分析", "description": "展开影响范围、跨层检查或迁移清单", "markdown": "```\n深入分析选项\n─────────────────\n[6] 影响范围\n 直接影响 → 间接影响 → 测试影响\n[7] 跨层一致性\n 前端 ↔ 后端端点差异检查\n[8] 迁移清单\n 带时间预估的有序执行手册\n```"},
{"label": "完成", "description": "计划可视化已完成"}
],
"multiSelect": false
}]
)写入文件: 使用模板将完整报告保存到。
assets/plan-report.mddesigns/{branch-name}.md生成议题: 为每个执行阶段创建一个GitHub议题,标题格式为,标签(组件 + ),里程碑,正文来自计划章节,以及依赖关系引用。
[{component}] {phase_description}risk:{level}存储到内存: 将计划摘要保存到知识图谱以便未来对比:
python
mcp__memory__create_entities(entities=[{
"name": "Plan: {plan_name}",
"entityType": "plan-visualization",
"observations": [
"分支: {branch}",
"风险: {risk_level}, 置信度: {confidence}",
"阶段数: {phase_count}, 文件数: {file_count}",
"关键决策: {decision_summary}"
]
}])Deep Dives (Tier 3, on request)
深入分析(三级,按需触发)
Available when user selects "Drill deeper". Load for cross-layer and migration patterns.
Read("${CLAUDE_SKILL_DIR}/references/deep-dives.md")| Section | What It Shows | Reference |
|---|---|---|
| [6] Blast Radius | Concentric rings of impact (direct -> transitive -> tests) | (load |
| [7] Cross-Layer Consistency | Frontend/backend endpoint alignment with gap detection | (load |
| [8] Migration Checklist | Ordered runbook with sequential/parallel blocks and time estimates | (load |
当用户选择“深入分析”时可用。加载获取跨层和迁移相关样式。
Read("${CLAUDE_SKILL_DIR}/references/deep-dives.md")| 章节 | 展示内容 | 参考文件 |
|---|---|---|
| [6] 影响范围 | 影响的同心圆(直接 → 间接 → 测试) | (加载 |
| [7] 跨层一致性 | 前端/后端端点对齐检查及差异检测 | (加载 |
| [8] 迁移清单 | 带顺序和并行块及时间预估的执行手册 | (加载 |
Key Principles
核心原则
| Principle | Application |
|---|---|
| Progressive disclosure | Tier 1 header always, sections on request |
| Judgment over decoration | Every section answers a reviewer question |
| Precise over estimated | Use scripts for file/line counts |
| Honest uncertainty | Confidence levels, pre-mortems, tradeoff costs |
| Actionable output | Write to file, generate issues, drill deeper |
| Anti-slop | No generic transitions, no fake precision, no unused sections |
| 原则 | 应用方式 |
|---|---|
| 渐进式披露 | 始终展示一级标题,按需展示章节 |
| 判断优先于装饰 | 每个部分都解答评审者的具体问题 |
| 精确而非估算 | 使用脚本获取文件/代码行数统计 |
| 坦诚不确定性 | 标注置信度、事前分析、权衡成本 |
| 可执行输出 | 写入文件、生成议题、深入分析 |
| 拒绝冗余 | 无通用过渡内容、无虚假精确值、无未使用章节 |
Rules Quick Reference
规则快速参考
| Rule | Impact | What It Covers |
|---|---|---|
section-rendering (load | HIGH | Rendering conventions for all 5 core sections |
| ASCII diagrams | MEDIUM | Via |
| 规则 | 影响程度 | 覆盖内容 |
|---|---|---|
section-rendering(加载 | 高 | 所有5个核心章节的渲染约定 |
| ASCII图表 | 中 | 通过 |
References
参考文件
Load on demand with :
Read("${CLAUDE_SKILL_DIR}/references/<file>")| File | Content |
|---|---|
| Progressive disclosure tiers and header field computation |
| Change manifest ASCII patterns |
| Execution swimlane ASCII patterns |
| Risk dashboard ASCII patterns |
| Decision log ASCII patterns |
| Blast radius ASCII patterns |
| Cross-layer consistency and migration checklist |
按需通过加载:
Read("${CLAUDE_SKILL_DIR}/references/<file>")| 文件 | 内容 |
|---|---|
| 渐进式披露层级和标题字段计算规则 |
| 变更清单ASCII样式 |
| 执行泳道图ASCII样式 |
| 风险仪表盘ASCII样式 |
| 决策日志ASCII样式 |
| 影响范围ASCII样式 |
| 跨层一致性和迁移清单 |
Assets
资源文件
Load on demand with :
Read("${CLAUDE_SKILL_DIR}/assets/<file>")| File | Content |
|---|---|
| Full mustache-style report template |
| Impact table template |
| 5-line summary template |
按需通过加载:
Read("${CLAUDE_SKILL_DIR}/assets/<file>")| 文件 | 内容 |
|---|---|
| 完整的mustache风格报告模板 |
| 影响评估表格模板 |
| 5行摘要模板 |
Related Skills
相关Skills
- - Execute planned changes
ork:implement - - Understand current architecture
ork:explore - - Evaluate complexity and risks
ork:assess - - Search prior plan visualizations
ork:memory - - Store plan decisions for future reference
ork:remember
- - 执行计划中的变更
ork:implement - - 理解当前架构
ork:explore - - 评估复杂度和风险
ork:assess - - 搜索历史计划可视化内容
ork:memory - - 存储计划决策以便未来参考
ork:remember