不到10KB！Sketch超實(shí)用插件Magic Mirror幫你一鍵展示作品

@JingDesign?：如果說(shuō)Sketch是萬(wàn)能的你一定不信，不過(guò)今天這款Magic Mirror會(huì)讓你完美感受Sketch中智能對(duì)象的魅力，不到10KB的大小，一鍵完美展示設(shè)計(jì)作品，神器已打包微盤(pán)，來(lái)收！

Sketch的插件總是給我們無(wú)限驚喜，昨天晚上Sketch measure的插件作者Utom向我推薦了一款名為Magic Mirror的插件，那翻譯過(guò)來(lái)就是“魔鏡”。魔鏡魔鏡誰(shuí)是最好用的移動(dòng)端UI設(shè)計(jì)軟件呢？ 魔鏡：“主人，那必須是Sketch好么？”是的，今天為大家安利這款Magic Mirror，通過(guò)這個(gè)插件，我們可以輕松把自己的artboard中的界面變成如下的樣子。

這么炫酷的效果在Sketch中只需一分鐘即可搞定，小伙伴一定會(huì)問(wèn)，你是怎么在Sketch中做到的？別著急，很簡(jiǎn)單，首先我們先來(lái)下載這款Sketch Mirror的插件吧

如何下載和安裝：

插件下載地址位于本文末尾。下載解壓后，雙擊插件即可安裝成功。這里要注意一點(diǎn)，請(qǐng)不要使用Sketchtoolbox安裝這款插件，因?yàn)殪o電在安裝過(guò)程中始終無(wú)法正確使用此插件，因此推薦使用手工下載安裝的方法。

插件打包 微盤(pán)下載

插件使用方法：

1.在Sketch中準(zhǔn)備好一張你已經(jīng)設(shè)計(jì)好的Artboard界面。

2.另外準(zhǔn)備一張Sketch圖片，比如靜電準(zhǔn)備的這張。

3.將這張Sketch圖拖到Sketch中，請(qǐng)確保這張圖和你剛才準(zhǔn)備的設(shè)計(jì)稿不在一個(gè)artboard中。你可以將它拖動(dòng)到工作區(qū)的其他位置即可。

4.接下來(lái)在這張Sketch需要展示界面的位置使用鋼筆繪制不規(guī)則矩形（必須確保只有四個(gè)點(diǎn)，另外請(qǐng)不要使用圓角矩形工具，這將導(dǎo)致插件失效。）繪制后如下圖紅色區(qū)域。

5.接下來(lái)的這步很重要，選中這個(gè)紅色的圖形，將此圖層的名稱(chēng)命名為與你準(zhǔn)備好的artboard的命名一樣，比如靜電的命名為Sketch。則artboard的名字也需要為Sketch。

6.選中紅色的矩形，然后執(zhí)行菜單plugin>Magic Mirror>Magic Mirror！

7.見(jiàn)證奇跡的時(shí)刻到來(lái)了！怎么樣，足夠簡(jiǎn)單吧？

更重要的是，如果這時(shí)我更改了artboard中的設(shè)計(jì)稿，則只需再次執(zhí)行插件命令，則這張Sketch也會(huì)隨之變化，簡(jiǎn)直方便到爆有木有？

Magic Mirror插件菜單的其他功能

細(xì)心的同學(xué)還會(huì)發(fā)現(xiàn)插件菜單中的另外兩項(xiàng)功能，他們是：

1. Jump to artboard-選中Sketch中的圖形，可以迅速定位到它調(diào)用的artboard位置。
2. Rotate Points-有時(shí)候使用Magic Mirror會(huì)導(dǎo)致Sketch上下左右顛倒，這個(gè)時(shí)候就需要使用這個(gè)功能來(lái)調(diào)整方向。

接下來(lái)，讓我們看看官方網(wǎng)站的演示動(dòng)畫(huà)(gif)。

下圖演示的是如何使用Magic Mirror功能

下圖演示的是如何使用Rotate Points功能

下圖演示的是如何使用Jump to artboard功能

心動(dòng)了？就趕緊下載Magic Mirror插件吧。

另外感謝Sketch measure插件的作者utom友情推薦此款插件，大家也不要忘記支持Utom的Measure插件哈

第一手原創(chuàng)設(shè)計(jì)文章及內(nèi)容，盡在靜design公眾號(hào)（長(zhǎng)按二維碼關(guān)注）

Sketch教程合集持續(xù)更新中：

1. 《SKETCH設(shè)計(jì)教室！從零開(kāi)始學(xué)APP設(shè)計(jì)利器SKETCH（一）》
2. 《SKETCH設(shè)計(jì)教室！從零開(kāi)始學(xué)APP設(shè)計(jì)利器SKETCH（二）》
3. 《SKETCH設(shè)計(jì)教室！帶你了解超好用的SKETCH插件》
4. 《想要一稿過(guò)不加班？SKETCH絕配神器MIRROR搶先體驗(yàn)》
5. 《超實(shí)用！SKETCH大師最常用的3個(gè)實(shí)戰(zhàn)小技巧》
6. 《前端神器！為網(wǎng)頁(yè)設(shè)計(jì)而生的15個(gè)優(yōu)質(zhì)SKETCH插件》
7. 《SKETCH新手指南！10個(gè)幫你UI設(shè)計(jì)提速的SKETCH使用技巧》
8. 《超能陸戰(zhàn)隊(duì)！手把手教你用SKETCH繪制萌萌噠的大白》

作者：@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ì)微博：擁有粉絲量99萬(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ò)掃描下方二維碼快速添加：