【注：原創(chuàng)文字，singgo首發(fā)于Verycd，轉(zhuǎn)載請(qǐng)注明原作者和出 處】
一、所謂原型系統(tǒng)
所謂原型系統(tǒng)，用最簡單的話來說，就是用一套工具來快速描述系統(tǒng)的界面和交互，而不需要涉及底層業(yè) 務(wù)的真正代碼開發(fā)實(shí)現(xiàn)。
原型系統(tǒng)在軟件的開發(fā)和實(shí)施項(xiàng)目中，可以有效降低需求交流過程中可能發(fā)生的信息衰減或失真，以最快的方式讓系統(tǒng)用 戶或者軟件工程師了解系統(tǒng)的功能組成和業(yè)務(wù)交互關(guān)系。
二、兩個(gè)具有代表性的原型系統(tǒng)工具
之前所常用到的原型系統(tǒng)工具，是 Axure RP Pro 5系列，而最新發(fā)現(xiàn)的，是另外一個(gè)工具，Balsamiq Mockups，目前的版本是1.7.6。
通過一 天時(shí)間對(duì)Balsamiq Mockups的試用，這兩者各自具有其鮮明特點(diǎn)，如果通過比喻來區(qū)分的話，Axure RP Pro 5像是一個(gè)商務(wù)男士，穿著整齊的套裝，結(jié)著領(lǐng)帶，樸素，簡樸，中規(guī)中矩，甚至有些古板；而Balsamiq Mockups則像是一個(gè)憂郁卻富有靈氣的藝術(shù)家，身著寬松的深灰亞麻休閑裝，動(dòng)作敏捷，但儀態(tài)閑適散漫。
這是兩者的主界面：
1、 Balsamiq Mockups
2、Axure RP Pro
三、對(duì)比
1、安裝
Axure RP Pro是一個(gè)標(biāo)準(zhǔn)的應(yīng)用軟件，按照常規(guī)方式安裝，安裝完成后，在30M之內(nèi)，這沒有計(jì)算附加組件所占用的空間。
Balsamiq Mockups的安裝和運(yùn)行于依賴Adobe AIR，這是一個(gè)跨操作系統(tǒng)運(yùn)行環(huán)境，用于建立富應(yīng)用，所以在安裝時(shí)必須要下載Adobe AIR。MockupsForDesktop.air文件為4M多。
2、組件資源
在原型系統(tǒng)的設(shè)計(jì)中，組件資源對(duì)我們來 說至關(guān)重要。
Axure RP Pro缺省的線框圖（組件）資源，顯得頗有些寒酸，但幸運(yùn)的是，你可以加掛線框庫，實(shí)際上，這些加掛的線框庫每次在啟動(dòng)Axure RP Pro時(shí)都要手工裝載，每次都多這么一個(gè)動(dòng)作，一定程度上會(huì)讓人覺得厭煩。
Axure RP Pro的線框圖，是標(biāo)準(zhǔn)樣式，和Win應(yīng)用程序中看到的一模一樣，甚至在設(shè)計(jì)Web應(yīng)用原型界面的時(shí)候，你會(huì)覺得它非常簡陋，當(dāng)然這只是原型系統(tǒng)，不妨可 以寬容一些。
Axure RP Pro的線框圖如下所示：
而Balsamiq Mockups的組件資源，相對(duì)于Axure RP Pro的缺省線框庫，要顯得豐富一些，而且Balsamiq Mockups的藝術(shù)家涂鴉風(fēng)格，令Balsamiq Mockups所制作的界面效果更具趣味性。
3、頁面資源的組織策略
在Axure RP Pro中，提供了組成原型系統(tǒng)的各類頁面、流程的組織功能，這個(gè)功能可以使設(shè)計(jì)者全面把控原型系統(tǒng)的功能組織和交互關(guān)系，特別的，對(duì)于基于流程的業(yè)務(wù)功 能，還可通過流程圖來描述業(yè)務(wù)承接關(guān)系，并在流程的各個(gè)節(jié)點(diǎn)上展示其功能模型，這對(duì)設(shè)計(jì)復(fù)雜原型系統(tǒng)，具有非常重要的意義。
下圖是 Axure RP Pro的頁面資源組織效果圖。
在這方面，Balsamiq Mockups顯得就比較單薄，僅僅是頁面，也只有頁面。頁面間的關(guān)系都是平行的，缺乏層次感，沒有體現(xiàn)項(xiàng)目組織的概念，從這點(diǎn)上來說，如果頁面間存在上 下業(yè)務(wù)隸屬關(guān)系，目前的這種組織方式將難以體現(xiàn)，而且平行頁面太多，會(huì)鋪陳的比較散，從這個(gè)功能上來看，Balsamiq Mockups存在著明顯不足。
下圖是Balsamiq Mockups的頁面資源組織：
4、組件資源的組織和使用
缺 省情況下的Axure RP Pro組件資源，就是那么一堆，線框圖和流程圖分開各自一堆，上下拖動(dòng)滾動(dòng)條后撿取自己所需的組件，如果輔助組件庫比較多的話，可能會(huì)比較費(fèi)時(shí)間。當(dāng) 然，Axure RP Pro也提供了組件檢索功能，但這個(gè)檢索功能擺放的位置和使用的便利性，頗令人感覺有點(diǎn)雞肋。
而Balsamiq Mockups的組件資源分別按“All”，“Big”、“Button”、“Common”、“Layout”、“Markup”、“Midia”、 “Text”、“IPhone”分類組織，這個(gè)分類組織順序不能完全照顧到每個(gè)人的試用習(xí)慣，也沒有提供個(gè)性化拖拽改變次序的功能，但因?yàn)樘峁┝?“Quick Add”和快速檢索功能，倒也在一定程度了改善了選取組件的效率。
相對(duì)來說Balsamiq Mockups的組件資源的組織和數(shù)量上，相比Axure RP Pro要?jiǎng)俪鲆换I。
但兩者都有著共同的不足，如多級(jí)化的菜單，不支持嵌 入flash等。雖然Balsamiq Mockups的組件比較豐富，但也發(fā)現(xiàn)有些問題讓人感覺不爽，比如，如何在ComboBox在錄入多個(gè)下拉選項(xiàng)后，將其控制在收縮狀態(tài)，就令人非常郁 悶，實(shí)際上，這種情況會(huì)占去寶貴的界面空間，而且影響了界面排放目標(biāo)。如下圖：
5、設(shè)計(jì)效率
更高設(shè)計(jì)效率，意味著更快的 設(shè)計(jì)速度。針對(duì)同一個(gè)原型設(shè)計(jì)任務(wù)，意味著你可以更短時(shí)間內(nèi)完成工作，也意味你在同樣的時(shí)間內(nèi)，可以做更多的事。
從這一點(diǎn)上來 講，Balsamiq Mockups的設(shè)計(jì)效率相比Axure RP Pro會(huì)更高一些。
具體表現(xiàn)在如下幾個(gè)方面：
（1）、 快速輸入并構(gòu)造頁面元素。以菜單為例，Balsamiq Mockups在菜單控件中，直接錄入各個(gè)菜單項(xiàng)，每個(gè)菜單項(xiàng)以半角逗號(hào)分割，即可自動(dòng)實(shí)現(xiàn)菜單項(xiàng)的自動(dòng)增加，這點(diǎn)非常優(yōu)秀。也就是說，你一行字打出來， 菜單就做完了。而Axure RP Pro你一定要老老實(shí)實(shí)在每個(gè)菜單項(xiàng)的輸入框中輸入菜單文字，如果菜單項(xiàng)的位置不夠，你還得手工添加，會(huì)多出N個(gè)動(dòng)作，鼠標(biāo)和鍵盤要多出好幾倍的移動(dòng)和敲 擊。
（2）、自動(dòng)對(duì)齊。在擺放組件的同時(shí)，Balsamiq Mockups就提供了對(duì)齊的標(biāo)尺控制，使你在第一時(shí)間就把控件擺放在合適的位置，至少水平對(duì)齊或垂直對(duì)齊，這個(gè)功能在Axure RP Pro只能參照網(wǎng)格進(jìn)行目測(cè)，或執(zhí)行手動(dòng)對(duì)齊，這一番折騰下來，必然要多花點(diǎn)功夫。
（3）、除了上述的1之外，在樹狀列表、分級(jí)列表、右 鍵菜單中，都提供類似的以鍵盤輸入“控制符”來一次性使界面成型的辦法，試圖在最大程度上降低往復(fù)的鼠標(biāo)和鍵盤組合動(dòng)作，這令人感到很有趣味，的確也提高 了工作效率，但前提是，你必須要盡快熟悉這些控制符的用法。
6、 交互能力對(duì)比
交互能力的強(qiáng)弱，直接影響原型系統(tǒng)和最終 交付的應(yīng)用系統(tǒng)的仿真程度。這點(diǎn)上，Axure RP Pro明顯占據(jù)優(yōu)勢(shì)，每個(gè)功能項(xiàng)有多個(gè)事件可以編制腳本，每個(gè)腳本可以選擇多個(gè)操作，基本上覆蓋了Web應(yīng)用的各種可能。
而Balsamiq Mockups，基本上就一個(gè)一個(gè)操作，即“鏈接到另外一個(gè)頁面”，這對(duì)復(fù)雜的業(yè)務(wù)應(yīng)用來說，是遠(yuǎn)遠(yuǎn)不夠的，這方面Balsamiq Mockups需要加大改進(jìn)力度，畢竟原型系統(tǒng)的仿真能力強(qiáng)弱，是評(píng)價(jià)原型系統(tǒng)工具是否適應(yīng)復(fù)雜業(yè)務(wù)設(shè)計(jì)需求能力的重要標(biāo)桿。
7、對(duì)中文 的支持
Axure RP Pro目前網(wǎng)上可以找到相應(yīng)的漢化包，可將其工作界面轉(zhuǎn)換為中文顯示，一定程度上，給不習(xí)慣E文的用戶帶來了更好的體驗(yàn)，但Balsamiq Mockups只有英文版可以使用。
可令人糾結(jié)的是，Axure RP Pro雖然有漢化包，但其對(duì)中文錄入的支持存在一點(diǎn)瑕疵，網(wǎng)上有反映對(duì)部分輸入法無法支持，但搜狗拼音輸入法是支持的，而且在錄入中文時(shí)，必須要把鼠標(biāo)指 針放在組件范圍之內(nèi)，才可以正常輸入。
而Balsamiq Mockups雖然只有英文版，但它對(duì)中文的支持卻是非常流暢，但你需要額外做一個(gè)設(shè)置，就是要在“Use System Fonts”的前面打上勾。
8、 團(tuán)隊(duì)協(xié)作
Axure RP Pro提供了強(qiáng)大而又可靠的團(tuán)隊(duì)協(xié)作機(jī)制，這讓團(tuán)隊(duì)的多個(gè)成員可以共同協(xié)作設(shè)計(jì)一套原型系統(tǒng)，具有完整的簽入/簽出管理功能，很好。
但Balsamiq Mockups的DeskTop版本則沒有提供對(duì)團(tuán)隊(duì)協(xié)作的支持。
9、傳播與交流
Axure RP Pro所制作完成的原型系統(tǒng)文件，可以另存為HTML站點(diǎn)，原型系統(tǒng)中的各種業(yè)務(wù)交互關(guān)系，通過JavaScript體現(xiàn)，基本上可以完整體現(xiàn)業(yè)務(wù)間的互 動(dòng)關(guān)系，當(dāng)然，在生成HTML站點(diǎn)后，頁面細(xì)節(jié)（比如字體等）可能會(huì)出現(xiàn)漂移，但總體看來，可以接受。所生成的HTML站點(diǎn)文件可以打包發(fā)送給其他人員， 通過瀏覽器即可查看原型系統(tǒng)，這種方式比較大眾，可以被廣泛接受。
但Balsamiq Mockups所導(dǎo)出的文件基本上都是靜態(tài)頁面效果（可以是圖片、PDF），頁面還原的比較好，能夠最大程度上和設(shè)計(jì)環(huán)境中保持一致，但要命的一點(diǎn)事，這 些頁面都是靜態(tài)的，缺少了交互的靈魂，令人沮喪。而要還原這些業(yè)務(wù)互動(dòng)，其實(shí)這些互動(dòng)也就是頁面鏈接的轉(zhuǎn)換，只能在設(shè)計(jì)環(huán)境下，借助于“Full Screen Presentation”這個(gè)功能來演練交互過程。
這就是說，如果你要將這個(gè)原型系統(tǒng)發(fā)給其他人，那么對(duì)方要查閱業(yè)務(wù)交 互關(guān)系的時(shí)候，必須保證其電腦上要裝有Balsamiq Mockups并獲得授權(quán)，否則，你只能看到靜態(tài)頁面。
三、小結(jié)
綜 上，小結(jié)如下：
1、風(fēng)格：Axure RP Pro思維嚴(yán)謹(jǐn)，理性，古板，中規(guī)中矩的商務(wù)男士，Balsamiq Mockups思路發(fā)散的藝術(shù)家，感性多一些，善于吸引眼球，思維組織能力不強(qiáng)，憂郁又內(nèi)向。
2、 中文支持。Axure RP Pro有漢化包，中文輸入內(nèi)容時(shí)有瑕疵；Balsamiq Mockups是E文版，但對(duì)中文支持比較流暢。
3、 協(xié)作：Axure RP Pro有完整的團(tuán)隊(duì)協(xié)作機(jī)制，而Balsamiq Mockups沒有。
4、 組件資源的豐富程度：Balsamiq Mockups優(yōu)于Axure RP Pro，且風(fēng)格別致，當(dāng)然，如果你喜歡的話。
5、 原型系統(tǒng)內(nèi)部功能頁面組織：Axure RP Pro多級(jí)化組織，邏輯感強(qiáng)，Balsamiq Mockups則是平行頁面，容易導(dǎo)致邏輯上的迷惑。
6、 交互能力：Axure RP Pro優(yōu)于Balsamiq Mockups，這點(diǎn)上，在Axure RP Pro可以算得上是個(gè)體操運(yùn)動(dòng)員，而Balsamiq Mockups只能算是會(huì)走路。
7、 交流的便利性。Axure RP Pro的方式更方便一些，更易于相互間的傳播，而Balsamiq Mockups顯得有點(diǎn)自我和封閉，適合于以自己為主角的當(dāng)眾演示。
8、 最后：如果有非常復(fù)雜的業(yè)務(wù)邏輯，對(duì)界面要求不高，而且需要團(tuán)隊(duì)協(xié)作來共同設(shè)計(jì)，那么必選Axure RP Pro；如果要快速出設(shè)計(jì)，交互復(fù)雜度不高，界面上需要?jiǎng)e樣風(fēng)格，則使用 Balsamiq Mockups。
原型圖設(shè)計(jì)工具：Balsamiq Mockups,Axure RP, Pencil
一、Balsamiq Mockups
特點(diǎn)：
可存：告別那一堆堆的紙質(zhì)線框圖吧…
易用：UI控件支持自動(dòng)拖拽，并且可以實(shí)現(xiàn)自動(dòng)對(duì)齊；
美觀：手繪風(fēng)格，簡約清爽；
豐富：從按鈕到輸入框，從導(dǎo)航條到頁面、表格，甚至包括了最潮的Iphone元素；
方便：對(duì)元素的修改除了工具欄外，還可以使用隱藏編輯框，支持快捷鍵；
兼容：可使用XML語言保存元素，也可以導(dǎo)出PNG圖片，可以插入到任何項(xiàng)目；
跨平臺(tái)：基于Adobe air。Windows、Mac OS、Linux下都可以使用，還有能集成在Confluence，JIRA，和XWiki中的版本。如果你沒時(shí)間下載桌面版，還可以直接使用網(wǎng)頁版的Balsamiq Mockups
Balsamiq Mockups最好用于商用web產(chǎn)品設(shè)計(jì)中的低保真線框圖或者草圖設(shè)計(jì)，相對(duì)于紙和筆，它不夠靈活；相對(duì)于Axure，它不夠精確；他的優(yōu)點(diǎn)也很明顯，比紙和筆快，比Axure簡單，易上手。
其實(shí)最最關(guān)鍵的是，它需要79美元，不過可免費(fèi)試用。
二、Axure RP
Axure的發(fā)音是”Ack-sure”，RP則是”Rapid Prototyping”快速原型的縮寫。Axure RP Pro是美國Axure Software Solution公司的精心杰作，可以說Axure是Windows上最出色的原型設(shè)計(jì)軟件，亦是web產(chǎn)品前期設(shè)計(jì)的首選，原因是：夠簡單、上手快，能幫助網(wǎng)站需求設(shè)計(jì)者，快捷而簡便的創(chuàng)建 基于目錄組織的原型文檔、功能說明、交互界面以及帶注釋的wireframe網(wǎng)頁，并可自動(dòng)生成用于演示的網(wǎng)頁文件和word文檔，以提供演示與開發(fā)；
Axure RP六合一功能：網(wǎng)站構(gòu)架圖、示意圖、流程圖、交互設(shè)計(jì)、自動(dòng)輸出網(wǎng)站原型、自動(dòng)輸出word格式規(guī)格文件
三、Pencil
一個(gè)firefox插件，比較小的工具，畫簡單的界面基本上可以滿足了。而且它開源免費(fèi)。
http://www.aau.cn/thread-8479-1-1.html
