先尽快介绍本文讲什么?对谁有用?有什么用?给读者节省时间

背景:设计师用 Windows 系统,交付设计作品给程序员时,工作流程有改进空间。

本文讲什么?我找了哪些软件来解决问题,最终结论是什么
对谁有用?设计师。想找工具来提升“设计交付”效率的设计师。
有什么用?省时间。你看我找过什么工具,工具名是什么,使用感受是什么,这样你就不用自己花n个小时找一遍了。

重要的事情讲三遍:Windows,Windows,Windows。

先介绍下背景

因资金原因只能给设计师配 Windows 电脑来使用。
(5000元左右的普通配置台式机,鼠标键盘机箱加24寸显示器)
(先别笑,缺钱是很正常的好么……,有钱当然是买 Macbook Pro 或者 27寸的 iMac)

目前的设计师工作流如下:

  1. 设计师自行选择 PS 或者 AI 完成工作(比如现在要设计微信小程序里的某个新功能)
  2. 切图,导出多张 .jpg/.png 图片,打包成压缩包 .zip 或者 .rar 格式。
  3. 微信把压缩包发给程序员

目前的痛点如下:

  1. (设计师)让设计师切图,导出图片,用聊天软件发送最终文件,浪费了设计师的时间。
  2. (程序员)一天收到几个或者几十个压缩包,管理这些文件很糟心,特别是压缩包和解压后的文件名乱七八糟就更烦了。
  3. (设计师)为了省事没有让设计师做标注,如果要标颜色,大小,距离,就更花费设计师时间了
  4. (其他人员)需要什么文件(比如 Logo)要打扰设计师才能拿到

说明

以上问题在设计界当然不是什么全新的问题,是很早就出现的问题。
所以肯定有相对成熟的解决方案了。
接下来要做的是调查别人是怎么解决的,用了什么工具。

条件限制是必须在 Windows 系统下能用。
所以 Sketch 等 Mac 设计工具不考虑,大大限制了选择范围。

目标

希望找一个软件,
这个软件可以在 (PS)Adobe Photoshop / (AI)Adobe Illustrator / Adobe XD 中使用。
(或者其他使用方式,但重点是方便)

一键上传设计到平台。
其他人(程序员等)需要时就打开网站拿,
要切图导出就导出,
要 @1x就@1x,要@2x就@2x。
要看组件之间的距离就直接看,
要颜色就直接看,
最好有 CSS 可以直接复制黏贴。

再次强调:这篇文章不讲的是

  1. (协作)设计协作, Design collaboration。比如在设计图上画框或画箭头然后写评论。
  2. (原型)原型设计, Low fidelity, High fidelity,不讲 Justinmind 等工具
  3. (动画)交互动画, Animation。不讲 Flinto
  4. (版本)版本管理, Version control。不讲 Abstract, Plant, Kactus

以上内容本文没有

结论

先讲结论,过程放到后面
(结论待补充)

值得一试的工具如下:

  1. Avocode(付费)
    优点:支持 Windows 平台。有 PS+AI 插件。
    缺点:只有14天试用。试用期过后最便宜是16美刀一个月。换算过来是108元人民币一个月。
    av

  2. MockPlus
    理由:支持 PS,是个 Adobe Photoshop Plugin。
    mock-plus-ps
    注意他们有 iDoc 和 RP 2个产品。一个是原型一个是设计协作,不要搞混了。
    Mockplus
    是个国内公司,位于成都,中文官网是 https://www.mockplus.cn/

过程(试过什么工具,感受怎样)

备注:实际看过的工具数量,比下面列出来的多,
但有些工具没列因为类型不对,完全不沾边。
(比如打开 tower 一看,原来这是个团队协作软件,和设计完全没有关系)
(其他的一打开:噢原来是个画流程图的工具,是画原型的工具,是专门做海报的工具,还有的工具官网都挂掉了,产品失败关掉了)

工具1:话画

不用,理由如下:
国内产品,首页没有价格(所以是免费)
官网和其他厂商一对比,看起来很一般,5/10。
让人感觉 1.技术不行。 2.小团队会不会倒闭

而且官网用了那个很常见的 stock photo。
我反正第一眼就想吐,因为看太多次看厌了。
感觉设计者不用心,
不知道放个什么图好,随便拿个看得过去的图糊弄完事。
官网截图如下:
walkeam

工具2:RapidUI

原本还打算试用,结果看到2019年3月份要关掉的通知。(本文写于2019年2月23号)
rapidui
原因不明,反正是要关掉然后加入 Wix,看如下截图:
rapidui-close

前面写了2个工具,后面懒得一个个写了,一次性来个列表

待进一步尝试

  • zeplin
  • figma
  • invision
  • 蓝湖
    国内产品,有中英文官网。完全免费。
  • pxcook
    支持 Windows, 需要 Adobe Air。完全免费。

贴一些有用的文章

少数派:会说话的截图?高效截图标注和设计协作工具:TeamPaper Snap

好用的标注切图工具

  • MarkMan
  • Pxcook
  • Assistor PS
  • Markly
  • INK

结论,结论,结论

  1. Avocode
  2. MockPlus

本文写于 2019-2-23

目前看来 Windows 下选择不多。
等有空了再来补这篇文章。