通過(guò)上兩節(jié)的文章，大家可能已經(jīng)對(duì)sketch這款軟件的基本操作有了一個(gè)大概的了解。但很多朋友可能會(huì)有疑惑，”好像sketch的功能也沒(méi)有那么強(qiáng)大啊?””也就是個(gè)普通的矢量繪圖軟件吧?” 恩，你錯(cuò)了，因?yàn)槟愫雎缘袅艘患|西—插件。 插件是讓sketch保持強(qiáng)大的獨(dú)門(mén)絕技，很多軟件看起來(lái)不支持的功能，通過(guò)插件都可以實(shí)現(xiàn)，大大提高工作效率。 下面，靜電來(lái)介紹下sketch常用的，受大家歡迎的插件。

一、安裝插件的方法

sketch有兩種插件安裝的方法，一種是傳統(tǒng)的安裝方式，另一種是通過(guò)一款叫sketch toolbox的小軟件來(lái)快捷安裝。

首先看第一種安裝方法，打開(kāi)sketch（這里以最新版本的sketch3 為例），然后選擇菜單 Plugins>Reveal Plugins Folder，即可打開(kāi)插件文件夾。 打開(kāi)后即可知道路徑，不用刻意去記這個(gè)路徑在哪里。

打開(kāi)后可以看到以一個(gè)個(gè)文件夾命名的，就是一個(gè)個(gè)的插件。以下就是靜電的電腦中安裝的插件。 目前sketch官網(wǎng)上零星分散著一些插件的壓縮包（相關(guān)鏈接：http://www.bohemiancoding.com/sketch/support/developer/） 我們可以通過(guò)下載相應(yīng)的壓縮包，并解壓到上述的Plugins下面，然后重啟sketch，如果成功，在plugins菜單就會(huì)出現(xiàn)相應(yīng)的選項(xiàng)。

或者，可以直接解壓文件夾，選擇里邊的以。sketchplugin結(jié)尾的文件，雙擊直接安裝，出現(xiàn)下面的提示，則安裝成功。

但是，使用這種方法安裝插件，需要一個(gè)個(gè)的找插件，非常麻煩。那么大家還記得靜電在第一節(jié)的sketch教程中給大家的兩個(gè)下載地址嗎？一個(gè)是sketch安裝文件，另一個(gè)就是關(guān)于插件的sketch toolbox。地址再貼一次給大家，沒(méi)有下的同學(xué)一定要裝哦（sketch toolbox下載地址：http://pan.baidu.com/s/1dD3VeUX），下載并安裝后即可使用。打開(kāi)sketch toolbox，大家會(huì)看到各種各樣的插件，如下圖：

只需簡(jiǎn)單點(diǎn)擊install按鈕，即可方便的安裝插件，再也不用費(fèi)時(shí)費(fèi)力的一個(gè)個(gè)的找了。

二、插件推薦

ok，這個(gè)時(shí)候大家可能會(huì)有選擇恐懼癥了，這么多插件，我要從何選起呢？ 別著急，靜電給大家推薦幾款最常用的。

順便推薦一下Photoshop的高效插件！《高效神器！21款強(qiáng)大實(shí)用的Photoshop擴(kuò)展插件》

推薦插件：Content Generator Sketch Plugin

做app設(shè)計(jì)的時(shí)候，我們可能會(huì)使用各種各樣的頭像來(lái)營(yíng)造真實(shí)效果。 但尋找頭像并做遮罩是一件非常耗時(shí)耗力的事情，但我們又不想把頭像做的千篇一律對(duì)吧？ 這個(gè)時(shí)候神器來(lái)了，快來(lái)下載這款 Content Generator Sketch Plugin吧。 只需選中你要填充頭像的圖形，他會(huì)幫你隨機(jī)選擇并填充合適的圖像。 看看效果吧。

這個(gè)插件比較大，大概80m左右，所以請(qǐng)多耐心的等待下載完成。 如果實(shí)在下載很慢，那么請(qǐng)使用這個(gè)網(wǎng)址使用迅雷直接下載，然后按照上文的方法解壓并拷貝到文件夾中：https://codeload.github.com

