我怎么做產(chǎn)品設(shè)計?

本文包含了我個人進(jìn)行獨立產(chǎn)品設(shè)計時的流程和工作心得，非科班、非大公司流程、非一定正確，歡迎大家批評指正，如果有幫助，也希望得到你的鼓勵。

產(chǎn)品經(jīng)理或產(chǎn)品設(shè)計是一個在不同環(huán)境中差別很大的崗位，大公司和創(chuàng)業(yè)公司、大團(tuán)隊和小團(tuán)隊、人員配備情況等都會影響我們工作的內(nèi)容和合作方式，而每個人相信在一定的工作磨練之后，都建立并積累了屬于自己的工作方法。

作為一個混跡于小團(tuán)隊甚至個人獨立設(shè)計開發(fā)應(yīng)用的學(xué)生，我是這么工作的：

idea的產(chǎn)生

我主要的設(shè)計工作都來源于自己的意愿，一般是我加入的某些小團(tuán)隊，或者是我想要滿足的某種需求，甚至也可能是我個人的產(chǎn)品設(shè)計練習(xí)。之前有很多朋友問我為什么去創(chuàng)業(yè)，或者參加這么多的項目，我回答的是『只是對于不好用或者不方便的東西，想要去改進(jìn)它罷了』。

我是一個比較敏感和細(xì)致的人，有比較強(qiáng)的共情能力，因此總會在自己或身邊的人身上發(fā)現(xiàn)一些需求，那么需求很多，idea 也會有很多，我們怎么選擇呢？

腦補(bǔ)

一般一個想法出現(xiàn)，我會從兩個方面去論證它。

第一，這個需求是否在用戶中普遍存在。普遍的意義不是說要所有人都需要，但是至少某個需求應(yīng)該有一定數(shù)量的用戶群，這樣才有解決的價值。結(jié)合自己的日常觀察以及生活經(jīng)驗，首先慮掉那些明顯不典型的需求，而對于難以確認(rèn)的，則在下一個『用戶調(diào)研』的環(huán)節(jié)搜集信息。

舉個例子，之前和朋友討論一個功能，是開發(fā)一個 App，一鍵將整個手機(jī)系統(tǒng)和所安裝的所有（或常用的）其他 App 都變?yōu)橐归g模式，并且可以和正常模式進(jìn)行切換。這個需求乍一聽很新奇，因為閱讀類產(chǎn)品都會設(shè)計夜間模式方便在黑暗環(huán)境下的閱讀，所以是否需要一個手機(jī)整體大切換的產(chǎn)品呢？我個人認(rèn)為這個需求并不真實存在的，首先我詢問了身邊喜歡看小說的朋友，他們大部分甚至不使用夜間模式來讀信息，而是選擇在有光的條件下閱讀；其次，整體替換手機(jī)閱讀模式會帶來不確定性、權(quán)限問題、夜間模式匹配設(shè)計問題等一系列狀況，因此這并不是一個好的選擇。

（如果有朋友覺得這個想法不錯，歡迎討論）

第二，這個需求的技術(shù)難度和實現(xiàn)可能性。當(dāng)一個需求有比較明顯的用戶群時，就可以從技術(shù)以及設(shè)計角度來進(jìn)行分析，看是否能夠?qū)崿F(xiàn)。

舉個例子，我早上上班經(jīng)常要乘坐地鐵，在早高峰是總是苦于如何快速找到座位。我相信這個需求很多人都有，選擇站位和觀察乘客都是一種技巧（寫過一個知乎答案：地鐵如何判斷哪個位置的人會早下車？）。但是仔細(xì)考慮一下這個需求的解決方案：首先，乘客需要貢獻(xiàn)自己的上下車地點（隱私問題，激勵問題）；其次，需要精確到某一個車廂甚至具體的某一個座位（定位精度問題、網(wǎng)絡(luò)通暢問題）；很快會發(fā)現(xiàn)，在一個信號時有時無、乘客摩肩接踵、隱私敏感的環(huán)境下，這個需求實現(xiàn)難度非常高。

用戶調(diào)研

