1. uxd 验收

待完善

为确保开发结果符合设计、交互及产品预期，减少因测试、产品、uxd不同分工协作时产生的难以避免的专业性差异对产品最终结果造成不良影响，特此编写uxd验收时应当核实验收的内容。

1.1. 验收说明

uxd验收由QA根据工作安排发起，由uxd部门配合。 发起uxd协同验收的时间节点可以在研发完成自测后提交QA部门后（最好在已通过用户故事 、测试用例、边界条件的验收之后），正式发布版本之前进行，双方商定验收节点后按计划交付验收结果，并由QA追踪验收结果调整。 如涉及任何界面、交互、视觉等内容时，不应该跳过uxd部门直接上线。

验收范围：

• 设计验收 （UI）
  • 字体
  • 用色规范
  • 图标应用
  • 布局
  • 风格样式
• 交互验收 （ID）
  • 业务流程
  • 使用流程
  • 状态
  • 页面布局
  • empty states
  • 异常状态
• 适配验收 （UI）
  • 根据产品指定范围的需兼容设备适配
  • 布局响应
  • 不同设备入口及任务流程复查
• 附属规范验收

如有需要，按需添加

1.2. 设计验收

验收依据： zeplin设计图、其他uxd部门提供的设计图。有多种类型资源提供时， 以zeplin的设计资源为主

1.2.1. 字体 & 文本

检查以下内容，是否与设计图匹配。 字体检查建议使用半透明设计图覆盖对比检查方式快速定位不符合标准的部分。

1. 大小 —— 检查字体大小
2. 字重 —— 检查字体字重
3. 字体家族 —— 检查字体家族
4. 字距 —— 检查字距
5. 行距 —— 检查行距
6. 首行缩进 —— 检查是否需要首行缩进
7. 颜色 —— 检查不同状态下的字体颜色
8. 位置 —— 检查字体所在的位置
9. 间距 —— 检查对应文字所处位置与附近元素的间距
10. 状态变化 —— 检查对应文字是否有交互状态变化，如果有，是否与设计图相符

1.2.1.1. 字体 & 文本应用原则

• 信息层次和内容结构组织清晰
• 简洁明了，优化可读性
• 语言使用规则在整个体系内是清晰、一致的
• 优化文本阅读，考虑环境和上下文。
• 遵循 w3c 文本对比度指南，在视觉上提供阅读保障

1.2.2. 用色规范

1. 品牌色（含主、辅色）应用是否准确、规范。
2. 交互色是否准确、规范。 （警告、正确、错误、链接）
3. 高、中、低对比度文字使用是否准确、规范。
4. 所有类型的文本是否能清晰识别（无论在那种背景色/图片上）

1.2.3. 图标应用

1. 图标尺寸是否符合规范
   • 32px
   • 24px
   • 20px
2. 图标状态颜色是否正确
3. 图标风格是否符合设计规范

1.2.3.1. 图标设计原则

1. 遵循图标可用性原则
2. 图标对于新用户来说要表意明确
3. 图标风格样式遵循设计规范（轮廓线、填充、双调、圆角……)
4. 隐喻准确，与现实世界建立关联
5. 能通过图标识别测试
6. 图标防错功能，确保图标因异常情况不能加载时仍然可以保证功能识别

※ 参考 你真的懂图标设计吗？ (opens new window)

1.2.4. 布局

1. 页面栅格布局
2. 元素、组件、板块间距
3. breakpoint
4. 容器及间距

1.2.5. 风格样式

相同组件的一致性 设计风格的一致性 要求与品牌当前设计语言相符。

1. 线 ：线型，线宽，线条颜色，线条间距
2. 面 ：背景色，倒角，边框色，投影规则(方向，距离，颜色，模糊)，交互样式状态的样式变化
3. 间距 ： 元素间距、组件间距、板块间距、页面间距等涉及布局相关的间距单位
4. 组件 ： 组件本身是否规范化使用，样式是否正确

1.3. 交互验收

1. 控件功能一目了然
2. 所有元素/组件的状态能够清晰准确的识别
3. 元素的布局位置在系统中是统一的
4. 确保有辅助用户回退的操作
5. 控件操作以简单且合乎逻辑的映射到操作结果
6. 用户必须可以识别、诊断和从错误中恢复
7. 用户很容易理解系统的当前状态
8. 信息架构的结构和深度在整个系统中保持一致
9. 提供操作的轻松undo
10. 业务流程、交互流程是否清晰
11. 主次流程设计是否与业务和目标相匹配
12. 交互流程是否闭合完整，场景是否覆盖全面(应满足基本需求)，状态反馈是否全面。

1.4. 工具 & 参考

A/B Test 参考 (opens new window)

※UX Checklist (opens new window)

※IXD Checklist (opens new window)