墨刀插件

墨刀插件是一款支持sketch的原型制作插件，這款插件基本可以滿足設(shè)計(jì)師在制作原型，團(tuán)隊(duì)協(xié)同，標(biāo)注，資源交付方面的所有功能。這款插件支持云端保存，實(shí)時(shí)預(yù)覽，一鍵分享，及多人協(xié)作功能，讓產(chǎn)品團(tuán)隊(duì)快速高效地完成產(chǎn)品原型和交互設(shè)計(jì)。

插件介紹：

Sketch是設(shè)計(jì)師用來制作高保真設(shè)計(jì)稿的軟件，目前只支持Mac系統(tǒng)。

墨刀的Sketch插件，可以將Sketch設(shè)計(jì)稿導(dǎo)入到墨刀中，制作交互效果，查看標(biāo)注信息，下載多倍率切圖。

如果你是產(chǎn)品經(jīng)理，使用協(xié)作功能將設(shè)計(jì)師邀請進(jìn)入「我的團(tuán)隊(duì)」中，設(shè)置其為「協(xié)作者」。設(shè)計(jì)師使用插件將設(shè)計(jì)稿傳入指定應(yīng)用中，產(chǎn)品經(jīng)理或交互設(shè)計(jì)師即可快速進(jìn)行交互設(shè)計(jì)，產(chǎn)出高保真 Demo。

如果你是設(shè)計(jì)師，直接創(chuàng)建墨刀帳號，將設(shè)計(jì)稿傳入墨刀中，快速進(jìn)行交互設(shè)計(jì)或者設(shè)計(jì)評審。通過打點(diǎn)討論來獲取一手評審記錄。

如果你是開發(fā)者，可以通過打開對應(yīng)的項(xiàng)目鏈接（分享鏈接），開啟「標(biāo)注模式」，獲取頁面元素的顏色、尺寸、坐標(biāo)、間距、樣式代碼等標(biāo)注信息，自助進(jìn)行px、pt、dp等單位換算，下載多倍率切圖等，加速開發(fā)。

墨刀 Sketch 插件是墨刀團(tuán)隊(duì)開發(fā)的免費(fèi)插件，不論你的墨刀帳號版本是免費(fèi)亦或付費(fèi)，都可以下載該 Sketch 插件供團(tuán)隊(duì)內(nèi)設(shè)計(jì)師們使用。

插件使用方法：

第一步：下載 MockingBot 插件，雙擊安裝后需要重啟 Sketch，重啟后重新登錄帳號插件才會(huì)生效。

第二步：選中某 Artboard 或 Layer 后，單擊 Export to MockingBot，打開插件彈窗。

第三步：輸入墨刀帳號，登錄后選擇想要上傳的「應(yīng)用名稱」或者「新建項(xiàng)目」，點(diǎn)擊上傳，完成設(shè)計(jì)稿導(dǎo)入。

第四步：打開「墨刀客戶端」或「墨刀網(wǎng)頁版」，登錄同一帳號，對所上傳的設(shè)計(jì)稿進(jìn)行交互設(shè)計(jì)、重新排序等操作。

第五步：也通過直接點(diǎn)擊「查看鏈接」，或者在項(xiàng)目中打開運(yùn)行頁，點(diǎn)擊「標(biāo)注」，查看詳細(xì)的標(biāo)注、切圖信息。

常見問題：

一、上傳的設(shè)計(jì)稿會(huì)以 Artboard 為單位在「墨刀工作區(qū)」創(chuàng)建不同頁面：

頁面順序目前以 Artboard 從左到右排列，新增頁面會(huì)處于應(yīng)用的頁面列表底部依次創(chuàng)建。

頁面名稱與 Artboard 命名一致，可在 Sketch 或 墨刀中修改頁面名稱

二、上傳更新版設(shè)計(jì)稿到原項(xiàng)目（已包含此 Artboard 的應(yīng)用），會(huì)自動(dòng)替換并覆蓋原有設(shè)計(jì)稿，設(shè)計(jì)稿上交互區(qū)域位置不變；反之，新設(shè)計(jì)稿會(huì)自動(dòng)創(chuàng)建頁面添加到工作區(qū)中。

三、為什么上傳到墨刀的設(shè)計(jì)稿是一張圖片？如何給圖片中的元素添加交互？

v2.3版本的插件上傳到墨刀的設(shè)計(jì)稿是一張圖片，但是能夠讀取到設(shè)計(jì)稿中所有的標(biāo)注信息，大家在標(biāo)注頁進(jìn)行查看即可。目前沒有做圖層分離的主要原因是，無法做到墨刀工作區(qū)的編輯修改與shetch文件保持同步。也就是說，如果導(dǎo)入到墨刀的設(shè)計(jì)稿做成分層的，那么對設(shè)計(jì)稿的元素進(jìn)行顏色、位置等修改，不會(huì)同步到sketch源文件中。那么當(dāng)你下一次在sketch中修改源文件再導(dǎo)入墨刀里時(shí)，就會(huì)覆蓋在墨刀中的修改，會(huì)給用戶造成一定的困擾。我們也在考慮如何與sketch打通接口，期待能夠同步文件信息。

但是，你也可以通過「鏈接區(qū)域」組件給圖片中的元素添加交互動(dòng)效，「鏈接區(qū)域」組件是一個(gè)熱區(qū)的概念，具體操作如下圖。