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