Menu
当需要基于IA和用户流程生成原型时使用。原型自动生成，基于IA方案和User Flow自动生成低保真和中保真原型，包含设计规范检查和可用性启发式评估。适用于快速原型验证和设计稿生成。关键词：原型设计、低保真原型、中保真原型、设计规范、原型生成、出设计稿、快速原型。
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
当需要执行完整的需求分析流程时使用。需求洞察指挥官，调度insight-analysis完成JTBD、需求分层、5Whys、KANO分类和优先级评分。关键词：需求分析流程、需求洞察编排、需求优先级全流程、JTBD、5Whys、KANO、优先级评分、分析需求、挖掘需求、用户需求、需求排序。本编排器为透传编排器，仅调度1个子Skill(insight-analysis)，上层编排器也可直接调用insight-analysis。
当需要执行完整的市场与竞品分析流程时使用。市场竞品指挥官，调度market-tam-som/pest/competitor-analysis。关键词：市场分析、竞品分析、TAM/SAM/SOM、PEST、竞品情报、四象限、市场规模、行业分析、竞争对手、竞品调研。
当需要执行完整的机会识别与定义流程时使用。机会识别指挥官，调度opportunity-definition完成机会评分、问题陈述、HMW发散和机会简报。关键词：机会识别、机会评分、HMW、Problem Statement、Opportunity Brief、产品机会、机会评估、问题定义。
当需要执行完整的用户研究流程时使用。用户研究指挥官，调度voice-analysis/behavior-analysis/user-modeling/interview-assist/report。关键词：用户研究、VOC分析、行为分析、Persona、访谈辅助、用户调研、用户画像、用户反馈、用户访谈。
当需要设计或评估产品商业模式时使用。商业模式指挥官，调度business-model-canvas/value-fit/pricing/strategy-report。关键词：商业模式、商业画布、定价策略、商业战略报告、怎么赚钱、盈利模式、收费模式、商业评估。
当需要进行产品立项、战略规划或路线图制定时使用。战略规划指挥官，调度产品提案、战略分析（SWOT/Ansoff/波特五力）、OKR、北极星、路线图等子Skill。关键词：产品立项、战略规划、SWOT、OKR、路线图、战略分析、制定目标、产品规划、年度规划。
Based on SOC occupation classification
| name | design-prototype |
| description | 当需要基于IA和用户流程生成原型时使用。原型自动生成，基于IA方案和User Flow自动生成低保真和中保真原型，包含设计规范检查和可用性启发式评估。适用于快速原型验证和设计稿生成。关键词：原型设计、低保真原型、中保真原型、设计规范、原型生成、出设计稿、快速原型。 |
| metadata | {"module":"产品构思与设计","sub-module":"产品设计与原型","type":"pipeline","version":"3.2","domain_tags":["互联网","软件","通用"],"trigger_examples":["帮我生成原型","快速出个设计稿","低保真原型怎么做"],"interaction_mode":"ai_suggest_human_approve"} |
🤖→👤 AI建议 → 人类审批
🤖→👤 AI建议人类审批
| 输入项 | 类型 | 必填 | 来源 | 说明 |
|---|---|---|---|---|
| IA方案 | JSON | 是 | output/pm-design/design-ia/ia_proposals.json | Pipeline 9输出的信息架构方案 |
| User Flow | JSON | 是 | output/pm-design/design-userflow/userflow.json | Pipeline 10输出的用户流程 |
| PRD文档 | Markdown | ○ | output/pm-design/design-prd/prd.md | 产品需求参考 |
| PRD结构化数据 | JSON | ○ | output/pm-design/design-prd/prd.json | PRD机器可消费版本，包含pages[]/features[]，供原型设计对齐 |
生成线框图级别的原型描述：
在低保真基础上增加：
基于Nielsen十大可用性原则评估：
评分范围0-10，评分<3的弱项需提供改进建议。
存储路径：output/pm-design/design-prototype/
输出文件：
| 文件 | 路径 | 说明 |
|---|---|---|
| 原型规格 | prototype_spec.json | 页面布局、功能区域、交互意图、启发式评估 |
| 组件清单 | component_catalog.json | 供 UI Skill 消费的组件清单，包含组件类型、属性、数据绑定 |
{
"prototype": {
"fidelity": "medium",
"pages": [
{
"name": "页面名称",
"layout": {
"regions": [],
"content_priority": [],
"navigation_flow": []
},
"functional_areas": [],
"data_display_needs": [],
"interaction_intents": []
}
],
"heuristic_evaluation": {
"overall_score": 8.5,
"weak_areas": [
{
"principle": "系统状态可见性",
"score": 2,
"suggestion": "增加加载进度指示器"
}
]
}
}
}
component_catalog.json 是原型设计的机器可消费组件清单，供 UI Skill 编程式消费，确保组件生成与原型设计对齐。
推荐+备选模式：每个组件提供推荐类型和备选方案，UI Skill 可根据设计判断选择更合适的实现方式，避免原型预选型限制设计自由度。
| 字段 | 说明 |
|---|---|
| type | 推荐的组件类型（基于原型功能需求推导） |
| alternatives | 备选组件方案列表，每个备选含类型、名称、推荐理由和适用场景 |
| selection_criteria | 组件选型决策依据，描述在什么条件下选择推荐类型 vs 备选类型 |
示例：
{
"component_id": "user-list",
"type": "data_display",
"name": "UserTable",
"alternatives": [
{
"type": "composite",
"name": "UserCardGrid",
"reason": "Card Grid 更适合视觉差异化，支持图片+摘要的富展示",
"best_for": "数据量<20条、需要视觉冲击力、移动端优先的场景"
}
],
"selection_criteria": "数据量>20行或需要排序/筛选用Table，数据量<20行或需要视觉差异化用CardGrid"
}
{
"catalog_id": "string",
"generated_at": "ISO8601",
"source_prototype": "prototype_spec.json",
"components": [
{
"component_id": "string",
"name": "string",
"type": "layout | navigation | data_display | form | feedback | media | composite",
"description": "string",
"props": [
{
"prop_name": "string",
"type": "string | number | boolean | array | object",
"required": "boolean",
"default_value": "string | null",
"description": "string"
}
],
"data_binding": {
"data_source": "api | local | cache",
"api_endpoint": "string | null",
"fields": ["string"],
"loading_state": "string",
"error_state": "string",
"empty_state": "string"
},
"pages_used_in": ["page_name"],
"sub_components": ["component_id"],
"variants": [
{
"variant_name": "string",
"description": "string",
"prop_overrides": {}
}
],
"alternatives": [
{
"type": "layout | navigation | data_display | form | feedback | media | composite",
"name": "string",
"reason": "string",
"best_for": "string"
}
],
"selection_criteria": "string"
}
],
"shared_components": [
{
"component_id": "string",
"name": "string",
"usage_count": "number",
"pages": ["page_name"]
}
],
"component_dependencies": [
{
"component_id": "string",
"depends_on": ["component_id"]
}
]
}
| 维度 | prototype_spec.json | component_catalog.json |
|---|---|---|
| 消费者 | 人类（设计师、PM） | 机器（UI Skill） |
| 内容 | 页面布局+交互意图+评估 | 组件类型+属性+数据绑定+依赖 |
| 生成顺序 | 先生成 prototype_spec.json | 从 prototype_spec.json 提取组件清单 |
| 一致性 | component_catalog.json 中的组件必须覆盖 prototype_spec.json 中所有页面的 functional_areas 和 data_display_needs |
输出校验规则：详见下方输出校验规则章节
| 检查项 | 标准 | 不达标处理 |
|---|---|---|
| 启发式评估 | 已完成10项原则评估 | 标注"评估未完成"，补充缺失项评估 |
| 弱项改进建议 | 评分<3的弱项均有具体改进建议 | 标注"建议缺失"，补充改进方案后重新评估 |
| 核心页面覆盖 | 所有核心页面已覆盖 | 标注"覆盖不全"，列出未覆盖页面并补充 |
| 功能区域覆盖 | 每个页面的功能区域与PRD对齐 | 标注"功能区域不完整"，补充缺失的功能区域 |
| 组件清单覆盖 | component_catalog 覆盖所有页面的 functional_areas 和 data_display_needs | 标注"组件清单不完整"，补充缺失组件 |
| 组件备选方案 | 关键组件（跨页面共享组件+数据展示类组件）有alternatives备选方案 | 标注"备选方案缺失"，补充备选方案（不影响输出） |
| 组件页面引用一致性 | component_catalog.components[].pages_used_in 中的页面名在 prototype.pages[] 中存在 | 标注"引用不一致"，修正页面引用 |
| 缺失的上游输入 | 降级方案 | 输出影响 |
|---|---|---|
| IA方案缺失 | 用户提供功能描述，生成低保真原型 | 缺乏IA数据，页面结构可能不够合理 |
| UserFlow缺失 | 用户提供功能描述，生成低保真原型 | 缺乏UserFlow数据，交互流程可能不够完整 |
| PRD缺失 | 基于IA和UserFlow推导功能区域 | 功能区域可能不够完整 |
| IA+UserFlow均缺失 | 基于用户功能描述生成低保真原型 | 整体置信度降低，仅产出低保真级别 |
| 所有上游文件均缺失 | 提示用户先执行前序阶段，或基于用户功能描述生成低保真原型 | 输出仅为低保真原型描述 |
| 字段路径 | 类型 | 必填 | 说明 |
|---|---|---|---|
| prototype | object | 是 | 原型数据 |
| prototype.fidelity | string | 是 | 保真度级别（low/medium） |
| prototype.pages | array | 是 | 页面列表，不可为空 |
| prototype.pages[].name | string | 是 | 页面名称 |
| prototype.pages[].layout | object | 是 | 页面布局（区域划分/内容优先级/导航流程） |
| prototype.pages[].functional_areas | array | 是 | 功能区域列表 |
| prototype.pages[].data_display_needs | array | 是 | 数据展示需求 |
| prototype.pages[].interaction_intents | array | 是 | 交互意图 |
| prototype.heuristic_evaluation | object | 是 | 启发式评估 |
| prototype.heuristic_evaluation.overall_score | number | 是 | 整体评分（0-10） |
| prototype.heuristic_evaluation.weak_areas | array | 是 | 弱项列表 |
| component_catalog | object | 是 | 组件清单数据 |
| component_catalog.catalog_id | string | 是 | 清单唯一标识 |
| component_catalog.components | array | 是 | 组件列表，不可为空 |
| component_catalog.components[].component_id | string | 是 | 组件唯一标识 |
| component_catalog.components[].name | string | 是 | 组件名称 |
| component_catalog.components[].type | string | 是 | 组件类型，枚举值：layout/navigation/data_display/form/feedback/media/composite |
| component_catalog.components[].props | array | 是 | 组件属性列表 |
| component_catalog.components[].data_binding | object | 是 | 数据绑定，含data_source/fields/loading_state/error_state/empty_state |
| component_catalog.components[].pages_used_in | array | 是 | 使用该组件的页面列表，须与prototype.pages[].name对应 |
| component_catalog.components[].alternatives | array | 否 | 备选组件方案列表，每项含type/name/reason/best_for |
| component_catalog.components[].selection_criteria | string | 否 | 组件选型决策依据 |
| component_catalog.shared_components | array | 是 | 跨页面共享组件列表 |
| component_catalog.component_dependencies | array | 是 | 组件依赖关系列表 |
| 上游变更 | 影响范围 | 响应策略 |
|---|---|---|
| IA方案变更（页面增删/层级调整） | 页面清单、布局结构 | 标注受影响的页面，建议人类确认是否重新生成原型 |
| UserFlow变更（流程路径修改） | 导航流程、交互意图 | 标注受影响的交互流程，建议人类确认是否更新 |
| PRD变更（功能增删） | 功能区域、数据展示需求 | 标注受影响的功能区域，建议人类确认是否更新 |
| 原型变更类型 | 通知范围 | 通知方式 |
|---|---|---|
| 页面增删 | interaction-spec、design-handoff-spec | 标记页面变更，触发交互规范和交接文档更新 |
| 功能区域变更 | design-handoff-spec | 标记功能区域变更，触发交接文档更新 |
| 交互意图变更 | interaction-spec | 标记交互意图变更，触发交互规范更新 |
| 组件清单变更 | UI Skill（ui-01-component-design） | 标记组件增删/属性变更，触发组件生成更新 |
| 共享组件变更 | UI Skill（ui-01-component-design） | 标记共享组件变更，触发跨页面组件更新 |
本Skill需要IA、UserFlow和设计规范数据，请通过以下方式之一提供：