PRD转设计需求文档

概述

本技能帮助将产品需求文档(PRD)转换为完整的设计需求文档,输出内容包括:
- 信息架构图
- 核心交互流程图
- 页面布局规范
- 视觉风格定义
- 异常状态处理
- 埋点需求

使用方法

输入要求

接受以下格式的PRD文档:
- PDF文档(.pdf)
- Word文档(.docx)
- Markdown文档(.md)
- 飞书云文档链接

输出内容

生成一份完整的设计需求文档,包含以下章节:

1. 项目背景与设计目标
   - 项目背景
   - 设计目标(体验/业务/品牌)
   - 核心设计挑战

2. 用户角色与场景
   - 用户画像
   - 核心使用场景

3. 信息架构
   - 整体信息架构图(Mermaid图)
   - 页面层级结构

4. 核心交互流程
   - 主流程交互流程图
   - 关键分支流程图
   - 异常流程处理

5. 关键交互细节定义
   - 各模块交互规则
   - 状态转换逻辑
   - 动效规范

6. 页面布局规范
   - 页面布局结构图
   - 组件布局规范

7. 视觉风格定义
   - 色彩体系
   - 字体规范
   - 图标规范

8. 异常状态处理
   - 网络异常
   - 业务异常

9. 埋点需求
   - 核心埋点事件表

10. 设计交付清单

    • 设计稿清单
    • 规范文档清单
    • 原型清单

11. 设计风险评估

    • 风险点识别
    • 应对方案

执行流程

1. 阅读PRD文档
   - 使用file工具读取PRD文档内容
   - 提取核心需求、用户场景、功能点

2. 生成设计需求文档
   - 按照标准章节结构生成设计需求文档
   - 每个章节需要具体、可执行的内容
   - 使用表格、列表等格式提升可读性

3. 生成交互流程图
   - 使用Mermaid语法生成交互流程图
   - 包含主流程、分支流程、异常流程
   - 生成PNG图片保存

4. 输出文档
   - 将完整设计需求文档保存为Markdown文件
   - 将交互流程图保存为PNG文件
   - 所有文件放在artifacts目录下

注意事项

• 设计需求文档必须具体可执行,避免空泛表述
• 交互流程图要覆盖主流程+异常流程
• 视觉规范要有具体色值、字号、尺寸
• 埋点需求要包含事件名称、触发时机、关键参数

参考资源

• 设计需求文档模板: references/design-doc-template.md