Marketch
簡介
據(jù)說sketch沒有一個一鍵標注+一鍵切片的工具贴铜，所以一位未知的設計師涯塔？程序猿找爱？設計了一個一鍵導出工具作煌，它可以實現(xiàn)以下幾個功能：
- 動態(tài)標注
- 單位轉換
- 動態(tài)切圖
顯示效果如下：
一位設計??的模板
Marketch,它可以幫設計師減負掘殴，免去標注的煩惱，程序可以通過內置的頁面查看所有要素的布局參數(shù)最疆，甚至是css代碼杯巨；反觀雖然Assistor Ps已經(jīng)免費蚤告，但是那是PS的玩意努酸，而且是有工作量的，優(yōu)點就是StoryBoard看起來更高大上杜恰；
設想下有了這個我們其實可以做很多获诈，可以生成html動畫，可以根據(jù)位置參數(shù)動態(tài)生成REACT模式的全部UI代碼心褐，對舔涎！目的就是把工作量都推給設計，然后我們前端程序就可以開開心心的寫幾段REDUX（業(yè)務流）,封裝業(yè)務組件逗爹，做些高端的事情亡嫌，剩下的就等后端的服務就好了。
</br>
</br>
用法
官網(wǎng)并沒有一個詳細的使用說明掘而，比如說怎么導出SVG挟冠，如何過濾StoryBoard，如何設置要導出的切片等等袍睡；
閒來無事知染，閱讀了一下源碼，發(fā)現(xiàn)該軟件的規(guī)範用法如下斑胜，隊列要整齊控淡。
安裝
- 然后下載嫌吠、安裝
<pre>安裝就是點擊文件夾下面的黃鉆石圖標即可</pre> -
查看是否安裝成功
安裝插件成功
使用
- 運行插件plugin->marketch
- 命名并導出
- 將zip解壓，運行html文件掺炭，在瀏覽器里查看效果
</br>
</br>
隱藏buff
- 導出切片
機智的截圖-01.png
這里slice可以隨意命名辫诅，最好放置在組內底層，這樣方便之后修改設計竹伸，放置在頂層不好選擇下方的內容泥栖。
---來自機智的射嘰師的友情提示
- 導出SVG格式
Paste_Image.png
- 切片不能包含文字，需轉換為路徑（包含會過濾掉）
Paste_Image.png
- '-'代表不導出該畫板
