原型設計是交互設計師與PD、PM、網站開發工程師溝通的最好工具。而該塊的設計在原則上必須是交互設計師的產物，交互設計以用戶為中心的理念會貫穿整個產品。利用交互設計師專業的眼光與經驗直接導至該產品的可用性。

簡單說，“原型”是在項目前期階段的重要設計步驟，主要以發現新想法和檢驗設計為目的，重點在于直觀體現產品主要界面風格以及結構、并展示主要功能模塊以及之間相互關系，不斷確認模糊部分，為后期的視覺設計和代碼編寫提供準確的產品信息。

目的：

下列角色使用用戶界面原型：

用例闡釋者，用來了解用例的用戶界面；

系統分析員，用來了解用戶界面如何影響系統分析；

設計員，用來了解用戶界面如何施加影響及它對系統“內部”的要求；

類測試人員，用來制定測試計劃活動。

如何高效完成優秀原型設計，工具自然非常重要。下面我們介紹一些常用的原型設計工具，供大家參考。

Axure Rp

Axure RP是美國Axure Software Solution 公司的旗艦產品，該原型設計工具可以專業快速地幫助完成定義需求規格負責設計功能和界面的原型設計者快速創建應用軟件或Web網站線框圖、原型、規格說明書等。Axure所針對的用戶包括用戶體驗設計師（UX）、交互設計師（UI）、業務分析師（BA）、信息架構師（IA）、可用性專家（UE）和產品經理（PM）等等。

Axure RP 能讓操作它的人快速準確的創建基于Web的網站流程圖、原型頁面、交互體驗設計、標注詳細開發說明，并導出Html原型或規格的Word開發文檔。（通過擴展還會支持更多的輸出格式）

• 網站架構圖   (Site Structure)
• 示意圖       (Wireframe)
• 流程圖       (Flowchart)
• 交互設計     (Interaction Design)
• 原型設計     (HTML Prototype)
• 規格文檔     (Specification)

用Axure RP設計線框圖和原型會有效提高工作效率，同時方便團隊成員一起完成協同設計，可以向用戶演示和交流以確認用戶需求以及自動產生規格說明書，極大地優化工作方式：設計更加高效、可快速體驗動態原型，幫助清晰有效的溝通。Axure RP的可視化工作界面以讓用戶輕松快速的簡單用鼠標拖拽的方式創建帶有注釋的各種線框圖。無需編程，就可以在線框圖上定義簡單鏈接和高級交互。同時該工具支持在線框圖的基礎上自動生成HTML原型和Word格式的規格說明書。

Balsamiq Mockup

Balsamiq Mockups是一款快速原型的設計軟件，由美國加利福利亞的Balsamiq工作室推出，它真正抓住了原型設計的核心與平衡點——既能快速設計草圖，又能較好地進入到平時團隊工作的流程和工具。它基于Adobe Air，能夠流暢的在不同瀏覽器，不同操作系統平臺下完美運行，可以在線使用，亦可以離線使用，能夠很順利地將其安裝在Windows 7、FreeBSD、Ubuntu等平臺中，高效率地完成每個原型設計任務。

Balsamiq Mockups具有極其豐富的表現形式，設計效果非常美觀。它支持幾乎所有的HTML控件原型圖，比如按鈕（基本按鈕、單選按鈕等）、文本框、下拉菜單、樹形菜單、進度條、多選項卡、日歷控件、顏色控件、表格、Windows窗體等。除此以外，它還支持Phone手機元素原型圖，極大地方便了開發iPhone應用程序的軟件工程師。

Pencil Project

Pencil Project最初只是firefox的小插件，曾經得過Firefox插件Grand Prize大獎第一名，后來發布了獨立軟件。這款手繪風格的開源原型設計工具可以用來繪制各種架構圖和流程圖。Pencil Project內置豐富模板，可創建具有背景的多頁面文檔，支持文檔內超鏈接跳轉，支持富文本功能的文字處理，支持安裝自制畫筆和模版，具備所有標準繪圖功能如對齊、堆疊層級、縮放、旋轉等，支持添加外部對象，跨平臺……可以創建可鏈接的文檔并輸出成為HTML、PNG、OpenOffice、Word、PDF等格式的文件。

