好的產(chǎn)品要表達清晰離不開一個好的原型。而一個合格的產(chǎn)品經(jīng)理也都是從畫好產(chǎn)品原型開始的。

什么是原型？

"快速產(chǎn)品實踐 "。

"原型"的定義簡而言之，首先原型不是最終產(chǎn)品，而是"快速實踐"——可以通過收集反饋來測試產(chǎn)品方案。

產(chǎn)品原型也是一種溝通工具，幫助數(shù)字設計師（專家）向用戶或客戶（非專業(yè)受眾）傳達他們的想法，再通過反饋改進產(chǎn)品。原型設計并不是傳達產(chǎn)品概念的唯一方法。有大量的替代方法，如線框圖、流程圖、信息體系結(jié)構(gòu)、可視化模型等。

但是原型的特點更為突出。

1.真實而有形

如果一張圖片價值1000字，那么一個原型價值1000場會議?！?— Tom＆David Kelley

• 對于我們的大腦來說，比起抽象的信息，我們更容易通過視覺和有形的經(jīng)驗快速處理信息。在這基礎上，原型作為一個只需幾次點擊就能完美地解釋一個概念的東西，可以很好的降低了產(chǎn)品復雜性。

• 對于客戶，（高保真）原型是開發(fā)之前最接近真實產(chǎn)品的演示。原型的直觀性不僅能夠讓他們做出更好的決策，而且還可以幫助他們輕松地將概念傳達給其他人以取得認可。

• 對于用戶，原型使他們能夠以最真實的形式體驗產(chǎn)品，從而產(chǎn)生真實的反饋，而不是聽過想象得到的反饋。

“ 如果產(chǎn)品看起來不真實，那么用戶的反應就不會真實?！?—杰克·納普（Jake Knapp）

對于團隊本身，可以使用原型進行說明和調(diào)整。尤其適用于行為和過渡。對于設計系統(tǒng)組件，也許有 20 條驗收標準，但是原型的鏈接就能解釋了一切。

2.快速迭代

僅使用最終產(chǎn)品進行方案驗證是有風險的。

在設計過程的任何階段制作和測試原型，并收集反饋以改進產(chǎn)品，有助于團隊在開發(fā)或發(fā)布之前快速的重塑產(chǎn)品（一旦發(fā)布，你可能會轉(zhuǎn)向分析）。

產(chǎn)品原型，不是在產(chǎn)品設計和測試結(jié)束時制作的，而且貫穿了始終，需要隨時創(chuàng)建和調(diào)整原型，僅需在3到4天，完成一個從草圖到測試原型的過程（當然，這取決于項目的需求和能力）。

3.省錢

對產(chǎn)品進行編碼很昂貴。原型不費錢。

原型通常是由產(chǎn)品創(chuàng)建的。這樣的設置使開發(fā)團隊可以在設計師探索或驗證概念時專注于開發(fā)。一般來說，編寫可測試產(chǎn)品的代碼涉及前端，后端，設計和質(zhì)量保證測試（QA），而原型只需要一名產(chǎn)品經(jīng)理。

如何制作原型？

1.考慮目標、受眾和能力

設計過程的每個階段都有其目標：

• “定義”：綜合階段，在該階段中，研究結(jié)果為制作產(chǎn)品的范圍或方向。在此階段，可以將低保真原型用作“概念驗證”。這些原型的受眾目標是用戶和客戶，把他們的真實地反應、反饋收集起來。這樣產(chǎn)品的假設將會得到驗證。

• 調(diào)研時關(guān)鍵問題要圍繞“用戶是否看到產(chǎn)品原型中的價值”？一旦團隊確定了方向，就開始對產(chǎn)品的要求進行修訂，然后順利進入下一階段“開發(fā)”。

• “開發(fā)”：構(gòu)想階段，在此階段創(chuàng)建并驗證各種解決方案。原型在這時主要用于測試目的，通常需要制作的更加詳細（中?；蚋弑Ｕ妫?。團隊可以快速測試出不同的選項，并根據(jù)測試結(jié)果做出更好的決策。

  
  

