我們進(jìn)行軟件開(kāi)發(fā)的時(shí)候首先需要做的就是制作界面原型圖，然后開(kāi)發(fā)人員根據(jù)原型圖進(jìn)行代碼的編寫。那么如何制作界面原型圖呢？下面小編就給大家分享一下用balsamiq mockups制作原型圖的方法。

工具/材料

balsamiq mockups

首先設(shè)計(jì)原型圖之前我們需要先更新一下AIR，因?yàn)閎alsamiq mockups依賴AIR的環(huán)境，所以要確保AIR環(huán)境是最新的，如下圖所示，一般打開(kāi)軟件的時(shí)候會(huì)自動(dòng)提示更新

接下來(lái)打開(kāi)balsamiq mockups軟件，我們會(huì)看到如下圖所示的界面，設(shè)計(jì)原型圖的時(shí)候直接從原型組件里面拖拽即可

大家在選擇原型組件的時(shí)候可以根據(jù)組件頂部的分類進(jìn)行篩選，如下圖所示

然后我們拖動(dòng)幾個(gè)組件到畫布上，你會(huì)發(fā)現(xiàn)很簡(jiǎn)單的幾步就能繪制出一個(gè)軟件的基本界面，如下圖所示

如果你想更改某一個(gè)組件的屬性，比如更改左側(cè)菜單的選中狀態(tài)，只需要選中組件，在右側(cè)屬性界面修改即可，如下圖所示

最后設(shè)計(jì)完了原型圖一定要保存文件，balsamiq mockups設(shè)計(jì)的原型文件的后綴名統(tǒng)一都是bmpr，如下圖所示

另外很多的公司要求將設(shè)計(jì)好的原型圖直接導(dǎo)出圖片，在balsamiq mockups中只需要點(diǎn)擊Project菜單下面的Export選項(xiàng)即可，如下圖所示