梳理适合自己的交互自查表

年底了，工作节奏逐渐空闲起来，回顾一下这大半年的工作内容和踩过的坑，发现其实很多问题都是易被忽略或经常重复出现的那种，于是脑海里想起来一个东西——交互自查表。

作为设计师，如何保证设计质量保证自己的专业性，在方案输出后不被项目组成员以及老板们提出各种挑战？交互自查表就是用于解决这些问题的工具。那么应该如何进行高效的设计自查？我看到过网上有各种版本，总觉得没有贴合自己的需求，于是就结合自己平时的项目经验及其他同学分享的内容，梳理出来这份适合自己的自查表。但这绝对不是终结版，还会持续不断更新优化，最终以提升设计质量，保证设计方案经得起检验。

一、明确用户核心使用场景及影响因素

不同的产品对应的用户场景和操作流程是不同的，设计投入前定好的那些功能需求，在设计产出后再回过头来检验一遍方案是否真正满足用户需求？在体验上是否还有优化空间？以及各种影响因素都要一并考虑进去。

• 在哪些主场景下完成什么任务？
• 有哪些核心影响因素？

二、整理产品框架及流程

按照核心任务梳理流程，检验整理的流程图是否有问题。设计稿常常在开始设计和中间过程会经过不断地调整，结合各方意见最终定稿，所以很难保证原本设定好的流程是否会发生变化，这里都需要设计师进行把控，从整体到局部，防止出现逻辑问题，保证最重要的核心任务流完成。

框架布局

• 框架结构：能否承载产品功能？明确操作区域、内容区域等是否合理统一？
• 信息层次：是否清晰，重要的信息是否优先展示
• 信息组织：是否可合并归类，没有重复信息
• 功能操作：是否易操作，重要、频繁触发的功能按钮是否在手机的可操作区域
• 导航：广度和深度是否适中、易操作、拓展性好；导航完整性，顶部菜单、手风琴菜单、面包屑（二级以上菜单）、步骤导航（不要超过5步）
• 页面打开方式：当前页打开（单个服务刷新页面）、在新窗口中打开（两个服务两种内容的跳转）的场景总结
• 页面滚动方式：系统滚动条滚动、指定区域滚动
• 颜色：背景色、线条色、图标颜色、多种状态色（成功、失败、失效、未完成、审核中等）、告警颜色（紧急>重要>次要>提示>正常）、文本颜色（标题、次级重要信息、置灰文字、链接文字）

流程

• 核心任务流程：从头到尾是否能顺畅走通
• 全景图：全站页面分布和组织情况，页面之间的跳转关系
• 框架图：关键界面的框架梳理，体现优先级关系
• 异常流程：退出、撤销、重置、返回、不通过、过期失效
• 返回：从哪里来是否可以回到那里去
• 保存：复杂任务流是否支持保存或自动保存；意外退出前保存提示
• 复杂状态之间的变化关系：子流程梳理辅助说明

三、按页面流逐一梳理界面内容细节

接着，以页面流仔细梳理每一个界面的内容细节。枚举了最基本的几种内容形式

文本内容

• 文本长度：是否有限制？
• 文案内容：是否完整、通俗易懂、有趣
• 超过负载时如何显示？
• 核心词汇是否统一（如各种用户角色名称）
• 重要、复杂的操作内容是否有清晰的解释说明？
• 浏览到内容底部的情感化表达

控件

• 按钮类型：主按钮、次按钮、幽灵按钮、虚线按钮是否按需区分使用（一般一个界面或视窗中只有一个主按钮）
• 按钮状态：默认、经过、点击、置灰、选中、加载中（提交按钮）；其中不同状态下按钮的置灰，是否有说明为什么不可用？以及按钮激活条件是什么？
• 链接：点击后颜色是否有变化
• 选择组件：单选、多选、tab选，是否有默认选中项
• 输入框：输入及时校验，有错误时定位；有特殊输入条件限制的输入框是否有明确说明

表格

• 基础表格：内容项过多时，考虑将次要身份鉴别类信息隐藏，鼠标浮动到对应字段后浮窗显示
• 表格排序：默认排序和切换排序，核心字段的默认宽度
• 表格操作：考虑在当前表格内完成（页内编辑）；批量操作时对于互斥的选项处理
• 对齐：一般文字左对齐，数字右对齐
• 折叠、展开 ：主要内容在列内显示，更多内容点击展开显示
• 分页：表格内容翻页展示还是无限加载？若分页每页显示多少条内容

弹窗

