Просмотр исходного кода

init: 初始化咨询师分身模板仓库

consultant 1 месяц назад
Родитель
Сommit
d2e2660289

+ 31 - 2
README.md

@@ -1,3 +1,32 @@
-# consult-template
+# consult-<客户名> · AI 咨询项目
 
-Consultant template repo
+> 本仓库为 `liuyuyang/consult-template` 模板实例化的客户仓库。
+> 服务团队:Fmode 团队(混沌AI院 / 未来飞马)
+
+## 目录说明
+
+| 目录 | 内容 |
+|------|------|
+| `meeting/record/` | 访谈纪要(md,已脱敏) |
+| `meeting/note/` | 访谈速记 |
+| `meeting/data/` | 定量数据包(脱敏后)|
+| `proposal/` | 提案 HTML + Q&A md |
+| `value-map/` | 价值链地图 HTML |
+| `plan/` | 90 天陪跑计划 HTML |
+| `report/` | 阶段性汇报 HTML |
+| `template/` | 可复用 HTML 模板(浅色视觉)|
+| `shared/` | 共享样式与脚本 |
+
+## 产出规范
+
+- 所有可视化产物(提案/价值地图/计划/报告)使用 **浅色 HTML** 格式
+- 样式唯一来源:`shared/design-system-light.css`
+- 画布:1280×720,`shared/canvas-scale.js` 等比缩放
+- 禁止提交 PPTX / docx
+- 访谈数据脱敏后方可提交,不存储密钥
+
+## 注意事项
+
+- 本仓库属于 `liuyuyang/` 命名空间(个人/咨询业务)
+- 公司项目使用 `fmode/` 命名空间
+- 敏感数据(API 密钥、未授权客户数据)**不得提交**

+ 0 - 0
meeting/data/.gitkeep


+ 0 - 0
meeting/note/.gitkeep


+ 0 - 0
meeting/record/.gitkeep


+ 0 - 0
plan/.gitkeep


+ 0 - 0
proposal/.gitkeep


+ 0 - 0
report/.gitkeep


+ 18 - 0
shared/canvas-scale.js

@@ -0,0 +1,18 @@
+/* canvas-scale.js · 1280×720 等比缩放
+ * 来源:skill-present/lib/player/canvas-scale.js
+ * 将 body 内容缩放到 1280×720 设计画布,适配任意视口
+ */
+(function() {
+  var W = 1280, H = 720;
+  function scale() {
+    var sw = window.innerWidth, sh = window.innerHeight;
+    var r = Math.min(sw / W, sh / H);
+    document.body.style.transform = 'scale(' + r + ')';
+    document.body.style.transformOrigin = 'top left';
+    document.body.style.width = W + 'px';
+    document.body.style.height = H + 'px';
+    document.body.style.overflow = 'hidden';
+  }
+  window.addEventListener('resize', scale);
+  scale();
+})();

+ 48 - 0
shared/design-system-light.css

@@ -0,0 +1,48 @@
+/* design-system-light.css · 咨询产出浅色视觉系统
+ * 来源:consult-haleon/demo/df-jiangzhong/shared/design-system-light.css
+ * 适用:所有咨询产出 HTML(提案/价值地图/陪跑计划/汇报)
+ */
+:root {
+  /* 主色 */
+  --primary: #30EA03;
+  --primary-dark: #1a8a00;
+  --primary-subtle: rgba(48, 234, 3, 0.06);
+  /* 背景层级 */
+  --bg-0: #FFFFFF;
+  --bg-1: #F7F8F9;
+  --bg-2: #EEF0F2;
+  --bg-3: #E4E6E8;
+  /* 文字层级 */
+  --text-1: #000000;
+  --text-2: #444444;
+  --text-3: #888888;
+  /* 边框 */
+  --border: rgba(0, 0, 0, 0.08);
+  --border-strong: rgba(0, 0, 0, 0.16);
+  /* 模块强调色(咨询场景语义) */
+  --df-blue: #1a6dd4;    /* 数据/科技/建议 */
+  --qw1-rose: #d94450;   /* 问题/卡点/风险 */
+  --qw2-teal: #0d9488;   /* 解决方案/增长 */
+  --qw3-green: #16a34a;  /* 成果/已确认 */
+  --amber: #e8940a;      /* 机会/洞察 */
+  --purple: #7c3aed;     /* 战略/架构 */
+  --blue: #2563eb;       /* 信息/数据 */
+  /* 圆角 */
+  --radius-sm: 4px;
+  --radius-md: 8px;
+  --radius-lg: 14px;
+  /* 字体 */
+  --font-head: 'Inter', 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
+  --font-body: 'Noto Sans SC', 'Inter', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
+  --font-mono: 'JetBrains Mono', 'SF Mono', 'Fira Code', 'Consolas', monospace;
+  /* 最大宽度 */
+  --max-w: 1280px;
+  /* 画布 */
+  --canvas-w: 1280px;
+  --canvas-h: 720px;
+}
+
+/* 基础重置 */
+*, *::before, *::after { box-sizing: border-box; }
+html { scroll-behavior: smooth; }
+body { margin: 0; padding: 0; font-family: var(--font-body); background: var(--bg-0); color: var(--text-1); -webkit-font-smoothing: antialiased; }

