想要一稿過不加班？Sketch絕配神器Mirror搶先體驗

@JingDesign?：設計師最苦逼的事情莫過于被折翼的天使指點江山，鑒于此，靜電選擇了離神靈比較近的雍和宮附近上班，以求得到保佑和庇護。香也上了，頭也磕了，可是效果如何呢？佛祖說，要有一顆虔誠的心，所以他賜予了我sketch；佛祖說，要有敬畏之心，于是Mirror來了，每天照照鏡子，看到里邊的自己，哇，超帥！瞬間工作動力UP有木有？ 言歸正傳，看看sketch的絕配，Mirror能給我們帶來什么驚喜！

這已經是靜電的Sketch教室的第五章了，各位做APP設計的小伙伴們，一定會有這樣的需求，就是將自己的設計稿導入到自己的手機中看效果。的確，顯示器顯示效果與手機顯示效果有本質的區別，分辨率與精度，物理尺寸都不一樣，所以只有在手機中，才能切切實實的感受到做APP感覺. 所以，靜電建議那些初學APP設計或者從網頁轉到APP設計的同學，一定要將設計稿在手機端查看，找感覺，感覺到了，以后就可以更方便來使用電腦來做APP設計稿了.

在移動設備上預覽設計稿的幾種方式

1.如果是安卓手機，那么使用數據線連接電腦，將設計稿拷貝到手機，再使用手機的圖片查看功能就可以看了。

2.iOS系統呢，稍微麻煩一點，需要你使用itunes將設計稿同步到手機，然后使用照片功能來查看。

3.還有稍微簡化一點的，我們可以使用現成的工具，在電腦和手機端同時登錄一個QQ賬號，使用QQ的傳文件到手機功能，即可查看設計稿了。

4.使用Psplay軟件。具體可以直接在手機的應用商店中搜索此軟件。安卓與iOS端都可以使用。

這個軟件超級方便！想要下載的同學右戳：《騰訊ISUX移動終端設計神器：Ps Play！移動設計零阻力》

這個時候，我們會遇到一個問題，通過以上的方法，不是不可以查看，只是這么預覽，大家不會感到特別麻煩嗎？當然，在我們使用photoshop進行設計的時候，有騰訊出品的預覽神器Ps play，但這個時候遇到一個最大的問題，就是sketch的文件不支持ps中直接預覽，我們需要在sketch中將設計稿導出為一般的圖片格式，比如png，jpg等，然后拖到photoshop中使用psplay預覽。這個過程也是稍顯繁瑣。靜電在沒有購買這款Mirror的時候，也是使用這種方式來預覽的。但是隨著設計稿越來越多，我實在受不了了。那個Mirror的圖標點了又點，今天，終于忍不住，打算入手這款付費軟件了。

Mirror的購買方法

我們打開sketch，大家看到工具欄右側的一個名為Mirror圖標了嗎？如下圖：

但這個功能是需要付費使用的，或者說，他就是一個付費的iOS應用而已. 所以，直接拿起iphone，打開APPstore， 搜索Sketch Mirror，交30RMB購買吧. 這個時候有同學可能會問，android端有mirror嗎？靜電特地去官網看了一下，很抱歉，木有，官網的Q&A中，作者明確表示他們沒有興趣開發安卓版本，那么使用安卓手機的朋友還是暫時使用Ps play吧。

使用Mirror的環境需求

以下兩種環境均可使用mirror，大家視自己的設備情況，自選一種即可。

1.使用wifi環境

mirror的使用環境很簡單，我們必須要保證運行sketch的電腦和運行Mirror的移動設備處于同一個網絡環境下。比如你使用自己的路由器上網，那么pc和mirror保持在一個局域網內即可。如果在公司使用，因為網絡環境稍顯復雜，如果實在無法確保在一個網段中，靜電建議大家購買一個小型的路由器，建立一個簡單的無線網絡，這樣即可保證運行mirror的環境了。

2.使用數據線，將手機連接電腦

如果沒有wifi環境，使用usb數據線將手機連接在電腦上也是可以的，但靜電在測試中發現這種連接方式貌似不太穩定，有時候是沒法預覽的。所以還是推薦第一種方式連接。如果連接有問題，可以和靜電聯系，微信jingdesign91。

Mirror使用步驟

使用上面的方式設置好后，我們就可以使用mirror直接預覽sketch中的設計稿了。

1.手機端，打開mirror，此時顯示的是一幅靜止畫面，告訴你要在sketch中進行操作才能查看文檔。這個時候手機端是無法進行任何操作的。

2.接著我們在電腦上使用sketch打開已經設計好的文件。如果一切正常，那么我們會發現，sketch界面mirror圖標的變化。mirror字樣變為connect。我們點擊connect，sketch中打開的設計稿即可在手機的mirror中顯示了。此時connect字樣變為disconnect，點擊disconnect，將中斷連接。

3.連接后如圖所示，文檔中的一個artboard將會出現在手機上。

4.此時，如果我們想切換page或者artboard，則要通過手機來操作，如下圖。這一點換個Ps play的所見即所得功能不太一樣。點擊下面界面的左下角或者右下角即可切換page或者artboard，左右滑動可以切換artboard，非常方便。靜電這里要贊一下mirror，文件切換速度非常快，相比Ps play的速度，mirror的速度明顯優于Ps play。

Mirror與PSplay對比

至此，mirror就演示完畢了。對比Ps play，這兩款預覽工具可以說是各有優劣。但畢竟mirror是sketch自帶的預覽工具，兼容性和執行效率都高于psplay。但是，Ps play仍然有著自己的獨特之處。

1.mirror可以有效提升我們使用sketch來設計app界面的效率

2.相對于psplay，預覽效率高。

3.左右滑動即可切換artboard。

4.缺點：無法設置預覽密碼，保密性差。另外，同一網絡中如有多臺電腦運行sketch，不知如何進行判定以便選擇預覽的目標pc。

5.無法進行設計稿在手機端的保存。

6.無法運行于安卓設備。

總之，mirror作為與sketch密切結合的軟件，表現已經超出靜電的預期。mirror與sketch結合將大大提升設計師的效率。在這個效率高于一切的時代，你還在等什么，說不定，我們焦急等待的幾秒鐘內，無數靈感已從大腦中飛逝而過，所以30元人民幣還是物超所值的，馬上去APP store下載吧。

mirror下載地址：https://itunes.apple.com/cn/app/sketch-mirror/id677296955?mt=8

關注我的微信：jingdesign91

Sketch設計教室系列好文：

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

從零開始學Sketch教程合集！
《SKETCH設計教室！從零開始學APP設計利器SKETCH（一）》
《SKETCH設計教室！從零開始學APP設計利器SKETCH（二）》
《SKETCH設計教室！帶你了解超好用的SKETCH插件》

原文地址：bbs.guimobile
作者：@JingDesign
uisdc.com"是國內人氣最高的網頁設計師學習平臺，專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書：史上最全的設計師圖書導航：http://hao.uisdc.com/book/。
設計微博：擁有粉絲量77萬的人氣微博@優秀網頁設計 ，歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航：全球頂尖設計網站推薦，設計師必備導航：http://hao.uisdc.com
———————————————————–
想在手機上、被窩里獲取設計教程、經驗分享和各種意想不到的"福利"嗎？
添加 優秀網頁設計 微信號：【youshege】優設哥的全拼
您也可以通過掃描下方二維碼快速添加：