新舊結(jié)合丑蛤，從頭了解 Sketch 3 ——? 快速復(fù)制排列
我們經(jīng)常會(huì)有這樣的需求叠聋，整齊的去重復(fù)排列某個(gè)按鈕或者圖標(biāo)。這里有兩個(gè)最快速的方法：
運(yùn)用 alt 鍵 和 cmd + D
使用網(wǎng)格工具
May
4
新舊結(jié)合受裹，從頭了解 Sketch 3 ——? 蒙版
Sketch 雖然是個(gè)矢量編輯工具碌补，但當(dāng)我們?cè)谠O(shè)計(jì)中使用圖片時(shí)虏束，Sketch也支持一些簡(jiǎn)單的位圖功能，蒙版便是最常用的之一厦章。
創(chuàng)建蒙版
三角镇匀、圓、多邊形袜啃，任何圖形都可以設(shè)置為蒙版汗侵，畫布上會(huì)只顯示出蒙版圖形之內(nèi)的內(nèi)容。
Alpha 蒙版
這是 Sketch 3新增的功能群发。Alpha 蒙版可以在菜單的圖層選項(xiàng)中找到晰韵，你可以給蒙版的填充（而不是圖片本身）設(shè)置透明度的漸變來產(chǎn)生更合適的效果。漸變?nèi)绻胁煌纳手凳菚?huì)被忽略的熟妓，整體效果只會(huì)受透明度的影響雪猪。
Apr
28
新舊結(jié)合，從頭了解 Sketch 3 —— 符號(hào) & 共享式樣
UI 設(shè)計(jì)的過程中起愈，我們常常會(huì)想重復(fù)使用某些元素只恨，已達(dá)到整體風(fēng)格和細(xì)節(jié)的統(tǒng)一，有時(shí)是一個(gè)按鈕抬虽，有時(shí)是一種文字式樣官觅，有時(shí)則是圖形填充和邊框的式樣。復(fù)用之后我們還希望這些元素可以保持同步斥赋，如果更改其中一個(gè)缰猴，其他的也會(huì)隨之改變。Sketch 當(dāng)中有這幾個(gè)不同的方式來幫你實(shí)現(xiàn)：
符號(hào) Symbols
符號(hào)是針對(duì)一個(gè)組（Group）的復(fù)用疤剑。比如重復(fù)使用的 header 或者 footer 或者某個(gè)按鈕滑绒。
大家可以參考中文手冊(cè)中關(guān)于符號(hào)的詳細(xì)內(nèi)容，以及這篇介紹?Sketch 3 新功能的文章中的視頻隘膘。
共享圖層式樣 Layer Style
圖層式樣則僅僅針對(duì)圖形：使用什么樣的填充和邊框疑故，什么樣的陰影和模糊，這些都是可以復(fù)用并同步的弯菊。
共享文字式樣 Text Style
文本式樣讓你保持文本的一致性纵势，設(shè)定好字體、字號(hào)管钳、顏色钦铁，然后復(fù)用于多個(gè)文本。
最后你可以在共享列表中來管理所有的符號(hào)和式樣才漆，方便你刪除牛曹、復(fù)制或者重命名。
當(dāng)然醇滥，以上這三種都是復(fù)用后自動(dòng)同步的黎比，還有另一種比較簡(jiǎn)單粗暴的針對(duì)圖形式樣的編輯超营，那就是開始設(shè)計(jì)之前，先把某一式樣設(shè)置為默認(rèn)阅虫。在菜單中選擇?編輯 > 設(shè)置為默認(rèn)式樣 (Edit > Set Style as Default),?這會(huì)替代Sketch 默認(rèn)設(shè)置下的淺灰色填充和灰色邊框演闭，使你接下來新畫的所有圖形都使用你剛剛設(shè)置的式樣，但他們并不是相鏈接的颓帝，也不會(huì)同步變動(dòng)米碰。
Apr
22
新舊結(jié)合，從頭了解 Sketch 3 —— 模板
Sketch3這次的更新吸引了很多目光躲履，大把大把的設(shè)計(jì)愛好者購入了Skecth認(rèn)真體驗(yàn)和學(xué)習(xí)见间，為了方便新朋友們，我們會(huì)把新舊功能結(jié)合在一起工猜，介紹幾個(gè) Sketch 的特別之處米诉。
New From Template
這個(gè)功能讓你從之前設(shè)定好的模板中直接新建文件（就像 Keynote 和 Pages 里面那樣） Sketch 已經(jīng)為大家設(shè)置好了幾個(gè)最常用的模板，方便直接調(diào)用篷帅。
?iOS App Icon：按照 iOS User Interface Guidelines 的要求史侣，每個(gè)畫板都是圖標(biāo)所需的不同尺寸。
?iOS UI Design： Sketch 3 嵌入了 由 teehan+lax 制作的iOS 7 UI套件魏身，第一頁是歡迎頁面惊橱，所有的 symbols 在第二頁喲。（我們會(huì)再下篇分享具體討論symbols）
?Mac App Icon：每個(gè)畫板都是Mac圖標(biāo)所需的不同尺寸箭昵。
?Web Design：第一頁包含四個(gè)網(wǎng)頁設(shè)計(jì)的畫板：Desktop HD税朴、Desktop、Tablet Portrait 和 Mobile Portrait家制，非常直觀正林。第二頁同樣包含簡(jiǎn)單的web UI 元素。
?Welcome to Sketch：這是 Bohemian Coding 團(tuán)隊(duì)制作的一個(gè)展示頁面颤殴，Sketch 官網(wǎng)的最終實(shí)現(xiàn)效果也正是由此產(chǎn)生觅廓。如果你是初次使用 Sketch，我十分建議你打開這個(gè)模板看看涵但，因?yàn)樗旧硪呀?jīng)是一份完整的 Sketch 文件了杈绸，你可以迅速了解到 Sketch 當(dāng)中規(guī)范的文件組織結(jié)構(gòu)是什么樣的，圖層層級(jí)是什么樣的矮瘟，一些最基本的操作是什么樣的瞳脓，這些都能幫你更快熟悉 Sketch。
模板的另一個(gè)好處是你可以自己新建模板澈侠，創(chuàng)作好文件然后進(jìn)入菜單欄的?File > Save as Template劫侧。因?yàn)閟ymbols符號(hào)功能是用于復(fù)用某一具體元素，比如一個(gè)按鈕埋涧，它并不能在不同文件中共享板辽，而模板則可以用來創(chuàng)建無數(shù)個(gè)獨(dú)立的文件。
色彩模式 RGB — HSB
在色彩面板中棘催，單擊 RGB 值下方劲弦，就可以轉(zhuǎn)換到 HSB 色彩模式。當(dāng)你想要制作一個(gè)同色系的色板的時(shí)候醇坝，HSB 模式就會(huì)非常實(shí)用邑跪。
Apr
14
快速查看圖形間距離
這是Sketch里最令我驚喜的功能之一，根本停不下來呼猪。
?按住????????????? 画畅，并將鼠標(biāo)懸停在畫布上
選中一個(gè)對(duì)象之后，按住alt 鍵宋距， 將鼠標(biāo)移至畫布上，Sketch便會(huì)告訴你這個(gè)對(duì)象與畫板各邊框的距離。
?按住????????????? 句占，并將鼠標(biāo)懸停在其他對(duì)象上
選中一個(gè)對(duì)象之后岛杀，按住alt 鍵， 將鼠標(biāo)移至另一對(duì)象壶唤，Sketch便會(huì)告訴你兩個(gè)對(duì)象之間的距離雳灵。
Apr
11
可運(yùn)算輸入框
Sketch 2.4.3之后加入了可運(yùn)算輸入框，支持基本的四則運(yùn)算闸盔。
你會(huì)發(fā)現(xiàn)使用輸入框比用鼠標(biāo)在畫布上拖拽要高效的多悯辙。
Apr
10
貼合最近的像素邊緣
想要在屏幕上實(shí)現(xiàn) pixel perfect 的效果？貼合最近的像素邊緣幫你實(shí)現(xiàn)完美迎吵。
當(dāng)某一圖形的位置非整數(shù)值時(shí)躲撰，你可以進(jìn)入編輯，選擇?貼合最近的像素邊緣功能钓觉，圖像就會(huì)迅速靠在最近的整數(shù)位子值上茴肥。
Apr
8
圖形縮放
縮放是創(chuàng)作矢量圖形很重要的環(huán)節(jié)之一，Sketch為我們提供了兩種不同的縮放方法荡灾。
?鼠標(biāo)拖拽縮放
選中圖形瓤狐，從圖形的一角拖拽鼠標(biāo)，直接完成縮放批幌，這樣得到的圖形會(huì)延續(xù)原圖形的一切設(shè)定础锐，比如圓角值，描邊粗細(xì)荧缘。
?縮放工具
使用縮放工具皆警，則只需輸入你想要的大小，sketch會(huì)自動(dòng)幫你把一切細(xì)節(jié)也進(jìn)行相應(yīng)的更改截粗，比如整個(gè)圖形放大值150%信姓，那么圓角值也會(huì)變成150%鸵隧，描邊寬度也會(huì)變成150%。
Apr
7
靈活的錨點(diǎn)模式
這是 Sketch 里非常貼心的功能之一意推，每一個(gè)錨點(diǎn)模式都可以單獨(dú)控制豆瘫，他們決定了每一個(gè)角是圓角還是直線角，錨點(diǎn)手柄的方向和長(zhǎng)短菊值。
?直線角：當(dāng)你剛剛點(diǎn)擊畫布的時(shí)候外驱，會(huì)添加一個(gè)直角，也就是說沒有任何錨點(diǎn)腻窒，你所得到的便是一條直線昵宇。
?鏡像：錨點(diǎn)會(huì)鏡像對(duì)應(yīng)。兩個(gè)錨點(diǎn)將會(huì)與主點(diǎn)距離相同并且正好相互對(duì)立儿子。當(dāng)主點(diǎn)并非直角時(shí)瓦哎，鏡像便是默認(rèn)的點(diǎn)模式。
?不對(duì)稱：兩個(gè)錨點(diǎn)到主點(diǎn)之間的距離是獨(dú)立的典徊，但他們依然相互對(duì)應(yīng)杭煎。
?斷開連接：錨點(diǎn)之間完全獨(dú)立，互不影響卒落。
?圓角：錨點(diǎn)將會(huì)以特定的內(nèi)角半徑渲染成圓角羡铲，非常適用于將一個(gè)矩形的一兩個(gè)角變成圓角。
Apr
4
圖形快捷鍵
sketch里的圖形快捷鍵和 Photoshop 或者Illustrator 略有不同儡毕，但習(xí)慣之后也切，能高效不少。
創(chuàng)建矩形
創(chuàng)建圓角矩形
創(chuàng)建圓形
創(chuàng)建文本
繪制矢量圖形
鉛筆工具
創(chuàng)建直線
按住 alt 鍵拖拽鼠標(biāo)腰湾，將從中心點(diǎn)繪制圖形
按住 shift 鍵拖拽鼠標(biāo)雷恃，將繪制正方形，正圓和45度角的直線费坊。
當(dāng)你熟悉這些快捷鍵之后倒槐，可以定制工具欄，把其他常用但是未設(shè)快捷鍵的圖形放在工具欄中附井，比如剪頭讨越、三角形和星型，當(dāng)然永毅，你也可以自己為他們?cè)O(shè)置快捷鍵把跨。
Mar
28
圖層列表的常用快捷鍵
相信我，當(dāng)你的sketch文件越來越龐大時(shí)沼死，你一定會(huì)愛上這些快捷鍵着逐。
搜索圖層列表
圖層重命名
圖層中切換
完成重命名
圖層隱藏/可見模式
圖層鎖定/解鎖模式
Mar
17
排列和復(fù)制畫板
Sketch 為我們提供了一些常用尺寸的畫板，帶來一個(gè)完美的開始。
?利用網(wǎng)格工具耸别，快速排列和復(fù)制畫板
輸入理想的行健芭、列和邊距的數(shù)值，就能得到理想的空白畫板秀姐。
?一個(gè)畫板一個(gè)UI元素
方便UI控件的管理吟榴，在導(dǎo)出時(shí)也能直接以畫板名導(dǎo)出文件。
Mar
9
創(chuàng)作空間最大化囊扳，隱藏控制面板
如果你有時(shí)需要用很小屏幕的Mac進(jìn)行創(chuàng)作——比如11寸的Air——那你一定不會(huì)放過任一個(gè)擴(kuò)大畫布展現(xiàn)空間的方法。
?定制工具欄
將常用且沒有快捷鍵的功能通通丟到工具欄中兜看，然后勾選 Icon Only 和 Use Small Size锥咸，以只顯示小號(hào)的工具圖標(biāo)。
?隱藏控制面板
還有一系列快捷鍵细移，讓你靈活的隱藏控制面板搏予。
隱藏工具欄
隱藏圖層列表
隱藏檢查器
同時(shí)隱藏圖層列表和檢查器
