Skill: lailiai/prd-design-iteration (version 1.0.0)

--- name: product-design-iteration description: Use this skill when the user wants to iterate on an existing company-internal process management system — adding/modifying/deleting features. Triggers when the user explicitly says "迭代", "给现有产品加功能", "改一下", "删除某功能", or similar iteration requests. Produces delta PRD and modified prototype through a streamlined 4-step process with screenshot-based precision. --- # Product Design Iteration (Internal Process System) — v3.0 **精简迭代流程**：4步完成，以截图为核心，精准定位变更。 ## 🆕 v3.0 核心优化 - ❌ 去除冗长的7步流程，精简为4步 - ✅ 增加**界面截图**作为核心输入，精准识别变更位置 - ✅ 按变更类型（新增/调整/删除）分类处理 - ✅ 最终输出：差量PRD + 修改后原型（before/after对比） ## Domain assumption Target is ALWAYS a company-internal process management system that ALREADY EXISTS. If product is brand new → use `product-design-0to1` skill instead. ## Core philosophy **以截图为锚点，精准变更。** 不看到界面就不知道改什么，不知道改什么就无法精准迭代。 ## The 4 Steps ### Step 1: 基础信息收集（3个快速问题） 依次询问以下3个问题： #### 1.1 涉及角色 > "这个流程涉及哪些角色？每个角色一句话职责。" 示例： - 客服专员：执行客户回访任务，记录回访结果 - 业务部门：配置回访模版，分配任务，审核质量 #### 1.2 现有主流程 > "请用3-7步描述现有的核心业务流程。" 示例： 1. 业务部门配置回访模板 2. 业务部门创建回访任务并分配给客服专员 3. 客服专员执行回访并记录结果 4. 业务部门审核回访质量 5. 系统生成回访数据报表 #### 1.3 迭代需求 > "目前流程存在什么问题？为什么要迭代？需要增加/修改/删除什么功能？" 示例： - 问题：业务部门手动创建任务太费时，每次要导入Excel客户名单 - 需求：希望系统能自动根据规则生成回访任务 **收集完成后**：创建 `project/00-input/baseline.md` 保存这3部分信息，用 `present_files` 呈现，等用户确认。 --- ### Step 2: AI分析并输出调整清单 基于Step 1的信息，AI分析并输出： #### 2.1 功能模块推断 根据主流程和迭代需求，推断出系统的功能模块列表。 示例输出格式： ```markdown ## 现有功能模块（推断） - M1 回访模板管理 - M2 回访任务管理 - M3 回访执行 - M4 质量审核 - M5 数据报表 ``` #### 2.2 调整清单 列出本次迭代涉及的模块和调整类型。 示例输出格式： ```markdown ## 本次调整清单 | 模块 | 调整类型 | 调整说明 | |------|---------|---------| | M2 回访任务管理 | 调整 | 增加自动生成任务功能 | | M6 规则引擎 | 新增 | 新增规则配置模块 | | M3 回访执行 | 调整 | 增加客户历史记录展示 | ``` **输出位置**：`project/01-adjustment-list.md` 用 `present_files` 呈现，询问用户： > "我理解您需要调整以上模块，对吗？如有遗漏或错误请告诉我。" **等用户确认后进入Step 3。** --- ### Step 3: 分类收集调整内容 根据Step 2确认的调整清单，按**调整类型**分别收集材料。 #### 3.1 新增界面（Type A） 对于每个"新增"的模块/界面，依次询问： **问题1：需求描述** > "请描述这个新增界面的需求和功能。" **问题2：界面字段** > "这个界面需要哪些字段？请列出字段名称和说明。" 示例： - 规则名称（文本） - 触发条件（下拉多选） - 生成频率（单选：每日/每周/每月） - 目标客户筛选（复杂条件组件） **问题3：前序/后续界面截图** > "请上传这个界面的**前序界面截图**（从哪里进入）和**后续界面截图**（点击后去哪里）。如果没有截图，请描述前后跳转关系。" **收集完成后**：创建 `project/02-add/{模块名}.md`，包含： - 需求描述 - 界面字段表 - 前后跳转关系 - 前序/后续截图引用 #### 3.2 调整当前界面（Type B） 对于每个"调整"的模块/界面，依次询问： **问题1：调整说明** > "请说明要对这个界面做什么调整？" 示例：在任务管理页面增加"自动生成"按钮和配置入口 **问题2：当前界面截图/原型** > "请上传**当前界面的截图**或HTML原型。这样我能精准知道在哪里加什么。" **如果用户无法提供截图**，追问： > "请描述当前界面有哪些主要元素？比如：顶部有什么按钮、表格有哪些列、右侧有什么操作。" **收集完成后**：创建 `project/03-modify/{模块名}.md`，包含： - 调整说明 - 当前界面截图/描述 - 标注变更位置 #### 3.3 删除界面（Type C） 对于每个"删除"的模块/界面： **AI自动分析**： 1. 检查该界面/模块在主流程中的位置 2. 分析删除后对数据流的影响 3. 检查是否有其他模块依赖 **输出分析结果**：`project/04-delete/{模块名}-impact.md` 示例： ```markdown ## 删除影响分析：M4 质量审核 ### 流程影响 - 主流程第4步"业务部门审核回访质量"将被移除 - 第3步"客服提交"后直接进入第5步"生成报表" ### 数据影响 - 回访记录表的"审核状态"字段将废弃 - 回访记录表的"审核意见"字段将废弃 - 历史审核数据建议归档保留 ### 依赖检查 - M5 数据报表中有"审核通过率"指标，需同步删除 ``` 用 `present_files` 呈现分析结果，询问用户： > "删除这个模块会有以上影响，确认要删除吗？" **所有类型收集完成后**，用 `present_files` 呈现所有收集的材料，等用户最终确认。 --- ### Step 4: 合理性检查 + 输出 #### 4.1 合理性检查 在输出前，执行以下检查： **检查项1：信息完整性** - [ ] 所有新增界面都有字段清单 - [ ] 所有调整界面都有截图/描述 - [ ] 所有删除界面都有影响分析 **检查项2：流程闭环性** - [ ] 新增界面的前序/后续跳转是否合理 - [ ] 调整后的主流程是否完整 - [ ] 删除后是否有流程断裂 **检查项3：角色权限覆盖** - [ ] 每个新增/调整的界面是否明确了操作角色 - [ ] 是否有角色失去必要功能 **如果检查不通过**： - 输出缺失项清单 - 要求用户补充信息 - 补充后重新检查 **如果检查通过**： - 输出检查结果：`project/05-validation-passed.md` - 进入输出阶段 #### 4.2 最终输出 **输出1：差量PRD文档** 位置：`project/06-output/delta-prd.md` 结构： ```markdown # [产品名称] 迭代PRD - [版本号] ## 1. 迭代概述 - 迭代目标 - 涉及角色 - 调整范围 ## 2. 现有流程回顾 （引用Step 1的主流程） ## 3. 迭代需求 （引用Step 1的迭代需求） ## 4. 调整清单 （引用Step 2的调整清单） ## 5. 新增功能详述 （针对每个Type A模块） ### 5.1 [模块名] - 功能描述 - 界面字段 - 前后跳转 - 用户故事 ## 6. 调整功能详述 （针对每个Type B模块） ### 6.1 [模块名] - 调整说明 - Before（当前状态） - After（调整后状态） - 影响范围 ## 7. 删除功能说明 （针对每个Type C模块） ### 7.1 [模块名] - 删除原因 - 影响分析 - 数据迁移方案 ## 8. 迭代后主流程 （更新后的完整流程） ## 9. 数据字段变更 - 新增字段 - 修改字段 - 废弃字段 ## 10. 回滚预案 - 回滚触发条件 - 回滚步骤 - 数据恢复方案 ``` **输出2：修改后的原型** 位置：`project/06-output/prototype.html` 原型要求： 1. **新增界面**：完整交互原型 2. **调整界面**：Before/After对比视图（左右分屏或Tab切换） 3. **删除界面**：标注"已删除"，说明删除原因 4. **导航**：提供原型导航菜单，按模块分组 原型技术栈： - 使用React + Tailwind - 使用tabs或左右分屏展示before/after - 调整部分用高亮标注变更区域 - 支持点击跳转模拟真实流程 **使用 `present_files` 同时呈现差量PRD和原型。** --- ## Cross-cutting rules 1. **强制卡点**：每步产物必须用 `present_files` 呈现并等用户确认 2. **截图优先**：Type B调整界面，必须要求截图/原型，否则无法精准定位 3. **不编造**：信息不足时用 `[TODO: 需要用户补充XXX]` 占位 4. **闭环检查**：Step 4必须检查流程完整性，发现断裂必须打回 5. **before/after必须对比**：调整类界面的原型必须有清晰的对比展示 ## File layout (under `project/`) ``` project/ ├── 00-input/ │ └── baseline.md # Step 1收集的基础信息 ├── 01-adjustment-list.md # Step 2的调整清单 ├── 02-add/ # Step 3 新增界面材料 │ ├── {模块名}.md │ └── screenshots/ ├── 03-modify/ # Step 3 调整界面材料 │ ├── {模块名}.md │ └── screenshots/ ├── 04-delete/ # Step 3 删除影响分析 │ └── {模块名}-impact.md ├── 05-validation-passed.md # Step 4 检查结果 └── 06-output/ ├── delta-prd.md # 差量PRD └── prototype.html # 修改后原型 ``` ## End "✅ 迭代设计完成（含差量PRD + 修改后原型）。请走灰度发布流程或交付工程实施。"

