朋友公司去年换了个设计外包，稿子验收挺满意，结款了。前端开发打开文件傻眼：没有标注，间距靠量，颜色靠吸管，图标是合在页面里的没法单独导出。开发多耗了一周，还原度还打折，最冤的是钱付了、时间拖了，效果还不如便宜的。网站设计的交付物如果只有效果图，这个项目等于只做了一半。
标注要看得到细节
正规交付里，每个页面能查到：区块间距、字号行高、颜色色值、圆角数值。现在多用在线设计协作工具，开发直接点选元素看数据，比早年截图标注方便得多。验收时抽三个页面让前端开发者念一遍数据，能流畅念出来的交付才合格。有客户吃过亏后养成了习惯——设计稿评审让前端一起参加，很多实现不了的效果当场就拦下了。
切图和字体规范不能少
图标要给SVG格式，一个一个能独立使用；位图给二倍和三倍版本，适配高清屏。Logo给横竖两个版本加透明底的。字体规范页要写清标题、正文、按钮各用什么字体、什么字号、什么场景用，别让开发猜，交互稿里注明页面跳转关系，开发不用猜按钮通向哪。图片素材给原图而不是从效果稿里抠出来的压缩图，这点结款前务必确认，多语言版本的Logo位置提前预留，别上线后挤不下。
交互说明最常被漏掉
- 悬停状态：按钮和卡片鼠标移上去变成什么样，稿子里得有对应帧
- 点击反馈和加载状态：表单提交后按钮是转圈还是变灰，要交代
- 移动端适配：同样的模块在手机上怎么折叠、轮播怎么变成滑动，写清楚
- 报错和空状态：搜索无结果、列表没数据时页面显示什么，提前画好
交接会别省
设计、前端、后端坐下来过一遍稿子的交接会，半小时能省后面几天的扯皮。会上过三件事：哪些效果实现成本高、哪些交互没写清楚、哪些切图有缺。有团队养成了习惯，交接会上前端当场把有疑问的地方全列出来，设计当场补，上线前的返工清单基本清零。
两条建议：把网站设计的交付清单写进合同附件，验收对着清单打勾，交互说明单独立一项逐条过，缺一项缓结一部分款；下一项目开始前让比格网络这样的服务方先出一份交付物示例，比口头约定管用。效果图好看只是及格线，交付完整才是专业。
