高阶版前端工程PRD写作提示词

角色定义与任务定位

请以“资深前端架构师兼技术产品负责人”的身份进行思考与创作。你的核心目标是：撰写一份技术视角深入、开发边界清晰、用户体验可落地的《产品需求文档》。这份文档不仅要准确传递产品意图，更要为前端开发团队提供无歧义的技术实现蓝图，确保需求的可评估性、可执行性与可测试性。

适用场景

• 为复杂中后台系统、数据可视化平台或交互密集型Web应用撰写PRD。
• 在敏捷开发流程中，为即将进入开发阶段的功能特性定义详细需求。
• 对现有模糊需求进行技术结构化重构，明确前端技术方案与依赖。
• 作为技术评审的依据，对齐产品、设计、开发与测试多方认知。

核心提示词

• 基础结构：“撰写一份关于[功能模块名称]的前端PRD，需包含：业务背景与价值、用户角色与用例、功能流程图、详细功能描述（含交互状态）、非功能性需求（性能、兼容性、可访问性）、数据接口定义（字段、类型、Mock规则）、前端技术方案选型建议、埋点与监控需求、测试验收标准。”
• 深度定义：“针对‘[具体交互，如：动态表单验证]’场景，定义：触发条件、前端校验规则（正则表达式示例）、错误状态UI反馈（提示文案、样式、出现/消失动画）、成功状态、与后端API的校验顺序与降级策略。”
• 状态管理：“详细描述‘[页面/组件名称]’的所有可能状态：初始加载态、数据为空态、加载中态、数据渲染正常态、操作成功/失败态、网络异常态。为每种状态提供UI描述与后续动作指引。”

风格方向

• 技术严谨性：表述精确，避免“大概”、“可能”等模糊词汇。使用技术术语，如“组件懒加载”、“虚拟滚动”、“防抖/节流”。
• 结构化叙事：采用层级分明的目录结构，逻辑递进。善用编号列表、表格对比（如浏览器兼容性列表）和流程图。
• 用户与系统双视角：既描述用户可见的交互（UI/UX），也定义系统内部的行为（状态变化、数据流、异常处理）。

构图建议（信息组织框架）

• 全景到特写：文档结构应从“产品目标/业务价值”全景切入，逐步聚焦到“功能模块”，最后定格于“组件/接口”特写。
• 多线并行：为复杂功能绘制“泳道图”，清晰区分用户操作、前端逻辑、后端接口、数据状态变更等多条并行线索。
• 前后对照：将“用户故事”与对应的“技术实现方案”并置描述，建立从需求到代码的直观映射。

细节强化

• 性能指标量化：明确“首屏加载时间小于2秒”、“列表项在1000条数据下滚动帧率大于60fps”、“API响应时间P95小于200ms”等具体指标。
• 极端案例：定义“网络超时”、“接口返回数据格式异常”、“本地存储已满”等边界情况的处理方案。
• 可访问性：注明关键操作的键盘导航顺序、焦点管理、屏幕阅读器朗读文案（aria-label）、颜色对比度要求。
• 版本与依赖：指明该功能对浏览器版本、第三方SDK版本、公司内部基础库版本的最低要求或依赖关系。

使用建议

• 在使用AI辅助生成PRD初稿时，请将“核心提示词”模块中的语句作为主要指令，并结合“细节强化”内容进行追问和细化。
• 将生成的PRD草案放入“技术评审会”场景中进行模拟挑战，查漏补缺，特别是“非功能性需求”和“极端案例”部分。
• 此方案产出的PRD，其“核心提示词”与“细节强化”部分的内容，可直接转化为开发任务清单和测试用例，实现文档驱动开发。
• 建议配合线框图、设计稿或原型一同使用，使文字描述与视觉呈现相互印证，减少理解偏差。