在需求文档和UI设计的提效上，是可以使用Cursor进行处理的。
如何使用Cursor生成需求文档和UI设计图呢？下面进行一个案例讲解
实现步骤
配置通用规则
这里可以按照自己电脑的系统进行修改
1.Always respond in 中文2.每次修改后将修改的内容记录在log.md3. 我的电脑系统是Windows 创建rules
点击创建rule
填写rule名称，这里只支持英文和"-"，创建之后就可以修改为中文
之后就生成了mdc文件
那么什么是mdc文件呢？
mdc文件可以理解为md文件+rule类型的一个文件
上方有支持配置规则类型的选项
Cursor Rule Type 是一种灵活且强大的工具，能够帮助开发者通过定制化规则优化 AI 的行为
Always Rule（始终规则）
这种规则适用于所有聊天和命令，通常用于框架或语言级别的通用规则。
2. Auto Attached Rule（自动附加规则）
当文件匹配特定模式时自动应用规则，适用于多仓库或多目标环境。Agent Requested Rule（代理请求规则）
根据用户意图智能地启用规则，适用于需要更灵活控制的场景。Manual Rule（手动规则）
需要明确将文件附加到 AI 上才能应用规则，适用于需要精细控制的场景
之后填写我们的需求文档生成的规则
这个是使用/Generate Cursor Rules 【cursor的0.49的特性】生成的规则
# 需求文档生成规则## 文档格式根据用户输入，生成的需求文档应包含以下部分：1. **项目概述** - 项目背景 - 项目目标 - 目标用户2. **功能需求** - 核心功能列表 - 功能详细描述 - 用户流程3. **非功能需求** - 性能要求 - 安全要求 - 可用性要求4. **技术规格** - 技术栈 - 系统架构 - 第三方集成5. **交付物** - 里程碑 - 时间线 - 验收标准## 标准模板用户提供信息时，请按照以下结构生成文档：```markdown# 项目名称：[项目名]## 1. 项目概述### 1.1 项目背景[根据用户输入填写]### 1.2 项目目标[根据用户输入填写]### 1.3 目标用户[根据用户输入填写]## 2. 功能需求### 2.1 核心功能- [功能1]- [功能2]- [功能3]### 2.2 功能详细描述#### 2.2.1 [功能1][详细描述]#### 2.2.2 [功能2][详细描述]### 2.3 用户流程[描述用户如何使用系统完成主要任务]## 3. 非功能需求### 3.1 性能要求[响应时间、并发用户数等]### 3.2 安全要求[数据安全、身份验证等]### 3.3 可用性要求[易用性、可访问性等]## 4. 技术规格### 4.1 技术栈[前端、后端、数据库等]### 4.2 系统架构[系统组件和交互]### 4.3 第三方集成[需要集成的外部系统或API]## 5. 交付：### 5.1 里程碑[主要项目阶段]### 5.2 时间线[各阶段的预计完成时间]### 5.3 验收标准[项目成功的衡量标准]使用指南
- 用户输入格式应包含项目基本信息和关键需求
- 尽可能从用户输入中提取所有相关信息
- 对于缺失信息，可以提示用户补充或使用合理的默认值
- 生成的文档应当清晰、结构化且专业
## 生成需求文档现在假设我们需要生成这样子的一个需求：小程序，支持以家庭为单位，进行目标设立和记账的功能不选择auto-select模式，否则默认会选择相对生成效果差一些的大模型输入下面的内容：```markdown按照@requirement-doc.mdc 生成需求文档：小程序，支持以家庭为单位，进行目标设立和记账的功能等待生成结果。
# 项目名称：家庭目标记账小程序## 1. 项目概述### 1.1 项目背景当今社会，家庭财务管理和目标规划变得越来越重要。许多家庭希望能够共同制定财务目标并跟踪家庭支出，但市场上缺乏专门针对家庭单位设计的、将目标设立与记账功能有效结合的应用。本项目旨在填补这一市场空白，为家庭提供一个简单易用的小程序解决方案。### 1.2 项目目标- 开发一款以家庭为单位的小程序，帮助家庭成员共同管理财务- 提供目标设立功能，允许家庭成员共同制定和跟踪财务目标- 实现便捷的记账功能，支持多成员协作记录家庭收支- 通过数据分析和可视化，帮助用户了解家庭财务状况和目标完成进度- 打造简洁友好的用户界面，确保各年龄段用户都能轻松使用### 1.3 目标用户- 有共同财务管理需求的家庭- 希望进行家庭预算规划的夫妻/伴侣- 需要教育子女理财知识的父母- 共同生活并分担家庭开支的室友- 有储蓄或投资目标的家庭成员## 2. 功能需求### 2.1 核心功能- 家庭单元创建与管理- 家庭成员邀请与权限管理- 家庭财务目标设立与跟踪- 日常收支记账- 财务报表与分析- 目标完成度可视化- 家庭成员消息通知### 2.2 功能详细描述#### 2.2.1 家庭单元创建与管理- 用户可以创建家庭单元并成为管理员- 支持家庭信息设置，包括家庭名称、成员角色定义等- 允许创建多个家庭单元(如大家庭和小家庭)- 支持家庭单元的基本设置修改和解散#### 2.2.2 家庭成员邀请与权限管理- 家庭管理员可以通过多种方式邀请成员(微信分享、二维码等)- 支持设置不同成员的权限级别(管理员、记账员、普通成员等)- 成员可以查看个人贡献和参与情况- 支持成员退出和管理员移除成员功能#### 2.2.3 家庭财务目标设立与跟踪- 支持创建短期、中期和长期财务目标- 目标类型多样化：储蓄目标、消费目标、投资目标等- 允许设置目标金额、截止日期和分期计划- 提供目标完成进度实时更新和提醒- 支持目标修改和历史目标查看#### 2.2.4 日常收支记账- 支持多种收入和支出类别的记账- 提供快速记账和详细记账两种模式- 支持定期收支自动记录- 支持上传票据照片和添加备注- 提供成员间账单分享和确认功能#### 2.2.5 财务报表与分析- 提供日/周/月/年度财务报表- 支持按类别、成员、时间等多维度分析- 展示收支构成比例和趋势变化- 与家庭目标关联，显示支出是否符合目标计划- 支持自定义报表导出### 2.3 用户流程1. **注册与家庭创建**： - 用户通过微信小程序授权登录 - 创建家庭单元并设置基本信息 - 邀请家庭成员加入2. **目标设立**： - 家庭管理员发起目标创建 - 成员参与讨论并确认目标 - 系统记录目标并开始跟踪3. **日常记账**： - 任一成员记录家庭收支 - 系统自动关联到相关目标 - 其他成员可查看并确认4. **目标跟踪与调整**： - 系统定期生成目标进度报告 - 成员查看财务分析报表 - 根据实际情况调整目标或支出习惯## 3. 非功能需求### 3.1 性能要求- 页面加载时间不超过 3 秒- 支持至少 50 名同时在线的家庭成员- 数据同步延迟不超过 5 秒- 能够处理单个家庭至少 5 年的历史数据- 报表生成时间不超过 10 秒### 3.2 安全要求- 采用微信小程序标准安全机制- 敏感财务数据加密存储- 基于角色的访问控制- 重要操作需二次确认- 数据备份与恢复机制- 符合相关数据隐私法规### 3.3 可用性要求- 简洁直观的用户界面- 适合各年龄段用户使用- 提供新手引导和操作提示- 支持语音输入记账- 关键功能不超过 3 次点击可达- 提供用户反馈和帮助中心## 4. 技术规格### 4.1 技术栈- 前端：微信小程序原生开发框架- 后端：Node.js + Express- 数据库：MongoDB- 云服务：腾讯云- 图表展示：ECharts for MiniProgram- 消息推送：微信订阅消息### 4.2 系统架构- 采用前后端分离架构- 微信小程序作为前端展示和交互层- 云函数处理业务逻辑和数据处理- MongoDB 存储用户和交易数据- 腾讯云提供云存储、云计算资源### 4.3 第三方集成- 微信登录和支付 API- 腾讯云短信服务- 数据分析与可视化库- OCR 票据识别服务- 云存储服务## 5. 交付物### 5.1 里程碑1. 项目启动与需求确认2. 原型设计与用户验证3. 核心功能开发完成4. 测试与优化5. 上线准备与推广6. 正式发布与运营### 5.2 时间线- 第 1 月：需求分析与原型设计- 第 2-3 月：核心功能开发- 第 4 月：内部测试与功能优化- 第 5 月：封闭测试与问题修复- 第 6 月：正式上线与运营支持### 5.3 验收标准- 所有核心功能按需求规格实现- 性能指标达到规定要求- 通过安全性测试和数据保护评估- 在不少于 50 个家庭单位中完成测试- 用户满意度测试达到 85%以上- 系统稳定运行 30 天无重大问题再基于需求文档，生成UI设计图
首先编写ui设计规则
# 需求文档转UI设计生成规则## 目的本规则用于根据用户指定的需求文档，生成对应的UI设计并输出为单个HTML文件。## 步骤1. 读取用户指定的需求文档文件2. 分析需求文档中的功能需求和用户流程3. 根据需求生成适合的UI设计4. 将设计转换为单个HTML文件并输出到output目录## UI设计生成指南### 基本原则- 界面应简洁清晰，符合现代设计趋势- 优先考虑用户体验和易用性- 布局应响应式，适配不同设备- 遵循需求文档中描述的用户流程- 色彩方案应符合产品定位和目标用户群体### 输出HTML要求- 单文件HTML，包含所有必要的CSS和JS- 不依赖外部资源（除非特别指定）- 注释清晰，代码结构合理- 实现需求文档中描述的核心功能- 提供基本交互效果展示### 设计元素- 导航结构- 布局框架- 色彩方案- 字体选择- 按钮和表单样式- 图标和视觉元素## 模板结构生成的HTML应包含以下基本结构：```html<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>[项目名称] UI设计</title> <style> /* 此处包含所有CSS样式 */ </style></head><body> <!-- 页面结构 --> <header> <!-- 导航栏 --> </header> <main> <!-- 主要内容区域 --> </main> <footer> <!-- 页脚 --> </footer> <script> // 此处包含所有JavaScript代码 </script></body></html>使用方法
- 用户需指定要处理的需求文档文件路径
- 系统将分析需求并生成UI设计
- 生成的HTML文件将保存到output目录
- 文件命名格式为：
[项目名称]-ui-design.html注意事项
- • 优先实现核心功能，确保基本可用• 界面设计应符合需求文档中描述的项目目标和用户群体• 生成的HTML应该是可直接在浏览器中打开和使用的
输入：```markdown根据 @ui-design-generator.mdc 规则，将 @需求文档.md ，生成UI设计稿可以看到生成结果：
