10款互動設計原型開發工具

標籤：des   blog   http   io   os   使用   ar   檔案   資料   

所謂“工欲善其事，必先利其器”，雖然小米加步槍能夠也能夠打敗敵人，但假設朱棣有了坦克裝甲部隊，那豈不是更easy平定安南？

關於原型開發工具，各有哥的使用習慣，有人喜歡axure、photoshop，也有人喜歡手繪，robert還見到過高人直接用excel製作的互動原型，不僅可以布局，還具有主要的連結和跳轉功能，相當佩服。工具僅僅是實現目標的一個手段，因此選用何種工具全然基於個人的習慣及方便。當然在某些公司為了便於不同的設計師之間進行交流以及重用而規定使用同樣的工具，那就另當別論。

以下僅僅是個人所使用過的而且覺得值得推薦的工具，我儘可能的將其便利性與不足寫出來，當然假設您發現有所不足或有很多其它的補充，也歡迎隨時和我聯絡。

1、Axure RP（Rapid Prototyping）

Axure（讀音為Ack-Sure）無疑是眼下最受關注的原型開發工具，其能通過組件的方式協助網站或軟體設計師高速建立帶有凝視的原型（流程圖、線框圖），並憑藉自己定義可重用的元件、動態面板以及豐富的script可以建立準系統或頁面邏輯的動態示範檔案。

Axure借鑒了office的介面，可以讓使用者高速上手，而且提供了豐富的組件樣式改動，使得通過其可以建立低傳真、高保真甚至接近於實際效果的介面。然而最讓人稱道的是，Axure的豐富的指令碼模式，可以通過點擊和選擇可以高速完畢介面元素的互動，如連結、state切換、動態變化等效果，使得Axure可以產生十分接近於真實產品的原型。還有一方面，Axure可以匯入其它人建立的元件庫，使得Axure可以滿足絕大多數類型產品的設計。

但Axure仍然有一個讓人頭痛的問題：對於中文的支援不太友好。在小部分元件上輸入中午的時候，常常須要像碰運氣似的重複切換IME，破壞了咱們設計師的使用者體驗。

瑕不掩瑜，Axure仍然是互動設計師的首選原型工具。

2、Microsoft Office Visio

Visio在2000年被微軟收購，並在2002年成為office2003套件中的一個組件，最新版本號碼是2007。Visio可以獲得推薦的原因是由於Visio的適用性很之廣，從網站介面、資料庫模型，到平面布置圖到工藝流程圖，Visio都提供了對應的元件庫和模板來進行高速建立。

相較Axure而言，Visio更適合於傳統行業的生產或流程設計，或者軟體及互連網行業中的資訊、資料和流程的說明，而不太適用於web介面。由於其的基於web的元件庫還是比較少，而且形式和結構也更相似於word中的圖形工具，因此在原型開發效率上都有所不足。

3、Balsamiq Mockups

這個基於Adobe AIR Runtime的工具實在是有讓人眼前一亮的感覺，手繪風格的元件樣式粗獷淋漓，能建立接近於紙上手繪的原型檔案。其提供了豐富的手繪風格的web經常使用元件，包含經常使用的html控制項、以及一些群組控制項，如多媒體控制器、標籤頁、列表、Iphone介面元件等。

Mockups最值得觀賞之處在於其提供的多數組件都可定製外觀，對於中文的支援也不錯（選擇View > Use System Fonts）。

4、Mockflow

Mockflow和以上工具最大的不同在於Mockflow是一項基於Adobe Flex技術開發線上服務，提供了與Balsamiq Mockups基本類似的功能，甚至更豐富的組件，儘管其元件定製化不夠強大，但其提供的元件庫預設樣式卻很適合用來做商業產品原型的搭建。有一個讓我愛不釋手的功能是模板，能夠設定基於不論什麼頁面的模板來進行新的頁面設計。

與其它模板工具相比，mockflow有一個很特色的功能，基於web的儲存能夠在隨意電腦上聯機開啟，同一時候能夠其它人進行高速的分享，並收集線上反饋意見，很適合虛擬團隊的原型設計交流。

儘管線上服務的基本帳號僅僅能建立一個檔案，但單個檔案卻沒有限制頁數，因此也基本上足夠使用。

5、Pencil sketch

Pencil 是一款基於Firefox的向外延展群組件，安裝之後就可以在Firefox的工具菜單中開啟Pencil的畫圖面板。功能比較簡單，僅能用以日常簡單工作的輔助 說明。提供的預設元件都是基於軟體project，因此更適合用於windows傳統型程式的簡易介面搭建，或者是主要的頁面功能說明，並不適用於嚴肅的原型開發，但 好在體積小、又輕便，可以方便將網頁中的元素直接拖到或者拷貝到當前的畫布中，這也是Pencil安裝在Firefox所帶來的便利之中的一個吧。

很多其它工具...

在以上列舉的原型開發工具都是較為經常使用的，也是在國內的互動設計師們比較常討論的，但事實上和Axure功能類似的軟體還有非常多，以下也就一些簡單說明：

6、GUI Design Studio

這 是一款真的非常強大的原型製作工具，沒有在上面推薦的原因是由於我還沒有實際體驗過，但衝著這project級的介面設計就沒有去嘗試的衝動，可是從官方網站的 和視頻示範來看，這款軟體的操作模式和前面的原型工具大有不同。Axure之類多是基於頁面的原型設計，對於web網站雖然非常有用，可是對於軟體介面的流 程設計卻略顯繁瑣。而GUI Design Studio卻另闢蹊徑，直接以建立元素與元素之間的關聯的方式來自己主動化的建立動作流程，而從視頻示範來看，這種確非常大程度上提升了軟體介面原型搭建的 效率。

7、Prototype Composer

Serena 公司免費提供的原型開發工具，功能確實強大，提供了基於專案管理主要流程的產出物文件範本、原型工具以及開發流程式控制制，這個軟體的開發理念很好，用這一 款工具來滿足項目開發流程中各個環節的溝通和決策。但軟體的學習和使用成本比較高，要瞭解當中的所有功能，貌似須要花不少時間。另外軟體的效率和穩定性還 有待提高，試用的過程中多次出錯及停止回應。

8、Lucid Spec

由 Elegance科技推出的Lucid Spec是一款非常相似Pencil的原型工具，只是提供了很多其它控制項。只是Lucid Spec強調了產生乾淨的說明文檔的功能，這可能是針對於多數原型工具的自己主動化產生規範的冗餘而言的，只是老實說Lucid Spec提供的原型介面太過簡陋，而且產生的說明文檔也未見最佳化有如何的提升。視頻介紹

9、Irise Professional Edition

Irise與其它原型工具相比當中一個特色在於提供了樣本資料的功能，這是相似於excel表的一個樣本資料庫，能夠通過介面元素直接擷取樣本資料庫中的資料，這樣所產生的原型甚至能夠使動態資料更新的。

10、Adobe Reader

Adobe reader？沒錯。事實上理論上不論什麼能夠建立圖形和文本的工具都能夠用來原型開發，由於原型本身就是對於商務邏輯和功能介面的類比或模擬，因此有何理由不能使用PDF格式呢？BoxandArrow的這篇文章《PDF Prototype》提醒了我們，全部的原型工具都僅僅是工具，而不是設計本身。

當然原型工具還有非常多，您能夠在這篇文章對照很多其它可用以進行原型開發的工具。

 

10款互動設計原型開發工具