Marketch
简介
据说sketch没有一个一键标注+一键切片的工具，所以一位未知的设计师？程序猿？设计了一个一键导出工具，它可以实现以下几个功能：
- 动态标注
- 单位转换
- 动态切图
显示效果如下：
一位设计🐵的模板
Marketch,它可以帮设计师减负，免去标注的烦恼，程序可以通过内置的页面查看所有要素的布局参数，甚至是css代码；反观虽然Assistor Ps已经免费，但是那是PS的玩意，而且是有工作量的，优点就是StoryBoard看起来更高大上；
设想下有了这个我们其实可以做很多，可以生成html动画，可以根据位置参数动态生成REACT模式的全部UI代码，对！目的就是把工作量都推给设计，然后我们前端程序就可以开开心心的写几段REDUX（业务流）,封装业务组件，做些高端的事情，剩下的就等后端的服务就好了。
</br>
</br>
用法
官网并没有一个详细的使用说明，比如说怎么导出SVG，如何过滤StoryBoard，如何设置要导出的切片等等；
閒來無事，閱讀了一下源碼，發現該軟件的規範用法如下，隊列要整齊。
安装
- 然后下载、安装
<pre>安装就是点击文件夹下面的黄钻石图标即可</pre> -
查看是否安装成功
安装插件成功
使用
- 运行插件plugin->marketch
- 命名并导出
- 将zip解压，运行html文件，在浏览器里查看效果
</br>
</br>
隐藏buff
- 导出切片
机智的截图-01.png
这里slice可以随意命名，最好放置在组内底层，这样方便之后修改设计，放置在顶层不好选择下方的内容。
---来自机智的射叽师的友情提示
- 导出SVG格式
Paste_Image.png
- 切片不能包含文字，需转换为路径（包含会过滤掉）
Paste_Image.png
- '-'代表不导出该画板
网友评论