產品人必備乾貨：產品開發流程（完整版）

1 引言

1.1目的

基於如今的開發流程中缺乏的環節進行補足，使得開發流程更加的流暢和正規化，以便之後的查閱與歸檔使用。面對互聯網行業中激烈的競爭，讓咱們的開發流程更完整、更有效率，產品才能脫穎而出。

1.2範圍

本文檔適用於產品的研發，主要流程包括：產品需求、交互原型、視覺設計、資源輸出、前端開發、後臺開發、測試等環節。之後的產品開發流程也能夠參考此文檔的環節進行開發。

1.3 讀者對象

本文檔的目標讀者對象包括：

• 需求工程師：主要根據文檔來提供給相關人員須要的文案，給出相應文檔。
• 交互設計師：根據文檔設計原型圖，並查看須要產出的資源有哪些，怎樣與產品、  開發人員合做。
• 視覺設計師：根據詳細設計文檔做爲視覺設計的步驟和資源產出的依據。
• 前端工程師：根據詳細設計文檔中提供的資源編寫代碼。
• 測試工程師：根據詳細設計文檔來覈實頁面內容與軟件實現效果是否一致。

2 需求整理

需求文檔由產品經理負責編寫，應整理完需求輸出一份《產品需求文檔》和《設計文檔》。

2.1人員評估

2.1.1 參與人員

產品經理

2.1.2 時間節點

由產品負責人規範產品功能需求文檔產出的時間節點。

2.1.3 預估工做量

由產品負責人規範產品功能需求文檔產出的工做量。

2.2 肯定產品功能

在拿到一個新的產品之前，產品經理應該把需求進行一次整理，看哪些是真需求？哪些是邊緣需求？哪些是僞需求？進而把功能點、產品賣點思路整理清晰，再有條件的狀況下作一份《市場需求文檔MRD》。

2.3 編寫需求文檔PRD

編寫需求文檔的時候給不一樣的人看，具體的內容由產品經理產出，產品需求文檔主要給軟件開發、測試人員、外部人員查看。

2.4 編寫設計文檔

設計文檔主要是用於設計人員在畫圖以前對整個產品的把握。設計文檔由產品經理主寫，交互人員輔助。由於產品在寫文檔時候的角度是在站在寫程序的方向寫的，設計人員要把交互原型所須要的東西提交於產品經理，輔助完成設計文檔，PC端和移動端的設計文檔要分開來編寫。

設計人員須要作：

把產品原型圖須要的內容提交給產品經理，並輔助產品經理完成編寫。

產品經理根據設計人員提供的要求須要提供如下內容：

• 功能類：功能流程圖 、產品的功能點、主要功能賣點。
• 模塊的內容：文字文案、各功能描述、彈出框內容文案，各模塊之間關係。
• 邏輯類：各模塊業務邏輯、結構框架圖。

功能流程圖示例：

在有一些比較複雜的流程的時候，怕開發人員或是設計人員不是能理解的狀況下，要把流程圖畫出來。可是一個完整的項目只用一個流程圖是不可能完成的，因此須要按照模塊的流程逐個進行分類，分類之後按照功能的不一樣、簡易程度，分別畫出流程。

3 交互原型

交互原型是在設計文檔評審經過後，安排頁面上每一個功能的具體位置，交互方式和跳轉方式，由產品經理輸出所有交互原型圖、原型圖解釋文案，如沒有產品經理由設計部門完成。

3.1 人員評估

3.1.1 參與人員

由產品經理完成，如沒有產品經理可由設計部門完成。

3.1.2 時間節點

在設計文檔評審沒有問題的前提下，開始交互設計，而後根據時間具體安排

3.1.3 預估工做量

按照不一樣平臺和具體完成的時間來評估工做量。

3.2 製做交互原型圖

目標觀看人員：測試人員、視覺設計人員、前端設計人員等。

交互原型圖具體要求：

1. 不要加入視覺設計的元素。着眼於大局，不要糾結細枝末節。
2. 工具不限，產品經理最好用axure完成動態，如沒有，需設計人員用AI或ps完成。
3. 按照頁面流程中所考慮的交互過程，體如今原型上面。出錯，提示等交互細節也應有體現。
   

   3.3 原型圖解釋文案

   在畫交互圖的開始就要記錄下來。

解釋文字具體要求：

每一個頁面之間的聯繫，承接關係。

