index.html 6.67 KB
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>三层 Loop 自动化开发系统 · 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="index.html">
<div class="shell">
  <aside id="sidebar"></aside>
  <main class="page">

    <section class="hero">
      <div class="kicker">
        <span class="pill">PRD-001</span>
        <span>LemonBoss · NewFunction</span>
        <span>v0.1 — Draft for Review</span>
        <span>2026-05-12</span>
      </div>
      <h1>三层 Loop<br/>自动化软件开发系统</h1>
      <p class="lede">把一段人类自然语言需求,沿 PRD → SDD → Unit → Integration 四级文档,跑通一个由 Claude Code ACP 与 LemonBoss 多 Agent 编织的、可自我修正的开发流水线。本文档是产品需求 + 最小改造方案。</p>

      <div class="contents-ribbon">
        <span>Tables</span><span>Design</span><span>Illustrations</span>
        <span>Code</span><span>Interaction</span><span>Workflows</span>
        <span>Spatial</span><span>Images</span>
      </div>

      <div style="margin-top:46px">
        <svg viewBox="0 0 1200 420" width="100%" role="img" aria-labelledby="heroTitle">
          <title id="heroTitle">L1 Unit Loop ⊂ L2 Integration Loop ⊂ L3 Human Feedback Loop</title>
          <defs>
            <linearGradient id="g1" x1="0" y1="0" x2="1" y2="1">
              <stop offset="0%" stop-color="#0E8C5A" stop-opacity=".18"/>
              <stop offset="100%" stop-color="#0E8C5A" stop-opacity=".05"/>
            </linearGradient>
            <linearGradient id="g2" x1="0" y1="0" x2="1" y2="1">
              <stop offset="0%" stop-color="#C77C2C" stop-opacity=".18"/>
              <stop offset="100%" stop-color="#C77C2C" stop-opacity=".05"/>
            </linearGradient>
            <linearGradient id="g3" x1="0" y1="0" x2="1" y2="1">
              <stop offset="0%" stop-color="#6E48C3" stop-opacity=".18"/>
              <stop offset="100%" stop-color="#6E48C3" stop-opacity=".05"/>
            </linearGradient>
          </defs>
          <ellipse cx="600" cy="210" rx="540" ry="190" fill="url(#g3)" stroke="#6E48C3" stroke-width="1.2"/>
          <text x="92" y="60" font-family="JetBrains Mono" font-size="13" letter-spacing="2" fill="#6E48C3">L3 · HUMAN FEEDBACK LOOP</text>
          <ellipse cx="600" cy="210" rx="380" ry="140" fill="url(#g2)" stroke="#C77C2C" stroke-width="1.2"/>
          <text x="260" y="100" font-family="JetBrains Mono" font-size="12" letter-spacing="2" fill="#C77C2C">L2 · INTEGRATION LOOP</text>
          <ellipse cx="600" cy="210" rx="200" ry="80" fill="url(#g1)" stroke="#0E8C5A" stroke-width="1.4"/>
          <text x="510" y="170" font-family="JetBrains Mono" font-size="11" letter-spacing="2" fill="#0E8C5A">L1 · UNIT LOOP</text>
          <g font-family="JetBrains Mono" font-size="11" fill="#0E0E10">
            <circle cx="540" cy="210" r="6" fill="#0E8C5A"/><text x="528" y="240">code</text>
            <circle cx="660" cy="210" r="6" fill="#0E8C5A"/><text x="648" y="240">test</text>
            <circle cx="420" cy="210" r="6" fill="#C77C2C"/><text x="392" y="195">integrate</text>
            <circle cx="780" cy="210" r="6" fill="#C77C2C"/><text x="762" y="195">triage</text>
            <circle cx="220" cy="210" r="6" fill="#6E48C3"/><text x="194" y="195">requirement</text>
            <circle cx="980" cy="210" r="6" fill="#6E48C3"/><text x="966" y="195">delivery</text>
          </g>
        </svg>
      </div>
    </section>

    <article class="body">
      <section>
        <h2>从哪里开始读?</h2>
        <p>本 PRD 共 24 页,分 8 个 Section。建议阅读顺序:</p>
        <div class="grid-3">
          <div class="card l3">
            <span class="tag L3">L3 · Recommended</span>
            <h3>顺序阅读</h3>
            <p>从左侧 Sidebar 第一项开始,按顺序点完。底部 Next 按钮串起来。</p>
          </div>
          <div class="card l2">
            <span class="tag L2">L2 · Skim</span>
            <h3>速读路径</h3>
            <p>立意 → 三层 Loop 总览 → Agent 总览 → 最小改造路径。约 15 分钟。</p>
          </div>
          <div class="card l1">
            <span class="tag L1">L1 · Deep dive</span>
            <h3>实现视角</h3>
            <p>映射 → 三个新组件 → 运行时工作流 → API → 文件布局。给开发者看。</p>
          </div>
        </div>
      </section>

      <section>
        <h2>三层 Loop 一句话</h2>
        <table>
          <thead><tr><th>Loop</th><th>触发</th><th>参与 Agent</th><th>退出条件</th><th>失败回滚</th></tr></thead>
          <tbody>
            <tr><td><span class="tag L1">L1</span> Unit</td><td>units.json 有 pending</td><td>Coder + Tester</td><td>单测全绿</td><td>retry ≤ N,超出 → blocked</td></tr>
            <tr><td><span class="tag L2">L2</span> Integration</td><td>所有 Unit passed</td><td>Integrator + BugTriager + Architect</td><td>集成全绿 → shipped</td><td>回写 SDD,受影响 Unit reset → L1</td></tr>
            <tr><td><span class="tag L3">L3</span> Human</td><td>POST /devloop/requirement</td><td>PM + Architect</td><td>人类 sign-off</td><td>对话化追问,PRD 加 section</td></tr>
          </tbody>
        </table>
      </section>

      <section>
        <h2>关键数字</h2>
        <div class="grid-4">
          <div class="card"><h4>新增 JS 文件</h4><h1 style="font-size:48px;margin:0">5</h1><p class="sig">+ 6 Agent 模板 JSON</p></div>
          <div class="card"><h4>修改既有</h4><h1 style="font-size:48px;margin:0">2</h1><p class="sig">index.js · _registry.json</p></div>
          <div class="card"><h4>预估代码量</h4><h1 style="font-size:48px;margin:0">~1.5K</h1><p class="sig">行 · 14 个文件</p></div>
          <div class="card"><h4>阶段</h4><h1 style="font-size:48px;margin:0">4</h1><p class="sig">P1 → P4 · 单人 ~6 周</p></div>
        </div>
      </section>
    </article>

    <nav class="prev-next"></nav>
    <footer class="site">
      <div><b>Document</b>PRD-001 · v0.1</div>
      <div><b>Status</b>Draft · 待 Review</div>
      <div><b>Author</b>Claude Opus 4.7</div>
      <div><b>Repo</b>lemonboss · main</div>
    </footer>
  </main>
</div>
<script src="assets/shell.js"></script>
</body>
</html>