上一期《夜雨原創玩轉Sketch第二期:基本工具使用》,我們對線條、幾何、文字工具三個基本工具有了一定的了解,也用基本工具描繪了一些基本的圖形,在第三期,我們將涉及高級工具的使用,看如何利用剪刀工具、變形工具,對圖形進行進一步的處理。
注:玩轉Sketch系列教程適用于Sketch44或者更高級的版本。
1.圖形編輯補充知識
(1)利用delete鍵刪除編輯點達到改變形狀的目的
在Sketch中,雙擊圖形即可進入編輯狀態,可在任意線段上添加編輯點來編輯圖形,除了拖動這些點改變形狀外,我們還可以通過刪除這些編輯點來實現。例如,下面的長方形,通過添加編輯點,和通過delete鍵刪除編輯點后,得到缺邊的形狀。
(2)運用shift鍵編輯圖形
進入圖形編輯狀態后,可以通過控制手柄調節曲線的弧度,這里有一個小技巧,當按住鍵盤“shift”鍵拖動手柄時,可以在調整手柄長度的時候,角度不會偏移。對視覺設計有深入興趣的小伙伴,可以參考優設的優秀譯文《干貨!設計師必須掌握的貝塞爾曲線的秘密》,利用貝塞爾曲線畫出更漂亮的形狀。
(3)開放路徑和封閉路徑
當進入編輯狀態后,在檢查器中可以選擇“Open Path(開放路徑)”或者“Close Path(封閉路徑)”,“Close Path(封閉路徑)”的作用是自動連接起點和終點,形成封閉的路徑。當圖形需要自動補全時,這個技巧很方便。
2.剪刀工具
剪刀工具可以用來剪除圖形的一部分,達到我們想要的形狀,注意:剪刀工具剪斷后,路徑是開放的,而前文提及的delete鍵刪除后路徑是封閉。下面,我們來學習一下怎么利用剪刀工具實現下圖所示的圓環效果。
首先,使用圓形工具畫出一個圓型,取消顏色填充,并適當調整邊框大小,得到一個圓環圖。
然后,復制一個一模一樣的圓環備用,點擊其中一個圓環圖進入編輯模式,在適當的位置添加編輯點。
接著,不要退出編輯狀態,點擊快捷工具欄的“Scissors”剪刀工具,剪除編輯點到編輯點之間的一段圓環(剪刀工具移動到圖形上方時,可剪除的路徑會變成虛線狀態)。
剪除之后,我們還需要“潤色”一下路徑,即把剪斷處變成圓頭,打開border的設置項,在Ends和Joins中各自選中中間的形狀即可。
最后一步,調整一下重復復制的圓環顏色(可以設置顏色為透明度為40%),再兩者疊加(剪掉的放在上方)即可。
3.變形工具
顧名思義,變形工具就是可以把圖像進行變形,以適應不同的形狀設計要求,例如手機的一些概念照片設計(圖片來源網絡)。
使用的方法也比較簡單,選中圖像,然后點擊快捷工具欄的“Transform”變形工具,這時,圖像上方會出現變形點,即代表已經進入變形編輯模式。
拖動變形點即可改變圖形的形狀,達到我們想要的效果。