强烈表示：以上，仅仅是个人笔记！ 不代表所有公司！！每个公司的制定也不一样，个人笔记代表也会出错，不建议大家收藏！

一直以来，面试的时候经常会被问到设计验收，那应该怎么回答呢？

以下就是我个人整理搬运的一些答案，平常我也用过，不过面试的时候老忘记，所以还是整理下笔记。

我们的设计稿和最后上线的视觉稿，其实是有出入的。

因为很多设计师不太重视设计验收，很多设计师基本设计稿做完，把标注往开发小哥那边一扔就行了。结果开发小哥就按照自己的逻辑去开发，最后导致设计对开发不满意，然后设计和开发开始多次返工修改Bug，极其影响效率，其实设计师在设计验收的时候，多用心，提前指出哪些容易出错的地方，做好文字以及当面说明，多花费几分钟，就能大大提高bug的修改率。

1、为什么设计验收不重视？

之所以验收不受重视，我觉得主要有两个原因： 

1、设计师不在上线结果。

很多设计师感觉只要做好设计稿就可以了，，没有意识到验收的重要性， 潜意识里认为我只要做好设计稿就完成任务了，其实只是做好流程的一半，最后开发的效果不好是开发的锅， 跟自己没有关系。

2、对自己和合作的程序员极其自信。

认为开发小哥很牛逼，自己什么不用做，开发小哥就会完全按照设计稿来。

2、交付设计稿之前

1. 保证设计稿完整

这个首先当然是设计师的失责，因为我们提交给技术的设计稿的第一要素就是完整度，到开发进入尾声才发现缺失，那技术同学只有说“对不起，排期吧”。然后设计同学还一肚子委屈，觉得开发不配合。

下面是设计稿中常见的缺失内容：

页面极限状态：无内容、无网络、加载中；

页面交互状态：上滑导航栏固定的样式、社交操作的交互状态、下拉刷新样式、按压状态等；

页面适配：文字的极限情况、屏幕横向竖向的适配、X和Android等各种极限机型的适配。

这些都应该是在出设计稿的时候就考虑清楚的问题，因为技术是根据你的设计稿进行技术排期的，如果你的页面不完整，后期再增补导致项目延期，这个责任在谁呢？

2. 忌口头说明

很不幸，实际工作中很多设计师发现问题后，只是口头告诉开发哪里要改，这种方式很容易出现你说了10个，但开发只记得6个，最终只改对了4个，重复返工以及沟通的时间太长，效率不高。

当然在这种口头说明的方法之下还产生了一个进阶版，就是搬个小板凳坐到开发面前指哪改哪，但这个也仅限于对接开发人员少的时候，当你同时对接三五个开发的时候，是没有这个精力的而且也会影响开发的进度。

 解决方案：

时间允许，尽量进行手动标注/时间紧张需要适配的地方单独标记；

技术开发前进行设计稿评审。

3.  提前确认某个功能开发小哥是否能做到，考虑成本是否要做

这里的不配合不是说技术同学偷懒不想干活，原因是多方面的：

设计审核时间太靠后，结果就是在我们提交UI问题的时候，产品也在提交功能型的bug，那技术同学同时拿到这两个问题，按照问题的优先级来说肯定是先改功能性问题，然后你的问题就被搁置了。

设计的时候没有考虑开发的可实现性和实现成本，所以就觉得开发应该完全按照自己的设计稿做出来，做不出来就是不配合。

设计师爱说“你看大厂能写出来，你咋就写不出来呢”，这是极其自大且没有情商的一种表现。首先大厂的技术团队实力理论上是比小公司要强，我们应该正视这个事实；另外我们也要倾听技术同学的声音，他们也许是因为排期紧张而做不到呢，所以在批判别人之前要首先想想自己的问题，看到客观存在的问题，然后一起寻找更好的解决方案。

解决方案：

提前进行设计验收，最好是提前知道模块的开发者，这样后期一对一进行模块的打版验收效率更高；

设计时考虑开发成本和可实现性。

3、验收过程中：

1. 截图和设计稿作对比

验收的时候，我们需要把开发实现后的效果截图，然后再去和设计稿做对比。

我们可以直接把截图放在设计图上方，降低透明度，大致比对下，就知道哪里不太对，然后再具体标注需求修改地方的参数。

2. 不要只是告知技术错哪里了，而是直接告知技术更改的方案

