免费2款标注工具实操(内含下载链接)
作为一个称职的设计师,在开发APP、官网、小程序、公众号等项目时,在设计稿上做好标记和备注,极大地减少与开发人员的沟通障碍,直接甩标注图,快准狠!
PS:在这里简单介绍下自己用过的2款标注工具,当然网上也很多资源,但现在绝大部分工具或插件都要收费,下面会告诉你各大工具的操作方法以及免费的下载链接,同为设计师不容易啊!
百度网盘安装链接:https://pan.baidu.com/s/1i49NgDv 密码:6pkb
安装前必须先下载Adobe AIR:https://get.adobe.com/cn/air/
1.MarkMan 马克鳗
目前是我使用最多的标注工具,界面简洁,操作方便,适用范围广。体验版一些基础功能都能实现,当然想要了解高级功能,也可以在官网中订购正式版,¥60/年。马克鳗可直接打开PSD源文件和JPG、PNG等图片格式,同时具有自动刷新功能。
1.1功能介绍
- 长度标记
- 坐标和矩形标记
- 色值标记
- 文字标记
1.2操作方法
打开软件,单击选择图片,也可通过左下角按钮重新选择文件。如下图:
常用到的快捷键—— 放大缩小:Ctrl+鼠标滚轮
a.长度标注:
b.坐标和矩形标记:
c.色值标记:
d.文字标记
关键一步:保存。自动添加_spec后缀,不用管它,直接保存。
2.Pxcook 像素大厨
相比于马克鳗的简洁,像素大厨多了一个对PSD源文件切图功能,可以快速切图。(其实切图也可以选择ps插件,这就是为什么很少用Px cook的原因)
功能更齐全,增加特色功能:智能标注、px和pt单位转换、切Retina双尺寸图、手动更改标注数值、多画板支持等。而且拥有设计和开发2个模式,自动生成前端代码,更方便设计师与开发人员的对接。
2.1功能介绍
- 距离标注
- 区域标注
- 颜色标注
- 文字标注
- 坐标点标注
2.2操作方式
打开后提示注册登录,登陆后新建项目,区分项目类型(iOS、Android和Web),导入文件。基本操作思路和马克鳗一样,懒惰的时候还可以直接选择智能标注,随意拖动就能标注尺寸啦!具体操作就不一步步展示了,里面设有教程,不懂的可以先观看操作流程。
快捷键:放大缩小:Alt+鼠标滚轮
同时可以查看开发模式的前端代码,如下图:
关于标注的工具还有很多,包括Assistor PS、Parker和Markly等,但由于很多是收费的我没用过,就不在这一一说明啦!每个人使用习惯不一样,只要能快速标注,就可以啦。不管黑猫白猫,抓到老鼠就是好猫!