技术路线图-三通道(tech-roadmap-trio)
把用户的文字描述一次性变成三份互补产物:
| 通道 | 产物 | 用途 |
|---|---|---|
| ① 矢量 | *.svg |
插 Word/PPT/LaTeX,或导入 draw.io/Figma 深度改版 |
| ② 交互 | *-editor.html |
零依赖网页:拖节点(连线自动跟随)、双击改字、导出 SVG |
| ③ 可编辑文档 | *.docx |
Word 原生形状,每个框、每条线都能单独选中/改字/拖动,零位图 |
通道③是本技能相对 bw-roadmap 的核心增强:不是把 SVG 当图片贴进 Word,而是以 SVG 为唯一数据源做逐元素转译(scripts/svg2docx.py),几何、圆角、线宽、虚实、箭头、字号、行距全部按 SVG 取值还原。
设计依据
- 绘制规范要点:
references/规范要点.md(生成前速览,尤其「方法-内容匹配」与视觉纪律) - DOCX 转译的 12 条硬性坑点:
references/docx转译要点.md,写/改svg2docx.py或verify.py前必读 - 自检脚本:
scripts/selftest.py(单元用例 + 端到端冒烟;改任何脚本后先跑它,--word追加 Word 实测)
硬性约束(不可协商)
- 纯黑白:仅
#000000线条 +#ffffff填充,禁止颜色/色块/图标/位图;逻辑差异只靠线型表达(实线细箭头=分解/因果,虚线箭头=反馈/关联,粗空心箭头=阶段推进,虚线框=分区)。 - 矢量:只用 rect/path/line/text/tspan 基本图元,不嵌 base64。
- 可编辑:节点只改
transform;连线绑定data-from/data-to,由编辑器脚本重算;样式集中在<style>块;
id 规则:标题node-title、阶段标签node-stage{阶段}、父框node-s{阶段}-p{块}、
子框node-s{阶段}-c{块}-{子项}、方法框node-m{阶段}、分区zone-s{阶段}、连线edge-*、反馈标签label-feedback。 - 布局遵循三通道骨架:左栏阶段标签|中栏内容分区(虚线框+树状分解)|右栏研究方法;顶部全宽标题框;层级≤5。
- DOCX 必须由 svg2docx.py 生成:禁止手绘形状、禁止把 SVG 转 PNG 再插入(那是位图,不可编辑,违反通道③的定义)。
工作流
第 1 步:解析用户输入 → spec JSON
用户可给自由文本或结构化描述。按以下 schema 生成 JSON(UTF-8,无 BOM):
{
"title": "必填|整图总标题",
"stages": [
{
"name": "必填|阶段名(左栏标签,如「提出问题」,建议 4 字)",
"methods": ["右栏方法框,每项一行,最多 3 行"],
"content": [
{"text": "父框文字", "children": ["子框1", "子框2", "子框3", "子框4"]}
]
}
],
"feedback": {"from": 4, "to": 3, "label": "迭代反馈"},
"emphasis": ["3.1", "3.1.2"]
}
stages2–6 个;每个 stage 的content可多个内容块(块内 = 父框 + 横排子框树);feedback可选,仅支持 from(下)→to(上) 的回溯虚线;emphasis可选,格式阶段.内容块或阶段.内容块.子项,效果 = 加粗边框(黑白图中突出创新点的唯一合规方式);- 抽取自由文本:段落标志→
name;顿号/分号列举→children;「采用××法/基于××理论」→methods;「反馈/迭代」→feedback;「重点/创新」→emphasis; - 缺省字段用默认值补全后,必须在回复中向用户声明假设;
- 必填最小集:
title+ ≥2 个含name的stages。
第 2 步:生成通道① SVG 与通道② HTML 编辑器
# <skill_dir> 为本技能安装目录(本 SKILL.md 所在目录);仅需标准库
python "<skill_dir>/scripts/generate.py" "<spec.json 路径>" "<输出目录>"
输出 <名称>.svg + <名称>-editor.html。脚本自带程序化自检:文字截断、标题/方法框溢出、
分区过高、画布过高(A4 可读性)、方法缺失,均以 [警告] / [自检提示] 输出。
第 3 步:生成通道③ Word 可编辑 DOCX
# 依赖 python-docx(仅用于建空文档与注入 XML,几何与形状全部手工生成)
python "<skill_dir>/scripts/svg2docx.py" "<名称>.svg" "[<名称>.docx]"
# 可选参数:--margin 0.5(页边距 in) --landscape(横向) --font 微软雅黑
不传第二参数时,默认与 SVG 同目录同名 .docx。转译映射见 references/docx转译要点.md。
第 4 步:三通道质检(必须执行)
python "<skill_dir>/scripts/verify.py" "<名称>.svg" "<名称>.docx" # 结构+几何+双向文本比对(零可选依赖)
python "<skill_dir>/scripts/verify.py" "<名称>.svg" "<名称>.docx" --word # 追加:本机 Word COM 实测打开+导出 PDF 复验
python "<skill_dir>/scripts/verify.py" "<名称>.svg" "<名称>.docx" --render # 追加:Chrome 渲染 SVG(按 viewBox)+ 左右对照图
检查项(退出码 0 才允许交付;1=存在问题,2=参数/文件错误):
- 结构:DOCX 形状数、零位图、wp:anchor 子元素顺序、a:gd 是否误用 val;
- 形状数下限:DOCX 形状数不得少于 SVG 可绘制图元数(转译是一对多,只会更多);
- 几何越界:逐形状校验包围盒是否落在 viewBox 内;
- 文本双向精确比对:SVG 每行都在 DOCX 中,且 DOCX 不多出任何 SVG 没有的文字;
- 空产物拦截:SVG 0 图元 / DOCX 0 形状直接判失败;
- --word:本机 Word 实测能否打开,打不开即硬失败;--render:SVG 参考图与 DOCX 渲染图左右对照。
> ⚠️ --word 依赖「多编码兜底解码 + 绝对路径」两条前提,已在 verify.py 内处理
> (见 references/docx转译要点.md 第 11 条)。不要改回 os.popen() 或相对路径,
> 否则会在失败路径崩溃或报「找不到您的文件」。
> 通道③若 Word 报「打开文件时遇到错误」:不要凭经验改,用二分探针定位——把 roundRect/custGeom/虚线框/无框文本/箭头线/竖线各生成一份只含一类形状的 docx,用 Word COM 批量打开,一次即可锁定违规形状类型。
第 5 步:交付
用 present_files 同时交付 .svg、-editor.html、.docx(有对照图时一并交付),并附:
1. 一句话说明三通道各自用途;
2. 逻辑自检清单(请用户核对):
- 每根箭头代表的依赖是否真实成立(「X 必须等 Y 产出 Z」);
- 每个阶段的研究方法与该阶段内容是否匹配(评审最忌错配);
- 图中术语、编号与正文/申报书是否一致;图中不写研究结果。
迭代修改
用户反馈改动时,改 spec JSON 后按 2→3→4 重新跑一遍(不要手改 SVG、也不要手改 DOCX),保证三通道几何一致。纯位置微调可让用户在 HTML 编辑器里拖完导出 SVG,再重跑第 3 步刷新 DOCX。
边界(不做)
- 不上色、不做甘特图/时间轴刻度、不生成位图;
- 通道③不生成表格/图片混排,只做形状级复原;
- 不替用户审核研究逻辑,只提供结构化呈现 + 自检清单。