• “交付”：團隊構(gòu)建、測試、學習和迭代的實施階段。開發(fā)人員很可能已經(jīng)開始開發(fā)。但仍然可以制作原型進行測試，或用來與團隊成員進行交流和調(diào)整設計。

2.從低保真度（lo-fi）到高保真度（hi-fi）

我們使用保真度來區(qū)分原型，從低保真開始逐漸轉(zhuǎn)向高保真是最常見的方法。如果打算用設計技巧來打動利益相關(guān)者，早期階段就設計帶有精美視覺技巧的高保真原型也是有必要的。

高保真與低保真的區(qū)別在于：

交互性（靜態(tài)或可點擊）

視覺效果（草圖，線框或最終界面）

內(nèi)容（接近真實或?qū)嶋H內(nèi)容）

四款優(yōu)秀的原型工具

Axure

產(chǎn)品原型工具-Axure

學習曲線：高

簡介：Axure RP是美國Axure Software Solution公司旗艦產(chǎn)品，是一個專業(yè)的快速產(chǎn)品原型工具，讓負責定義需求和規(guī)格、設計功能和界面的專家能夠快速創(chuàng)建應用軟件或Web網(wǎng)站的線框圖、流程圖、原型和規(guī)格說明文檔。作為專業(yè)的原型工具，它能快速、高效的創(chuàng)建原型，同時支持多人協(xié)作設計和版本控制管理。

優(yōu)點：變化多端的操作，自帶組件庫并支持強大的第三方組件庫，提供強大的交互支持，完整的教程及支持文檔，支持原型預覽。

缺點：學習曲線較高，性價比不高，專業(yè)需求度高。

Wireframe sketcher

學習曲線：較低

簡介：WireframeSketcher是一款強操作靈活、功能強大的線框圖工具?？蓭椭O計人員，開發(fā)人員和產(chǎn)品經(jīng)理快速創(chuàng)建用于桌面，Web和移動應用程序的線框和原型。值得一提的是Wireframe Sketcher還是一款帶有手繪風格的創(chuàng)作工具，這在一定程度上可以幫助用戶專注于設計。除此之外，這款產(chǎn)品原型工具還提供大量的UI控件，支持通過鏈接創(chuàng)建交互原型，靈活的Wiki形式，線框圖注釋，生成PDF文檔等。

優(yōu)點：操作靈活，繪制頁面速度很快，功能強大，支持手繪風格，提供大量模板，可以進行原型導出。

缺點：僅支持低保真，交互效果較少。

Balsamiq Mockups

Balsamiq官網(wǎng)界面

學習曲線：較高

簡介：Balsamiq Mockups是一款軟件工程中快速產(chǎn)品原型工具，可以作為與用戶交互的一個界面草圖，一旦客戶認可也可以做為美工開發(fā)HTML的原型使用，特別是在web原型圖設計領域有不錯的影響力。使用Balsamiq Mockups畫出的原型圖都是手繪風格的圖像，看上去非常美觀、清爽。此外，這款工具支持幾乎所有的HTML控件原型圖，比如按鈕（基本按鈕、單選按鈕等）、文本框、下拉菜單、樹形菜單、進度條、多選項卡、顏色控件、表格、Windows窗體等。除此以外，還支持iPhone手機元素原型圖。

優(yōu)點：雖然不是免費原型工具，但性價比也算不錯；工具內(nèi)置大量模塊，能夠快速應用于原型設計，支持手繪風格。

缺點：原型沒有配色，沒有設計風格，不能進行交互展示。

摹客RP

學習曲線：低

簡介：摹客原型設計采用基于Web的全新架構(gòu)，不需要下載安裝，不受設備系統(tǒng)的限制，通過瀏覽器即可快速進行原型設計。摹客原型自帶鋼筆、鉛筆等矢量工具，可幫助用戶自由完成設計。設計完成后可以和團隊成員無縫協(xié)作，輕量設計還能直接交付開發(fā)，真正實現(xiàn)“從創(chuàng)意到落地”。

優(yōu)點：

支持多人同時在線編輯同一項目，支持頁面交互、狀態(tài)交互、命令交互，以及設置多種觸發(fā)方式和曲線，快速制作交互原型。

缺點：不支持離線使用