提升 UI 交互验收效率的5个技巧

般项目验收分为三个部分：项目需求验收、UI 交互验收、产品发布前验收，分别在不同的时间节点介入。

这里我将针对 UI 交互验收这一环节，从以下五个细节方面来和大家一起探讨。

一、书写格式

在验收过程中我们团队使用的是钉钉在线表格（知识库-产品验收问题记录表）进行协作，由设计部门维护，开发部门反馈。

协作模式是由设计团队在测试版体验产品，然后和 UI 稿、交互稿、PRD 文档做比对，从中发现问题，并书写在表格中，核心要写的是问题描述和配图两大块，开发、测试去查看问题，所以先来简单描述下有关书写需要注意的事项：

1. 格式一致性

在多人参与协作时，设计团队对外输出应保持一致性，所以在验收时，要做到同一模块内容书写格式保持一致，方便相关人员查看和理解内容。

建议书写格式根据导航系统来书写：一级导航 -> 二级导航 -> 主菜单 -> 具体模块

例如：科室综合分析 -> 科室主页 -> 总览 -> 费用构成分析

2. 聚类整合、统一呈现

上一步中我们统一按照导航去描述问题模块，这里应把相同模块的问题聚类整合到一起，让表格看起来具有统一性，展示表格的整体性。

由于验收由多角色（产品、交互、设计…）参与，这里建议大家在描述问题时，把相同模块下的问题写到一起，减少相同内容重复出现，降低表格的复杂度，也方便开发测试去查看问题。

最后，问题模块的比例可以看得一清二楚，甚至可以把责任转移到相关人员身上。

二、截图标注

单纯的用文字问题描述需要一定的理解成本，附上图片则能更加直观的展示问题，在截图标注问题时有以下几个小 tips 可供参考：

1. 整页截图

问题：B 端产品页面重复性高，如果仅局部截图，很大情况下会是很多模块都有这个截图上的内容，很难看出到底是属于哪个模块，需要结合文字再去确认。

好处：方便开发人员利用导航系统定位页面位置。

2. 在图上标注问题及修改建议

好处：开发人员在查看截图时即可清楚的看到问题及修改建议，同时方便保存图片带着问题与其他人员进行探讨（问题来源：在小分辨率电脑上，打开 excel 表格中的缩略图会覆盖表格内容）。

3. 多个问题存在，用序号做标记

面对一个页面有多个问题需要做标注时，要做到井然有序。

4. 复杂问题，附上对应的 UI 稿/交互稿/PRD 文档截图

减少开发人员操作(找文件，找页面的重复操作)，提升修改 bug 的效率。

升级版验收标注截图技巧

5. 带代码截图标注

在检验页面的时候，即使是拥有像素眼的设计们，单纯的靠眼睛去检查页面，也很难准确的看出来哪里有错误。

在这里，我们需要对照代码检查页面，然后我们可以拿代码截图，在代码中找到需要修改的地方，把说明性的案例附在一边，然后把这样的截图附在验收单上，这样可以节省大量的开发时间，也说明我们是如此的专业。

这里顺便跟大家分享一个好用的 MAC 截图标注软件「xnip」，它不仅可以截图、搭配有很多截图功能键、而且有步骤标注工具、支持滚动截图、可设置快捷键……总之很好用，推荐给大家。

三、问题描述

与之前的基本操作相比，如何描述验收中的问题？在这里，我们需要将视角从设计转向开发。从他们的角度出发，我们需要思考问题描述如何帮助开发人员通过有效的描述获得所需的信息。

1. 不要只描述哪里错了，而是直接描述如何做

意思就是说一定要把修改意见写详细，帮开发节省反复对稿、计算参数的时间，反过来是帮自己减少了二次验收的成本。

文案技巧：用间距减小 4px，代替高度 20px、参见交互稿等这类含糊不清的文案。

四、完整验收

在没有一个系统的验收框架时，我们基本上是看到哪里是哪里，这样就会导致在验收的时候会有遗漏、缺失、重复等问题。所以有一份设计验收清单至关重要，对照清单进行验收，才能尽量避免遗漏，保证验收的完整性。

这里我根据结合项目，整理了一份设计验收清单。这份清单可以助力大家更全面的验收产品，同时应根据项目的迭代不断的优化其内容，持续的修正和完善，使其覆盖更全面、更好的赋能业务。

五、复盘验收

验收的复盘工作是对一次产品更新的总结，也是为预防以后重复出现错误工作。

在产品验收工作进行到90%或完成后，问题已达到了一定的数量级，在这时应对问题进行分类整理，从中找出基础组件问题、通用型交互规范问题。把这两类单独挑出来，进行整理，并和对应的负责人，进行一对一的对接调整，严格按照组件库和交互标准进行修改，以达到百分百还原度，在源头上解决基础性问题，这样后续在其他项目中沿用此类组件/交互时，不会重复出现此类问题。

这样一次完整的验收工作就可以完美的结束了。

小结：有了这个系统化的验收流程，可以帮助我们在验收过程中更好地与上下游合作。当然，相应的提案人也应该负责到底。问题提出后，要时刻关注开发商的反馈情况。如果有问题，要积极沟通，针对具体问题给出具体的解决方案，直到问题解决为止，这样才能保证产品的顺利推出。

转载声明：本文来源于网络，不作任何商业用途