用戶調(diào)研環(huán)節(jié)，我個人比較喜歡采取訪談的形式——事先準(zhǔn)備好一些問題和我關(guān)心的要素，在網(wǎng)上聊天、面對面溝通、實際情景模擬等場景下，進(jìn)行調(diào)研。調(diào)研的主要目的，一方面是確認(rèn)需求的普遍程度，另一方面則是調(diào)查需求解決方案中的一些用戶細(xì)節(jié)。比如 O2O 產(chǎn)品中的單價、社交產(chǎn)品中的興趣點等等。

關(guān)于調(diào)查問卷，我之前針對不同的項目做過很多次調(diào)研，多的時候可以回收上千份有效答卷。設(shè)計調(diào)查問卷時應(yīng)該注意，這種形式更適合整理數(shù)據(jù)性質(zhì)的信息（價格、使用時間、用戶分類占比等），而對于一些比較感性的問題不太容易得到準(zhǔn)確的答案；另一方面，投放人群也需要提前針對你所要調(diào)研的信息做好設(shè)計。

核心頁面繪制

前面幾個環(huán)節(jié)，著重從用戶需求分析等產(chǎn)品角度討論。而從這一階段開始，更多的涉及設(shè)計方面的工作。有的人在設(shè)計產(chǎn)品時會先繪制流程圖和結(jié)構(gòu)圖，或者先畫線框圖來說明產(chǎn)品邏輯，最后再繪制界面。這個地方我的習(xí)慣和大家有些不一樣，也不一定是正確的做法。

當(dāng)開始進(jìn)行設(shè)計時，我會首先根據(jù)之前腦補(bǔ)+調(diào)研的內(nèi)容，繪制3-5頁高視覺保真的界面圖。這么做的第一個原因，是我想先確立產(chǎn)品的基調(diào)（顏色、布局等），更重要的是，我打算把最核心的功能先確定下來。

直接繪制流程圖會有一個小問題，就是不容易抓住重點，有的時候會陷在某一個細(xì)節(jié)里?！扼w驗·度》中提到一個例子：

我們用百度新聞客戶端來舉例。在做新聞客戶端的時候都會思考哪個信息是用戶每天都想看到的，調(diào)研結(jié)果是『天氣』，既然是天氣我們是否要將天氣做得更炫酷呢，甚至點擊后顯示一周的天氣呢，如果你問用戶，答案是肯定的；既然是如此絢麗的 UI，我們是不是要進(jìn)行微博分享呢？用戶依然認(rèn)為是的；那么既然分享我們是否要增加查看評論功能呢？這時候你會發(fā)現(xiàn)我們討論的點已經(jīng)和新聞客戶端完全無關(guān)了。

所以，先畫幾頁核心頁面，把最重要的功能確定下來，并且在后面的流程中時刻提醒自己，不要跑偏了。

流程圖與結(jié)構(gòu)圖

一般不會在操作流程上百分百繪制流程圖，而是針對需要著重設(shè)計的功能來繪制。下面的例子是一個O2O 外賣配送產(chǎn)品的泳道圖（部分）

而結(jié)構(gòu)圖就需要把產(chǎn)品可能涉及到的每一個頁面表達(dá)出來，這無論是在產(chǎn)品討論還是開發(fā)溝通，甚至是用戶調(diào)研階段都是很有用的。注意，結(jié)構(gòu)圖主要表達(dá)的是層級關(guān)系，直接相關(guān)的就是產(chǎn)品的導(dǎo)航結(jié)構(gòu)以及頁面層次，可以使用顏色、樹狀圖等進(jìn)行區(qū)分和強(qiáng)調(diào)，而至于頁面之間的跳轉(zhuǎn)關(guān)系，則可以在交互設(shè)計中再著重表達(dá)。如下圖，是某習(xí)慣養(yǎng)成產(chǎn)品的信息結(jié)構(gòu)圖：

視覺設(shè)計

視覺設(shè)計階段，根據(jù)前面定下來的基調(diào)確定 VI （視覺系統(tǒng)），根據(jù)信息結(jié)構(gòu)圖來明確導(dǎo)航結(jié)構(gòu)（雖然大部分時間這屬于交互設(shè)計的工作），最后把每一個頁面的真實視覺設(shè)計稿繪制出來。

