prd-user-flows.html 13.1 KB
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" /><meta name="viewport" content="width=device-width,initial-scale=1" />
<title>用户流程 · LemonBoss PRD</title>
<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=Fraunces:opsz,wght@9..144,300;9..144,500;9..144,700&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="assets/shell.css" />
</head>
<body data-page="prd-user-flows.html">
<div class="shell">
  <aside id="sidebar"></aside>
  <main class="page">
    <header class="page-head">
      <div class="crumb"><span class="pill">01 · PRD</span><span class="sep">/</span><span>用户流程</span></div>
      <h1>用户流程图</h1>
      <p class="deck">三个核心 User Flow。每个流程图带「人类侧动作」「系统侧反应」「关键决策点」三栏。Flow1 / Flow2 是 P0;Flow3 是 P4 才有。</p>
    </header>
    <article class="body">

      <section>
        <h2>Flow 1 · 启动新项目(US-01)</h2>
        <svg viewBox="0 0 1100 380" width="100%" role="img">
          <defs><marker id="arrF1" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto"><path d="M0,0 L10,5 L0,10 Z" fill="#0E0E10"/></marker></defs>
          <g font-family="JetBrains Mono" font-size="11" fill="#0E0E10">
            <text x="60"  y="30" font-weight="700">HUMAN</text>
            <text x="380" y="30" font-weight="700">SYSTEM</text>
            <text x="780" y="30" font-weight="700">DECISION</text>
            <g stroke="#dcd5c4" stroke-dasharray="2 4">
              <line x1="160" y1="40" x2="160" y2="370"/>
              <line x1="660" y1="40" x2="660" y2="370"/>
            </g>

            <rect x="20"  y="60"  width="280" height="50" rx="6" fill="#ECE4FB" stroke="#6E48C3"/>
            <text x="160" y="80"  text-anchor="middle" font-weight="700">① 打开 Dashboard</text>
            <text x="160" y="98"  text-anchor="middle" font-size="10">点击「+ NEW PROJECT」</text>

            <rect x="320" y="60"  width="320" height="50" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="480" y="80"  text-anchor="middle">② FeedbackModal 弹出</text>
            <text x="480" y="98"  text-anchor="middle" font-size="10">company_id 自动注入</text>

            <rect x="20"  y="130" width="280" height="50" rx="6" fill="#ECE4FB" stroke="#6E48C3"/>
            <text x="160" y="150" text-anchor="middle" font-weight="700">③ 输入需求 + 提交</text>
            <text x="160" y="168" text-anchor="middle" font-size="10">"做个 TODO API"</text>

            <rect x="320" y="130" width="320" height="50" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="480" y="150" text-anchor="middle">④ POST /api/devloop/projects</text>
            <text x="480" y="168" text-anchor="middle" font-size="10">PM Agent 异步启动</text>

            <rect x="320" y="200" width="320" height="50" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="480" y="220" text-anchor="middle">⑤ PM 写 prd.html v1</text>
            <text x="480" y="238" text-anchor="middle" font-size="10">归档 history/prd-rev-001.html</text>

            <rect x="320" y="270" width="320" height="50" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="480" y="290" text-anchor="middle">⑥ Architect 写 sdd + units.json</text>
            <text x="480" y="308" text-anchor="middle" font-size="10">contract_hash 计算</text>

            <rect x="680" y="270" width="400" height="50" rx="6" fill="#F7E8D2" stroke="#C77C2C"/>
            <text x="880" y="290" text-anchor="middle">⑦ 是否有 conflict / data-question?</text>
            <text x="880" y="308" text-anchor="middle" font-size="10">→ 是:发 SSE conflict ✦ 否:进 L1</text>

            <rect x="20"  y="340" width="280" height="30" rx="6" fill="#ECE4FB" stroke="#6E48C3"/>
            <text x="160" y="360" text-anchor="middle" font-weight="700">⑧ Dashboard 跳到项目详情</text>

            <g stroke="#0E0E10" fill="none" marker-end="url(#arrF1)">
              <line x1="300" y1="85"  x2="315" y2="85"/>
              <line x1="480" y1="110" x2="160" y2="125"/>
              <line x1="300" y1="155" x2="315" y2="155"/>
              <line x1="480" y1="180" x2="480" y2="195"/>
              <line x1="480" y1="250" x2="480" y2="265"/>
              <line x1="640" y1="295" x2="675" y2="295"/>
              <line x1="160" y1="180" x2="160" y2="335"/>
            </g>
          </g>
        </svg>
        <table class="dense">
          <thead><tr><th>耗时</th><th>关键产物</th></tr></thead>
          <tbody>
            <tr><td>0-2s</td><td>HTTP 201 + project_id</td></tr>
            <tr><td>5-30s</td><td>prd.html v1</td></tr>
            <tr><td>30-60s</td><td>sdd.html v1 + units.json</td></tr>
          </tbody>
        </table>
      </section>

      <section>
        <h2>Flow 2 · 增量反馈(US-02)</h2>
        <svg viewBox="0 0 1100 360" width="100%" role="img">
          <defs><marker id="arrF2" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto"><path d="M0,0 L10,5 L0,10 Z" fill="#0E0E10"/></marker></defs>
          <g font-family="JetBrains Mono" font-size="11" fill="#0E0E10">
            <text x="60"  y="30" font-weight="700">HUMAN</text>
            <text x="380" y="30" font-weight="700">SYSTEM</text>
            <text x="780" y="30" font-weight="700">DECISION</text>
            <g stroke="#dcd5c4" stroke-dasharray="2 4">
              <line x1="160" y1="40" x2="160" y2="350"/>
              <line x1="660" y1="40" x2="660" y2="350"/>
            </g>

            <rect x="20"  y="60"  width="280" height="50" rx="6" fill="#ECE4FB" stroke="#6E48C3"/>
            <text x="160" y="80"  text-anchor="middle" font-weight="700">① 看到现状不满意</text>
            <text x="160" y="98"  text-anchor="middle" font-size="10">"还得加个 OAuth"</text>

            <rect x="20"  y="130" width="280" height="50" rx="6" fill="#ECE4FB" stroke="#6E48C3"/>
            <text x="160" y="150" text-anchor="middle" font-weight="700">② 点 + NEW REQUIREMENT</text>
            <text x="160" y="168" text-anchor="middle" font-size="10">FeedbackModal 弹</text>

            <rect x="320" y="130" width="320" height="50" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="480" y="150" text-anchor="middle">③ POST /requirement</text>
            <text x="480" y="168" text-anchor="middle" font-size="10">入队,立即返 202</text>

            <rect x="320" y="200" width="320" height="50" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="480" y="220" text-anchor="middle">④ PM 追加 PRD section</text>
            <text x="480" y="238" text-anchor="middle" font-size="10">data-rev=N+1</text>

            <rect x="680" y="200" width="400" height="50" rx="6" fill="#F7E8D2" stroke="#C77C2C"/>
            <text x="880" y="220" text-anchor="middle">⑤ 与历史矛盾?</text>
            <text x="880" y="238" text-anchor="middle" font-size="10">是:data-conflict ✦ 否:传给 Architect</text>

            <rect x="320" y="270" width="320" height="50" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="480" y="290" text-anchor="middle">⑥ Architect diff_units</text>
            <text x="480" y="308" text-anchor="middle" font-size="10">{added, changed, removed}</text>

            <rect x="680" y="270" width="400" height="50" rx="6" fill="#E2F2EA" stroke="#0E8C5A"/>
            <text x="880" y="290" text-anchor="middle">⑦ 仅 added/changed 入 L1</text>
            <text x="880" y="308" text-anchor="middle" font-size="10">passed 且 hash 不变的<b>不动</b></text>

            <g stroke="#0E0E10" fill="none" marker-end="url(#arrF2)">
              <line x1="160" y1="110" x2="160" y2="125"/>
              <line x1="300" y1="155" x2="315" y2="155"/>
              <line x1="480" y1="180" x2="480" y2="195"/>
              <line x1="640" y1="225" x2="675" y2="225"/>
              <line x1="480" y1="250" x2="480" y2="265"/>
              <line x1="640" y1="295" x2="675" y2="295"/>
            </g>
          </g>
        </svg>
        <div class="callout ok"><b>关键设计点:</b>已 passed 且 contract_hash 不变的 Unit <b>不会被 reset</b>。这是「增量」的本质。</div>
      </section>

      <section>
        <h2>Flow 3 · 集成失败 → 自愈(US-04)</h2>
        <svg viewBox="0 0 1100 420" width="100%" role="img">
          <defs><marker id="arrF3" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto"><path d="M0,0 L10,5 L0,10 Z" fill="#0E0E10"/></marker></defs>
          <g font-family="JetBrains Mono" font-size="11" fill="#0E0E10">
            <text x="60"  y="30" font-weight="700">SYSTEM</text>
            <text x="500" y="30" font-weight="700">AGENT</text>
            <text x="900" y="30" font-weight="700">DECISION</text>
            <g stroke="#dcd5c4" stroke-dasharray="2 4">
              <line x1="240" y1="40" x2="240" y2="410"/>
              <line x1="780" y1="40" x2="780" y2="410"/>
            </g>

            <rect x="20"  y="60"  width="200" height="40" rx="6" fill="#F7E8D2" stroke="#C77C2C"/>
            <text x="120" y="85" text-anchor="middle">① L2 gate 打开</text>

            <rect x="280" y="60"  width="200" height="40" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="380" y="85" text-anchor="middle">② Integrator 起进程</text>

            <rect x="280" y="120" width="200" height="40" rx="6" fill="#FCE7E2" stroke="#C7341A"/>
            <text x="380" y="145" text-anchor="middle">③ 集成失败</text>

            <rect x="800" y="120" width="280" height="40" rx="6" fill="#F7E8D2" stroke="#C77C2C"/>
            <text x="940" y="145" text-anchor="middle">l2_rounds &lt; 3?</text>

            <rect x="280" y="180" width="200" height="40" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="380" y="205" text-anchor="middle">④ BugTriager 归因</text>

            <rect x="800" y="180" width="280" height="40" rx="6" fill="#F7E8D2" stroke="#C77C2C"/>
            <text x="940" y="205" text-anchor="middle">confidence ≥ 0.5?</text>

            <rect x="20"  y="240" width="200" height="40" rx="6" fill="#ECE4FB" stroke="#6E48C3"/>
            <text x="120" y="265" text-anchor="middle">⑤a SSE 求人</text>
            <text x="120" y="280" text-anchor="middle" font-size="9">human_intervention_needed</text>

            <rect x="280" y="240" width="200" height="40" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="380" y="265" text-anchor="middle">⑤b Architect patch</text>

            <rect x="280" y="300" width="200" height="40" rx="6" fill="#fff" stroke="#0E0E10"/>
            <text x="380" y="325" text-anchor="middle">⑥ Registry.reset</text>

            <rect x="20"  y="300" width="200" height="40" rx="6" fill="#E2F2EA" stroke="#0E8C5A"/>
            <text x="120" y="325" text-anchor="middle">⑦ 回 L1 重跑</text>

            <rect x="20"  y="370" width="200" height="40" rx="6" fill="#E2F2EA" stroke="#0E8C5A"/>
            <text x="120" y="395" text-anchor="middle">⑧ shipped 或回 ②</text>

            <g stroke="#0E0E10" fill="none" marker-end="url(#arrF3)">
              <line x1="220" y1="80" x2="275" y2="80"/>
              <line x1="380" y1="100" x2="380" y2="115"/>
              <line x1="480" y1="140" x2="795" y2="140"/>
              <line x1="380" y1="160" x2="380" y2="175"/>
              <line x1="480" y1="200" x2="795" y2="200"/>
              <line x1="940" y1="220" x2="380" y2="240" stroke-dasharray="3 2"/>
              <line x1="940" y1="220" x2="120" y2="240" stroke="#C7341A" stroke-dasharray="3 2"/>
              <line x1="380" y1="280" x2="380" y2="295"/>
              <line x1="280" y1="320" x2="225" y2="320"/>
              <line x1="120" y1="340" x2="120" y2="365"/>
            </g>
          </g>
        </svg>
      </section>

      <section>
        <h2>状态可见性约定</h2>
        <p>三个 Flow 都对人类有可见性要求。Dashboard 必须在 5 秒内反应以下事件:</p>
        <table class="dense">
          <thead><tr><th>事件</th><th>视觉反馈</th></tr></thead>
          <tbody>
            <tr><td>新 Unit 进 coding</td><td>DAG 节点变 emerald</td></tr>
            <tr><td>Unit 进 testing</td><td>节点变黄</td></tr>
            <tr><td>Unit failed</td><td>节点变红 + retry 数字</td></tr>
            <tr><td>Unit passed</td><td>节点深绿描边</td></tr>
            <tr><td>L2 启动</td><td>L2 状态卡变 amber pulse</td></tr>
            <tr><td>SDD patched</td><td>SDD diff 面板高亮新 section</td></tr>
            <tr><td>human_intervention_needed</td><td>右上角 toast violet</td></tr>
            <tr><td>shipped</td><td>整页 confetti 5s(认真的)</td></tr>
          </tbody>
        </table>
      </section>

    </article>
    <nav class="prev-next"></nav>
    <footer class="site"><div><b>Section</b>01 · PRD</div><div><b>Page</b>prd-user-flows.html</div></footer>
  </main>
</div>
<script src="assets/shell.js"></script>
</body>
</html>