前端用户体验自查表

一、体验优化

• 是否为用户设计新手提示

  功能变更，或者新用户首次使用等情况，是否为用户设计了提示信息？

• 使用缺省状态

  没有数据或内容时，应提示缺省状态，并给出可以执行的推荐操作（如果有）。

• 表单易用性

  表单是人机交互的重要组成部分，涉及各类交互动作、输入体验、数据验证等

    将相关字段和标签进行视觉分组
  

  • 顺畅的阅读路径（视线）
  • 使用逻辑排序和表单索引（tab 键 index 设置）
  • 避免仅使用占位文本导致可用性问题
  • 字段类型匹配和输入框长度匹配
  • 注明可选、必填字段
  • 解释任何输入和格式要求，尽量提供防错
  • 避免信息丢失和重置风险

• 交互文案文案是否清晰易懂，符合用户习惯。了解更多

• 等待时长提示

  需要较长时间等待提醒用户，避免用户损失大量时间或认为这是个bug。

• 网络状态

  无网络、网络慢、网络中断等状态和设计的完整性。

二、流程检查

• 几步完成页面主流程

  页面级的主要流程能在几步完成？是否高效？可以精简吗？

• 是否能明确区分主次任务

  页面布局是否能明确反映主次任务层级？使用户专注于主任务流程。

• 那些设计未使用标准组件

  哪些设计为何未能使用标准组件？是否有合理的理由支撑，是否需要加以梳理创建业务组件？

三、界面风格

• CTA(Call to action) button 风格统一

  重要的 CTA button 的视觉风格、应用位置等是否统一

• Card block 类组件是否风格一致

  1. 版块内容的视觉样式是否统一

  2. 线条的视觉样式是否统一

  3. 投影的视觉样式是否统一

  4. 倒角间距的视觉样式是否统一

• 交互还原度

  页面流程是否完整，是否完整设计了所有交互稿件的状态。

• 图标可用性

  • 寓意准确
  • 避免使用混淆图标(1标多义)
  • 通过5s测试
  • 测试图标可记忆性
  • 必要时使用文字标签

• 一致性检查

  • 信息结构深度一致性
  • 语言、语法一致性
  • 重点元素（如标题、CTA btn）一致性
  • 布局规则一致性

• 页面视觉重心在那里？

  当前页面的主视觉重心在那里？ 它的主要 Action 是什么？是否符合任务目标？

• 内容区域分隔明确吗？

  当前页面的区域分隔是否明确，通过区域分隔理解页面基本逻辑和影响范围。