比如说图片尺寸错了，有些设计师就直接标注出来说这里出错了，请参考设计标注重新调整。另一个设计师不仅标注哪里错了，还直接标出这个图片尺寸是多大。很明显技术看第二个设计师给的验收文档更改的效率更高。

作为设计师而言，我们每天都是跟像素打交道，间距、字号差个几像素，我们一眼就能看出来，但是作为每天跟代码打交道的开发来说，差了几像素在他们眼里是没区别的，觉得都一样。所以我们需要明确的告诉他这里移动几像素，那里字号改大几像素。

3. 分割线

在验收的时候要特别注意分割线的问题，分割线不管在几倍的机型下，都应该保持1px的线条高度，但是很多时候技术开发的时候并没有注意到这种适配方式，或者说设计师在开发前没有特别说明，程序员就写成了1pt。因为pt是1x下的单位，px是实际单位。结果就是在2倍机型下是显示2px，3倍机型下显示3px。这个问题很容易出现也很容易避免，就是将线条适配规则跟所有的技术同学周知一下即可。

所以在做分割线的是，单位需要是“px”，这样才能保证每个屏幕的分割线都是1像素。

4.行高的设置（个人经验）：

版式规范中，中文汉字1.5～2倍的行距是最为适合的。整体来说，字号越小，行间距应该相对越大，反之亦然。51号正文在之前探讨的（48～72）字号里偏小，这里适当增加行间距和段落间距可以优化阅读体验。

我的经验是：

单行行高=字高

多行行高按照1.5～2倍的行距去设置

5. 文字截断范围

当文字左右两边有内容的时候，我们需要标明文字可显示的范围，也就是说它最多能显示几个字。

6. 小屏适配问题

设计师普遍用的设计尺寸都是750（1x为375），一些板式排版也是基于这个尺寸的，那么对于640的手机来说，某些地方就会出现排不下的情况，这个时候是需要设计师在做设计稿的时候就考虑到这一点，并给出适配规则。在后期验收的时候也需要特别去注意这个问题。

有一个我总结的换算公式：

• 比如2倍图750尺寸下图标为24，那么：

安卓640：640=750=图标24

（安卓640和苹果750图标是一样大的；间距改一下）

安卓1080：720=750=图标24

（安卓1080/1.5=720后，和苹果750图标是一样大的；也相当于24图标*1.5=36就是安卓1080的大小。间距改一下）

苹果6P：414=375=图标24（间距改一下）

苹果1242：828=750=图标24

（苹果1242/1.5=828后，和苹果750图标是一样大的，也相当于24图标*1.5=36就是安卓1080的大小。间距改一下）

总结：

在安卓640和苹果750图标一样大；只是安卓页面窄，需要微调下间距。

在安卓1080和苹果1242上，750下的图标需要*1.5；因为页面宽窄不一样，需要调整下元素之间的间距。

7. 投影

投影最好少用为妙，首先是因为技术实现成本很高，其次即使写出来了跟你想要的样式偏差也会很大，需要不断的沟通调整，会花费很长的时间；再者多个投影卡片聚合在一起的时候，进行多机型适配，能把设计师和技术同学都折磨疯的。所以为了节省开发成本，呵护我们和开发同学友谊的小船，能少用尽量少用。或者全部统一。

8. Android加粗

Android的系统默认字体是思源，在系统默认的字体库里（我们的技术同学告知的）只有3个自重，细体、常规体、和超粗字体，导致的结果就是Android机型上的加粗字体会显得格外粗重。我们摸索出一个解决方案就是Android字体加粗的时候减少一个字号，这样页面才能显得平衡。

9. 通用样式进行组件化开发

通用模块样式进行组件化整理，比如Toast、对话框、错误提示等。协助技术进行组件化开发。

4、总结

在与开发的设计视觉验收的时候，我们将心比心，换位思考，把自己当做程序员，站在他们的角度去思考问题，因为对于他们来说1像素和2像素是没区别的，所以我们要考虑怎么样的验收方式会更方便开发修改，减少重复返工，宁愿验收标注的时候多花10分钟，也要把修改意见写详细，直接写改几个像素一步到位，不要写错在哪里，帮开发节省时间，也帮我们减少了二次验收的成本。

以上，仅仅是个人笔记！ 不代表所有公司！！

Powered by Froala Editor