如何用balsamiq mockups製作軟體的介面原型

我們進行軟體開發的時候首先需要做的就是製作介面原型圖，然後開發人員根據原型圖進行程式碼的編寫。那麼如何製作介面原型圖呢？下面小編就給大家分享一下用balsamiq mockups製作原型圖的方法。

工具/材料

balsamiq mockups

操作方法

首先設計原型圖之前我們需要先更新一下AIR，因為balsamiq mockups依賴AIR的環境，所以要確保AIR環境是最新的，如下圖所示，一般開啟軟體的時候會自動提示更新

接下來開啟balsamiq mockups軟體，我們會看到如下圖所示的介面，設計原型圖的時候直接從原型元件裡面拖拽即可

大家在選擇原型元件的時候可以根據元件頂部的分類進行篩選，如下圖所示

然後我們拖動幾個元件到畫布上，你會發現很簡單的幾步就能繪製出一個軟體的基本介面，如下圖所示

如果你想更改某一個元件的屬性，比如更改左側選單的選中狀態，只需要選中元件，在右側屬性介面修改即可，如下圖所示

最後設計完了原型圖一定要儲存檔案，balsamiq mockups設計的原型檔案的字尾名統一都是bmpr，如下圖所示

另外很多的公司要求將設計好的原型圖直接匯出圖片，在balsamiq mockups中只需要點選Project選單下面的Export選項即可，如下圖所示