设计师都爱用的UI标注软件有哪些？

thomas2

UI标注软件现在是设计师（UI、PM、前端等）必备的一款软件。设计稿是UI设计师日常工作中的产出物之一，当然，做出了高保真设计稿并不意味着你的工作结束了，因为你还得与下游的开发工程师进行对接。

我们经常听到UI设计师抱怨说，做完设计稿后满满的成就感被开发的同学给打击的稀碎，为什么和开发沟通这么累？我们也经常会听到崩溃在边缘的开发对UI设计师说：“你这个图标的尺寸是多少呢？”，“这两个控件之间的间距是多少”，“这里的切图呢”？......归根结底，是你给了开发不规范的标注图和切图。

传统的设计稿标注会让人感到窒息，为什么这么说？先来一张UI设计稿标注图感受一下：

如果你是开发，看到这样的UI设计稿标注会怎样呢？有没有一种让人欲哭无泪的感觉？一张设计稿，UI标注密密麻麻，虽然都有清晰的箭头指示，但是其呈现出来的视觉逻辑并不符合开发逻辑。工程师在搭建一个页面的时候，会先去架构布局，一块内容一块内容的划分好，接着填充内容，最后来修改视觉的样式。一句话总结一下，这样的UI标注，极大的加剧了UI设计师和前端人员的撕逼大战。

好了，问题有了，那么我们该如何有效避免呢？哈哈，小本本准备起，小编要放大招了。接下来给大家推荐几款90%的设计师都在用的智能UI标注软件，切实做到告别手工，告别低效，告别口水战。

摹客iDoc

摹客iDoc是一款更快更简单的UI标注软件，确切的说，是一款产品协作设计平台，支持智能标注、一键切图、多样批注、交互原型、全貌画板、团队管理，真正做到从产品到开发，只要一个文档。

特色功能点：

• 支持上传Sketch、PS、XD的设计原稿
• 标注和切图自动生成，不再用手工
• 设计规范自动采样生成
• 支持多种的原型（Axure、Justinmind、Mockplus）和各类文档，直接在线预览
• 轻松查看智能标注，还可显示百分比标注
• 自动获取切图，一键下载
• 一键查看页面中的重复元素
• 样式代码自动导出
  

官网地址：https://idoc.mockplus.cn

Sketch Measure

Sketch Measure是一款好用的Sketch UI标注插件。

特色功能点：

支持区域、尺寸、间隔、属性、备注标注；设置切图，颜色命名，导出规范等；

官网地址：http://utom.design/measure/

Zeplin

一款由四名在伊斯坦布尔的开发者制作的团队协作工具。其核心功能为UI标注、样式规范、备注文档。

特色功能点：

• 支持自动标注，切图
• 设计规范自动采样生成
• 支持上传Sketch、PS、XD、Figma的设计原稿
• 自动生产样式代码
  

官网地址：https://zeplin.io/

Marvelapp

总部在英国伦敦，旗下有多款与设计相关的产品。

特色功能点：

• 支持自动标注，切图
• 及时同步信息
• 支持导出CSS, Swift and Android XML
• 支持上传Sketch、Marvel的设计原稿
  

官网地址：https://marvelapp.com/features/handoff

小结

市场上UI标注软件还有很多，选择一款好用的协作工具可以极大的提高团队工作效率，在这里给大家强烈推荐一下国产摹客iDoc，是否真的好用，用过才知道！

相关推荐：

让UI设计师崩溃的瞬间，你经历过哪些？

那些年，UI设计师还在手工标注和切图时走的弯路