先上圖看效果,上面的是百度的界面,下面的是我用Balsamiq設計的。html
感受一下還不錯吧。前端
下面是一篇關於Balsamiq詳解的文章,轉載來吧。O(∩_∩)O~node
Balsamiq Mockups出自加利福尼亞州的Balsamiq工做室,創始人Peldi在2008年6月推出了這款手繪風格的產品原型設計工具,並廣受好評。2年多來,Balsamiq工做做爲一個微型獨立軟件開發商,專一於Mockups的開發設計,僅3周便實現了盈利,18個月內銷售額達到200萬美圓,用戶端數量超過10萬個,這與Balsamiq Mockups的市場用戶細分的成功以及產品特性是分不開的。web
在Web產品設計中,Balsamiq Mockups是產品設計師繪製線框圖或產品原型界面的利器。在產品設計的需求階段,低保真的線框圖或者草圖設計介於產品流程設計與高保真DEMO設計之間,在Balsamiq Mockups出現以前,流程圖可使用Visio,高保真DEMO可使用Axure,但咱們並無好用的草圖設計工具;在產品設計管理中,咱們一般在產品的業務流程和數據流轉已經至關明確時纔開始進一步考慮產品的結構層和框架層,雖然此時紙、筆、白板都是很是簡單方便的交流工具,可是他們的最大劣勢就是——很難將有價值的原型保存下來。Balsamiq Mockups的出現完美的解決了這個問題。框架
可存:告別那一堆堆的紙質線框圖吧…
易用:UI控件支持自動拖拽,而且能夠實現自動對齊;
美觀:手繪風格,簡約清爽;
豐富:從按鈕到輸入框,從導航條到頁面、表格,甚至包括了最潮的Iphone元素;
方便:對元素的修改除了工具欄外,還可使用隱藏編輯框,支持快捷鍵;
兼容:可以使用XML語言保存元素,也能夠導出PNG圖片,能夠插入到任何項目;
跨平臺:Windows、Mac OS、Linux下均可以使用,還有能集成在Confluence,JIRA,和XWiki中的版本,對了,若是你沒時間下載桌面版,還能夠直接使用網頁版的Balsamiq Mockups…ide
應用範圍:就像以前提到的,Balsamiq Mockups最好用於商用web產品設計中的低保真線框圖或者草圖設計,相對於紙和筆,它不夠靈活;相對於Axure,它不夠精確;工具
使用語言:暫時沒有英文版的Balsamiq Mockups,雖然相對於用慣國外軟件的產品設計師/前端交互設計師來講,這並非什麼大問題,但畢竟這提到了使用門檻,童鞋們仍是要學好英語;(關於中文漢化版Balsamiq Mockups下面會提到)post
價格不菲:79美圓的價格並不適合喜歡的朋友嚐鮮;而對於國內公司而言,在產品設計領域的理念和意識,遠達不到花錢去買一個細分的專業軟件的程度。即使不使用Balsamiq Mockups,地球照樣轉。(關於Balsamiq Mockups的免費方法下面會提到)網站
使用Balsamiq Mockups的人包括產品經理、產品設計師、用戶體驗設計師、交互設計師、網站前端設計師等等,隨便誰均可以。這並不重要,問題是不少大公司都在使用,來看看騰訊CDC對Balsamiq Mockups的分析,或者搜狐產品經理對Balsamiq Mockups的推薦,甚至如今網易招聘產品設計師都要求會Balsamiq Mockups了……ui
首先提供在線安裝Balsamiq Mockups的方法:
>> 點擊進入Balsamiq Mockups官方下載安裝頁面 <<
點擊圖標直接安裝便可,安裝內容包括Adobe AIR環境以及Mockups主體桌面程序:
若是你的電腦安裝時出現問題,能夠嘗試分步下載安裝Balsamiq Mockups:
確保你的電腦安裝了Adobe AIR,下載後安裝到默認文件夾
>> 點擊進入 Adobe AIR 的最新版本安裝頁 <<
安裝完Adobe AIR後直接下載Balsamiq Mockups桌面程序,不管是Windows仍是Mac均可以正常使用,下載後安裝到你須要的文件夾便可
最後,當你沒法安裝Balsamiq Mockups或者沒時間安裝時,Balsamiq還爲你提供了在線Web版本的Mockups。
若是不註冊,Balsamiq Mockups便只能繪圖,不能保存你的Mockups,同時每隔5分鐘會彈出提示框請你輸入許可證。雖然對企業而言,79美圓的註冊費並很少,購買大量許可還有打折優惠,但對於我的使用者或者但願體驗的朋友來講,免費的老是最好的。Balsamiq很是體貼的推出了「免費得到Balsamiq Mockups許可證密鑰的幾個方法」,包括:
若是你是非營利、慈善機構、開源貢獻者;
若是你是技術/軟件博客做者或者記者;
若是你是學校高中班老師;
若是你加入可用性專業培訓;
若是你是大學的教授或者學生;
固然,對普通人而言,在你的博客上寫一篇關於Balsamiq Mockups的評測或者介紹,作口碑營銷,是比較靠譜的辦法,這並不困難,所以不要去尋找所謂的破解和註冊機了——當你完成博客時,給Balsamiq寫郵件索要免費的Mockups註冊碼吧!
郵箱:free@balsamiq.com
主題:I want to review Mockups on my software blog!
內容:關於Balsamiq Mockups介紹的博客URL
PS.如下是我成功申請Balsamiq Mockups的免費Serial Key的郵件以及Balsamiq首席運營官Valerie Liberty的回信,再次感謝Balsamiq的慷慨並強烈表揚Valerie Liberty的高效,重點在於,回信的美國當地時間是晚上10點多……
發送至 free@balsamiq.com
日期 2010年3月18日 下午1:08
主題 I want to review Mockups on my software blog!Hi,This is my blog’s URL what about Balsamiq Mockups:http://www.hanjunxing.com/balsamiq-mockups-one-for-all
Could you give me a license, free of charge,please?Thank you very much!
日期 2010年3月18日 下午2:11
主題 Re: I want to review Mockups on my software blog!It’s my pleasure to give you the license below:
Organization name:***
Serial Key:***
Enjoy Balsamiq Mockups and thanks for spreading the word, I am looking
forward to seeing your review!
Valerie Liberty
Chief Operating Officer, Wow! Division
選擇菜單欄 View >> 將 Use System Fonts 勾上,就能完美支持中文輸入。
目前Balsamiq沒有發佈中文版的Mockups,同時因爲Balsamiq Mockups是基於Flash的應用程序,因此沒法安裝漢化補丁或漢化包。值得慶幸的是,Balsamiq Mockups的操做很是簡單和人性化,你不須要專門的Balsamiq Mockups教程,由於你甚至不須要看文字提示就能夠快速上手繪製本身的產品原型了。最後,爲須要的朋友提供一個Balsamiq Mockups的山寨中文漢化版:Balsamiq Mockups中英文對照圖,順便作一個Balsamiq Mockups的界面DEMO: