1
雷鋒網按：本文作者John，微信產品經理。感謝覃超推薦過來與讀者們一同分享。John的產品之器系列最近會持續更新，產品經理們可以繼續關注雷鋒網，或者移步其知乎。
最近看知乎的時候發現了一篇很棒的文章，特地拿過來與大家分享，尤其推薦給產品經理或想成為產品經理的你。
以下是原文：
算上創業，我做產品差不多三年。我一直在問自己，做產品經理最重要的特質是什么？甚至在一次內部交流會上，我也問過小龍這個問題。很多人覺得做產品很輕松，寫個文檔，提個需求給設計和開發，然后扯皮，「產品經理不需要硬技能」，「不會寫代碼就去做產品」，「人人都是產品經理」。
我覺得不是這樣的，不然這三年來我應該過的很輕松才對。我每天都焦慮，沒有好的想法焦慮，碰到技術問題焦慮，業務數據不上漲焦慮，如果沒有「做一個偉大產品」的理想，我應該早就放棄了。做產品，一點都不輕松。但「焦慮」并不是一個產品經理的特質，想辦法解決問題，用好的辦法解決才是。
產品的每一個階段都要解決大量問題。需求分析階段，我們搞清楚了為什么要做這個需求。下一個階段就是把想法變成讓用戶（包括老板）實際可體驗的東西，即產品原型。產品原型并不是直接上手 Sketch，畫完給老板看。我的最佳實踐是產品原型有三個子階段：
紙上原型。
你需要在桌面上，攤開一張紙，用一支筆，去構思你的產品。這里輸出的線框圖是給自己的，所以你盡情揮灑，只要自己看得懂就行；
靜態原型。
有了紙上原型，這個產品的雛形已經在你心中，現在，打開 Sketch把產品的「最終形態」畫出來，不要太在意用色，不必面面俱到。這個階段配合Sketch Mirror，可以邊畫邊給其他人看，聽取其他人的反饋；
動態原型。
動態原型工具太多，我也基本都嘗試過，最終選擇了 Craft，這個還在內測中的工具。動態原型并不是必須的，但是動態原型更接近實際產品體驗，為什么不再進一步呢。
紙上原型最大的特點就是極速，不用在意字體，顏色等細節，只需要構思整個產品的大致形態。紙上原型最佳實踐：
第一步：打印模版
從A4模版選擇一個合適的硬件機型，比如iPhone 6，單面打印出來。
第二步：不斷探索產品形態，輸出線框圖
合理利用這一面紙。空白區域可以對線框圖做標注，背面可以用文字來梳理產品架構。
因為不能涉及公司業務，這里我以 iMessage 為例。
我用 Sketch 已經兩年多了，從 3.0 版本開始就把 Sketch 列為主力設計工具。對于「產品經理要不要懂設計」，我的理解是不僅要懂，而且要精。和設計師不同，產品經理的設計稿偏向于思考用設計解決問題，而不是視覺傳達。
Sketch 最佳實踐
第一步：選擇 Sketch 模版
開始一個項目前，從模版創建一個項目。在前一篇文章「產品之器?Ulysses」中提到過，我很討厭重復工作，所以對 Sketch 我也有自己做的模版，包含 iOS 標準控件，還有微信里用到的氣泡等控件，加上 Style Guideline，常用圖標等。
第二步：創建 Pages
對于不同版本，很多人通過不同的 Sketch 文件名來區分，比如 xxx-v1，xxx-v2。這樣做有個壞處，一個項目分散在不同的文件中。我是通過不同 Pages 來進行文件版本控制，每一個版本里面包含了完整方案。
第三步：在Artboard里設計
在Artboard里面設計每一個界面，在設計的過程中同步使用 Mirror，實時在手機里看效果。每設計完成一個版本，拿給同事看，聽聽他們的反饋，從反饋中提取可改進的地方進行優化。最終得到一份基本完整的 Sketch 文件。
一些奇技淫巧
1. 如何快速上手 Sketch？
入門 Sketch 最好方法是系統截屏，把 iOS 系統里面每一個原生 App 自己畫一遍，每個圖標自己畫一遍，邊畫邊琢磨蘋果的設計師是怎么解決問題的。這里推薦一些其他快速入門的教程：
也許過不久，我也會出一套上手視頻，誰知道呢：）
2. 常用的 Sketch 的模版庫有哪些？
模版能夠減少很多「重復發明輪子」，這里提供一些好用的模版
iOS 10 UI Kit. 新鮮出爐的 iOS 10 模版；
iOS 9 UI Kit. Facebook Design Team 出品的 iOS 模版庫；
Apple Watch GUI. Meng To 出的一套 Apple Watch 模版；
資源庫。你想要的所有模版，這里都能找到。
3. 怎么做自己的 Sketch 模版？
好的模版雖然能夠滿足基本需求，但是根據自己的實際需求打造自己的設計模版必不可少。一個自己的設計模版以下部分必不可少：
UI Bars. 包括 Navigation Bars, Search Bars, Status Bars, Tab Bars, Toolbars等；
UI Views. Action Sheets, Activity Views, Alerts, Collections, Image Views, Maps, Pages, Popovers, Scroll Views, Split Views, Tables, Text Views, Web Views等；
UI Controls. Buttons, Edit Menus, Labels, Page Controls, Pickers, Progress Indicators, Refresh Content Controls, Segmented Controls, Sliders, Steppers, Switches, Text Fields等；
Icons. 包含App Icon，系統常用 Icon等；
Sytle Guidelines. 包括 Colors, Typography等。
4. 常用 Sketch 插件有哪些？
Sketch 強大之處在于能夠使用第三方插件，這極大提升了生產力，甚至你可以自己寫插件提高效率。我常用的插件包括：
Content Generator. 通過快捷鍵能夠填充頭像等；
Measure. 用來給其他人做標注用；
Craft. Invision 出品的強大的 Sketch 插件，包含 Library, Photos, Type, Duplicate, Prototype 這五個部分，其中 Prototype就是我們接下來要介紹的動態原型工具。
上一節輸出的靜態原型，已經能夠讓我們進入到產品的下一個階段。作為錦上添花的動態原型，能夠更直觀讓用戶體驗。動態原型工具市面上一大把，Origami, Pixate, Framer, Keynote, 甚至 Xcode，每一個工具我都用過一段時間，最終，我選擇了 Craft 作為動態原型設計工具。
做動態原型的一個原則是：快速。如果在這個階段浪費太多時間，得不償失。Craft 就是能夠直接在 Sketch 軟件里面進行動態原型設計的工具。
Craft 最佳實踐：
第一步：在 Sketch 里面設計
設置初始界面，定義不同界面之間的跳轉，Craft 也提供了基本的輸入狀態等。
第二步：使用 Invision App 體驗
在 Sketch 里面做好基本的頁面跳轉和動態效果之后，可以使用 Invision App 進行預覽。如果需要呈現在 Keynote 上面可以使用 Mac 系統提供的 QuickTime Player 進行錄屏。
以上，我們把一個想法變成了一個可體驗的動態原型。
雷鋒網注：本文轉載請務必聯系授權并保留作者完整信息，有興趣可關注John的知乎。
這里推薦下覃超小魔王，他有一個好玩的公號，講述硅谷和技術背后的故事：覃超帝國興亡史，有興趣的童鞋也可以移步其知乎專欄：覃超帝國興亡史-跨越美利堅之路。
雷峰網原創文章，未經授權禁止轉載。詳情見轉載須知。
