UI 规格
技能名称:view-spec
背景与适用场景
在把用户故事交给UI设计师画原型或者交给前端开发写页面之前,需要先把「这个页面有哪些元素、点击后发生什么、数据从哪里来」这些交互规则说清楚。否则设计师和开发者会各自脑补,导致最终页面和需求预期不一致。这个技能产出的是UI设计师和前端开发都能读懂的视图操作规格。
输入与输出
你需要提供:已确认的用户故事集和需求规格说明书。
你将获得:UI视图操作规格表,包含:每个页面的组件映射(有哪些输入框/按钮/列表)、数据转化规则(展示的数值怎么计算)、阀门条件(什么情况下哪个按钮可点)、操作链(点击后触发什么)。
流程说明
Agent 会逐个场景、逐个页面帮你定义:这个页面有哪些 UI 组件(输入框、按钮、列表)、展示的数据怎么转化计算、什么条件下哪些操作可用、用户点击按钮后触发什么操作链。产出的是 UI 设计师和前端开发都能直接使用的视图操作规格表。
flowchart TD
s0["视图规格准备"]
s1["单场景内页面 by 页面递进"]
s2["单场景页面一致性自检与收口"]
s3["校验与确认"]
s4["文档整合:元数据 + 视图规格准备"]
s5["文档整合:所有场景页面规格"]
s6["文档整合:校验清单 + 待澄清事项 + 定稿声明"]
s0 --> s1
s1 --> s2
s2 --> s3
s3 --> s4
s4 --> s5
s5 --> s6