它是交互設(shè)計師專門用來統(tǒng)一設(shè)計規(guī)范，方便后期交接的一款非常強(qiáng)大的工具。上周的文章《》講解了如何下載和安裝該插件。這次，來自馬克筆設(shè)計留學(xué)的MUzi老師來給大家講解一下如何使用它。

要使用這個插件，首先需要打開它的工具欄，在工具欄--工具欄，快捷鍵是+shift+B。

所有的功能都集中在這個工具欄里，簡單、清晰。

區(qū)域

區(qū)域功能很簡單，當(dāng)需要標(biāo)記某個區(qū)域時，只需要選中一個或多個圖層然后點(diǎn)擊區(qū)域按鈕即可，快捷鍵是Ctrl+shift+1。

尺寸

size功能用于標(biāo)注某些圖層的寬度和高度，使用方法先在 中選擇一個或多個圖層，然后點(diǎn)擊工具欄上的size按鈕或者使用快捷鍵 + shift + 2。另外也可以按住alt鍵點(diǎn)擊size按鈕進(jìn)入設(shè)置框，設(shè)置標(biāo)注的位置和方式。

間隔

間距工具可以幫助你標(biāo)記任意圖層或畫板之間的距離。使用方法：先選中畫板上的一個或任意兩個圖層，然后點(diǎn)擊間距按鈕或者使用快捷鍵 + shift + 3。在這里可以設(shè)置間距的位置。按住 alt 鍵并點(diǎn)擊間距按鈕可以設(shè)置間距的位置，如頂部、底部、左側(cè)和右側(cè)間距。

標(biāo)簽屬性

該插件可以注釋圖層或文字圖層的一些信息，例如顏色、透明度、字體和大小等。使用方法是選中一個或多個圖層，然后點(diǎn)擊工具欄上的屬性按鈕或者使用快捷鍵 + shift + 4，也可以按住 alt 鍵點(diǎn)擊屬性按鈕來設(shè)置具體的注釋內(nèi)容。

設(shè)置切割

快速設(shè)置圖層導(dǎo)出選項的預(yù)設(shè)和規(guī)格，即可導(dǎo)出切片規(guī)格，如下圖即可導(dǎo)出資源

在中選擇一個或多個圖層

單擊工具欄上的“設(shè)置切割”按鈕或使用快捷鍵 ?+shift?+S 使用 alt+cut 按鈕創(chuàng)建切片涂層。

顏色命名

可以將顏色導(dǎo)出為XML文件，方便后端開發(fā)，可以大大提高軟件開發(fā)的效率。使用方法也很簡單，首先點(diǎn)擊工具欄上的顏色命名按鈕或者使用快捷鍵 +shift+C，然后點(diǎn)擊彈出的顏色管理對話框界面中的+號按鈕，雙擊顏色編輯名稱，編輯完成后選擇一個或多個圖層或者文字圖層即可。

規(guī)范導(dǎo)出

它能幫你一鍵自動生成包含你的原型的 HTML 頁面，并照顧到所有的細(xì)節(jié)數(shù)據(jù)和 CSS 樣式，并且可以離線查看，這對于交給開發(fā)人員來說是一個非常高效的功能。使用方法sketch標(biāo)注插件，先在工具欄中選中一些畫板sketch標(biāo)注插件，點(diǎn)擊工具欄上的標(biāo)準(zhǔn)導(dǎo)出按鈕或者使用快捷鍵 + shift + E 進(jìn)行導(dǎo)出。

最后三個是更簡單的函數(shù)：

顯示/隱藏注釋

鎖定/解鎖標(biāo)注

設(shè)置放大倍數(shù)和顏色格式

如有侵權(quán)請聯(lián)系刪除！