如果可以的話，最好使用可以投影到手機(jī)上的軟件實時查看設(shè)計效果。比如 Sketch 的 mirror 功能，還有 Skala Preview 都是比較常用的軟件。

視覺設(shè)計的另一個工作，就是切圖和標(biāo)注。把所使用的控件按照最小單元導(dǎo)出，并且單獨復(fù)制一份視覺稿，在上面對形狀大小、尺寸距離、字體和顏色等信息都進(jìn)行標(biāo)注，方便開發(fā)工程師的工作。注意，對于某些通用的控件，可以單獨標(biāo)注，就不需要重復(fù)標(biāo)注了。

交互設(shè)計與文檔補(bǔ)完

然后呢，我需要設(shè)計每一個頁面的每一個狀態(tài)所呈現(xiàn)的視覺。比如打卡類應(yīng)用根據(jù)當(dāng)天的打卡次數(shù)，打卡按鈕會有不同的文案；比如輸入框輸入了不合理的信息，應(yīng)當(dāng)反饋給用戶；比如信息呈現(xiàn)頁面如果內(nèi)容為空，需要增加文字或圖片說明；再比如網(wǎng)絡(luò)不通暢或者刷新、發(fā)送失敗，又需要通知提醒?？傊谶@個階段，需要考慮很多用戶使用上的細(xì)節(jié)，多用極限思考的方法模擬用戶的極限操作，往往會有新的發(fā)現(xiàn)。

一般，我會使用視覺圖+文字注釋+引導(dǎo)線的方法來做交互設(shè)計。

完成了這些內(nèi)容之后，如果有需要，還可以進(jìn)行動效設(shè)計，使用一些原型設(shè)計軟件可以呈現(xiàn)出比較好的真實模擬效果，用以用戶實際測試或者項目演示。原型設(shè)計軟件主要考量的是這樣幾個因素，不分先后，分別是上手難度、效果復(fù)雜度、可否進(jìn)行代發(fā)復(fù)用等，這里我推薦幾個軟件：

Axure，是人都知道，就不細(xì)說了，操作簡單，效果一流，比較適合制作相對完整的產(chǎn)品原型。但是，不能制作比較復(fù)雜的動態(tài)效果，另外原型設(shè)計工作導(dǎo)出文件為 html 格式，對于原生應(yīng)用開發(fā)難以復(fù)用。

Quartz Composer，俗稱 QC，結(jié)合 origami 插件能夠降低使用難度，但是依然有陡峭的學(xué)習(xí)曲線。效果出眾，幾乎可以實現(xiàn)你想到的任何動態(tài)效果，并且使用 pop 引擎能夠?qū)崿F(xiàn)代碼復(fù)用（僅iOS），值得注意的是，QC 比較適合去制作某一個特定的效果，而不適合描繪整體。還有一個類似的軟件叫做 Form，被 google 收購后免費了，在手機(jī)上瀏覽效果不錯，和 QC 非常類似。

Xcode storyboard，故事版，其實就是直接開發(fā)只有頁面結(jié)構(gòu)的 App 了，使用 Swift 語言大大降低了難度，不過因為需要開發(fā)和編程，總體還是有一定上手難度的。優(yōu)點不用多說，效果好，代碼無縫復(fù)用。

當(dāng)然，真正的工作中也絕不僅僅只包含這些內(nèi)容，還有很多細(xì)節(jié)、工具和文檔都是根據(jù)實際情況來選擇的。不知道大家一般怎么工作和練習(xí)呢，如果不介意的話，可以留言或者聯(lián)系我一起交流，互相學(xué)習(xí)，一起進(jìn)步。

新聞標(biāo)題：我怎么做產(chǎn)品設(shè)計?
路徑分享：http://www.muchs.cn/news4/161404.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁設(shè)計公司、網(wǎng)站制作、網(wǎng)站排名、品牌網(wǎng)站建設(shè)、商城網(wǎng)站、外貿(mào)建站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)