當(dāng)然隨機(jī)生成用戶名也是可以的。

還可以有隨機(jī)的大段文本生成。

恩，這樣的效果圖，豈不是比做一個(gè)元素然后不斷拷貝粘貼帥氣多了?畢竟，我們的效果圖要模擬最真實(shí)的效果不是嗎?

推薦插件：Sketch Measure

我們?cè)谧鐾暝O(shè)計(jì)稿后，需要告訴前端開(kāi)發(fā)工程師，圖片是多大尺寸，這段文本是多大字號(hào)，間距是多少。這個(gè)時(shí)候，sketch messure就派上用場(chǎng)了，相比傳統(tǒng)的標(biāo)注方式，在軟件內(nèi)標(biāo)注極大提高了我們的工作效率。我們只需選中兩個(gè)元素，然后選擇plugins菜單， 就可以標(biāo)注圖片尺寸，文字字號(hào)，間距等等等等，這一切不需要你自己一個(gè)個(gè)的打字上去哦，只需要告訴sketch你要標(biāo)注那些元素，要標(biāo)注什么，就可以一鍵搞定了。 效率極大提高，我們可以騰出更多的時(shí)間來(lái)更好的設(shè)計(jì)我們的作品了。

tips：要標(biāo)記，首先選擇要標(biāo)記的一個(gè)或者多個(gè)元素，然后選擇plugins里的標(biāo)注方式即可完成自動(dòng)標(biāo)注了。標(biāo)注完成的設(shè)計(jì)稿，直接輸出就可以給前端開(kāi)發(fā)工程師了。

另外要注意的一點(diǎn)，標(biāo)注的時(shí)候，一定要選對(duì)相應(yīng)的Design Resolution 。 安卓的按照安卓的解決方案標(biāo)注， ios的按ios的方式標(biāo)注。這樣才能確保你的設(shè)計(jì)稿被前端工程師正確的實(shí)現(xiàn)出來(lái)。靜電認(rèn)為，這個(gè)標(biāo)注非常方便，特別是標(biāo)注字體的時(shí)候，插件直接按照標(biāo)注解決方案換算出正確的字號(hào)，方便開(kāi)發(fā)工程師調(diào)用。對(duì)于ios和安卓的標(biāo)注，一般各自選擇一套即可。 比如ios選擇Retina，安卓可以選擇xxhdpi或者xhdpi。

推薦插件：icon stamper

icon stamper是一個(gè)可以一鍵生成iOS多種圖標(biāo)尺寸的插件。 你只需要做一個(gè)最大的圖標(biāo)，這個(gè)插件可以自動(dòng)幫你生成一整套各種尺寸的圖標(biāo)，然后可以一次導(dǎo)出。不用在ps中一個(gè)一個(gè)的設(shè)計(jì)啦。 來(lái)，讓我們看看這款插件如何使用。

首選，選擇菜單 File > New From Template > iOS App Icon

第二步，在名為iTunesArtwork@2x”的artboard中設(shè)計(jì)你的圖標(biāo)。 設(shè)計(jì)完成后，選中所有元素，按command+G組合成一個(gè)組，并選中這個(gè)組。

第三步，選擇 Plugins > icon-stamper > Icon Stamper 即可生成各種大小的圖標(biāo)了。

第四步，選擇File>Export，即可批量導(dǎo)出。

推薦插件：Rename it

對(duì)于app設(shè)計(jì)者來(lái)說(shuō)，我們通常需要切出不同尺寸的圖標(biāo)來(lái)適應(yīng)各種機(jī)型或者分辨率。這個(gè)時(shí)候，我們需要將某些參數(shù)體現(xiàn)的文件名或者圖層名稱(chēng)，方便我們非常快速的知道，這個(gè)圖層的屬性，比如長(zhǎng)寬高等等。 或者，我們需要批量將文件或者圖層進(jìn)行命名。 Renameit 插件可以輕松幫我們辦到。