path: references/templates/prototype-template.html
content: <!--
迭代原型模板 v3.0
用于展示新增/调整/删除模块的before/after对比
-->
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>迭代原型 - [产品名称]</title>
  <script crossorigin src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
  <script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
  <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
  <script src="https://cdn.tailwindcss.com"></script>
  <style>
    body {
      margin: 0;
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
    }
    
    .badge-new {
      background: #10b981;
      color: white;
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 12px;
      font-weight: 600;
    }
    
    .badge-modify {
      background: #3b82f6;
      color: white;
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 12px;
      font-weight: 600;
    }
    
    .badge-deleted {
      background: #ef4444;
      color: white;
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 12px;
      font-weight: 600;
    }
    
    .highlight-new {
      position: relative;
      animation: highlight-pulse 2s ease-in-out infinite;
    }
    
    @keyframes highlight-pulse {
      0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); }
      50% { box-shadow: 0 0 0 10px rgba(16, 185, 129, 0); }
    }
    
    .comparison-divider {
      width: 2px;
      background: linear-gradient(to bottom, #e5e7eb 0%, #3b82f6 50%, #e5e7eb 100%);
    }
    
    .change-annotation {
      background: #fef3c7;
      border-left: 4px solid #f59e0b;
      padding: 8px 12px;
      margin: 8px 0;
      font-size: 14px;
    }
  </style>
</head>
<body>
  <div id="root"></div>

  <script type="text/babel">
    const { useState } = React;

    // 主应用组件
    function App() {
      const [selectedModule, setSelectedModule] = useState('overview');

      // 模块配置（根据实际调整清单填充）
      const modules = {
        new: [
          // { id: 'M6', name: '规则引擎', component: NewRuleEngineModule }
        ],
        modify: [
          // { id: 'M2', name: '任务管理', component: ModifyTaskManagementModule }
        ],
        delete: [
          // { id: 'M4', name: '质量审核', component: DeletedQualityAuditModule }
        ]
      };

      return (
        <div className="flex h-screen bg-gray-50">
          {/* 左侧导航 */}
          <Sidebar 
            modules={modules} 
            selectedModule={selectedModule}
            onSelect={setSelectedModule}
          />
          
          {/* 主内容区 */}
          <MainContent 
            selectedModule={selectedModule}
            modules={modules}
          />
        </div>
      );
    }

    // 侧边栏组件
    function Sidebar({ modules, selectedModule, onSelect }) {
      return (
        <nav className="w-64 bg-white border-r border-gray-200 overflow-y-auto">
          <div className="p-6">
            <h1 className="text-xl font-bold text-gray-900 mb-2">
              迭代原型
            </h1>
            <p className="text-sm text-gray-500">
              v[版本号]
            </p>
          </div>

          <div className="px-3 pb-6">
            {/* 概览 */}
            <button
              onClick={() => onSelect('overview')}
              className={`w-full text-left px-3 py-2 rounded-lg mb-2 ${
                selectedModule === 'overview' 
                  ? 'bg-blue-50 text-blue-700 font-medium' 
                  : 'text-gray-700 hover:bg-gray-50'
              }`}
            >
              📊 迭代概览
            </button>

            {/* 新增模块 */}
            {modules.new.length > 0 && (
              <div className="mt-6">
                <h3 className="px-3 text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">
                  ✨ 新增模块
                </h3>
                {modules.new.map(module => (
                  <button
                    key={module.id}
                    onClick={() => onSelect(module.id)}
                    className={`w-full text-left px-3 py-2 rounded-lg mb-1 ${
                      selectedModule === module.id 
                        ? 'bg-green-50 text-green-700 font-medium' 
                        : 'text-gray-700 hover:bg-gray-50'
                    }`}
                  >
                    {module.id} {module.name}
                  </button>
                ))}
              </div>
            )}

            {/* 调整模块 */}
            {modules.modify.length > 0 && (
              <div className="mt-6">
                <h3 className="px-3 text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">
                  🔄 调整模块
                </h3>
                {modules.modify.map(module => (
                  <button
                    key={module.id}
                    onClick={() => onSelect(module.id)}
                    className={`w-full text-left px-3 py-2 rounded-lg mb-1 ${
                      selectedModule === module.id 
                        ? 'bg-blue-50 text-blue-700 font-medium' 
                        : 'text-gray-700 hover:bg-gray-50'
                    }`}
                  >
                    {module.id} {module.name}
                  </button>
                ))}
              </div>
            )}

            {/* 删除模块 */}
            {modules.delete.length > 0 && (
              <div className="mt-6">
                <h3 className="px-3 text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">
                  🗑️ 删除模块
                </h3>
                {modules.delete.map(module => (
                  <button
                    key={module.id}
                    onClick={() => onSelect(module.id)}
                    className={`w-full text-left px-3 py-2 rounded-lg mb-1 ${
                      selectedModule === module.id 
                        ? 'bg-red-50 text-red-700 font-medium' 
                        : 'text-gray-700 hover:bg-gray-50'
                    }`}
                  >
                    {module.id} {module.name}
                  </button>
                ))}
              </div>
            )}

            {/* 流程对比 */}
            <div className="mt-6">
              <h3 className="px-3 text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">
                📋 流程对比
              </h3>
              <button
                onClick={() => onSelect('flow-comparison')}
                className={`w-full text-left px-3 py-2 rounded-lg ${
                  selectedModule === 'flow-comparison' 
                    ? 'bg-purple-50 text-purple-700 font-medium' 
                    : 'text-gray-700 hover:bg-gray-50'
                }`}
              >
                调整前后流程
              </button>
            </div>
          </div>
        </nav>
      );
    }

    // 主内容区组件
    function MainContent({ selectedModule, modules }) {
      // 概览页面
      if (selectedModule === 'overview') {
        return <OverviewPage modules={modules} />;
      }

      // 流程对比页面
      if (selectedModule === 'flow-comparison') {
        return <FlowComparisonPage />;
      }

      // 查找对应的模块组件
      const allModules = [...modules.new, ...modules.modify, ...modules.delete];
      const module = allModules.find(m => m.id === selectedModule);
      
      if (module && module.component) {
        return <module.component />;
      }

      return (
        <div className="flex-1 p-8">
          <p className="text-gray-500">请选择左侧模块查看详情</p>
        </div>
      );
    }

    // 概览页面
    function OverviewPage({ modules }) {
      return (
        <div className="flex-1 p-8 overflow-y-auto">
          <h2 className="text-3xl font-bold text-gray-900 mb-2">
            迭代概览
          </h2>
          <p className="text-gray-600 mb-8">
            本次迭代涉及的模块和调整内容
          </p>

          <div className="grid grid-cols-3 gap-6 mb-8">
            <div className="bg-green-50 border border-green-200 rounded-lg p-6">
              <div className="text-4xl font-bold text-green-600 mb-2">
                {modules.new.length}
              </div>
              <div className="text-green-800 font-medium">
                新增模块
              </div>
            </div>

            <div className="bg-blue-50 border border-blue-200 rounded-lg p-6">
              <div className="text-4xl font-bold text-blue-600 mb-2">
                {modules.modify.length}
              </div>
              <div className="text-blue-800 font-medium">
                调整模块
              </div>
            </div>

            <div className="bg-red-50 border border-red-200 rounded-lg p-6">
              <div className="text-4xl font-bold text-red-600 mb-2">
                {modules.delete.length}
              </div>
              <div className="text-red-800 font-medium">
                删除模块
              </div>
            </div>
          </div>

          <div className="bg-white rounded-lg border border-gray-200 p-6">
            <h3 className="text-lg font-bold text-gray-900 mb-4">
              调整清单
            </h3>
            
            <table className="w-full">
              <thead>
                <tr className="border-b border-gray-200">
                  <th className="text-left py-3 px-4 text-sm font-semibold text-gray-700">
                    模块编号
                  </th>
                  <th className="text-left py-3 px-4 text-sm font-semibold text-gray-700">
                    模块名称
                  </th>
                  <th className="text-left py-3 px-4 text-sm font-semibold text-gray-700">
                    调整类型
                  </th>
                  <th className="text-left py-3 px-4 text-sm font-semibold text-gray-700">
                    调整说明
                  </th>
                </tr>
              </thead>
              <tbody>
                {modules.new.map(m => (
                  <tr key={m.id} className="border-b border-gray-100">
                    <td className="py-3 px-4 text-sm">{m.id}</td>
                    <td className="py-3 px-4 text-sm">{m.name}</td>
                    <td className="py-3 px-4">
                      <span className="badge-new">新增</span>
                    </td>
                    <td className="py-3 px-4 text-sm text-gray-600">
                      {m.description || '新增功能模块'}
                    </td>
                  </tr>
                ))}
                {modules.modify.map(m => (
                  <tr key={m.id} className="border-b border-gray-100">
                    <td className="py-3 px-4 text-sm">{m.id}</td>
                    <td className="py-3 px-4 text-sm">{m.name}</td>
                    <td className="py-3 px-4">
                      <span className="badge-modify">调整</span>
                    </td>
                    <td className="py-3 px-4 text-sm text-gray-600">
                      {m.description || '功能调整'}
                    </td>
                  </tr>
                ))}
                {modules.delete.map(m => (
                  <tr key={m.id} className="border-b border-gray-100">
                    <td className="py-3 px-4 text-sm">{m.id}</td>
                    <td className="py-3 px-4 text-sm">{m.name}</td>
                    <td className="py-3 px-4">
                      <span className="badge-deleted">删除</span>
                    </td>
                    <td className="py-3 px-4 text-sm text-gray-600">
                      {m.description || '移除此模块'}
                    </td>
                  </tr>
                ))}
              </tbody>
            </table>
          </div>
        </div>
      );
    }

    // 流程对比页面（示例）
    function FlowComparisonPage() {
      return (
        <div className="flex-1 p-8 overflow-y-auto">
          <h2 className="text-3xl font-bold text-gray-900 mb-8">
            流程对比
          </h2>

          <div className="grid grid-cols-2 gap-8">
            {/* Before */}
            <div>
              <h3 className="text-xl font-bold text-gray-700 mb-4">
                调整前流程
              </h3>
              <div className="bg-white rounded-lg border border-gray-200 p-6">
                <ol className="space-y-3">
                  {/* 这里填入Step 1收集的现有主流程 */}
                  <li className="flex items-start">
                    <span className="flex-shrink-0 w-6 h-6 rounded-full bg-gray-200 text-gray-700 flex items-center justify-center text-sm font-medium mr-3">
                      1
                    </span>
                    <span className="text-gray-700">
                      [步骤1描述]
                    </span>
                  </li>
                  {/* 更多步骤... */}
                </ol>
              </div>
            </div>

            {/* After */}
            <div>
              <h3 className="text-xl font-bold text-gray-700 mb-4">
                调整后流程
              </h3>
              <div className="bg-white rounded-lg border border-gray-200 p-6">
                <ol className="space-y-3">
                  {/* 这里填入调整后的主流程 */}
                  <li className="flex items-start">
                    <span className="flex-shrink-0 w-6 h-6 rounded-full bg-gray-200 text-gray-700 flex items-center justify-center text-sm font-medium mr-3">
                      1
                    </span>
                    <span className="text-gray-700">
                      [步骤1描述]
                    </span>
                  </li>
                  {/* 新增步骤标记 */}
                  <li className="flex items-start">
                    <span className="flex-shrink-0 w-6 h-6 rounded-full bg-green-500 text-white flex items-center justify-center text-sm font-medium mr-3">
                      2
                    </span>
                    <div>
                      <span className="text-gray-700">
                        [新增步骤描述]
                      </span>
                      <span className="ml-2 badge-new">NEW</span>
                    </div>
                  </li>
                  {/* 更多步骤... */}
                </ol>
              </div>
            </div>
          </div>
        </div>
      );
    }

    // 渲染应用
    ReactDOM.render(<App />, document.getElementById('root'));
  </script>
</body>
</html>


path: references/steps/step3-material-collection.md
content: # Step 3: 分类收集调整内容

## 目标
按调整类型（新增/调整/删除）分别收集必要的材料，确保有足够信息进行精准设计。

## 处理顺序
建议按以下顺序处理（先易后难）：
1. 删除类（DELETE） - 只需分析影响
2. 新增类（ADD） - 需求描述即可
3. 调整类（MODIFY） - 需要截图/原型，最复杂

---

## 3.1 新增界面（Type A）

### 适用场景
调整清单中标记为"新增"的模块。

### 收集流程

对于每个新增模块，依次询问3个问题：

#### 问题1：需求描述
**提问**：
> "请描述【{模块名}】这个新增界面/模块的需求和功能。"

**引导格式**：
```
功能：做什么
用户：谁用
场景：什么时候用
目标：解决什么问题
```

**示例**：
```
功能：配置自动生成回访任务的规则
用户：业务部门使用
场景：在需要批量定期回访时，提前配置好规则，系统按规则自动生成任务
目标：减少手动创建任务的工作量
```

#### 问题2：界面字段
**提问**：
> "这个界面需要哪些字段？请列出字段名称、类型和说明。"

**引导格式**：
```
字段名 | 类型 | 说明 | 是否必填
```

**示例**：
```
规则名称 | 文本 | 规则的标识名称 | 是
触发条件 | 下拉多选 | 选择触发规则的条件（如：新客户注册、订单完成） | 是
生成频率 | 单选 | 每日/每周/每月 | 是
目标客户 | 复杂筛选组件 | 按业务类型、地区等筛选客户 | 是
回访模板 | 下拉单选 | 选择使用哪个回访模板 | 是
分配策略 | 单选 | 平均分配/按地区分配/按客服负载分配 | 是
状态 | 系统字段 | 启用/禁用 | 否
```

**注意**：
- 如果用户只说字段名，追问类型和说明
- 如果字段超过15个，提醒"是否可以分页或分组"

#### 问题3：前序/后续界面
**提问**：
> "这个界面的前序界面是什么（从哪里进入）？后续界面是什么（点击后去哪里）？
> 
> 如果有**现有系统的截图**，请上传前序和后续界面的截图，这样我能更精准地设计跳转。如果没有截图，请描述跳转关系。"

**引导格式**：
```
前序界面：从XX页面点击XX按钮进入
后续界面：
  - 点击"保存"后回到XX页面
  - 点击"取消"后回到XX页面
```

**示例**：
```
前序界面：从M2任务管理页面，点击顶部"规则配置"按钮进入
后续界面：
  - 点击"保存规则"后回到任务管理页面，顶部显示成功提示
  - 点击"取消"后回到任务管理页面
  - 点击"预览生成结果"后弹窗显示按规则会生成哪些任务
```

**如果用户上传截图**：
- 保存截图到 `project/02-add/screenshots/`
- 在文档中引用截图路径
- 分析截图中的导航结构、按钮位置、页面布局

### 输出

为每个新增模块创建 `project/02-add/{模块名}.md`：

```markdown
# 新增模块：{模块名}

## 需求描述

**功能**：[做什么]
**用户**：[谁用]
**场景**：[什么时候用]
**目标**：[解决什么问题]

## 界面字段

| 字段名 | 类型 | 说明 | 必填 |
|-------|------|------|------|
| [字段1] | [类型] | [说明] | 是/否 |
| [字段2] | [类型] | [说明] | 是/否 |
...

## 前后跳转

**前序界面**：[从哪里进入]
（如有截图：见 `screenshots/[文件名]`）

**后续界面**：
- [操作1]：[跳转目标]
- [操作2]：[跳转目标]
（如有截图：见 `screenshots/[文件名]`）

## 备注

[其他需要说明的信息]
```

---

## 3.2 调整当前界面（Type B）

### 适用场景
调整清单中标记为"调整"的模块。

### 收集流程

对于每个调整模块，依次询问2个问题：

#### 问题1：调整说明
**提问**：
> "请说明要对【{模块名}】做什么调整？具体要增加/修改/移除什么功能或元素？"

**引导格式**：
```
调整内容：[具体要改什么]
调整原因：[为什么要改]
期望效果：[改完后是什么样]
```

**示例**：
```
调整内容：在任务管理页面顶部增加"自动生成"按钮，点击后进入规则配置页面
调整原因：目前只能手动创建任务，希望增加自动生成入口
期望效果：业务部门可以快速进入规则配置，减少操作步骤
```

#### 问题2：当前界面截图/原型（关键！）
**提问**：
> "🎯 **关键步骤**：请上传【{模块名}】**当前界面的截图**或HTML原型。
> 
> 这样我能精准知道：
> - 在哪个位置加按钮/字段
> - 现有布局是怎样的
> - 应该如何调整才不破坏原有设计
> 
> 如果暂时没有截图，请尽可能详细描述当前界面的布局和主要元素。"

**如果用户提供截图**：
- 保存截图到 `project/03-modify/screenshots/`
- 仔细分析截图：
  - 页面标题在哪里
  - 主要操作按钮在哪里（顶部/右侧/底部）
  - 数据展示区域是什么形式（表格/卡片/列表）
  - 筛选/搜索组件在哪里
- 在调整说明中标注变更位置（如："在顶部操作栏右侧增加按钮"）

**如果用户无法提供截图**：
追问以下细节：
> "请描述当前界面：
> 1. 顶部有什么？（标题、面包屑、操作按钮）
> 2. 中间主体是什么？（表格、表单、卡片）
> 3. 如果是表格，有哪些列？
> 4. 右侧或底部有什么操作？"

### 输出

为每个调整模块创建 `project/03-modify/{模块名}.md`：

```markdown
# 调整模块：{模块名}

## 调整说明

**调整内容**：[具体要改什么]
**调整原因**：[为什么要改]
**期望效果**：[改完后是什么样]

## 当前界面

### 截图
（如有截图：嵌入截图或引用路径 `screenshots/[文件名]`）

### 界面结构描述
（如无截图，根据用户描述整理）

**顶部区域**：
- [元素1]
- [元素2]

**主体区域**：
- [表格/表单/卡片等]
- [列/字段清单]

**操作区域**：
- [按钮/链接]

## 变更位置标注

**要增加的元素**：
- 位置：[在哪里加]
- 内容：[加什么]
- 样式：[按钮/链接/下拉等]

**要修改的元素**：
- 原内容：[现在是什么]
- 新内容：[改成什么]
- 位置：[在哪里]

**要删除的元素**：
- 位置：[在哪里]
- 内容：[删什么]
- 原因：[为什么删]

## 调整后效果描述

[用文字描述调整后的界面应该是什么样]
```

---

## 3.3 删除界面（Type C）

### 适用场景
调整清单中标记为"删除"的模块。

### AI自动分析（无需用户输入）

对于每个删除模块，AI自动执行以下分析：

#### 分析1：流程影响
检查该模块在主流程中的位置，分析删除后流程如何衔接。

**示例**：
```
当前流程：
1. 配置模板
2. 创建任务
3. 执行回访
4. 审核质量 ← 要删除
5. 生成报表

删除后流程：
1. 配置模板
2. 创建任务
3. 执行回访
4. 生成报表 ← 直接跳到这里

影响：客服提交回访后，直接进入报表生成，中间不再有审核环节
```

#### 分析2：数据影响
检查该模块涉及的数据字段，分析哪些字段会废弃。

**从Step 1中提取的数据字段**：
```
回访记录：记录ID、任务ID、客户ID、客服ID、回访时间、
         回访结果、问题答案JSON、审核状态、审核意见
```

**分析**：
```
废弃字段：
- 审核状态（删除审核模块后不再需要）
- 审核意见（删除审核模块后不再需要）

保留字段：
- 其他字段继续使用

历史数据处理建议：
- 已有的审核状态和审核意见建议归档保留，不删除
- 新创建的回访记录不再包含这两个字段
```

#### 分析3：依赖检查
检查其他模块是否依赖被删除的模块。

**检查方法**：
1. 在其他模块的描述中搜索被删除模块的关键词
2. 检查数据报表是否使用被删除模块的数据

**示例**：
```
依赖检查结果：
- M5 数据报表中有"审核通过率"指标，依赖审核状态字段
- M3 回访执行中有"返工"状态，需要审核模块触发

影响处理：
- M5 数据报表需要删除"审核通过率"相关图表
- M3 回访执行需要移除"返工"状态及相关逻辑
```

### 输出

为每个删除模块创建 `project/04-delete/{模块名}-impact.md`：

```markdown
# 删除影响分析：{模块名}

## 删除概述

**删除模块**：[模块名]
**删除原因**：[引用用户在迭代需求中的说明]

## 流程影响

### 当前流程
[列出当前完整流程，标注被删除步骤]

### 删除后流程
[列出删除后的流程，标注如何衔接]

### 流程完整性
- ✅ 流程仍然完整 / ⚠️ 需要补充衔接逻辑

## 数据影响

### 废弃字段
| 数据对象 | 废弃字段 | 原用途 | 处理建议 |
|---------|---------|--------|---------|
| [对象名] | [字段名] | [用途] | [建议] |

### 保留字段
[列出不受影响的字段]

### 历史数据处理
[说明已有数据如何处理]

## 依赖检查

### 被依赖情况
[列出哪些模块依赖被删除的模块]

### 影响处理
[说明如何处理这些依赖]

## 删除风险评估

- **流程风险**：[高/中/低] - [说明]
- **数据风险**：[高/中/低] - [说明]
- **依赖风险**：[高/中/低] - [说明]

## 建议

[AI给出的删除建议或替代方案]
```

### 用户确认

用 `present_files` 呈现影响分析，询问用户：

> "删除【{模块名}】会有以上影响，确认要删除吗？
> 
> - 如果确认删除，我将在后续设计中处理这些影响
> - 如果风险太高，建议改为"隐藏"或"禁用"而非完全删除"

---

## 3.4 全部收集完成

当所有类型的调整内容都收集完成后：

### 汇总检查

创建 `project/03-collection-summary.md`：

```markdown
# 调整内容收集汇总

## 收集完成情况

| 模块 | 调整类型 | 收集状态 | 材料位置 |
|------|---------|---------|---------|
| M2 | 调整 | ✅ 已完成 | 03-modify/M2-任务管理.md |
| M6 | 新增 | ✅ 已完成 | 02-add/M6-规则引擎.md |
| M4 | 删除 | ✅ 已完成 | 04-delete/M4-质量审核-impact.md |

## 缺失检查

[列出是否有信息缺失]

- [ ] 所有新增界面都有字段清单
- [ ] 所有调整界面都有截图/描述
- [ ] 所有删除界面都有影响分析
```

### 用户最终确认

用 `present_files` 呈现所有收集的材料（02-add/、03-modify/、04-delete/ 中的所有文件），询问用户：

> "以上是我收集的所有调整内容材料，请确认：
> 1. 信息是否完整？
> 2. 有没有需要补充的？
> 3. 确认无误后我将进入合理性检查和输出阶段。"

**用户确认后进入Step 4。**


path: references/steps/step1-baseline-collection.md
content: # Step 1: 基础信息收集

## 目标
用3个快速问题收集迭代所需的最小必要信息。

## 三个问题

### 1.1 涉及角色

**提问方式**：
> "这个流程涉及哪些角色？每个角色一句话职责。"

**示例格式提供给用户**：
```
- 客服专员：执行客户回访任务，记录回访结果
- 业务部门：配置回访模版，分配任务，审核质量
```

**注意事项**：
- 角色一般3-6个
- 每个角色职责控制在20字以内
- 如果用户列出超过10个角色，提醒"是否可以合并相似角色"

### 1.2 现有主流程

**提问方式**：
> "请用3-7步描述现有的核心业务流程。"

**示例格式提供给用户**：
```
1. 业务部门配置回访模板
2. 业务部门创建回访任务并分配给客服专员
3. 客服专员执行回访并记录结果
4. 业务部门审核回访质量
5. 系统生成回访数据报表
```

**注意事项**：
- 控制在3-7步，不要太细
- 每步应该是一个完整的业务动作
- 如果用户描述超过10步，提醒"请概括为核心主流程"

**补充确认**：
如果流程中有关键分支，追问：
- "步骤X是手动还是自动触发？"
- "步骤Y是每次都执行还是按条件执行？"

### 1.3 迭代需求

**提问方式**：
> "目前流程存在什么问题？为什么要迭代？需要增加/修改/删除什么功能？"

**引导用户结构化描述**：
```
问题：（描述现状痛点）
需求：（想要达成的目标）
涉及模块：（如果知道的话）
```

**示例**：
```
问题：业务部门手动创建任务太费时，每次要导入Excel客户名单
需求：希望系统能自动根据规则生成回访任务
涉及模块：任务管理模块
```

**注意事项**：
- 允许用户描述多个问题和需求
- 如果需求描述模糊，追问具体场景
- 记录用户提到的关键词（会用于Step 2推断模块）

## 输出

创建 `project/00-input/baseline.md`，格式如下：

```markdown
# 基础信息

## 涉及角色

| 角色 | 职责 |
|------|------|
| [角色1] | [职责描述] |
| [角色2] | [职责描述] |

## 现有主流程

1. [步骤1]
2. [步骤2]
3. [步骤3]
...

## 迭代需求

### 需求1
- **问题**：[痛点描述]
- **需求**：[目标描述]
- **涉及模块**：[用户提到的模块，如未提到则留空]

### 需求2
...
```

**用 `present_files` 呈现，询问用户**：
> "我整理的基础信息如上，确认准确吗？如有遗漏或错误请告诉我。"

**等用户确认后进入Step 2。**


path: references/steps/step4-validation-output.md
content: # Step 4: 合理性检查 + 输出

## 目标
在输出前执行合理性检查，确保信息完整、流程闭环、设计合理，然后输出差量PRD和修改后原型。

---

## 4.1 合理性检查

### 检查清单

#### 检查项1：信息完整性

逐一检查每个调整模块的材料是否完整：

**新增界面检查**：
- [ ] 有需求描述（功能、用户、场景、目标）
- [ ] 有界面字段清单（字段名、类型、说明、必填）
- [ ] 有前后跳转说明或截图

**调整界面检查**：
- [ ] 有调整说明（调整内容、原因、期望效果）
- [ ] 有当前界面截图或详细描述
- [ ] 有变更位置标注

**删除界面检查**：
- [ ] 有流程影响分析
- [ ] 有数据影响分析
- [ ] 有依赖检查分析

**检查方法**：
遍历 `02-add/`、`03-modify/`、`04-delete/` 目录下的所有文件，检查必要字段是否填写。

**如果发现缺失**：
创建 `project/05-validation-issues.md`：
```markdown
# 信息完整性检查 - 发现缺失

## 缺失项清单

### M6 规则引擎（新增）
- ⚠️ 缺少前序界面截图
- ⚠️ 字段"目标客户"的类型和说明不够详细

### M2 任务管理（调整）
- ⚠️ 缺少当前界面截图或描述
```

用 `present_files` 呈现缺失清单，要求用户补充，补充后重新检查。

#### 检查项2：流程闭环性

检查调整后的主流程是否完整、合理、可执行。

**检查步骤**：

1. **重建调整后的主流程**

从Step 1的现有主流程出发，应用所有调整：
- 新增模块 → 在流程中插入新步骤
- 调整模块 → 修改相应步骤的描述
- 删除模块 → 从流程中移除相应步骤

**示例**：

原流程：
```
1. 业务部门配置回访模板
2. 业务部门创建回访任务并分配给客服专员
3. 客服专员执行回访并记录结果
4. 业务部门审核回访质量
5. 系统生成回访数据报表
```

应用调整（M6新增、M2调整、M4删除）：
```
1. 业务部门配置回访模板
2. 业务部门配置自动生成规则（新增M6）
3. 业务部门手动创建任务 或 系统自动生成任务（调整M2）
4. 业务部门分配任务给客服专员
5. 客服专员执行回访并记录结果
6. 系统生成回访数据报表（删除M4审核步骤）
```

2. **检查流程完整性**

- [ ] 流程有明确的开始点
- [ ] 流程有明确的结束点
- [ ] 每个步骤都有执行角色
- [ ] 步骤之间的衔接合理（没有跳跃、断裂）
- [ ] 新增步骤的前后衔接清晰

3. **检查界面跳转闭环**

对于新增和调整的界面，检查跳转路径是否闭环：

```
用户从A页面 → 点击按钮进入B页面 → 操作完成后能回到A页面或进入合理的下一页
```

**检查方法**：
遍历所有新增/调整界面，画出跳转路径图，检查是否有"死胡同"（只能进不能出）或"孤岛"（无法到达）。

**如果发现问题**：
记录到 `project/05-validation-issues.md`：
```markdown
## 流程闭环性检查 - 发现问题

### 问题1：M6规则引擎的返回路径不明确
- 现状：从M2任务管理进入M6，但没有说明如何返回
- 建议：增加"保存后返回M2"或"取消后返回M2"的说明
```

#### 检查项3：角色权限覆盖

检查每个新增/调整的界面是否明确了操作角色，以及角色是否失去必要功能。

**检查步骤**：

1. **新增界面的角色分配**

遍历所有新增界面，检查是否在需求描述中明确了"用户：[角色]"。

2. **调整界面的角色影响**

检查调整是否影响原角色的操作权限：
- 增加功能 → 确认哪个角色使用
- 移除功能 → 确认是否影响角色的必要工作

3. **删除界面的角色影响**

检查删除模块后，相关角色是否失去必要功能：

**示例**：
```
删除M4质量审核模块
原角色：业务部门负责审核回访质量
删除后：业务部门失去质量审核功能

检查：
- 业务部门是否还有其他质量管控手段？
- 是否需要在其他模块补充质量检查功能？
```

**如果发现问题**：
记录到 `project/05-validation-issues.md`：
```markdown
## 角色权限检查 - 发现问题

### 问题1：删除M4后业务部门失去质量管控手段
- 现状：删除质量审核模块后，业务部门无法审核回访质量
- 建议：在M5数据报表中增加"异常回访标记"功能，作为质量监控替代方案
```

### 检查结果

**如果所有检查都通过**：

创建 `project/05-validation-passed.md`：
```markdown
# 合理性检查 - 通过 ✅

## 检查时间
[时间戳]

## 检查结果

### ✅ 信息完整性检查
- 所有新增界面都有完整的需求描述、字段清单、前后跳转
- 所有调整界面都有截图或详细描述、变更位置标注
- 所有删除界面都有影响分析

### ✅ 流程闭环性检查
- 调整后的主流程完整、合理
- 所有新增/调整界面的跳转路径闭环
- 无流程断裂或孤岛

### ✅ 角色权限检查
- 所有新增/调整界面都明确了操作角色
- 删除模块未导致角色失去必要功能

## 结论
所有检查通过，可以进入输出阶段。
```

**如果检查未通过**：

用 `present_files` 呈现 `05-validation-issues.md`，要求用户补充信息或确认风险接受。

补充完成后重新执行检查。

---

## 4.2 最终输出

### 输出1：差量PRD文档

创建 `project/06-output/delta-prd.md`。

#### PRD结构

```markdown
# [产品名称] 迭代PRD - v[版本号]

## 文档信息
- **版本号**：[如 v2.1]
- **迭代目标**：[一句话概括本次迭代目标]
- **创建日期**：[日期]
- **涉及角色**：[列出Step 1中的角色]

---

## 1. 迭代概述

### 1.1 迭代背景
[引用Step 1中的迭代需求 - 问题部分]

### 1.2 迭代目标
[引用Step 1中的迭代需求 - 需求部分]

### 1.3 调整范围
本次迭代涉及以下模块：
[引用Step 2中的调整清单表格]

---

## 2. 现有流程回顾

[引用Step 1中的现有主流程]

---

## 3. 调整后流程

[引用Step 4.1检查项2中重建的调整后主流程]

### 流程变更说明
- **新增步骤**：[列出新增的步骤]
- **修改步骤**：[列出修改的步骤及修改内容]
- **删除步骤**：[列出删除的步骤及原因]

---

## 4. 新增功能详述

[针对Step 2调整清单中每个"新增"类型的模块]

### 4.1 [模块名]

#### 功能概述
[引用Step 3中该模块的需求描述]

#### 界面字段
[引用Step 3中该模块的字段表]

#### 界面原型
参见原型文件：`prototype.html` - [模块名]

#### 前后跳转
[引用Step 3中该模块的前后跳转说明]

#### 用户故事
作为 [角色]，我希望 [功能]，以便 [目标]。

**验收标准**：
- [ ] [验收条件1]
- [ ] [验收条件2]
- [ ] [验收条件3]

---

## 5. 调整功能详述

[针对Step 2调整清单中每个"调整"类型的模块]

### 5.1 [模块名]

#### 调整概述
[引用Step 3中该模块的调整说明]

#### Before（当前状态）
[引用Step 3中该模块的当前界面描述]
[如有截图，嵌入或引用]

#### After（调整后状态）
[基于调整说明，描述调整后的界面]

**主要变更点**：
1. [变更点1：位置、内容、样式]
2. [变更点2：位置、内容、样式]
3. [变更点3：位置、内容、样式]

#### 界面原型
参见原型文件：`prototype.html` - [模块名] - Before/After对比

#### 影响范围
[说明此调整对其他模块或流程的影响]

---

## 6. 删除功能说明

[针对Step 2调整清单中每个"删除"类型的模块]

### 6.1 [模块名]

#### 删除原因
[引用Step 3中该模块的删除原因]

#### 影响分析
[引用Step 3中该模块的影响分析 - 流程影响、数据影响、依赖影响]

#### 数据迁移方案
[说明历史数据如何处理]

#### 功能替代方案
[如果有替代方案，说明如何在其他模块补偿被删除的功能]

---

## 7. 数据字段变更

### 7.1 新增字段

[列出所有新增模块涉及的新数据对象和字段]

| 数据对象 | 字段名 | 类型 | 说明 | 必填 |
|---------|--------|------|------|------|
| [对象名] | [字段] | [类型] | [说明] | 是/否 |

### 7.2 修改字段

[列出现有字段的修改]

| 数据对象 | 字段名 | 原类型/说明 | 新类型/说明 | 修改原因 |
|---------|--------|------------|------------|---------|
| [对象名] | [字段] | [原值] | [新值] | [原因] |

### 7.3 废弃字段

[列出删除模块涉及的废弃字段]

| 数据对象 | 字段名 | 原用途 | 处理方案 |
|---------|--------|--------|---------|
| [对象名] | [字段] | [用途] | [归档/删除] |

---

## 8. 角色权限变更

### 8.1 新增权限

[列出新增模块涉及的角色权限]

| 角色 | 新增权限 | 对应功能 |
|------|---------|---------|
| [角色] | [权限] | [功能模块] |

### 8.2 权限调整

[列出调整模块涉及的权限变化]

| 角色 | 原权限 | 新权限 | 变更说明 |
|------|--------|--------|---------|
| [角色] | [权限] | [权限] | [说明] |

### 8.3 废弃权限

[列出删除模块涉及的权限]

| 角色 | 废弃权限 | 原功能 |
|------|---------|--------|
| [角色] | [权限] | [功能模块] |

---

## 9. 交互规范（如有变更）

[如果新增或调整涉及新的交互组件或规范，在此说明]

### 9.1 新增交互组件
- [组件名称]：[用途和交互说明]

### 9.2 调整交互规则
- [规则名称]：[调整内容]

---

## 10. 回滚预案

### 10.1 回滚触发条件
- [条件1：如"新增功能导致系统响应时间超过5秒"]
- [条件2：如"用户反馈新流程比旧流程更复杂"]
- [条件3：如"数据迁移失败"]

### 10.2 回滚步骤

**新增功能回滚**：
1. [步骤1：关闭新增功能入口]
2. [步骤2：隐藏新增菜单/按钮]
3. [步骤3：停止新数据写入]

**调整功能回滚**：
1. [步骤1：切换回旧版界面]
2. [步骤2：恢复原有流程]

**删除功能回滚**：
1. [步骤1：重新启用被删除模块]
2. [步骤2：恢复废弃字段]
3. [步骤3：恢复相关权限]

### 10.3 数据恢复方案
[说明如何恢复数据到迭代前状态]

---

## 11. 灰度发布计划（建议）

### 11.1 灰度范围
- 阶段1（10%）：[选择哪些用户先试用]
- 阶段2（50%）：[扩大范围]
- 阶段3（100%）：[全量发布]

### 11.2 监控指标
- [指标1：如"新功能使用率"]
- [指标2：如"用户反馈分数"]
- [指标3：如"系统性能指标"]

---

## 附录

### A. 术语表
[定义本PRD中使用的专业术语]

### B. 参考资料
- Step 1 基础信息：`00-input/baseline.md`
- Step 2 调整清单：`01-adjustment-list.md`
- Step 3 新增材料：`02-add/`
- Step 3 调整材料：`03-modify/`
- Step 3 删除分析：`04-delete/`
```

### 输出2：修改后的原型

创建 `project/06-output/prototype.html`。

#### 原型技术栈
- React（用于交互组件）
- Tailwind CSS（用于样式）

#### 原型结构

```jsx
// 整体结构示例
<div className="prototype-container">
  {/* 左侧导航 */}
  <Sidebar modules={modules} />
  
  {/* 主内容区 */}
  <MainContent>
    {/* 根据选择的模块显示不同内容 */}
    {selectedModule.type === 'add' && <NewModulePrototype />}
    {selectedModule.type === 'modify' && <ModifyModulePrototype />}
    {selectedModule.type === 'delete' && <DeletedModuleNotice />}
  </MainContent>
</div>
```

#### 新增界面原型

完整的交互原型，包含：
- 所有字段按Step 3收集的字段表实现
- 前后跳转按钮（模拟跳转）
- 表单校验（必填项校验）
- 提交/取消操作

示例：
```jsx
function NewRuleEngineModule() {
  return (
    <div className="new-module">
      <div className="module-header">
        <h2>新增模块：M6 规则引擎</h2>
        <span className="badge-new">NEW</span>
      </div>
      
      <form className="rule-form">
        <div className="form-field">
          <label>规则名称 *</label>
          <input type="text" required />
        </div>
        
        <div className="form-field">
          <label>触发条件 *</label>
          <select multiple>
            <option>新客户注册</option>
            <option>订单完成</option>
            <option>退款申请</option>
          </select>
        </div>
        
        {/* 更多字段... */}
        
        <div className="form-actions">
          <button type="button" onClick={() => goTo('M2-任务管理')}>
            取消
          </button>
          <button type="submit">
            保存规则
          </button>
        </div>
      </form>
      
      {/* 跳转说明 */}
      <div className="navigation-note">
        <p>前序：从 M2 任务管理 点击"规则配置"进入</p>
        <p>后续：保存后返回 M2 任务管理</p>
      </div>
    </div>
  );
}
```

#### 调整界面原型（Before/After对比）

使用左右分屏或Tab切换展示：

**方案A：左右分屏**
```jsx
function ModifyTaskManagementModule() {
  return (
    <div className="modify-module">
      <div className="module-header">
        <h2>调整模块：M2 任务管理</h2>
        <span className="badge-modify">MODIFIED</span>
      </div>
      
      <div className="comparison-view">
        {/* 左侧：Before */}
        <div className="before-view">
          <h3>Before（当前版本）</h3>
          {/* 如果有截图，显示截图 */}
          <img src="screenshots/M2-current.png" alt="当前界面" />
          {/* 或者渲染简化版界面 */}
          <div className="mockup">
            <div className="header">
              <h2>回访任务管理</h2>
              <div className="actions">
                <button>手动创建任务</button>
              </div>
            </div>
            <table>...</table>
          </div>
        </div>
        
        {/* 右侧：After */}
        <div className="after-view">
          <h3>After（调整后）</h3>
          <div className="mockup">
            <div className="header">
              <h2>回访任务管理</h2>
              <div className="actions">
                <button>手动创建任务</button>
                {/* 高亮新增的按钮 */}
                <button className="highlight-new">
                  自动生成任务
                  <span className="new-badge">NEW</span>
                </button>
              </div>
            </div>
            <table>...</table>
          </div>
          
          {/* 变更说明 */}
          <div className="change-notes">
            <h4>主要变更</h4>
            <ul>
              <li>✨ 在顶部操作栏增加"自动生成任务"按钮</li>
              <li>✨ 点击后跳转到 M6 规则配置页面</li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  );
}
```

**方案B：Tab切换**
```jsx
function ModifyTaskManagementModule() {
  const [activeTab, setActiveTab] = useState('before');
  
  return (
    <div className="modify-module">
      <div className="tabs">
        <button 
          className={activeTab === 'before' ? 'active' : ''}
          onClick={() => setActiveTab('before')}
        >
          Before（当前版本）
        </button>
        <button 
          className={activeTab === 'after' ? 'active' : ''}
          onClick={() => setActiveTab('after')}
        >
          After（调整后）
        </button>
      </div>
      
      {activeTab === 'before' && <BeforeView />}
      {activeTab === 'after' && <AfterView />}
    </div>
  );
}
```

#### 删除界面原型

显示"已删除"通知和影响说明：

```jsx
function DeletedQualityAuditModule() {
  return (
    <div className="deleted-module">
      <div className="module-header">
        <h2>删除模块：M4 质量审核</h2>
        <span className="badge-deleted">DELETED</span>
      </div>
      
      <div className="deletion-notice">
        <div className="icon-warning">⚠️</div>
        <h3>此模块已在本次迭代中删除</h3>
        
        <div className="deletion-details">
          <h4>删除原因</h4>
          <p>[引用Step 3中的删除原因]</p>
          
          <h4>影响范围</h4>
          <ul>
            <li>流程影响：[说明]</li>
            <li>数据影响：[说明]</li>
            <li>依赖影响：[说明]</li>
          </ul>
          
          <h4>功能替代</h4>
          <p>[如果有替代方案，说明]</p>
        </div>
      </div>
    </div>
  );
}
```

#### 导航菜单

左侧导航按模块分组：

```jsx
function Sidebar() {
  return (
    <nav className="sidebar">
      <h3>原型导航</h3>
      
      <div className="module-group">
        <h4>✨ 新增模块</h4>
        <ul>
          <li><a href="#M6">M6 规则引擎</a></li>
        </ul>
      </div>
      
      <div className="module-group">
        <h4>🔄 调整模块</h4>
        <ul>
          <li><a href="#M2">M2 任务管理</a></li>
          <li><a href="#M3">M3 回访执行</a></li>
        </ul>
      </div>
      
      <div className="module-group">
        <h4>🗑️ 删除模块</h4>
        <ul>
          <li><a href="#M4">M4 质量审核</a></li>
        </ul>
      </div>
      
      <div className="module-group">
        <h4>📋 流程对比</h4>
        <ul>
          <li><a href="#flow-before">调整前流程</a></li>
          <li><a href="#flow-after">调整后流程</a></li>
        </ul>
      </div>
    </nav>
  );
}
```

### 呈现输出

使用 `present_files` 同时呈现差量PRD和原型：

```javascript
present_files([
  'project/06-output/delta-prd.md',
  'project/06-output/prototype.html'
]);
```

并向用户说明：

> "✅ 迭代设计完成！
> 
> **差量PRD**：包含完整的迭代说明、新增功能详述、调整功能before/after对比、删除影响分析、回滚预案
> 
> **修改后原型**：交互式原型，可查看：
> - 新增模块的完整界面
> - 调整模块的before/after对比
> - 删除模块的影响说明
> - 调整前后的流程对比
> 
> 请审阅以上产物，如有需要修改的地方请告诉我。
> 
> 下一步建议：
> - 灰度发布测试
> - 交付工程团队实施
> - 准备用户培训材料"

---

## End

迭代设计流程到此结束。


path: references/steps/step2-adjustment-list.md
content: # Step 2: AI分析并输出调整清单

## 目标
基于Step 1收集的信息，AI推断出功能模块列表和本次迭代的调整清单。

## 2.1 功能模块推断

### 推断逻辑

**输入**：Step 1的主流程 + 迭代需求

**推断方法**：
1. 从主流程中提取动词短语（配置、创建、执行、审核、生成）
2. 将相似动作归并为一个功能模块
3. 从迭代需求中提取新提到的功能词

**示例**：

主流程：
```
1. 业务部门配置回访模板
2. 业务部门创建回访任务并分配给客服专员
3. 客服专员执行回访并记录结果
4. 业务部门审核回访质量
5. 系统生成回访数据报表
```

推断出的模块：
```
M1 回访模板管理 - 对应步骤1"配置回访模板"
M2 回访任务管理 - 对应步骤2"创建任务、分配"
M3 回访执行 - 对应步骤3"执行回访、记录结果"
M4 质量审核 - 对应步骤4"审核回访质量"
M5 数据报表 - 对应步骤5"生成数据报表"
```

如果迭代需求提到：
```
需求：希望系统能自动根据规则生成回访任务
```

则新增推断：
```
M6 规则引擎 - 新增模块，用于配置自动生成规则
```

### 输出格式

创建 `project/01-adjustment-list.md`：

```markdown
# 调整清单

## 现有功能模块（推断）

基于主流程推断出以下功能模块：

| 模块编号 | 模块名称 | 对应流程 |
|---------|---------|---------|
| M1 | [模块名] | 步骤X：[流程描述] |
| M2 | [模块名] | 步骤Y：[流程描述] |
...

## 本次调整清单

根据迭代需求，本次需要调整以下模块：

| 模块编号 | 模块名称 | 调整类型 | 调整说明 | 对应需求 |
|---------|---------|---------|---------|---------|
| M2 | 回访任务管理 | 调整 | 增加自动生成任务功能 | 需求1 |
| M6 | 规则引擎 | 新增 | 新增规则配置模块 | 需求1 |
| M3 | 回访执行 | 调整 | 增加客户历史记录展示 | 需求2 |

### 调整类型说明

- **新增**：全新的功能模块，之前不存在
- **调整**：在现有模块基础上增加/修改功能
- **删除**：移除现有模块或功能
```

## 2.2 调整类型判断规则

### 新增（ADD）
触发条件：
- 迭代需求中出现"新增"、"增加XX模块"、"需要一个新的XX"
- 推断的模块在现有主流程中找不到对应步骤

### 调整（MODIFY）
触发条件：
- 迭代需求中出现"在XX模块增加"、"XX功能优化"、"改进XX"
- 现有模块功能不变，但增加新能力或修改交互

### 删除（DELETE）
触发条件：
- 迭代需求中出现"删除"、"移除"、"废弃"、"不再需要XX"

## 2.3 用户确认

用 `present_files` 呈现 `01-adjustment-list.md`，询问用户：

> "我理解您需要调整以上模块，对吗？
> 
> - 如果模块推断有误，请告诉我正确的模块名称
> - 如果有遗漏的模块，请补充
> - 如果调整类型判断错误（新增/调整/删除），请指正"

### 常见调整情况

**情况1：用户补充遗漏模块**
```
用户："还需要调整M5数据报表，增加新的统计维度"
AI：更新调整清单，增加M5的调整项
```

**情况2：用户修正调整类型**
```
用户："M6不是新增，是调整现有的任务配置模块"
AI：将M6从"新增"改为"调整"，并更新模块名称
```

**情况3：用户合并模块**
```
用户："M2和M6其实是一个模块，都是任务管理"
AI：合并为一个模块M2，调整说明合并
```

## 确认完成标志

用户明确回复：
- "确认"
- "没问题"
- "就是这样"
- "对的"

或用户修正后再次确认。

**确认完成后进入Step 3。**


path: references/appendices/selfcheck.md
content: # 迭代设计自检清单（v3.0）

在完成所有步骤后，使用此清单进行最终检查。

## ✅ Step 1: 基础信息收集

- [ ] 收集了涉及角色（3-6个）
- [ ] 收集了现有主流程（3-7步）
- [ ] 收集了迭代需求（问题+需求描述）
- [ ] 用户已确认基础信息准确

## ✅ Step 2: 调整清单

- [ ] AI推断出了功能模块列表
- [ ] 输出了本次调整清单（模块+类型+说明）
- [ ] 调整类型标注准确（新增/调整/删除）
- [ ] 用户已确认调整范围

## ✅ Step 3: 材料收集

### 新增界面（如有）
- [ ] 每个新增界面都有需求描述
- [ ] 每个新增界面都有字段清单
- [ ] 每个新增界面都有前后跳转说明/截图
- [ ] 字段表包含：字段名、类型、说明、必填

### 调整界面（如有）
- [ ] 每个调整界面都有调整说明
- [ ] 每个调整界面都有当前界面截图或详细描述
- [ ] 每个调整界面都标注了变更位置
- [ ] 如果有截图，截图清晰可见

### 删除界面（如有）
- [ ] 每个删除界面都有流程影响分析
- [ ] 每个删除界面都有数据影响分析
- [ ] 每个删除界面都有依赖检查
- [ ] 用户已确认删除风险

### 材料完整性
- [ ] 所有材料已用 present_files 呈现
- [ ] 用户已最终确认所有材料

## ✅ Step 4: 合理性检查

### 信息完整性
- [ ] 所有新增界面材料完整
- [ ] 所有调整界面材料完整
- [ ] 所有删除界面材料完整
- [ ] 无缺失项或缺失项已补充

### 流程闭环性
- [ ] 重建了调整后的主流程
- [ ] 主流程有明确的开始和结束
- [ ] 每个步骤都有执行角色
- [ ] 步骤之间衔接合理（无断裂）
- [ ] 所有新增/调整界面的跳转路径闭环
- [ ] 无"孤岛"界面（无法到达）
- [ ] 无"死胡同"界面（只能进不能出）

### 角色权限覆盖
- [ ] 所有新增界面都明确了操作角色
- [ ] 所有调整界面都明确了权限变化
- [ ] 删除模块未导致角色失去必要功能
- [ ] 角色权限变更已记录

## ✅ Step 4: 最终输出

### 差量PRD
- [ ] 包含迭代概述（背景、目标、范围）
- [ ] 包含现有流程回顾
- [ ] 包含调整后流程
- [ ] 包含新增功能详述（如有）
- [ ] 包含调整功能before/after对比（如有）
- [ ] 包含删除功能影响说明（如有）
- [ ] 包含数据字段变更表
- [ ] 包含角色权限变更表
- [ ] 包含回滚预案（触发条件+回滚步骤+数据恢复）
- [ ] 包含灰度发布建议

### 修改后原型
- [ ] 新增界面：有完整的交互原型
- [ ] 新增界面：包含所有字段和操作
- [ ] 新增界面：有前后跳转模拟
- [ ] 调整界面：有before/after对比视图
- [ ] 调整界面：变更部分有高亮标注
- [ ] 删除界面：有"已删除"通知和影响说明
- [ ] 原型有清晰的导航菜单
- [ ] 原型可以点击跳转模拟流程

### 输出质量
- [ ] PRD和原型已用 present_files 呈现
- [ ] PRD语言清晰、无歧义
- [ ] 原型界面美观、交互流畅
- [ ] PRD和原型内容一致

## ✅ 一致性检查

### PRD vs 原型一致性
- [ ] PRD中描述的新增功能在原型中都能找到
- [ ] PRD中描述的调整在原型的before/after中清晰展示
- [ ] PRD中的字段表和原型中的表单字段一致
- [ ] PRD中的跳转说明和原型中的跳转路径一致

### Step 1-3 vs 输出一致性
- [ ] 输出的主流程和Step 1收集的基础流程匹配
- [ ] 输出的调整清单和Step 2确认的清单匹配
- [ ] 输出的详细设计和Step 3收集的材料匹配
- [ ] 无遗漏的调整项
- [ ] 无多余的调整项

## 🎯 最终检查

- [ ] 用户对PRD满意
- [ ] 用户对原型满意
- [ ] 用户理解回滚预案
- [ ] 用户知道下一步如何推进（灰度发布/工程实施）

---

## 检查结果

**通过项**: _____ / _____

**未通过项**:
1. [列出未通过的检查项]
2. ...

**处理建议**:
- [针对未通过项的建议]

---

## 签字确认

**设计者**: ___________  **日期**: ___________

**审核者**: ___________  **日期**: ___________


Security scan verdicts — ClawScan: suspicious | static analysis: clean | VirusTotal: clean | SkillSpector: suspicious (MEDIUM)