编者按:设计还原如何做才能达到至少80%的落地效果?本文从设计前期的严谨,设计中期的积极沟通到设计后期的主动跟进3个方面,让你的设计方案完美落地。

1. 关于设计还原

设计还原是开发实现的效果不断校正并与设计稿保持一致的过程。在项目开发的流程中,设计还原和功能测试一样,是上线前最后的质检工作。设计界面是直接呈现给用户的,还原度的高低影响用户对产品的第一印象。

设计还原这么重要,在实际执行中是什么样的?

2. 设计还原现状

其实很多时候,设计验收环节不太受到各方重视。设计师更多思考的是如何达到美观的界面、流畅的交互等问题,认为开发能会完全按照设计稿标注来,而忽略掉后期的设计验收;开发则关心的是实现这个功能需要花费多长时间,实现难度如何等等。大家站在不同的角度看待问题,双方的目标没有对齐,最终影响到工作效率也是必然的。

设计还原,终究是一个合作问题。还原度的高低与否,取决于设计-开发-测试这些环节的协作质量,也直接影响上线产品的用户体验。

如何进行高效设计验收?这3个步骤让设计还原度更高!

影响设计还原的原因

3. 如何高效验收

在对接的整个流程中,本文梳理了前中后三个阶段分别需要做的准备工作,来帮助解决设计师和开发如何高效验收的问题。

如何进行高效设计验收?这3个步骤让设计还原度更高!

前中后三个阶段需要做的工作

前期·严谨设计

建立设计规范

设计规范的目的是为了统一设计内部及前端工程师的开发,提升团队的协作效率,从而实现设计稿到线上页面输出统一的设计语言,从根本提升设计质量和还原度。我们把颜色、字体、组件等内容预设定成规范,保证了视觉上的统一,也方便组件的复用。

在设计前期需要确认哪些模块有可调用的开发组件,若没有,需要评估开发成本,预留好制作规范组件的时间。如果不了解这些情况,后期会有调整设计稿或延期风险。

如何进行高效设计验收?这3个步骤让设计还原度更高!

建立统一的设计规范和设计组件

设计完整输出

我们在做设计交付前期,需要把全部的页面状态、切图标注、动效视频等文件整理好,避免在开发过程中临时进行补充,影响项目开发进度。关于设计稿内的切图,我们要提前与研发沟通,切图的范围和形式,最后把设计稿上传到公司统一使用的协作网站,如 58 使用的是自研开发协作平台风火轮。

如何进行高效设计验收?这3个步骤让设计还原度更高!

设计稿输出到风火轮等设计开发协作平台

关于标注,现在的标注软件虽然能解放设计师的双手,但是它们只是生成各元素的基本样式、尺寸等,对于重要模块部分建议手动标注,告知开发设计说明及注意事项。

如何进行高效设计验收?这3个步骤让设计还原度更高!

中期·积极沟通

设计宣讲会

一个产品的完整流程中,从创意发散到设计实施,由一开始的抽象目标到最终具象的方案形成,背后很多工作是不为人知的。这就解释了为什么很多时候开发同学不理解设计师对一个字号、一个像素的差异要“锱铢必较”。所以我们需要通过设计宣讲环节把设计的理念表达出来,与开发对齐目标,避免开发同学带着疑问写页面。

设计宣讲会的意义是把问题前置化。通过宣讲可以把视觉变化最大的地方和开发说明清楚。有些细微的地方我们特别向开发说明,加深他们的印象,在实现时候减少出错,我们前面每走一步,都是为了开发落地更效率、后续验收更轻松。

如何进行高效设计验收?这3个步骤让设计还原度更高!

设计师需要与项目成员阐述设计方案,达成一致目标

在设计宣讲前,确认项目组主要成员到场,包括前端、测试、产品、后端同学等。我们对已确认的设计稿进行宣讲,结合设计文档对设计理念、组件规范、动效、特殊样式等模块进行讲述,帮助开发同学理解。同时开发同学也要及时反馈是否有还原困难,如:是否有技术限制?是否有组件改动困难?实现成本过高等问题。针对宣讲过程当中的问题和解决方案以会议纪要的形式记录下来,会议结束后根据达成的共识和重要结论邮件周知项目组全员。

如何进行高效设计验收?这3个步骤让设计还原度更高!

