Sketch進階教程-快速複製、測距以及邊界

Sketch Mac是一款爲設計師量身定作的優美界面和強大工具兼有的專業繪圖工具。可以知足網頁、用戶界面、圖標等的設計需求。 Sketch是一款爲設計師量身定作的優美界面和強大工具兼有的專業繪圖工具。製做出漂亮的圖形是一件頗有挑戰性的事情，你所須要的是一款精心設計的應用 程序。這次小編帶你們瞭解Sketch快速複製、測距以及邊界。

一、夜視項目的框架設計

通過初步整理以後，咱們獲得夜視項目的框架，方便咱們利用Sketch進行具體界面設計，框架以下：

另外，由於虛擬項目的變動，因此在《夜雨原創玩轉Sketch第五期：原型設計入門》的基礎上，對首頁進行了從新設計，設計後的界面以下：

二、圖像變色處理

細心的同窗可能發現了，界面的圖像進行了黑白處理，這是在《夜雨原創玩轉Sketch第六期：最全圖像處理方案》中沒有說起的，因此這裏補充一下Sketch圖像變色的處理教程。變色的處理比較簡單，選中圖像後，在檢查器處找到「Color Adjust」選項便可，「Color Adjust」對應的4個子選項功能分別爲「Hue（色相）」、「Saturation（飽和度）」、「Brightness（亮度）」、「Contrast（對比度）」，能夠拖動滾動條對圖像進行調整。

以首頁的banner配圖黑白處理爲例，只須要將「Saturation（飽和度）」選項數值設置爲0便可獲得黑白的圖片。

三、快速複製

咱們在畫原型時，每每會遇到重複的元素須要不斷複製的狀況，除了經過複製、粘貼以外，利用Sketch的快捷鍵能夠事半功倍。以首頁的banner定位小圓點爲例，咱們須要複製數個重複樣式的小圓點，則可使用到這個小技巧，具體操做步驟以下：

1）首先須要畫出一個小圓點，選中小圓點後，按住鍵盤的「option（alt）」鍵，鼠標往右拖動複製一個小圓點

2）而後，按下「command（⌘ ）」+「D」組合鍵，便可複製一個相同的圓點，而且能夠新複製的小圓點水平位置和前面的小圓點保持一致，且間距都設置好了。

若是在第1）步中拖歪了，會致使重複複製的元素出現偏移，那也沒關係，利用Sketch的對齊和分佈工具便可，在工具欄處便可看到。

四、測距

在Sketch中進行設計，對尺寸、間距的把控必不可少。Sketch中提供比較方便的測距方式，在拖動圖層的時候，就能夠看到相鄰圖層間距的展現；也能夠經過選中圖層，按住「option（alt）」鍵，而後鼠標移動到其餘圖層，查看二者的間距。

五、邊界

這裏說的邊界，是指頁面的邊界，以首頁爲例，首頁底部還有什麼內容？底部最多展現多少內容？是否有邊界仍是一直無限刷新？這些都是咱們在進行原型設計時，須要考慮的問題。

考慮清楚以後，咱們能夠在原型設計時，把首頁底部須要呈現的內容所有畫出來，也能夠用文字註明邊界的設置。

在實際演示時，咱們每每會默認展現一屏的內容，這個時候，咱們能夠用隱藏圖層的方式，把下方的邊界內容隱藏起來，在須要的時候再進行展現。隱藏的方法也比較簡單，找到邊界的圖層，點擊眼睛符號便可在展現和隱藏之間進行切換。

以上就是小編爲你們帶來的Sketch進階教程-快速複製、測距以及邊界。還有更多詳細、實用的功能以及相關軟件sketch和其餘Mac軟件獲取，你們快來Macdown.com自行探索一番吧。