Prototype Composer

Prototype Composer是一款Serena出品的能夠讓非技術型的用戶進行原型設計的免費軟件，同時它還包括商業過程、活動、用戶界面、需求和數據，不但可以制作界面原型，方便用戶在代碼編寫之前直觀預覽到網站的運行流程，同時還可以用來做項目管理，包括需求管理，數據管理。

Prototype Composer提供了完整的集成環境，可輕松進行設計、建模，在進行開發之前使得商業應用軟件合理化。該軟件能夠以可視化的形式描述軟件的工作模型，提供可定制的Word格式說明書模板庫，可自動組裝上從模型中產生的數據，一鍵創建需求、功能、技術規格說明。

Omni Graffle

Omni Graffle軟件由Omni Group公司出品，可以在OS X平臺上輕松繪制漂亮的圖表、樹狀結構圖、流程圖、頁面等，可以用來規劃電影或劇本的情節走向、繪制公司組織圖、專案進度等等。該軟件界面非常漂亮，模板豐富精致，容易激發靈感，輔助對齊和尺寸調整功能強大。目前還推出了iPad版本的應用（328元）。

GUI Design Studio（GDS）

GUI Design Studio是面向應用軟件設計圖形用戶界面的專業工具，特別適合客戶端軟件設計。該軟件能夠快速將設計思路以可視化的方式來表現出來，并實現基本的交互，便于演示以及與客戶完成有效溝通交流。GUI Design Studio是不需要軟件開發和編碼的完整的設計工具，它支持所有基于微軟Windows 平臺的軟件，提供的了大部分C/S、B/S組件的示意圖，可組合使用，是一款非常款適合界面原型設計者和界面原型開發員的軟件，能夠滿足一般軟件界面模型設計需要。

Office組件

大家熟悉的Office套件中有不少組件都可以用在原型設計中：如Visio、PPT、Word、甚至Excel等，但是操作過程相對比較繁瑣。

Visio：功能相對豐富，操作復雜。適合畫流程圖，框架圖。不利于批注與交互的表達與演示。
Word：可以畫線框圖、流程圖，添加批注與文字說明。對交互表達不好，不利于演示。
PPT：易于畫框架圖、做批注，也可以表達部分交互流程，擅長演示。

Adobe設計組件

一些視覺設計出身的原型設計人員因為軟件使用習慣的原因，會選用Adobe的一些平面和網頁設計工具來做原型設計工具。

Photoshop/Illustrator：操作難度相對較大，易于畫框架圖、流程圖。不利于表達交互設計，不擅長文字說明與批注。
Dreamweaver：操作難度大，需要基礎html知識。易于畫框架圖、流程圖、表達交互設計。不擅長文字說明與批注。

紙筆

當然，我們最傳統的紙筆也是非常重要的原型設計工具，幫助我們在設計初期記錄和整理思路，繪制最初的草稿。

除了上面我們提到的這些，現在還有很多很多相關的原型設計工具他們各有特點，大家可以選擇自己習慣地使用，也歡迎在文章末尾分享您的意見。無論是桌面軟件、Web網站還是移動APP界面，原型設計都是產品設計流程中非常重要的一環，原型設計在一定程度上是為了說明用戶將如何與產品進行交互，用來展現最初的產品設想，起到直觀展示和有效溝通的作用。原型設計需要體現出用戶在每個頁面上期望看到的內容，以及這些內容在頁面上的相對優先級，展示內容和結構及粗線條的布局，而不是視覺設計。原型是一個概念到實現的過渡，是不同部門對話的交流介質，重點在于溝通和幫助項目成員（比如團隊中的工程師與設計師等）理解產品需求。 從整個項目的角度講，在原型的設計與溝通過程中發現問題并加以調整，將更有效地避免將問題留到視覺設計和開發流程中，有效提高開發效率。