更高效的使用Sketch,效率提升200%
- 首先你要有一定的Sketch基礎(chǔ),基礎(chǔ)默認(rèn)的熱鍵這里都不會(huì)提到,此文為Sketch的進(jìn)階教程
- 只需要按照A,B兩個(gè)步驟配置好Sketch,然后把文中提到的熱鍵都用一遍,即可.
- 如果實(shí)際項(xiàng)目中忘了熱鍵,可以打開這篇文章對(duì)應(yīng)的參照
- 熱鍵屬于肌肉記憶,多用就記住了,不需要死記硬背.
A.首先安裝插件
由于以下許多功能都是插件附帶的,所以需要先安裝插件,這個(gè)插件包是我多個(gè)項(xiàng)目久經(jīng)考驗(yàn)的插件匯總:
https://pan.baidu.com/s/1pKT12yf 密碼:x5gv
把插件包解壓拷貝到Sketch的插件文件夾中,
如圖sketch的設(shè)置頁(yè)面,可以直接打開插件文件夾(齒輪下的Show Plugins Folder按鈕)

B.需要修改的Sketch熱鍵
由于Sketch許多功能都沒(méi)有設(shè)定默認(rèn)熱鍵,并且又都是常用功能,所以在此添加熱鍵設(shè)置,包括插件的也是一樣.
如圖,在系統(tǒng)設(shè)置中修改Sketch的熱鍵,只要把功能的名稱復(fù)制到應(yīng)用快捷鍵的列表中即可,如果不會(huì)修改熱鍵請(qǐng)百度,網(wǎng)上許多這類文章:
http://blog.csdn.net/rznice/article/details/47297335

下文標(biāo)記為(默認(rèn))前綴的不需要添加熱鍵,在此標(biāo)記出來(lái)只是為了大家方便上下文記憶
其中涉及到一些個(gè)人對(duì)鍵位的理解,如果不喜歡,一些常規(guī)鍵位可以不修改.
個(gè)人建議如果之前沒(méi)有修改過(guò)熱鍵的朋友,最好原封不動(dòng)的按照以下熱鍵方式修改:
Zoom Out : F1 放大, 滾輪太慢,組合鍵太遠(yuǎn),習(xí)慣它
Zoom In : F2 放小
ArtboardZoom - Zoom to selected Artboard : cmd+2 縮放到當(dāng)前畫板(插件),特別常用
Delete :** F3** 刪除, Delete太遠(yuǎn),習(xí)慣它
Close Path : F4 閉合路徑
Scissors : F5 剪切路徑, 繪制icon常用,但是系統(tǒng)沒(méi)有給它配熱鍵...
Reverse Order : F6 反向路徑, Sketch如果要從路徑另一頭繪制,只能用它,并且系統(tǒng)沒(méi)給熱鍵.
Space Vertically : F7 (插件)垂直排列,指定間隙(重要并不是默認(rèn)的垂直排列,是設(shè)定固定間隙的排列)
Space Horizontally : F8 (插件)水平排列,指定間隙
Flip Horizontal : F9 水平翻轉(zhuǎn)
Flip Vertical : F10 垂直翻轉(zhuǎn)
Mask with Selected Shape : cmd+F 把所選的文件打組蒙版,新出的功能,比之前的cmd+shift+M更好用的蒙版
Alpha Mask : cmd+option+T 變成透明蒙版, 很偶爾用得到
Outline Mask : cmd+control+T 變成路徑剪切(默認(rèn)) 很偶爾用得到
Resize Artboard to Fit : control+A 讓畫板剛好和內(nèi)容圖層一樣大
Flatten Selection to Bitmap : cmd+K 讓所選組變成位圖
Union : cmd+option+A 并集形狀, 常用
(默認(rèn))Subtract : cmd+option+S 差集形狀, 常用
Intersect : cmd+option+Z 交集形狀
(默認(rèn))Difference : cmd+option+X 或集形狀
Flatten : cmd+return 把路徑組變成單圖層路徑, 常用
Convert to Outlines : cmd+shift+return 把描邊變成路徑
Smaller : cmd+3 文字變小, 特別常用,養(yǎng)成用熱鍵修改字體大小的習(xí)慣,這樣可以精細(xì)的修改1pt的字體
Bigger : cmd+4 文字變大
Forward : cmd+] 圖層上移, 主要是為了和ps保持一樣
Backward : cmd+[ 圖層下移
Move To Front : cmd+shift+] 圖層移到最上層
Move To Back : cmd+shift+[ 圖層移到最下層
Android : cmd+shift+O 導(dǎo)出Android格式圖片(插件),比系統(tǒng)自帶的好用.這里注意,以750 or 720為單位的畫板才可以自動(dòng)適配.
(默認(rèn))Web : cmd+shift+W 導(dǎo)出Web格式的圖片
(默認(rèn))iOS : cmd+shift+I 導(dǎo)出iOS格式的圖片,畫板尺寸同上
Scale... : cmd+T 保持描邊比例縮放
Paste Style : cmd+B 粘貼樣式, 特別常用
Triangle : cmd+I 三角形工具
Round to Pixel : cmd+U 讓所選的所有圖層對(duì)齊像素
Collapse Artboards and Groups : cmd+option+G 圖層列表文件夾合并顯示
Show Smart Guides : cmd+shift+C 切換顯示智能參考線,繪制細(xì)膩的icon的時(shí)候最好隱藏參考線,方便繪制
Place Bitmap as Layer Fill... : cmd+control+O 給一個(gè)圖層添加位圖填充(智能鏈接,配合PS做復(fù)雜圖形)(插件)
(默認(rèn))Update All Bitmaps : cmd+control+U 刷新智能圖層填充(插件)
Select Group Layers : cmd+option+F 選擇子圖層(插件)
一些其他常用到的默認(rèn)的熱鍵,包括Sketch默認(rèn)的和插件默認(rèn)的
Replace Layer : cmd+option+R 把剪切板的圖層替換當(dāng)前選中的圖層(插件),特別常用
Pick Color : control+C 吸取填充色/只有描邊時(shí)吸取描邊色,系統(tǒng)自帶
Pick Border Color : control+shift+C 吸取描邊(插件)
Fit Artboard Height : control+shift+A 把畫板變成內(nèi)容一樣高,繪制特別長(zhǎng)的列表效果圖時(shí)用得到
Duplicate Artboard : cmd+shift+D 水平復(fù)制當(dāng)前畫板(插件)
Rearrange Artboards Into Grid : cmd+option+control+R 自動(dòng)排列畫板(插件)
Prefix Artboard names With Numbers : cmd+option+control+N 自動(dòng)給畫板加編號(hào)(插件)
Export as zipFile : cmd+shift+M (神器,節(jié)約一頓飯的功夫)導(dǎo)出自動(dòng)標(biāo)注, (marketch插件),在畫板名前加"-"前綴,可以阻止導(dǎo)出該畫板
寫在最后
不要妄想一個(gè)軟件解決所有問(wèn)題(包括Photoshop),Sketch不能完全代替Photoshop,但是的確可以提高一個(gè)數(shù)量級(jí)的效率,個(gè)人推薦的使用方式為:
1.Sketch繪制大部分UI
2.復(fù)雜圖形還是由PS繪制,輸出Png到Sketch做"組裝"
3.Sketch同時(shí)作為最終切圖/標(biāo)注/效果圖輸出
4.Sketch方便配合其他原型工具做動(dòng)效高保真原型