關於互聯網產品設計階段的工作流程，近幾年好像有了一個標準的模式，大家都按照這麼一個大概的流程來工作，又好像沒有標準，每個團隊又不盡相同，有的簡單粗暴，有的複雜細緻 。之前工作過的幾個東家工作流程都不是很合理，產生了很多經驗教訓。最近在饅頭商學院回爐改造，又講到這塊，自己總結了一下感覺比較合理的工作流程，希望給一些小夥伴參考和啟發。
目前大部分的公司遵循的產品設計工作流程，涵蓋工作崗位從產品經理，交互設計師，用戶研究員，視覺設計師，前臺開發，後臺開發，測試，運營等等，當然具體到每個公司的人員配置不同工作環節也會有些出入，每個環節細分起來還有很多工作。下面說下產品經理和設計師為主要執行者的工作環節，開發運營階段就不多討論。
一、需求分析
需求分析是一個燒腦的工作階段，這個階段需要產品經理，用戶研究工程師，交互設計師，甚至公司各路大佬，市場、運營等各路人馬參與，做大量的研究和提煉工作。一般通過用戶分析，需求整理，競品分析，核心流程設計，技術分析，商業市場分析等這麼幾個步驟，最終梳理出需求規劃。工作流程順序不一定，更多的是在交叉進行。
1、用戶分析
一切產品都是建立在用戶需求之上，一個產品必須能滿足用戶需求才有存在的價值，用戶需求需要被發現和感知。規劃產品時，不可繞過的第一步工作就是用戶分析，用戶分析其實很複雜，大公司會有專門的用戶研究工程師來負責，但一般公司都是由產品經理或交互設計師來完成的，而且沒有太多資源和時間，但簡化的用戶分析也是有用的，一般做用戶分析的目的：確定目標用戶，詳細瞭解用戶的目的和行為，用戶的問題，用戶使用場景以及當前用戶問題的解決方案等等。簡單有效的方法就是做幾次用戶訪談，通過訪談其實可以瞭解足夠多，如果資源和條件足夠，調查問卷，焦點小組都是常見的方法，如果已有用戶基礎，可以進行用戶數據分析，精確瞭解用戶行為，也有很多開放平臺如百度指數進行數據查詢。產出物有用戶畫像，用戶故事板，用戶研究報告等，不管產出什麼，最重要是腦子裡有清晰的目標用戶形象。
2、需求整理
需求整理之前需要做需求收集，收集的方式有很多種，數據分析，思維導圖梳理，用戶研究，競品分析，個人經驗等等。收集一系列需求後，開始整理篩選，去掉不合理的需求後，按功能框架，用戶量，使用頻率，開發難度，用戶習慣，商業價值，數據表現等等方面分析排序和分類，產出物一般就是需求池，需求池會伴隨產品的整個生命週期，需要細緻和認真的去維護。
3、競品分析
現在做一款產品大多數已經有競品，做好競品分析能達到事半功倍的效果。產品層面的競品分析就從用戶需求、產品功能，交互流程視覺展現等進行分析和對比，總結出優劣勢和機會等。個人覺得不應包含市場格局，公司戰略之類的，商業層面的競爭關係可以放在商業市場環節去分析。做競品分析目的是瞭解競品，更好制定競爭方案，同時學習競品優秀的地方，但別照抄，哪怕微創新一下也好。產出物是競品分析報告的等文檔。
4、核心流程
產品能滿足最主要的用戶需求是什麼，需求分析階段需要團隊人員明確核心流程，統一方向。流程中包含角色，任務，信息流向等幾個關鍵點，產出物一般是泳道圖。
5、技術分析
在核心流程制定後拉著技術負責人共同探討一下，瞭解下研發成本，產品設計人員要有個意識，在設計流程階段會有很多討論和評審，儘量拉上技術負責人，這樣後期會省很多麻煩。
6、商業市場
做某一行業的產品，必須深入瞭解行業，商業市場分析是一個很大的話題，很多公司都是大佬們決定的，更多是產品經理在執行。目的是明確產品的商業價值，為高層做決策參考依據，獲得人、錢、資源支持等。分析的角度很多，主要是瞭解行業，市場，競爭，用戶等，預估成本和風險，不同的行業，公司，階段側重點不一樣，需要具體問題具體分析。產出物是商業需求文檔（BRD）和市場需求文檔（MRD）等文檔，個人覺得最重要的環節其實是項目彙報宣講。
二、交互設計
需求都梳理好了之後就進入到了交互設計階段，這是一個產品成型的階段，產品從抽象的需求轉化成具象的界面，需要產品經理和交互設計師配合完成，當然大部分公司都是產品汪流著淚自己完成。
1、信息架構
這裡說的信息架構簡單理解就是信息分類，產品由哪些功能組成，將相關功能內容組織分類，明確邏輯關係，並平衡信息展現的深廣度，引導用戶尋找信息，這一步要把導航規劃好，最好的產出物就是一個思維導圖的表格。如下圖：
2、業務流程
業務流程是一個產品功能設計的基礎，是一定要畫的，流程確定了，後面的工作才能順利進行，否則會出現產品功能實現搖擺不定，反覆修改的狀況。確定好產品中的角色，角色的任務，階段，按信息流向把流程繪製出來。一般繪製完業務流程，產品需求文檔（PRD）也該成型了，PRD文檔的寫法不多做討論了，主要其實是給開發做參考依據，把產品層面的邏輯表達清楚就可以。業務流程舉例：
3、頁面流程
頁面流程是業務流程延伸，要以用戶為中心的思路來整理，按用戶使用頁面的順序進行組織，把頁面結構和跳轉邏輯梳理的更清楚，並確定每個頁面的展現主題。如下圖：
4、低保真原型
低保真原型就是驗證交互想法的粗略展現，不用精細，因為在這個階段會有很多更改，需要不斷的評審和討論，最好就是紙和筆手繪，也可以用Axure或sketch做一些簡單的草圖，好用的軟件還有mockups。如下圖：
5、高保真原型
高保真原型要將詳細的頁面控件、佈局、內容、操作指示、轉場動畫、異常情況等等都詳細表達出來，給視覺和開發詳細參考，也是交互設計的最終定稿，高保真原型可以顯著降低溝通成本，具體高保真到什麼程度也得看團隊習慣和時間，有的團隊會無限接近視覺稿，模擬真實的產品交互操作，有的則還是以黑白灰為主，把交互細節都展現出來，特別需要顏色體現交互的的地方才加一些顏色提示。如下圖（來源於網絡）：
6、交互說明文檔
很多公司都沒有專門的交互說明文檔，因為時間原因一般就是在原型旁邊的註釋說明，不管單獨的文檔還是原型註釋，目的都是要把交互邏輯和交互規則表達清楚。當然還有的時候，如果項目出現了一些狀況，不用被開發說你的交付物不全，成為背鍋俠。寫交互文檔要站在以開發為中心的思維上，想想開發看著說明能不能理解交互邏輯和規則。
三、視覺設計
1、視覺概念稿
正式視覺設計之前，挑幾個典型頁面設計不同的風格稿，等評審確定視覺風格後，再進入下一步工作，避免推翻重做的風險。
2、視覺設計圖
視覺設計也是一個很複雜的工作流程，影響一個產品展現在用戶面前最直觀的印象，需要延續用戶體驗設計原則和良好表達產品風格。視覺設計之後還需要建立標準控件庫和頁面元素集合等視覺規範，使團隊的工作統一化，標準化。如下圖：
3、標註切圖
web的視覺設計完成後，需要給設計稿做標註，方便前端工程師切圖，標註的內容主要是邊距，間距，控件長寬，控件顏色，背景顏色，字體，字體大小，字體顏色等。移動端的設計稿不僅需要標註，還需要切圖，把頁面控件拆分成小圖片，方便開發實現。切圖要注意的就是不同分辨率，比如ios的切圖就分為1倍圖，2倍圖，3倍圖來適應不同分辨率。切好的圖片按照頁面和模塊名稱或以不同分辨率進行分類放入不同文件夾。
四、工作流程的開展形式
實際的工作環境下，下游的人不會按部就班的等上游的人完成所有工作，才開始進行自己的工作。在複雜的項目中，會將大項目拆分成不同的週期版本，按不同版本配合工作，如產品經理完成第一週期的工作後交付給交互設計師，交互設計師在進行第一週期的工作時，產品經理已經進入第二週期，然後所有上下游人員都這樣順延工作，提高效率。這來源於敏捷開發的工作思想，當然中間還有很多高效快速的工作方法，這裡不多討論。
還想跟大家說一個小的思路，就是讓下游的人在做工作時候都提前一個階段或者兩個階段參與上游工作，不要等著上游有了輸出物後才開始工作，花幾個小時時間，會讓自己的工作思路更清晰，減少很多溝通成本和撕逼。比如在做核心流程時拉著開發負責人一起探討，開發心中有數，等交付原型時，不用產生太大分歧。之前所在團隊在需求分析階段會多次拉著測試一起討論，每次花一兩個小時的時間，省去的是測試階段幾倍的溝通時間。
標準化工作流程主要是為了規避問題，提高效率，不是為了標準的工作流程去做工作，每個公司的流程都被人員配置，項目週期，甚至公司文化影響著，不論什麼樣的流程，能夠達到工作目標的流程就是好流程。
閱讀更多 Marketing聯盟 的文章
