高效技能！如何对设计稿进行标注说明

从事互联网工作的同学们，平时或多或少都会有标注图片的需求。一般情况下，我们会用QQ截图进行标注。但对于图片数量、图片尺寸较大的项目，QQ截图并不能符合我们的要求。像产品原型、UI设计稿、广告图，往往文件较多，需要标注的除了箭头、文字之外，往往还要对设计稿添加尺寸、色值标注。在正式邮件中使用QQ截图进行标注也会显得不够专业。

我们需要高效、专业的设计稿标注方式。

在网上找到很多相关软件，诸如 PxCook、Dorado 等，各有优缺点。最终我选择了 Markman 马克鳗 搭配 Photoshop批处理 完成这个任务。

选择 Markman 马克鳗 的原因，主要因为它能够进行文字标注，箭头带 45° 倾角，在文字较多的情况下不容易重叠。而 PxCook 的标注线只能是垂直或水平的直线，Dorado 则不支持文字标注。

Markman 马克鳗 ￥60 一年，不过也可以免费使用，但部分功能不支持。 它可以直接打开 PSD 文件，当然 PNG、JPEG 文件的支持也不在话下。Markman 马克鳗 收费版还支持多次修改调整标记文件（会生成相应的标注文件）。马克鳗还有一些其他特点，比如设计稿自动刷新、支持 Retina@2x 图片标注、标注样式自定义等。

但在使用过程中发现一个问题，在给尺寸较小的图片（手机截图）进行标注时，不能把过多的标注信息放在图片内容中，否则会覆盖掉图片内容，能添加的标注信息区域也极其有限。这时候我们就要调整图片的画布大小。

如果这种小尺寸图片较多，我们需要对图片的画布进行批处理。前文提到使用 Photoshop批处理 完成尺寸调整。下面说一下具体的操作步骤：

1.Alt+F9 打开 Photoshop 的动作窗口，点击窗口下方的“创建新动作”按钮，在“新建动作”按钮中填写相关信息，并点击“记录”，这时候动作窗口下方的小红点变成红色，表示开始录制动作。

2.手动打开一张图片，Alt+Ctrl+C 打开画布大小调整窗口，调整定位和宽度完成画布大小调整。Ctrl+S保存图片，Ctrl+W关闭当前图片。然后点击动作窗口中的“停止播放/记录”按钮，动作录制就完成了。

3.最后，依次点击“文件 - 自动 - 批处理”，在打开的批处理窗口中进行如下操作。点击“确定”后，将自动批量进行文件画布调整。

稍等片刻，所有图片右侧将增加空白区域。这时候，再使用 Markman 马克鳗 在空白区域进行标注说明即可。

个人觉得，标注软件应该加入调整画布大小功能，但试过的几个软件都没有发现这一重要功能。如果你有找到比这更高效的方式，欢迎在评论中告知。

---