竞品分析可视化页生成器

Overview

将一次"竞品分析"请求，稳定地产出一份单文件 HTML 可视化页面（靛蓝网格科技感、全中文、无外部依赖、可离线双击打开）。页面固定由四块构成：六维能力雷达图、2×2 机会矩阵、厂商功能对比表、各厂商定位卡 + 机会空位结论。

本 skill 沉淀自多次实际产出（密码安全产品、签名验签服务器厂商、密码服务平台厂商等），模板与配色已打磨一致，直接复用即可保证风格统一。

触发条件

• 用户说"生成/做/写 XX 的竞品分析（可视化页）"
• 用户说"对比 A/B/C 这几家厂商的 XX 产品"
• 用户要点"竞品雷达图 / 机会矩阵 / 功能对比表"
• 用户给出「产品名 + 厂商名单」或只给「产品名」

输入规则（先判断，再动手）

| 用户给的信息 | 处理方式 | |---|---| | 产品名 + 明确厂商名单 | 直接用给定厂商生成，不自行检索 | | 仅产品名，未给厂商 | 用 WebSearch 检索该产品主流厂商（通常 4–6 家），查证市场格局后对比；在页面注明"厂商为自动检索结果，可替换" | | 产品名 + "主流厂商"等模糊表述 | 同"仅产品名"处理，自动检索 |

检索厂商时优先找：行业头部上市/央企系（如信安世纪、吉大正元、三未信安、格尔软件、卫士通、渔翁等密码行业常见厂商）、信创目录入围厂商、招投标常客。检索结果仅作"代表性"定位，不是实测。

页面四块结构（固定，不可省略）

1. 六维能力雷达图（SVG 手绘，多厂商多边形叠加，越靠外圈综合能力越强）
2. 2×2 机会矩阵（横轴=价格友好度，纵轴=行业案例生态；右上角虚线高亮框标「机会空位：高价格友好 × 强案例生态」）
3. 功能对比表（行=对比维度，列=厂商；末行=六维综合均值，用 JS 按六维算术平均自动算出，不要手填）
4. 定位卡 + 机会结论（每家一张卡：强项 / 短板 / 差异化机会；末尾一段"机会空位结论"点明空白象限与破局方向）

维度口径（六维，按对比层级选用）

• 厂商级对比（默认）：功能完备度 / 性能吞吐 / 国产化适配 / 易用性运维 / 价格友好度 / 行业案例生态
• 产品类型级对比（如对比不同产品类别而非厂商）：产品功能 / 性能 / 国产化 / 易用性 / 价格友好度 / 安全合规（密评适配）

需与用户确认层级；未指定时按"厂商级"处理。维度顺序要保持一致，雷达图与矩阵、对比表、定位卡共用同一套 6 维。

硬约束（默认生效，无例外）

1. 禁区域维度锚定：结论与定位卡一律走通用竞争视角，不得出现"西北/山西/新疆/周边省份/本地政务/区域政务/某省适配"等区域化表述。这是常驻规则（见 ~/.workbuddy/MEMORY.md）。若用户当次主动要求加回区域视角，以当次指令为准。
2. 评分必标基准值：页面顶部与页脚必须标注"所有 0–100 评分为代表性基准值（基于公开市场定位与行业认知），非逐条核对的实测；正式立项/商务前需用厂商规格书、招投标参数、落地案例替换校准"。不得把基准值伪装成实测。
3. 零依赖单文件：CSS/JS 内联，不引用任何 CDN/外部字体/图片；图表用原生 SVG + 少量 JS 绘制（参考 assets/template.html）。
4. 靛蓝网格科技风 + 全中文：配色见模板 :root 变量（深蓝底 #0A0F1E、靛蓝 #3B82F6、青 #38BDF8 等），body 叠加网格 background；所有文案中文。
5. 综合均值由脚本算：对比表末行均值用 JS fillAverages() 计算，避免手算误差。
6. 机会空位客观：矩阵右上角标为空白象限，但须诚实说明"当前对比厂商均未占据"或"某厂商已部分占据"，不为了制造机会而歪曲数据。

配色与厂商数

模板内置 6 色：cyan #38BDF8、indigo #3B82F6、green #34D399、pink #F472B6、amber #FBBF24、purple #A78BFA。若对比 >6 家，扩展调色板（如 red #F87171、teal #2DD4BF、indigo2 #818CF8、sky #22D3EE），并在 VENDORS 数组与表头 <th> 的 color 同步。

工作流

1. 解析用户输入，确定产品名与厂商来源（给定 or 自检索）。
2. 若自检索：用 WebSearch 找主流厂商，确定 4–6 家进入对比。
3. 确定维度口径（厂商级默认六维）。
4. 为每个厂商在六维上打代表性基准值（0–100，记录打分依据：公开市场定位/行业认知）。
5. 复制 assets/template.html 为产出文件，在复制件上填充：
   • <title> / <h1> / 副标题 / 顶部声明（PM 诚实声明）
   • JS DIMS 数组（6 维名称）、VENDORS 数组（name/color/scores[6]）
   • 对比表 <thead> 厂商列 + <tbody> 各维度行（手填，末行均值留空由脚本填）
   • JS POS 对象（每家 strong/weak/opp 文案）
   • 结论段（机会空位 + 差异化破局点，通用视角）
   • 页脚
6. 自检：grep 产出文件是否残留区域措辞；确认评分声明存在；确认均值脚本挂载。
7. 用 present_files 交付，并口头说明"评分为基准值、厂商检索结论需实测校准"。

修改既有文件的前置动作

若本次任务是在已生成的竞品页上增删厂商或改维度，按 ~/.workbuddy/MEMORY.md 的"改前必备份"规则：先用 date +%Y%m%d_%H%M%S 取时间戳，把原文件 cp 一份 _backup_时间戳.html 到同目录，再改。

Resources

• assets/template.html — 完整可运行的单文件 HTML 模板（CSS 网格科技风 + SVG 雷达/矩阵 + 均值计算 + 定位卡渲染 JS）。生成时复制此文件并替换其中的数据占位（见文件内 /* ===== 数据填充区 ===== */ 注释），不要重写样式与绘制逻辑。

产出示例（用户原话 → 结果）

• "生成服务器密码机的竞品分析，对比 A/B/C" → 按给定 3 家出页
• "生成安全认证网关的竞品分析" → 自动检索主流厂商出页
• "把吉大正元加进签名验签对比" → 复制既有页、备份、增列与数据、重算