產品經理迅速上手 SKETCH

01-27

很多人在學習 Sketch 時，打開工具看到迥異的功能，會立馬打退堂鼓。

其實大家對於工具的恐懼，來自於太多的新功能，和 Axure、Photoshop 不一樣。

但是作為產品經理，不是專職設計人員，只用會 Sketch 的這幾個功能，就夠了。

ARTBOARD

Artboard 有點類似 Axure 中的頁面。如果說 Axure 中以頁面為單位，那麼在 Sketch 中就是以 Artboard 為單位。

如果你做的是 Web Design，在如今寬屏較多的情況，可以以 1200 px 作為頁面寬度。

而我習慣使用 1440 px 的寬度。

如果你做的是 App Design，並且以 iOS iPhone 6 的尺寸為基準，那麼就可以使用 750 px 作為頁面寬度。

個人覺得 Sketch Artboards 比 Axure 頁面更好的地方，就是可以更加直觀看到所有頁面。

當你點擊 Artboard 時，Sketch 會給出尺寸參考，讓你快速相應尺寸的頁面。

身為產品經理，最常面對的是線框圖，所以在 Sketch 中最常見的就是矩形：Rectangle 了。

就算是設計師，最常用的也就是矩形吧。啊哈哈。

先給大家看看一個頁面，他幾乎都由矩形構成。

掌握矩形的檢查器，也就掌握了 Sketch 功能的一半啦。當然，這是對於產品經理來說啦~

那我們來看看矩形的檢查器都有什麼功能吧：

是不是很簡單，有 Axure 基礎基本都能了解是什麼功能。

至此，你就可以開始使用 Sketch 來畫原型了。

在原型設計沒有走設計流程時，產品經理可以去http://iconfont.cn/下載一些 icons 臨時充數。

Sketch 可以承接 iconfont svg 的格式，並且還原路徑，方便後續編輯。Sketch 的布爾運算，和 Ai 中的「路徑查找器」如出一轍。

在 Sketch 布爾運算中，可以方便得實現形狀的合併、相差、相交、去重。

產品經理做完產品設計後，需要將成果交接給設計師或者說研發人員。Sketch 插件 Zeplin 可以很好幫助我們完成這一點。

Zeplin 是幫助設計師和研發人員更快溝通的工具，他可以完成：

在 Sketch 選中要上傳的 Artboard，按下 cmd + E 就可以上傳啦。

Zeplin 神奇的地方就在於，可以給出標註和參考代碼，來幫助研發人員更快得書寫前端代碼。

在 App Design 中設計師往往要交接不同尺寸的切圖，就很麻煩。Zeplin 可以幫助設計師快速生成不同尺寸的元素切圖。而研發人員直接在上面下載就可以了。

有一些簡單的交互和控制樣式說明，可以直接寫在 Zeplin 上就很方便。相當於產品經理的需求文檔，就可以直接在 Zeplin 上搞定了，還自帶評論功能。