編者按：選擇使用Sketch的理由很多，因為好奇跟風(fēng)安裝的同學(xué)應(yīng)該不在少數(shù)，看了介紹覺得功能強大而安裝的應(yīng)該也不少。當(dāng)然，如果你是一名UI/網(wǎng)頁設(shè)計師，你的Mac和我一樣感覺跑PS不堪重負，那么Sketch絕對能幫你排憂解難，從此告別卡頓和無所不在的進度條。

越來越多的設(shè)計師開始選擇使用Sketch 設(shè)計網(wǎng)頁、UI了，開發(fā)團隊 Bohemian Coding 居功至偉。雖然這個還在不斷迭代的軟件還有不少Bug，并且在功能上尚未完全替代PS，但是已然可以逐漸降低使用PS這款臃腫軟件的頻率了。如果你想知道你是否適合使用Sketch，可以看看兩大軟件的對比：《巔峰對決！新晉神器SKETCH VS. 經(jīng)典老炮PHOTOSHOP》。

上手新軟件，許多功能都不太就手，設(shè)計一個界面可能會比在PS上耗費更多的時間。所以，掌控一些實用的小技巧就非常重要了。哪怕你是Sketch新手，下面的10個小技巧也能幫你節(jié)省不少時間。

1、為畫板選擇合理尺寸

好吧好吧，看起來這并不是太高端的技巧，但是在Sketch中，畫板的設(shè)定非常實用也非常易用。Sketch 中提供了非常多預(yù)設(shè)的畫板尺寸（要不怎么說它是UI設(shè)計神器呢？這個軟件就是為UI設(shè)計而生的啊！），你只需要點擊A按鍵，就可以選擇你需要的畫板了！

2、搞定柵格

借助柵格系統(tǒng)來設(shè)計UI和網(wǎng)頁是經(jīng)常用到的技巧，在Sketch中，你只需要選擇 View(視圖) -> Layout Settings (布局設(shè)置) 就可以快速配置布局，或者使用Ctrl+L 這個快捷鍵來調(diào)用默認的布局。

3、幾秒內(nèi)快速復(fù)制……任何東西！

這一功能在AI和PS中常常使用，Sketch的開發(fā)者將這一功能也完全實現(xiàn)在這一軟件中。你可以按住Option鍵，點擊要復(fù)制的元素拖動就可以。當(dāng)你將這一元素拖拽到你要的區(qū)域之后，然后使用Command+D的快捷鍵，就可以復(fù)制這一動作了。

注意：如果你發(fā)覺無法操作的話，可以去Preferences （偏好設(shè)置）-> Layers（圖層）中解鎖 pasted & duplicated objects （粘貼&復(fù)制 對象）這一選項。

4、距離測算

如果你想設(shè)計出精美的作品，那么一定要對所有的細節(jié)了如指掌。如果你想測量頁面上所有元素之間的距離，只需要選定元素，按住Option鍵就可以。接下來，就是屬于你自己的強迫癥時間了~

5、善用共享樣式，你會獲益匪淺的

如果你的這個項目有一百多個頁面，并且項目的評審已經(jīng)推進到第三輪了。眼看著終止日期要到了，奇葩甲方深夜打電話給你：“咱們把所有的按鈕都改成藍色的咋樣？”

好吧，先不要忙著掀桌子砸電話罵娘，你可以說“OK”的，因為你可以使用共享樣式來搞定這些按鈕。當(dāng)你在創(chuàng)建你這些UI元素的時候，對于那些要重復(fù)使用的樣式，你可以在左側(cè)菜單中點擊“No Shared Style”調(diào)出菜單，然后給這個樣式起一個難忘的名字，然后就可以運用到更多的UI中去了。

6、"濫用"符號（Symbols）

符號，也就是Symbols 是Sketch 中一個非常實用的功能，盡管看起來有點濫用的趨勢，但是它確實非常有用。

如果你設(shè)計的UI上有許多不同的狀態(tài)、模式或者選項，那么你可以將單個屏幕設(shè)定為一個“符號”，然后單擊工具欄中的 “轉(zhuǎn)化為符號（Convert to Symbol）按鈕”，再在畫板上復(fù)制這一“符號”，并且創(chuàng)建你所需要的不同狀態(tài)，唯一需要做的就是添加你設(shè)定的這個符號（Insert -> Symbol）。當(dāng)你改變這個符號中的元素的時候，所有的屏幕會同時跟著更新，絕對夠快捷。

7、繪制圖形時拖拽它們

這是一個超級實用的技巧。當(dāng)你在繪制圖形的時候，比如你要畫一個圓形，但是你很難一次畫好并放置在正確的位置。不過，如果你在繪制過程中按住空格按鍵，那么你就可以在創(chuàng)建好之后立刻移動它到對的位置，然后繼續(xù)調(diào)整尺寸。

8、飛速改變透明度

這一功能應(yīng)該也是來源于PS，盡管很多人并不太去使用它。當(dāng)你要調(diào)整一個元素的透明度的時候，不用去慢慢調(diào)節(jié)進度條，你只需要使用數(shù)字按鍵（1-0）來設(shè)定透明度，比如3就是30%透明度。

9、善用“比例（Scale）”功能

很多時候，你在創(chuàng)建的UI元素并不一定符合需求，大了或者小了都很正常。比如你設(shè)置了一個邊緣半徑20px、邊框4px的按鈕，如果你直接鼠標拖拽縮放，效果恐怕不會理想。如果你點擊“比例（Scale）”按鈕，這樣來調(diào)整，效果會好很多。

10、最大限度地利用你的工作空間

大家都扛著筆記本干活兒，但是幾乎所有的軟件在筆記本上顯示的時候，都感覺屏幕空間不夠，但又不是所有時候都正好有個屏幕在旁邊幫你輸出屏幕內(nèi)容，這個時候，就需要你善用屏幕空間了。如果你要隱藏左右兩邊的菜單欄，點擊Ctrl+Option+Cmd+3 組合鍵，如果要單獨隱藏左邊或者右邊，快捷鍵是Ctrl+Option+Cmd+1 和Ctrl+Option+Cmd+2 。

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

1. 《SKETCH設(shè)計教室！從零開始學(xué)APP設(shè)計利器SKETCH（一）》
2. 《SKETCH設(shè)計教室！從零開始學(xué)APP設(shè)計利器SKETCH（二）》
3. 《SKETCH設(shè)計教室！帶你了解超好用的SKETCH插件》
4. 《想要一稿過不加班？SKETCH絕配神器MIRROR搶先體驗》

原文地址：invisionapp
優(yōu)設(shè)譯者：@陳子木

「子木說」

說Sketch是為UI設(shè)計而生一點錯都沒有，不過上手之后你會發(fā)現(xiàn)它的許多功能壓根就是來自Adobe系的這堆軟件。反過來看，其實PS和AI從某種程度上來說“也是為UI設(shè)計而生”的，不過你得把其中某些功能單獨提出來再組合到一起來看。比如PS中的“圖層復(fù)合”功能，它可以幫你在同一文件中呈現(xiàn)不同的頁面，它主要用來記錄圖層的可見性、位置和外觀，雖然有一定局限性，但是拿來做UI設(shè)計倒是非常實用。詳細了解可以參考咱們之前發(fā)過的文章：《無憂改稿！四個不為人知的PHOTOSHOP高效操作秘籍（二）》

本文由優(yōu)設(shè)網(wǎng)原創(chuàng)翻譯，請尊重版權(quán)和譯者成果，轉(zhuǎn)摘請附上優(yōu)設(shè)鏈接，違者必究。謝謝各位編輯同仁配合。

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

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