对宣讲会重要信息做会议记录

及时同步信息

在项目正式上线前,都可能出现产品临时更改需求,计划赶不上变化,这种情况比较常见。有时候产品同学认为更改个颜色或交互形式是比较小的调整,只告知了设计师调整往往忽略了同步给开发。那么在测试上线后暴露出的问题,可能导致了延期等状况时,各方就出现责任划分。所以信息的同步非常重要,在项目组成立时,把涉及到的项目成员建立项目沟通群,所有相关信息同步在群内,有问题及时沟通,必要时拉会面聊。

避免频繁修改

除了产品需求上变更导致设计稿调整外,应避免对设计稿的频繁修改。因为在随意更新设计稿的时候,我们不清楚当前的开发进度,如果修改的部分已开发,会给他们产生不必要的工作量,也可能会影响开发同学的代码规范。如果必须要修改,一定要及时说明原因,否则会有被开发同学“追杀”的风险。

后期·主动跟进

跟进开发进度

设计稿交付后,我们还需要实时跟进项目的进度,了解当前项目开发的时间节点,根据开发给出的时间排期,在计划提测时间介入走查。如果开发反馈有延期风险,我们需要跟产品及时了解原因,然后评估是否对设计有影响。

建立走查机制

尽管我们前面做了详细的沟通和宣讲,但有时也避免不了在开发过程中发现有些问题才暴露出来。设计师需要在提测阶段提前介入走查,给开发预留出修改时间,通过建立合理完善的走查机制,来提升团队整体的协作效率。

如何进行高效设计验收?这3个步骤让设计还原度更高!

建立合理的走查机制流程

① 保证视觉还原度在80%左右

在项目排期阶段可与开发沟通,要求对自身负责的部分进行设计自查,同时将设计实现效果纳入测试同学的工作中,保证视觉还原度在 80%以上,再介入视觉验收工作。因为很多时候不要求测试走查设计还原度,我们在验收的时候就会浪费很多时间和精力在那些对照视觉稿就能发现的简单问题上,反复验收导致设计与测试的工作量变大。

② 规范走查文档

在视觉走查阶段,我们应该建立线上协作走查文档,支持设计、开发、测试、产品等项目成员共同管理和跟进走查进度,避免口头沟通造成的信息遗漏、沟通误差等扯皮事件。走查文档中包含对设计走查问题的分类、分级等,再根据影响程度、实现难度、资源配比等情况综合分析进行排期。

在走查过程中,设计师还需要给予充分的支持响应,必要时补充设计示意图或交互动效帮助开发同学理解,避免信息偏差导致再次调整。

如何进行高效设计验收?这3个步骤让设计还原度更高!

建立健全的线上协作走查文档

③ 关注特殊情况

特殊场景在走查中常常被忽略,等上线后在现实中碰到缺失异常状态体验会大打折扣,所以完成主流程的走查后,一定要记得考虑到特殊场景,包括括网络异常、内容缺失、空状态等。同时还要看下不同机型适配的问题,保证不同机型的界面呈现效果一致,包括关键信息及操作是否超出屏幕,是否出现覆盖、拉伸等情况。

数据监测

功能上线后也不代表需求的完结,我们还要及时追踪数据的情况。数据的量化指标可以很好佐证我们方案的价值,也能帮助我们在错误道路上及时转向。我们可根据数据反映的情况及时调整对应的产品策略,促进我们设计上的修改、完善等工作。

4. 写在最后

所以设计能力再强,设计方案再好,没有后续良好的执行,也终究不过是废纸一张。一个优秀的项目落地是大家共同协作的结果。如果设计还原出了问题,首先要自查,确保自身工作做到位,提升设计输出质量,依照设计规范做设计,做到逻辑自洽。我们要做足前期的准备工作,尽可能的多思考、多沟通,打造专业的“人设”,不仅赢得开发同学的尊重也更方便自己顺利开展工作。

关于提升设计还原质量,这里只是抛砖引玉,如果大家有更好的工作方法,欢迎评论区留言交流~

欢迎关注「58UXD」的微信公众号:

如何进行高效设计验收?这3个步骤让设计还原度更高!

收藏 88
点赞 28

复制本文链接 文章为作者独立观点不代表优设网立场,未经允许不得转载。