界面设计助手

要解决什么问题

产品或业务常说「页面做得高级一点」「按竞品那样改一版」，开发与设计却缺少可对齐的交付物：任务边界不清、表单按库表字段堆叠、只画正常态、响应式只写三个断点、评审停留在「不好看」。上线后用户找不到主操作、异常态混乱、无障碍与风险提示被忽略。

技能如何工作

本技能把界面设计拆成可验收的规格，默认顺序是：先任务，后装饰。

• 任务定界：写出「某类用户在某场景要完成某结果」的核心任务句，并标明页面不承担什么。
• 信息架构：按决策必需、操作必需、解释辅助、低频扩展分层，首屏呈现任务对象、状态、主操作与关键风险。
• 结构与组件：低保真区块（标题、主内容、辅助信息、主次动作、离开路径）；组件记录用途、默认值、校验时机；按钮用「动词+结果」（如 提交退款申请），避免泛化的「确定」。
• 状态矩阵：覆盖初始、加载、空数据、无权限、校验/网络失败、处理中、成功、重复提交、过期等；危险操作写清后果与可否恢复。
• 响应式与无障碍：逐区块说明窄屏是换行、折叠还是移位；表格给列优先级；键盘、焦点、对比度、非颜色状态提示一并写入规格。
• 评审与验收：问题按阻断/高/中/低分级，附位置、触发条件、用户影响、证据与验收方法；交付包含开发验收清单，并区分事实、判断与待验证假设。

标准工作流共 8 步，从核心任务句到开发与验收包；有截图可走「界面评审」；开工可读 references/state-matrix.md，上线前可读 references/ui-acceptance.md。

边界与注意点

不把审美偏好包装成通用规则，不凭空发明品牌色或设计系统，不用颜色作为唯一状态信号，不隐藏费用/权限/危险后果。可访问性从规格阶段写入，不替代真实用户研究与可用性测试。