目標(biāo):將圖中的三個(gè)形狀按照寬高來(lái)批量命名。

第一步，選擇要批量命名的元素。

第二步，選擇Plugins > Rename it ，在彈出的對(duì)話框中，設(shè)定命名規(guī)則。 這里要說(shuō)明的是， %N %W這些都是變量，會(huì)根據(jù)圖片的尺寸來(lái)自動(dòng)填充，我們需要的是設(shè)定這個(gè)規(guī)則即可， 接著我們輸入下面的參數(shù)（請(qǐng)自己填寫(xiě)文件后綴），然后確定。 這個(gè)時(shí)候圖層就會(huì)按我們要的規(guī)則明明。

圖層命名規(guī)則參數(shù):

- 輸入號(hào) “+” 和你想添加的文本即可在適當(dāng)?shù)奈恢锰砑庸潭ㄗ址ㄈ纾? button）

-? “%N” 將圖層名按順序加上數(shù)字后綴。“%n” 則是加上倒序的數(shù)字。（如：item %N）

- 保留并移動(dòng)原圖層名： 輸入新的圖層名時(shí)，使用 “*” 號(hào)代替原圖層名。（如：big * button）

- 添加圖層的長(zhǎng)度和寬度：輸入 “%w” 或者 “%h” 來(lái)添加圖層的長(zhǎng)和寬。（如：rectangle %w 或者 rectangle %w x %h）

推薦插件：Duplicator

使用這個(gè)插件，我們可以將一個(gè)元素有規(guī)律的復(fù)制并排列，并可以選擇復(fù)制次數(shù)及間距。 使用很簡(jiǎn)單，靜電就不截圖演示了。

推薦插件：Sketch Qrcode

生成矢量二維碼，直接在sketch中解決，不用再去找二維碼生成網(wǎng)站了。

ok，sketch強(qiáng)有力的左膀右臂已經(jīng)介紹完畢了。有了這些插件，我們可以更方便的進(jìn)行設(shè)計(jì)。 下一節(jié)，我們重點(diǎn)談?wù)剆ketch的鋼筆工具，畢竟，矢量軟件嘛，路徑什么的必須得及其熟練才行，小伙伴們，如果發(fā)現(xiàn)有其它好的插件，歡迎一起交流，也歡迎關(guān)注我的微信jingdesign91。 我們下期見(jiàn)。

Sketch設(shè)計(jì)教室系列好文！

附上貼心小技巧：
《UI設(shè)計(jì)師新寵！聊聊sketch那些方便好用的貼心功能》

從零開(kāi)始學(xué)Sketch教程合集！
《SKETCH設(shè)計(jì)教室！從零開(kāi)始學(xué)APP設(shè)計(jì)利器SKETCH（一）》
《SKETCH設(shè)計(jì)教室！從零開(kāi)始學(xué)APP設(shè)計(jì)利器SKETCH（二）》

原文地址：bbs.guimobile
作者：@JingDesign

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：2650232288@qq.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國(guó)內(nèi)人氣最高的網(wǎng)頁(yè)設(shè)計(jì)師學(xué)習(xí)平臺(tái)，專(zhuān)注分享網(wǎng)頁(yè)設(shè)計(jì)、無(wú)線端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書(shū)：史上最全的設(shè)計(jì)師圖書(shū)導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計(jì)微博：擁有粉絲量76萬(wàn)的人氣微博@優(yōu)秀網(wǎng)頁(yè)設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁(yè)設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com
———————————————————–
想在手機(jī)上、被窩里獲取設(shè)計(jì)教程、經(jīng)驗(yàn)分享和各種意想不到的"福利"嗎？
添加 優(yōu)秀網(wǎng)頁(yè)設(shè)計(jì) 微信號(hào)：【youshege】?jī)?yōu)設(shè)哥的全拼
您也可以通過(guò)掃描下方二維碼快速添加：