頁面當中的細節跳轉，按鈕的不一樣狀態，彈框的提示文字，日曆的跨年跨越顯示效果，小數點是否保留(若保留，保留到後幾位數字）等。

或是在不一樣狀況下按鈕的使用狀況。

4視覺設計

在交互評審經過後，負責把控UI總體風格和全部視覺效果的設計，主要輸出：VI選擇的方案、全部視覺效果圖、資源包等。

4.1人員評估

4.1.1 參與人員

UI設計人員

4.1.2 時間節點

在交互原圖評審經過後，按照項目複雜程度在來具體安排時間節點

4.1.3 預估工做量

按照不項目複雜程度和具體完成的時間來評估工做量。

4.2 視覺識別系統

在一個項目開始以前，這是任務是必需要作的，除了延續性的項目，之後給每個項目都要作這個視覺識別，不是設計師腦中的印象而是要落實到文檔與圖片展現。

由UI設計人員作3套以上UI設計方案，方案包括:顏色、logo、總體風格、icon等效果圖，而後開會評審確認其中一套風格，評估確認後方可進行接下來總體的界面設計，這樣避免了一我的接受項目之後交接給別人視覺上會有誤差的問題。另外一個是解決了項目後期的問題，好比之後宣傳單、手冊設計或是名片設計，都是一種風格一種顏色。

4.2.1  顏色的設定

顏色的設定要有理有據，開會的時候會有不少人會問你爲何要用這個顏色，這個顏色表明什麼，這些最好在作設計的時候就要想好。

舉個例子：

當咱們拿到一個項目的時候交互是已經完成一小部分了，咱們能夠拿着這一小部分進行設計定位，這時候咱們須要瞭解的是：這是一個什麼類型產品？這個產品的目標人羣是哪些？這個產品的年齡段是哪些？這個產品的生命週期是多久？

4.2.2  LOGO的設定

通常狀況下咱們公司不須要作logo，可是若是有須要的話就要按照logo的製做流程進行設計。

主要內容有：logo的設計思路，logo的顏色、logo的應用場景等。

4.2.3  總體風格的設定

整理風格設計是須要作顏色、板式、icon等系列的設計。在總體風格肯定前不須要作其頁面的視覺設計。

4.2.4  icon的設定

俗話說細節決定成敗，icon在設計中就佔有細節這個位置。

每個icon的設計要跟總體頁面的風格保持一致，這樣才能保證全部頁面設計完成之後風格是保持統一的。

4.3 視覺頁面設計

4.3.1 主要頁面的評審

主要頁面的評審對於設計開展後面的工做十分重要，設計師須要在評審的時候講述本身的設計思路，包括顏色的設計理由，風格的設計理由等，講述清楚，要讓參與人員瞭解到你在作設計的時候思考的內容，而不僅僅是製做圖。

4.3.2 總體頁面的設計

具體要求以下：

1. 在基於視覺風格已肯定的狀況下，按照交互原型圖逐個頁面進行設計。
2. 在設計中對於細節的把握要準確。
3. 在視覺設計中咱們要考慮到不一樣平臺的特性，根據不一樣平臺進行設計，切勿混淆各平臺的控件。
4. 在某些須要適配的移動端上面，或是H5的設計中，要考慮到尺寸的問題。
5. 在設計中一些容易忽視的頁面也要作出來，好比：斷網頁面、連不上wifi頁面、404頁面、正在加載 等展現效果。

4.4 資源輸出

咱們在設計評審經過後，接下來會進行一項比較重要環節，跟前端開發合做實現效果。

這個時候咱們須要輸出5個文件資源，具體資源包分別是：

視覺效果圖的尺寸標註、全部尺寸的切圖資源包、解釋文案、效果圖源文件、所有視覺效果圖。

4.4.4  編寫總結規範

在一款產品結束後，設計人員須要作一份設計總結，就是對如今這一版本進行視覺規範，這也是對設計師工做的一個總結。

在對下一版的開發也是頗有幫助的，大大增長了開發者的效率。

5優化體驗點的編寫

這個是在項目已經成功上線後，第二版還沒開始前，咱們要對現有的一個版本的體驗點進行優化。

這部份內容，開發人員和用戶研究人員一塊兒參與。

• 具體內容有：
• 對現有產品的一些功能須要優化的點的記錄，有哪些不足之處。
• 基於用戶的反饋，哪些功能是能夠省略的，哪些是要強調的。
• 有哪些更好的想法能夠用在下一個版本中的。

結束 謝謝觀看！