Skip to content

Add business decision skills #98

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
nettee merged 2 commits into from
Jun 2, 2026
Merged

Add business decision skills #98

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
867d4e3
add business decision skills
ttoyekk1a May 30, 2026
e4d8480
align skill previews with default styles
ttoyekk1a May 31, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 55 additions & 0 deletions next/src/lib/templates/skills/competitive-teardown/SKILL.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
---
name: competitive-teardown
zh_name: "竞品拆解"
en_name: "Competitive Teardown"
emoji: "🧩"
description: "定位图 + 功能矩阵 + 价格对比 + 机会窗口, 把竞品资料转成产品决策报告"
category: doc
scenario: product
aspect_hint: "战略长页面"
featured: 8
tags: ["competitive", "teardown", "strategy", "product", "竞品", "拆解"]
example_id: sample-competitive-teardown
example_name: "竞品拆解 · AI Meeting Assistants"
example_format: markdown
example_tagline: "比较矩阵 + 定位象限 + 我们的应对"
example_desc: "把三家竞品的定位、价格、功能、评价转成产品团队可行动的拆解报告。"
---

【模板: 竞品拆解 / Competitive Teardown】
【意图】这不是文章、不是 PRD、不是 pitch deck。目标是把多个竞品的杂乱资料转成一份可决策的产品战略报告, 帮团队回答: "我们和它们到底差在哪里, 下一步该怎么打?"

【适合输入】
- 竞品官网 / 定价页 / changelog / 用户评论 / 销售反馈 / 内部调研笔记
- 2-6 个竞品最合适; 如果用户只给一个竞品, 输出单竞品 deep dive
- 可以包含表格、bullet、链接摘录、访谈记录、截图说明

【必须输出的结构】
1. Header: 市场 / 产品类别 / 报告日期 / 结论一句话。
2. Executive takeaway: 3 条最重要判断, 每条必须包含 "so what"。
3. Positioning map: 用 2×2 象限或坐标图表现竞品定位。坐标轴必须来自用户内容, 不要套模板词。
4. Competitor cards: 每个竞品一张卡, 包含 target user、core promise、pricing signal、primary strength、visible weakness。
5. Feature matrix: 行是关键能力, 列是竞品 + "Us / Opportunity"; 用 ✓ / △ / — 表达覆盖度, 并用短注释说明。
6. Pricing / packaging read: 价格层级、免费试用、限制项、企业销售动作。
7. UX / messaging notes: 从用户材料中抽取 4-6 条可观察细节, 不要泛泛而谈。
8. Opportunity windows: 3 个机会窗口, 每个包含 why now、target segment、first move、risk。
9. Recommended moves: 近期 30 天 / 90 天 / 180 天行动建议。

【设计要求】
- 战略咨询 + 产品战情室风格: 信息密度高、扫描快、图表清楚。
- 使用 restrained palette: ink / paper / muted blue / signal amber 或类似专业色。
- Feature matrix 必须横向可读; 小屏可变成 stacked cards。
- 不要做成营销落地页, 不要做成普通文章。

【可选风格模板 — 参考 assets/】
根据用户内容选择最贴合的一种, 不要三种混用:
- `assets/war-room-grid.html`: 默认风格。浅色战情室 / 咨询报告, 适合产品团队、PM、普通商业读者。
- `assets/radar-map.html`: 深色雷达图 / market intelligence console, 适合安全、AI、开发者工具、平台型竞品。
- `assets/analyst-dossier.html`: 纸质分析档案 / investment research dossier, 适合投研、行业分析、正式战略备忘。

如果用户没有指定风格, 优先使用 `war-room-grid`; 如果输入强调市场格局、技术雷达、攻防态势, 使用 `radar-map`; 如果输入像研究笔记、投资备忘或行业报告, 使用 `analyst-dossier`。

