草 稿

好用的标注切图工具

身为一个产品汪有时也需要做做图,如果在设计稿上做好了标记与备注,这样与开发合作的时候,会更加方便。当然,设计湿也是可以用的。这几个工具是比较推荐大家使用的,其中有收费的也有免费的,可以酌情选用。

 

P.S. 因为我只用过马克鳗和像素大厨,所以对这两个比较熟悉。后面的几个 PS 插件也是比较有名的,只是没有用过,了解不深,但是在设计师圈内口碑还是非常不错。

  1. MarkMan 马克鳗

    马克鳗我是最早从它们免费beta版开始用的,一直用来做设计稿的标注说明非常方便。现在这个工具已经做的非常不错了,已经开始走收费路线了为 ¥60 一年,不过也可以免费使用(部分功能不支持)。

    马克鳗支持直接打开 PSD 文件,当然 PNG、JPEG 文件的支持也不在话下,如果是收费版,马克鳗还支持多次修改调整标记文件(会生成相应的标注文件,请勿删除)。

     

    支持多种图片格式

    支持 PSD(需用最大兼容保存)、PNG、BMP、JPG 格式

    设计稿自动刷新

    在标注的过程中,如果设计稿在被修改和保存了,马克鳗会自动重新载入设计稿。让设计和标注同步进行。

    定制标记样式

    在标记和空白处,点右键,会出现定制样式的菜单,可以修改标注的:颜色、大小、色值格式等

    支持 Retina@2x 图

    对于文件名末尾是 @2x 的图,会自动缩小 50% 加载,以便测量出来的长度不会被 x2。

  2. 长度标注

  3. 坐标、矩形标注

  4. 颜色标注

  5. 文字说明标注

  6. Pxcook 像素大厨

    像素大厨师我目前使用的标注工具,为啥选择这个工具呢,就是因为这个工具除了标注功能外,还多了一个 PSD 文件切图,也就是传说中的一键切图功能。只需要你的 PSD 文件是按照官方提供的要求,就可以快速切图。

    除了常规的标注功能外,像素大厨还有一些有特色的地方,比如 px 和 dp 单位的切换,标注的长度数值可以手动修改(设计稿偷懒神器,慎用)等。同样的像素大厨也是支持多次修改标注文件和实时刷新功能。切图功能能够方便的切出 Retina 双尺寸,需要切出的图层或者图层文件夹只需要加上「.jpg」或者「.png」即可。

  7. 长度标注

  8. 矩形标注

  9. 颜色标注

  10. 文字说明标注

  11. 坐标点标注

  12. PSD 文件切片

  13. Assistor PS

    这个工具是 PS 插件了,而且是一个功能比较强大的标注插件,除了标注功能,还有参考线自动生成、单位换算、圆角生成等功能,算是集中了好几个插件于一身。它的最大的特色就是可以快速的自动标注。

    值得高兴的是,这款强大的插件虽然目前是收费,但是官方却说「Assistor PS license will be completely free for use after June 2015.」,以前貌似是听说有金主投钱给这个团队了,所以就不差钱了,感兴趣的可以先下载试用一下。

  14. 长度标注

  15. 矩形标注

  16. 颜色标注

  17. 文字标注

  18. 网格 Guild Maker

  19. 圆角生成

  20. 单位换算

  21. Tiler

    这个功能我没搞懂,还等高手解答。

  22. Markly

    这是一款国外的工具,目前收费 $39.99。价格挺贵,不过官方介绍的功能倒是非常强大,可以做到一键自动标注,同时标注好的数据可以随设计稿的变动自动调整。这款工具还支持 Sketch,但是只支持Photoshop CC 2014。

  23. 长度标注

  24. 颜色标注

  25. 字体样式标注

  26. INK

    这个工具是ps的插件,目前支持 PS CC 和 CS6,它算是一个设计元素的规范生成工具,不过也会对相应的元素进行标注说明。使用比较方便,直接一键生成元素的规范描述。

评论(1

不错的推荐。