過去兩年一直用PS做的界面，今年開始慢慢轉(zhuǎn)用Sketch，期間查了不少資料，都沒有發(fā)現(xiàn)很全的，在這里給和我曾有同樣困惑的設(shè)計師總結(jié)一下經(jīng)驗哦，可能不太適合小白。
因為過去兩年一直用PS做的UI，今年才開始慢慢轉(zhuǎn)用Sketch，期間查了不少資料，都沒有發(fā)現(xiàn)很全的，所以在這里總結(jié)一下經(jīng)驗，希望能幫助到可能會和我同樣困惑的設(shè)計師們。由于我使用Sketch經(jīng)驗有限，所以本文所涉及的所有內(nèi)容僅以移動界面的制作為例來講述，Icon制作不包括在內(nèi)；因為我也不精通Sketch，文章內(nèi)如有錯誤和遺漏的，希望能幫幫忙提出來一起進(jìn)步哦；
一.Sketch的購買和下載
1.下載：sketch目前在appstore下架了，我是從官網(wǎng)下載的，下載試用版之后，在官網(wǎng)也可以直接購買，支持支付寶付款很方便。
官網(wǎng)地址：https://www.sketchapp.com/
2.教育優(yōu)惠：Sketch對于在校學(xué)校生老師的優(yōu)惠政策，通過申請之后購買時可以打5折，我買的時候打折后是￥359.57，超實惠。我用的是朋友的幾張帶學(xué)校印章的大學(xué)中英文成績單（文件絕對真實），信息都填的英文據(jù)說這樣通過率比較大，前一天12點提交的，第二天早上8點多就發(fā)郵件告訴我通過了，郵件上會附帶有優(yōu)惠碼，然后購買的時候輸入優(yōu)惠碼就可以，有人用的學(xué)生證貌似也可以。
官方教育優(yōu)惠在線申請地址：https://sketchapp.com/store/edu/
二.簡單介紹
1.簡介：Sketch應(yīng)該不需要太多的介紹，有空的話可以看一下中文手冊。
Sketch中文用戶手冊地址：
http://www.sketchcn.com/sketch-chinese-user-manual.html
2.漢化：因為我拿到就開始做項目了，所以比較著急，就直接用插件漢化了，目前還沒發(fā)現(xiàn)什么不穩(wěn)定，所以也沒必要去強迫自己用英文。sketch還有很多有用的插件，在這里就不做介紹了。
漢化插件地址，地址里有插件的使用說明：http://sketch.im/plugins/2
3.界面初識：值得一提的是Sketch的歡迎頁，亮點是在Templates里有關(guān)于iOS、Android 等Icon、UI的一些組件與規(guī)范十分有用。
3.進(jìn)入Sketch：如下圖，可以很清楚的看到Sketch的操作界面，左側(cè)是圖層列表，展示頁面-藝術(shù)板-圖層的情況，頂部是工具欄，右側(cè)是查看器，用于修改一些具體的屬性和樣式，Sketch的藝術(shù)板與AI里的畫板概念類似，畫布區(qū)域可以建立非常多個畫板，也可以像整理圖層一樣去整齊排列畫板。其他的和PS大同小異，就不做介紹了。
比較亮點的部分是，在新建畫板的時候，在界面右側(cè)可以選擇已有規(guī)格，比如iPhone7之類的，
如果電腦屏幕比較小影響操作空間的話，可以用快捷鍵隱藏這些部分，常用快捷鍵會在文末給出。
三.使用流程簡要說明
1.基本準(zhǔn)備：如下圖，在做項目的時候，我基本上是一個內(nèi)容模塊是一個Page，然后它的子頁都在這個Page的不同的藝術(shù)板里，這樣可以非常直觀的展示出頁面結(jié)構(gòu)和邏輯，不容易有遺漏，同時也方便復(fù)用一些公共部分；Sketch導(dǎo)出效果圖的時候可以直接以藝術(shù)板的名字命名圖片，所以藝術(shù)板的命名建議盡量規(guī)范一些，這樣導(dǎo)出之后整理圖片會非常方便；
2.常用操作：在Sketch中，新建形狀，文本等都和PS差不多，比較大的亮點是共享樣式，建立一個共享樣式，可以給多個部分使用，好處在于一旦修改也會是多個部分共同修改，能提高效率。共享樣式在形狀和文本樣式中都有。
還有一個就是文檔顏色，其實和PS的色板差不多，不過更直觀也操作更方便，只要吸取或者輸入自己想要的色值，點擊文檔顏色里的加號就能添加成功了。
3.實時預(yù)覽：Sketch Mirror，與Sketch搭配的iPhone預(yù)覽工具，在APP Store可下載，通過WIFI或者數(shù)據(jù)線獲得連接，連接上之后可以實時預(yù)覽自己的文件，超級爽。
這張是拍的不太好，但是還是能看到，我的手機和電腦畫面同步著，而且我有任何改動，只要刷新一下就能馬上看得到，告別以前做完圖發(fā)給手機預(yù)覽的心酸日子真的開心到飛起！
當(dāng)然了，還有一個更厲害的效率神器，馬上介紹！
三.組件
1.簡介：Sketch我目前認(rèn)為最最大的優(yōu)勢就是Symbols（即組件），主要用來整理一些頁面內(nèi)常用的公共部分，以便于復(fù)用和統(tǒng)一修改。如果有用過墨刀的話會知道，和里面組件的功能幾乎一樣，也有些類似于PPT的母版，但可操作性更強。
2.創(chuàng)建組件：要創(chuàng)建一個組件非常簡單，只需要選中你想要作為組件的圖層或組，點擊菜單欄這個紫色按鈕，或者直接右鍵選擇創(chuàng)建組件即可；
3.組件分組：如下圖是我目前創(chuàng)建的一些組件,X/Y的寫法是指同一個X的組件即默認(rèn)為同一個組的組件，在替換組件的時候方便找到；
4.組件覆蓋與替換：如下圖，標(biāo)題欄為一個組件，在插入組件之后，還可以對文字部分進(jìn)行修改，還可以對組件進(jìn)行選擇替換，非常的方便
其實組件除了能提高作圖效率之外，在style guide的編寫上都有很好的指導(dǎo)意義，在自己項目的組件整理和晚上的過程中，其實style guide基本上就完成了一半。
四.保存與導(dǎo)出
1.保存：保存文件與PS一樣，在這里介紹Sketch Cloud，即為云端，可以把文件上傳上去，可以設(shè)置密碼，發(fā)給同事共享什么的很方便；
Sketch Cloud地址：https://sketch.cloud/documents
2.導(dǎo)出：SKetch導(dǎo)出可以按倍數(shù)導(dǎo)出多組圖片，也可以自己設(shè)置默認(rèn)的切片規(guī)則，美中不足的是全部導(dǎo)出的時候不能按照Page來分成不同的文件夾存放，而是所有畫板的圖都在一個文件夾，目前找到的插件能實現(xiàn)這個功能但是不能改變圖片的倍數(shù)和格式。
五.快捷鍵
如下圖是我現(xiàn)階段常用的快捷鍵，要看比較全的可以看?https://sketchsortcuts.com??
六.總結(jié)
總體來說Sketch給我的感受就是快和爽，就像它宣傳的那樣，把最多的時間都留給思維。但也有美中不足的部分。比如沒有PS方便的fx，也不能直接復(fù)制fx，不能給組添加樣式，感覺超級遺憾。
當(dāng)然了，Sketch還有很多能提升效率的方法去等著我學(xué)習(xí)，期待下一次的分享！
第一次發(fā)文章，謝謝觀看！謝謝建議！