【内容真实性】
- 只使用用户提供的竞品、价格、功能、评论。缺失信息用 "not found in source" 或 "unknown" 标注。
- 不要发明市场份额、ARR、客户名、定价数字。
- 如果用户资料明显不足, 仍然输出报告, 但在 "Evidence gaps" 中列出缺口。
44 changes: 44 additions & 0 deletions next/src/lib/templates/skills/competitive-teardown/assets/analyst-dossier.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Competitive Teardown · Analyst Dossier</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:wght@500;700&family=Inter:wght@400;600;800&display=swap" rel="stylesheet">
<style>
:root{--paper:#f4efe3;--ink:#1d1b16;--muted:#6d6558;--line:#cfc4b0;--red:#9b2f23;--blue:#284b7a}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,system-ui,sans-serif}.page{max-width:1120px;margin:auto;padding:42px 28px 58px}
.serif{font-family:"IBM Plex Serif",Georgia,serif}.rule{border-top:3px double var(--ink);border-bottom:1px solid var(--ink)}.box{border:1px solid var(--line);background:#fbf7ee}
.stamp{border:2px solid var(--red);color:var(--red);transform:rotate(-2deg);display:inline-block;padding:5px 10px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:11px}
table{width:100%;border-collapse:collapse}th,td{border-bottom:1px solid var(--line);padding:13px;text-align:left;vertical-align:top;font-size:13px}th{font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}
</style>
</head>
<body>
<main class="page">
<header class="rule py-5 flex flex-wrap items-end justify-between gap-4">
<div><div class="stamp">Competitive dossier</div><h1 class="serif mt-4 text-6xl leading-[.96] font-bold">AI meeting assistants: the open flank.</h1></div>
<div class="text-right text-sm text-[var(--muted)]"><b>Prepared for:</b> Product Strategy<br><b>Question:</b> Where should LoopNote compete?</div>
</header>
<section class="grid lg:grid-cols-[.7fr_1.3fr] gap-5 mt-6">
<aside class="box p-5">
<h2 class="serif text-2xl font-bold">Thesis</h2>
<p class="mt-3 leading-7 text-[var(--muted)]">The visible market is crowded around note capture. The under-defended space is durable product insight across repeated customer conversations.</p>
<div class="mt-6 text-sm leading-7"><b>Do:</b> product discovery memory<br><b>Avoid:</b> generic transcription parity<br><b>Proof point:</b> source notes show no competitor owning cross-interview insight cards.</div>
</aside>
<section class="box overflow-hidden">
<table><thead><tr><th>Competitor</th><th>Promise</th><th>Strength</th><th>Weakness</th></tr></thead><tbody>
<tr><td><b>Granola</b></td><td>AI notes for people in meetings.</td><td>Personal, invisible, low-friction.</td><td>Team analytics not obvious.</td></tr>
<tr><td><b>Fireflies</b></td><td>Automate meeting notes.</td><td>Integrations and searchable library.</td><td>Heavy workflow; visible bot.</td></tr>
<tr><td><b>Fathom</b></td><td>Never take notes on Zoom.</td><td>Free individual capture, CRM utility.</td><td>Less focused on product insight synthesis.</td></tr>
</tbody></table>
</section>
</section>
<section class="grid md:grid-cols-3 gap-5 mt-5">
<div class="box p-5"><h3 class="serif text-xl font-bold">30-day move</h3><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Reframe objects around interviews, pain, quotes, objections, and feature requests.</p></div>
<div class="box p-5"><h3 class="serif text-xl font-bold">90-day move</h3><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Ship cross-call synthesis and export to PRD / roadmap workflows.</p></div>
<div class="box p-5"><h3 class="serif text-xl font-bold">Evidence gaps</h3><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Need 8-12 product-team interviews and willingness-to-pay signal for research memory.</p></div>
</section>
</main>
</body>
</html>
53 changes: 53 additions & 0 deletions next/src/lib/templates/skills/competitive-teardown/assets/radar-map.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Competitive Teardown · Radar Map</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap" rel="stylesheet">
<style>
:root{--bg:#08111f;--panel:#0d1b2d;--line:#223651;--ink:#e7eefc;--muted:#91a4c3;--cyan:#38d5ff;--lime:#9ef36a;--pink:#ff6aa2}
body{margin:0;background:radial-gradient(circle at 70% 10%,#173761 0,#08111f 46%,#050914 100%);color:var(--ink);font-family:Inter,system-ui,sans-serif}
.page{max-width:1200px;margin:auto;padding:38px 26px 56px}.panel{border:1px solid var(--line);background:rgba(13,27,45,.76);border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.chip{border:1px solid var(--line);border-radius:999px;padding:6px 10px;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
.radar{background:repeating-radial-gradient(circle at center,transparent 0 44px,rgba(56,213,255,.25) 45px 46px),linear-gradient(90deg,transparent 49.8%,rgba(56,213,255,.28) 50%,transparent 50.2%),linear-gradient(0deg,transparent 49.8%,rgba(56,213,255,.28) 50%,transparent 50.2%)}
table{width:100%;border-collapse:collapse}th,td{border-bottom:1px solid var(--line);padding:14px;text-align:left;font-size:13px;vertical-align:top}th{color:var(--muted);text-transform:uppercase;letter-spacing:.09em;font-size:11px}
</style>
</head>
<body>
<main class="page">
<section class="panel p-7">
<div class="flex flex-wrap gap-2 mb-6"><span class="chip">Radar map</span><span class="chip">AI meeting assistants</span><span class="chip">Product strategy</span></div>
<div class="grid lg:grid-cols-[.9fr_1.1fr] gap-8">
<div>
<p class="text-[var(--cyan)] text-sm font-bold mb-3">Strategic read</p>
<h1 class="text-6xl font-extrabold leading-[.94]">Own the insight layer.</h1>
<p class="mt-5 text-lg leading-8 text-[var(--muted)]">Granola wins personal capture. Fireflies and Fathom win workflow breadth. LoopNote should map raw conversations into product decisions.</p>
</div>
<div class="panel radar relative h-[420px] overflow-hidden">
<div class="absolute left-1/2 top-1/2 h-3 w-3 -translate-x-1/2 -translate-y-1/2 rounded-full bg-[var(--cyan)] shadow-[0_0_28px_var(--cyan)]"></div>
<div class="absolute left-[18%] top-[62%] rounded-full bg-[#10294f] px-4 py-2 text-sm font-extrabold text-[var(--cyan)]">Granola</div>
<div class="absolute right-[14%] top-[45%] rounded-full bg-[#203117] px-4 py-2 text-sm font-extrabold text-[var(--lime)]">Fireflies</div>
<div class="absolute right-[24%] bottom-[18%] rounded-full bg-[#3b1730] px-4 py-2 text-sm font-extrabold text-[var(--pink)]">Fathom</div>
<div class="absolute left-[42%] top-[26%] rounded-full bg-[var(--ink)] px-5 py-3 text-sm font-extrabold text-[#08111f]">LoopNote wedge</div>
<div class="absolute left-5 top-5 text-xs uppercase tracking-widest text-[var(--muted)]">Synthesis intensity</div>
<div class="absolute right-5 bottom-5 text-xs uppercase tracking-widest text-[var(--muted)]">Workflow gravity</div>
</div>
</div>
</section>
<section class="grid md:grid-cols-3 gap-4 mt-5">
<article class="panel p-5"><div class="text-[var(--cyan)] text-xs font-bold uppercase">Granola</div><h2 class="mt-3 text-2xl font-extrabold">Invisible personal notes</h2><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Best signal: meeting-heavy individuals who want AI without bot ceremony.</p></article>
<article class="panel p-5"><div class="text-[var(--lime)] text-xs font-bold uppercase">Fireflies</div><h2 class="mt-3 text-2xl font-extrabold">Searchable conversation ops</h2><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Best signal: integrations, transcript memory, sales and CS workflow.</p></article>
<article class="panel p-5"><div class="text-[var(--pink)] text-xs font-bold uppercase">Fathom</div><h2 class="mt-3 text-2xl font-extrabold">Free sales capture</h2><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Best signal: fast highlight capture and very clear CRM-adjacent value.</p></article>
</section>
<section class="panel mt-5 overflow-hidden">
<table><thead><tr><th>Vector</th><th>Market evidence</th><th>Our move</th><th>Risk</th></tr></thead><tbody>
<tr><td><b>Capture</b></td><td>Competitors already anchor here.</td><td>Meet parity only where product research needs it.</td><td>Feature treadmill.</td></tr>
<tr><td><b>Synthesis</b></td><td>Source notes show no clear owner.</td><td>Turn calls into pain clusters, quotes, and roadmap inputs.</td><td>Requires opinionated taxonomy.</td></tr>
<tr><td><b>Team workflow</b></td><td>Fireflies is broad, Fathom is sales-specific.</td><td>Package for product discovery teams.</td><td>Narrower TAM story.</td></tr>
</tbody></table>
</section>
</main>
</body>
</html>
82 changes: 82 additions & 0 deletions next/src/lib/templates/skills/competitive-teardown/assets/war-room-grid.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Competitive Teardown · AI Meeting Assistants</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;700;800&display=swap" rel="stylesheet">
<style>
:root{--ink:#162033;--muted:#667085;--paper:#f7f4ec;--line:#ded7ca;--blue:#1d4ed8;--amber:#c47b25;--green:#28715f}
*{box-sizing:border-box} body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,"Noto Sans SC",system-ui,sans-serif}
.page{max-width:1180px;margin:0 auto;padding:42px 28px 56px}.hair{border:1px solid var(--line);background:rgba(255,255,255,.54)}
.pill{border:1px solid var(--line);border-radius:999px;padding:6px 10px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.grid-bg{background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:32px 32px}
.matrix th,.matrix td{border-bottom:1px solid var(--line);padding:14px;text-align:left;vertical-align:top}.matrix th{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.matrix td{font-size:13px}
</style>
</head>
<body>
<main class="page">
<section class="hair grid-bg rounded-[6px] p-7">
<div class="flex flex-wrap items-center gap-2 mb-8">
<span class="pill">Competitive teardown</span><span class="pill">AI meeting assistants</span><span class="pill">2026-05-28</span>
</div>
<div class="grid md:grid-cols-[1.25fr_.75fr] gap-8 items-end">
<div>
<p class="text-sm font-bold text-[var(--blue)] mb-3">LoopNote should avoid generic transcription and own product-discovery memory.</p>
<h1 class="text-5xl md:text-7xl font-extrabold leading-[.92] tracking-tight">Competing on synthesis, not capture.</h1>
</div>
<div class="hair rounded-[6px] p-5 bg-[#fffaf0]">
<div class="text-xs font-bold text-[var(--muted)] uppercase tracking-wider mb-3">Executive takeaway</div>
<ol class="space-y-3 text-sm leading-6">
<li><b>1.</b> Granola owns low-friction personal notes; Fireflies and Fathom own capture workflows.</li>
<li><b>2.</b> LoopNote's wedge is cross-interview product insight synthesis.</li>
<li><b>3.</b> The next 90 days should prove a product-team workflow, not chase every meeting use case.</li>
</ol>
</div>
</div>
</section>

<section class="grid md:grid-cols-3 gap-4 mt-5">
<article class="hair rounded-[6px] p-5 bg-white/70"><div class="text-xs text-[var(--muted)] mb-2">Granola</div><h2 class="text-2xl font-extrabold">Personal AI notepad</h2><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Best at feeling invisible and personal for people in back-to-back meetings.</p></article>
<article class="hair rounded-[6px] p-5 bg-white/70"><div class="text-xs text-[var(--muted)] mb-2">Fireflies</div><h2 class="text-2xl font-extrabold">Conversation library</h2><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Broad integrations and searchable transcripts for sales, recruiting, and CS teams.</p></article>
<article class="hair rounded-[6px] p-5 bg-white/70"><div class="text-xs text-[var(--muted)] mb-2">Fathom</div><h2 class="text-2xl font-extrabold">Free sales notetaker</h2><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Clear highlight capture and CRM utility; strongest around individual call follow-up.</p></article>
</section>

<section class="grid lg:grid-cols-[.9fr_1.1fr] gap-5 mt-5">
<div class="hair rounded-[6px] p-6 bg-[#fbfaf6]">
<div class="flex justify-between text-xs font-bold text-[var(--muted)] uppercase tracking-wider mb-4"><span>Positioning map</span><span>derived from source notes</span></div>
<div class="relative h-[360px] border border-[var(--line)] bg-white">
<div class="absolute left-1/2 top-0 bottom-0 border-l border-dashed border-[var(--line)]"></div>
<div class="absolute top-1/2 left-0 right-0 border-t border-dashed border-[var(--line)]"></div>
<div class="absolute left-3 top-3 text-xs text-[var(--muted)]">High synthesis</div>
<div class="absolute right-3 bottom-3 text-xs text-[var(--muted)]">Team workflow</div>
<div class="absolute left-[18%] bottom-[26%] rounded-full bg-[#e8eefc] px-3 py-2 text-sm font-bold text-[var(--blue)]">Granola</div>
<div class="absolute right-[13%] top-[42%] rounded-full bg-[#fff1dc] px-3 py-2 text-sm font-bold text-[var(--amber)]">Fireflies</div>
<div class="absolute right-[22%] bottom-[24%] rounded-full bg-[#ecfdf5] px-3 py-2 text-sm font-bold text-[var(--green)]">Fathom</div>
<div class="absolute left-[42%] top-[18%] rounded-full bg-[var(--ink)] px-4 py-2 text-sm font-bold text-white shadow-lg">LoopNote wedge</div>
</div>
</div>
<div class="hair rounded-[6px] bg-white/70 overflow-hidden">
<table class="matrix w-full">
<thead><tr><th>Capability</th><th>Granola</th><th>Fireflies</th><th>Fathom</th><th>LoopNote opportunity</th></tr></thead>
<tbody>
<tr><td><b>Invisible note capture</b></td><td>✓ strong</td><td>△ bot-like</td><td>△ call tool</td><td>Do not compete head-on</td></tr>
<tr><td><b>Transcript library</b></td><td>unknown</td><td>✓ strong</td><td>△ useful</td><td>Only store what supports research synthesis</td></tr>
<tr><td><b>CRM / sales workflow</b></td><td>not found</td><td>✓ broad</td><td>✓ clear</td><td>Avoid sales-first packaging</td></tr>
<tr><td><b>Cross-interview insight cards</b></td><td>not found</td><td>△ searchable</td><td>not found</td><td><b>Primary wedge</b></td></tr>
</tbody>
</table>
</div>
</section>

<section class="grid md:grid-cols-3 gap-4 mt-5">
<article class="hair rounded-[6px] p-5 bg-white/70"><span class="pill">30 days</span><h3 class="mt-4 text-xl font-extrabold">Package for product discovery</h3><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Rename core objects around interviews, pain, quotes, requests, and insight clusters.</p></article>
<article class="hair rounded-[6px] p-5 bg-white/70"><span class="pill">90 days</span><h3 class="mt-4 text-xl font-extrabold">Build research memory</h3><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Ship cross-call synthesis, tagging, and export to PRD / roadmap workflows.</p></article>
<article class="hair rounded-[6px] p-5 bg-white/70"><span class="pill">180 days</span><h3 class="mt-4 text-xl font-extrabold">Integrate selectively</h3><p class="mt-3 text-sm leading-6 text-[var(--muted)]">Add calendar bot only when it strengthens product research capture, not as generic parity.</p></article>
</section>
</main>
</body>
</html>
Loading
Loading