当前位置: 首页 > 科技观察

最后一道防线!五步提升UI交互验收效率

时间:2023-03-19 11:47:50 科技观察

细节决定成败。这次跟大家聊聊项目开发中的最后一个环节,也是考验细节能力的环节,即“设计验收”。背景:为快速迎合市场发展,公司战略层面决定打造中台版。该项目现已完成1.0试验验收,进入设计验收环节。体验测试产品后发现,页面的还原度与设计稿存在一定的差异,在交互上也存在一些问题。这时候验收工作就是为了解决这些问题而存在的,是产品上线的最后一道防线。事件:在验收过程中,发现产品验收工作过程中存在一些问题,于是主动提出系统的验收框架提案,提案成功并纳入团队。目的:为了用敏捷的方法协同完成业务需求,在团队内部形成标准化的工作流程,更好地利用设计为业务增值……一般的项目验收分为三个部分:项目需求验收、UI交互验收和产品发布验收涉及不同的时间节点。下面我将从以下五个关于UI交互验收的细节来和大家一起探讨。写作格式在验收过程中,我们团队使用钉钉在线表格(知识库-产品验收问题记录表)进行协作,由设计部门维护,开发部门反馈。在协作模式下,设计团队在beta版本中体验产品,然后与UI稿、交互稿、PRD文档进行对比,从中发现问题,并写在表格中。写的核心就是问题描述和图片。开发测试排查问题,下面简单描述一下书面上需要注意的事项:1.格式一致性。模块内容的书写格式一致,方便相关人员查看和理解内容。建议按照导航系统编写格式:一级导航->二级导航->主菜单->具体模块如:部门综合分析->部门首页->概览->成本构成分析2.集群整合和统一展示上一步我们统一导航描述问题模块。这里我们应该将同一模块的问题簇整合在一起,使表格看起来统一,体现出表格的完整性。由于验收是由多个角色(产品、交互、设计...形式的复杂性,便于开发和测试。查看问题。最终问题模块的比例可以一目了然,甚至可以将责任落实到相关人员身上。本设计验收表模板可在文首获取。在截图标注中用文字简单描述问题需要一定的理解成本,但是附上图片可以更直观的展示问题。截图问题标注时有几点提示可以参考:1.整页截图问题:B端产品页面重复性高。如果只截取部分截图,大多数情况下,很多模块都有这张截图上的内容。很难看出它属于哪个模块。需要结合正文加以确认。好处:方便开发者使用导航系统定位页面位置。2、在图上标注问题和修改建议好处:开发者在查看截图的时候可以清楚的看到问题和修改建议,同时方便保存图片和其他有问题的人员一起讨论。(问题来源:在小分辨率的电脑上,打开excel表中的缩略图会覆盖表中的内容。)3.存在多个问题,并用序号标记。当一个页面有多个问题需要标注时,要有序的做些什么。4.对于复杂的问题,附上对应的UI草稿/交互草稿/PRD文档截图,减少开发者操作(找文件、找页面的重复操作),提高bug修改效率。!!!升级验收批注截图提示5.检查代码截图页面时,即使是像素眼的设计师👀当他们仅仅依靠他们的眼睛来检查错误的页面时,几乎无法准确地看到他们在哪里。这里我们需要对照代码检查页面,那么我们可以对代码进行截图,找到代码中需要修改的地方,并在旁边附上说明文案,然后将这样的截图附在验收文件中,那么我们可以给开发节省很多时间,也可以看出我们有多专业。顺便给大家分享一款好用的MAC截图标注软件“xnip”。它不仅可以截图,还有很多截图功能键,还有步骤标注工具,支持滚动截图,可以设置快捷键……总之,很好用。推荐给大家。下载链接:https://xnipapp.com/问题描述有了前面的基本操作,验收时遇到问题应该怎么描述呢?这里需要我们换位思考,从设计的角度到开发的角度,站在他们的角度,什么样的问题描述才能通过有效的描述帮助开发者得到想要的信息。1.不要只描述错在哪里,而是直接描述怎么做,这意味着你必须详细写下修改意见,帮助开发节省重复起草和计算参数的时间,进而有助于减少二次验收的费用。文案提示:少用4px的间距代替20px的高度,模棱两可的文案见交互式草稿等。完全验收在没有系统验收框架的情况下,我们基本上看哪里是哪里,这就会导致验收时出现遗漏、删减、重复等问题。因此,设计验收清单非常重要。只有对照清单进行验收,才能尽可能避免遗漏,确保验收的完整性。这里我根据项目组合整理了一份设计验收清单。这份清单可以帮助您更全面地验收产品。同时,其内容要根据项目的迭代不断优化,不断修订完善内容,以覆盖更全面、更好赋能的业务。审核验收审核验收的审核工作是一次产品更新的总结,也是为了防止以后再犯错误。当产品验收工作达到90%或完成后,问题已经达到一定数量级。这时候要对问题进行分类整理,找出基本的组件问题和通用的交互规范问题。将这两个类分别挑出来,整理出来,与对应负责人一对一对接调整,严格按照组件库和交互标准进行修改,做到100%还原,解决基本问题在源头。问题,以便以后在其他项目中继承此类组件/交互时不会再次出现。这样就可以完美的完成一个完整的验收工作。文末总结:有了这个系统化的验收流程,可以帮助我们在验收过程中更好的配合上下游。当然,相应的提议者也应该负责到底。问题提出后,时刻关注开发者的反馈情况。如有问题,积极沟通,针对具体问题给出具体解决方案,直至问题解决,确保产品顺利上线。以上是我对产品验收流程的个人建议。希望能提高团队工作效率,为业务赋能。同时也希望大家能提出宝贵的建议。