+ 246 - 0
template/index-light.html

@@ -0,0 +1,246 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>提案标题 · 客户名</title>
+<link rel="stylesheet" href="../shared/design-system-light.css">
+<style>
+/* 本文件中的样式是对 design-system-light.css token 的组合,不新增色值 */
+body { margin:0; font-family: var(--font-body); background: var(--bg-0); color: var(--text-1); overflow: hidden; }
+.deck { width:100%; height:100vh; }
+.chapter-bar { position:fixed; top:0; left:0; right:0; height:44px; background:var(--bg-0); border-bottom:1px solid var(--border); display:flex; align-items:center; gap:12px; padding:0 24px; z-index:100; font-size:0.8rem; }
+.ch-item { cursor:pointer; color:var(--text-3); padding:4px 8px; border-radius:var(--radius-sm); }
+.ch-item.active,.ch-item:hover { color:var(--primary-dark); background:var(--primary-subtle); }
+.ch-sep { color:var(--border-strong); }
+main.deck { padding-top:44px; height:calc(100vh - 44px); overflow-y: scroll; scroll-snap-type: y proximity; }
+section.report-section, section.cover-slide, section.chapter-divider { min-height: calc(100vh - 44px); scroll-snap-align: start; }
+/* Cover */
+.cover-slide { background: linear-gradient(135deg, var(--bg-1) 0%, var(--bg-0) 100%); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:60px 40px; text-align:center; }
+.cover-slide .eyebrow { font-size:0.8rem; font-weight:600; letter-spacing:0.1em; color:var(--primary-dark); text-transform:uppercase; margin-bottom:16px; }
+.cover-slide .hero-title { font-size:clamp(2.5rem,5vw,4.5rem); font-weight:900; line-height:1.1; margin:0 0 24px; color:var(--text-1); }
+.cover-slide .subtitle { font-size:clamp(1rem,1.5vw,1.2rem); color:var(--text-2); max-width:600px; margin:0 auto 40px; line-height:1.6; }
+.cover-stats { display:flex; gap:40px; justify-content:center; flex-wrap:wrap; margin-top:24px; }
+.cover-stat { text-align:center; }
+.cover-stat .num { font-size:clamp(1.8rem,3vw,2.8rem); font-weight:900; color:var(--primary-dark); }
+.cover-stat .lbl { font-size:0.8rem; color:var(--text-3); margin-top:4px; }
+/* Report section */
+.report-section { padding:80px 40px; background:var(--bg-0); }
+.section-inner { max-width:1100px; margin:0 auto; }
+.section-eyebrow { font-size:0.75rem; font-weight:700; letter-spacing:0.12em; color:var(--primary-dark); text-transform:uppercase; margin-bottom:12px; }
+.section-title { font-size:clamp(1.8rem,3vw,2.6rem); font-weight:800; margin:0 0 16px; }
+.section-sub { font-size:clamp(0.9rem,1.2vw,1rem); color:var(--text-2); max-width:700px; line-height:1.75; margin-bottom:40px; }
+.cards-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; margin-top:32px; }
+.card { background:var(--bg-1); border-radius:var(--radius-md); padding:24px; border:1px solid var(--border); }
+.card .k { font-weight:700; font-size:1rem; margin-bottom:8px; color:var(--text-1); }
+.card .v { font-size:0.9rem; color:var(--text-2); line-height:1.6; }
+/* Chapter divider */
+.chapter-divider { background:var(--text-1); color:white; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:60px 40px; }
+.chapter-divider .ch-num { font-size:0.75rem; font-weight:700; letter-spacing:0.2em; color:var(--primary); text-transform:uppercase; margin-bottom:16px; }
+.chapter-divider h2 { font-size:clamp(2rem,4vw,3.5rem); font-weight:900; margin:0; }
+/* Bottom nav */
+.bottom-nav { position:fixed; bottom:0; left:0; right:0; height:48px; background:var(--bg-0); border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; padding:0 24px; z-index:100; }
+.bottom-nav button { background:none; border:none; cursor:pointer; color:var(--text-2); font-size:0.85rem; padding:6px 12px; border-radius:var(--radius-sm); }
+.bottom-nav button:hover { background:var(--bg-1); color:var(--text-1); }
+#progress-line { position:fixed; bottom:48px; left:0; height:2px; background:var(--primary); transition:width 0.3s; z-index:101; }
+</style>
+</head>
+<body>
+<div class="chapter-bar" id="chapterBar">
+  <span class="ch-item active" data-ch="0">封面</span>
+  <span class="ch-sep">|</span>
+  <span class="ch-item" data-ch="1">现状诊断</span>
+  <span class="ch-sep">|</span>
+  <span class="ch-item" data-ch="2">价值路径</span>
+  <span class="ch-sep">|</span>
+  <span class="ch-item" data-ch="3">行动建议</span>
+</div>
+
+<main class="deck" id="deck">
+
+  <!-- 封面 -->
+  <section class="cover-slide" id="ch0">
+    <div class="eyebrow">AI 落地咨询 · Fmode 团队</div>
+    <h1 class="hero-title">客户名称<br>AI 就绪度评估与<br>价值路径规划</h1>
+    <p class="subtitle">基于深度访谈与数据分析,识别 AI 落地的最高价值入口</p>
+    <div class="cover-stats">
+      <div class="cover-stat">
+        <div class="num" data-count="5" data-suffix="+">0+</div>
+        <div class="lbl">深度访谈</div>
+      </div>
+      <div class="cover-stat">
+        <div class="num" data-count="3" data-suffix="个">0个</div>
+        <div class="lbl">P0 优先场景</div>
+      </div>
+      <div class="cover-stat">
+        <div class="num" data-count="90" data-suffix="天">0天</div>
+        <div class="lbl">陪跑计划</div>
+      </div>
+    </div>
+  </section>
+
+  <!-- 章节分隔 -->
+  <section class="chapter-divider" id="ch1-div">
+    <div class="ch-num">01</div>
+    <h2>现状诊断</h2>
+  </section>
+
+  <!-- 诊断内容 -->
+  <section class="report-section" id="ch1">
+    <div class="section-inner">
+      <div class="section-eyebrow">Diagnosis</div>
+      <h2 class="section-title">核心挑战与机会</h2>
+      <p class="section-sub">基于访谈洞察,识别三个核心卡点与对应机会。每个建议均有访谈原话支撑。</p>
+      <div class="cards-grid">
+        <div class="card">
+          <div class="k" style="color:var(--qw1-rose)">卡点 01</div>
+          <div class="v">「这里填写客户原话」——受访者角色,访谈日期<br><br>核心问题:...</div>
+        </div>
+        <div class="card">
+          <div class="k" style="color:var(--qw1-rose)">卡点 02</div>
+          <div class="v">「这里填写客户原话」——受访者角色,访谈日期<br><br>核心问题:...</div>
+        </div>
+        <div class="card">
+          <div class="k" style="color:var(--df-blue)">机会 01</div>
+          <div class="v">核心机会描述...<br><br>价值潜力:高 / 实施难度:低</div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- 价值路径 -->
+  <section class="chapter-divider" id="ch2-div">
+    <div class="ch-num">02</div>
+    <h2>价值路径</h2>
+  </section>
+
+  <section class="report-section" id="ch2">
+    <div class="section-inner">
+      <div class="section-eyebrow">Value Path</div>
+      <h2 class="section-title">90 天价值路径</h2>
+      <p class="section-sub">M1 打底 → M2 规模化 → M3 系统化。每个里程碑有明确 OKR 与成功标准。</p>
+      <div class="cards-grid">
+        <div class="card">
+          <div class="k" style="color:var(--qw2-teal)">M1 · 打底期</div>
+          <div class="v">目标:1 个 AI 工作流在生产运行<br>关键任务:...<br>成功标准:...</div>
+        </div>
+        <div class="card">
+          <div class="k" style="color:var(--df-blue)">M2 · 规模化期</div>
+          <div class="v">目标:3 个场景稳定运行<br>关键任务:...<br>成功标准:...</div>
+        </div>
+        <div class="card">
+          <div class="k" style="color:var(--qw3-green)">M3 · 系统化期</div>
+          <div class="v">目标:交付评估报告 + 下步规划<br>关键任务:...<br>成功标准:...</div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+  <!-- 行动建议 -->
+  <section class="chapter-divider" id="ch3-div">
+    <div class="ch-num">03</div>
+    <h2>行动建议</h2>
+  </section>
+
+  <section class="report-section" id="ch3">
+    <div class="section-inner">
+      <div class="section-eyebrow">Next Steps</div>
+      <h2 class="section-title">本周就能启动的三件事</h2>
+      <p class="section-sub">Quick Win 路径:最小成本验证 AI 价值,建立团队信心,然后推动规模化。</p>
+      <div class="cards-grid">
+        <div class="card">
+          <div class="k">第一步</div>
+          <div class="v">具体行动描述...<br>负责人:<br>完成时间:</div>
+        </div>
+        <div class="card">
+          <div class="k">第二步</div>
+          <div class="v">具体行动描述...<br>负责人:<br>完成时间:</div>
+        </div>
+        <div class="card">
+          <div class="k">第三步</div>
+          <div class="v">具体行动描述...<br>负责人:<br>完成时间:</div>
+        </div>
+      </div>
+    </div>
+  </section>
+
+</main>
+
+<div class="bottom-nav">
+  <button onclick="navPrev()">← 上一章</button>
+  <div style="font-size:0.8rem;color:var(--text-3)" id="bn-info">封面 · 1/8</div>
+  <button onclick="navNext()">下一章 →</button>
+</div>
+<div id="progress-line" style="width:0%"></div>
+
+<script src="../shared/canvas-scale.js"></script>
+<script>
+// Sections and chapter navigation
+const sections = Array.from(document.querySelectorAll('section'));
+const chItems = document.querySelectorAll('.ch-item');
+const deck = document.getElementById('deck');
+const progressLine = document.getElementById('progress-line');
+const bnInfo = document.getElementById('bn-info');
+
+function updateNav() {
+  const scrollTop = deck.scrollTop;
+  const total = deck.scrollHeight - deck.clientHeight;
+  const pct = total > 0 ? (scrollTop / total * 100).toFixed(1) : 0;
+  progressLine.style.width = pct + '%';
+  
+  // Find active section
+  let active = 0;
+  sections.forEach((s, i) => {
+    if (s.offsetTop - deck.scrollTop <= deck.clientHeight / 2) active = i;
+  });
+  bnInfo.textContent = (sections[active] ? sections[active].querySelector('h1,h2')?.textContent?.slice(0,12) || '' : '') + ' · ' + (active+1) + '/' + sections.length;
+}
+
+deck.addEventListener('scroll', updateNav);
+
+// Counter animation
+document.querySelectorAll('[data-count]').forEach(el => {
+  const target = parseInt(el.dataset.count);
+  const suffix = el.dataset.suffix || '';
+  let start = null;
+  const obs = new IntersectionObserver(entries => {
+    if (entries[0].isIntersecting) {
+      const animate = (ts) => {
+        if (!start) start = ts;
+        const prog = Math.min((ts - start) / 1000, 1);
+        el.textContent = Math.floor(prog * target) + suffix;
+        if (prog < 1) requestAnimationFrame(animate);
+      };
+      requestAnimationFrame(animate);
+      obs.disconnect();
+    }
+  });
+  obs.observe(el);
+});
+
+// Chapter navigation via bar
+chItems.forEach(item => {
+  item.addEventListener('click', () => {
+    const ch = item.dataset.ch;
+    const target = document.getElementById(`ch${ch}`);
+    if (target) target.scrollIntoView({ behavior: 'smooth' });
+  });
+});
+
+function navNext() {
+  const scrollTop = deck.scrollTop;
+  for (const s of sections) {
+    if (s.offsetTop > scrollTop + 10) { s.scrollIntoView({ behavior: 'smooth' }); break; }
+  }
+}
+function navPrev() {
+  const scrollTop = deck.scrollTop;
+  for (let i = sections.length - 1; i >= 0; i--) {
+    if (sections[i].offsetTop < scrollTop - 10) { sections[i].scrollIntoView({ behavior: 'smooth' }); break; }
+  }
+}
+
+updateNav();
+</script>
+</body>
+</html>

+ 0 - 0
value-map/.gitkeep