• 遮罩：是否有背景遮罩
• 操作：主行动点是否突显，有无取消操作
• 核心、毁灭性操作是否有二次确认提示？
• 足不出户：避免滥用 Modal 进行二次确认，考虑使用覆盖层直接操作，并支持撤销
• 无线modality：按照规范使用相应modality

四、交互与反馈

上一步主要是一个产品看起来怎么样；而这一步是这个产品用起来会怎么样，用户如何跟产品交流？在满足产品基本功能的基础上，如何更大的优化用户体验？

从A状态到B状态

A.触发时

• 触发源：操作按钮在当前界面中是否明确
• 触发区域：操作按钮是否易操作易触达
• 未释放状态：考虑内容过多或展示过快时支持长按停留内容；是否可以取消，例如发送语音消息，此时是否允许用户取消发送；

B.触发后

• 结果反馈：是否有反馈，反馈是否备注清楚，选择轻（tip/小红点）、中（Toast）、重（提示框）提示优先级别是否恰当；常见的结果类型有成功、失败、空（搜索）、无权限；触发的控件是否有状态变化
• 加载状态：状态改变的等待时间是否超过3S左右，如果太长是否需要加入加载状态
• 转场动效：是否需要添加有趣的转场动效
• 撤销：是否支持撤销操作

刷新和加载

• 刷新：自动还是手动刷新？每次刷新加载多少条内容？刷新失败如何提示？
• 无线刷新：顶部下拉、底部上拉，安卓有刷新按钮
• 加载：复杂页面是否有副列表加载？预览、保存、提交的完成时间若超过3S是否有加载的过渡状态？新加载内容是否有高亮底纹显示？

通知机制

• 回流：多端任务流是否需发送通知（钉钉、邮件、旺信、短信等）拉用户回到平台？发送通知的触发状态是否交代清楚
• 消息推送：是否需要消息推送C用户，调用系统通知还是第三方还是其他方式
• 推送策略：是否备注通知的推送时间、表现形式、失效策略

五、特殊情景再复查

此外，还有一些特殊情况要考虑，多是一些很容易疏忽的细节，需要对于这些特殊因素再次复查是否遗漏

硬件设备

• 横竖屏：是否支持横屏显示，横竖屏时布局及功能是否完整
• 分辨率高低：分辨率情况下是否会有适配问题，例如5s等小屏手机下内容展示及操作区域是否足够？
• 硬件、系统版本：不同手机的物理按键、系统等不同，是否需要备注
• 应用版本：新增功能是否影响老版本，是否需要升级
• 硬件交互：定位、蓝牙是否打开？需要调用GPS、相机的使用权限吗？如何让用户更加愿意授权？

模式

• 编辑模式：编辑模式下出现意外情况是否提示保存或自动保存已填信息
• 夜间模式：是否需要考虑夜间模式（有没有光线较暗的场景）
• 无图模式：数据流量环境下是否提示切换无图模式
• 低电量模式：是否减弱部分视觉效果，停用富文本内容的自动刷新与下载
• 沉浸模式：如全屏模式、VR模式，考虑退出操作的便捷性和信息提示弱打断

网络状态

• 没有网络（无网）
• 网络超时（断网）
• 网络太慢（弱网）
• 网络环境变化：从WiFi到数据流量环境时是否需要切换视图
• 加载失败：是否自动重新加载？

异常

• 异常操作：连续多次点击给予反馈、统一设备登录多个账号验证码、统一IP；连续破坏性操作n项内容时是否需要身份验证
• 数据相关：进入页面后服务器获取不到数据；搜索无结果状态；数据加载时间较长时预设默认图片、状态、内容框架；
• 错误提示页：404页面、即将上线、页面失效、服务下线、系统繁忙，考虑出错页面内容情感化表达以减弱用户的受挫感

账号权限

• 未登录：登录和未登录按钮权限差别，需要登录后才可操作的功能是否备注
• 用户权限：需要读取权限吗？如何描述读取内容让用户读？不同权限管理

其他

• 是否需新手引导页
• 是否需要进行埋点，以便分析用户行为？
• 技术可行性
• 必要的动效提供

总结

其实，交互自查的核心目标是：工作效率和质量的一并提升。这决定了自查表应该是不冗余的，在高效迭代的产品进程中能够快速发挥作用，通过自查表可以减少技术返工，不能因为要检查而拉长设计交付的时期。但是现在自查表还是过长，后续我会根据在实际项目中的检验不断精细打磨，欢迎大家指正。最后附上梳理好的交互自查表：