來人人都是産品經理【起點學院】，BAT實戰派産品總監手把手系統帶你學産品、學運營。

如果說Sketch是最美、最簡潔的設計軟件，那麼Axure就是最強大的原型制作軟件。Axure不僅能制作靜态的視覺稿、頁面，還能添加交互動作，是進行原型設計的最佳軟件之一。雖然Axure的學習曲線比較陡峭，但是掌握之後可以很快實現我們腦海中的用戶體驗效果。

Axure 8.0

筆者自學Axure有半年多的時間了。剛開始接觸Axure的時候，逛過無數論壇、Axure的網站，也浏覽了許多大牛錄制的Axure視頻課程。這些教程和資料非常完整地介紹了這款軟件能夠做什麼，這款軟件的界面如何，怎麼樣使用部件，如何創建交互等。但是在自學過程中，如何掌握學習的先後次序從而達到最佳的學習效果這方面我走了很多彎路。

寫這篇文章就是想總結一路走來的經驗教訓，并且跟大家分享如何快速掌握Axure這款軟件的使用，以及如何将自己的想法通過這款軟件來實現，從而構建起自己使用這款軟件的方法。希望對大家有幫助。

從零開始學Axure原型設計（入門篇）

在入門篇中，主要講解Axure的界面布局和部件庫的使用。

快速入門Axure界面

Axure界面，圖片來自網絡

• 工具欄：類似office軟件，可以對字體大小、背景填充、圖形寬高以及位于工作區的位置（X\Y軸）進行修改；
• 工作區：繪制産品原型的操作區域，所有的用到的元件都直接拖拽到裡面就好了。
• 頁面導航：可以通過鼠标拖動調整頁面順序以及頁面之間的關系，雙擊可以重命名。
• 部件庫：也叫組件庫或元件庫，所有軟件自帶的元件和加載的元件庫都在這裡，這裡可以執行創建、加載、删除axure元件庫的操作，也可以根據需求顯示全部元件或某一元件庫的元件。大家可以點擊放大鏡圖标，搜索自己需要的部件。
• 母版：這裡可以創建重複出現在每一個頁面的元素，這樣在制作時就不用再重複這些操作。通常用于頁面頭部、菜單欄等的制作。
• 頁面交互：這裡可以設置當前頁面的樣式，添加與該頁面有關的注釋，以及設置頁面加載時觸發的事件onpageload。
• 部件交互：這裡可以設置選中元件的标簽、樣式，添加與該元件有關的注釋，以及設置頁面加載時觸發的事件。閃電樣式的小圖标代表交互事件。

部件庫的構成

了解部件庫的使用是Axure的基礎，下面我們就來梳理一下Axure中的常用部件：

Axure部件庫

部件使用易錯點

關于部件庫的使用，新手特别容易出錯的有以下幾點：

• 圖片：圖片拖拽進畫布時如果選擇“壓縮圖片大小”，gif文件會變成靜态的圖片形式。
• 圖片熱區：圖片熱區可以用來創建自定義按鈕上的點擊區域。例如在一個區域中，既有圖片部件又有文字部件，我們隻需在這些部件上面覆蓋一個圖片熱區并添加一次事件即可，無需在每個部件上都添加事件。反之，如果你想給一張圖片上添加多個交互，也可以給圖片的部分區域覆蓋一塊熱區來實現。
• 動态面闆滾動欄：使用滾動欄給你的動态面闆添加可滾動内容，在動态面闆屬性面闆中選擇，滾動欄下拉菜單并選擇滾動欄的顯示方式，為了讓滾動欄正常顯示，動态面闆狀态内中的内容必須比動态面闆的邊界輪廓大，并且不能勾選調整大小以适合内容。
• 内部框架：你可以給内部框架的屬性選項框中添加Axure内置的預覽圖片，如視頻、地圖，也可以自定義預覽圖片。注意：預覽圖片會在設計區域中顯示，但不會在生成的原型中顯示。
• 列表選擇框：在一個交互事件中同時讀取或設置多個選項時，列表選擇框部件隻允許你讀取或設置一個選項，即便你勾選了多選功能。
• 提交按鈕：提交按鈕無法設置交互樣式，如：選中/鼠标懸停/鼠标按下。提交按鈕的填充顔色、邊框顔色和其他大多數樣式格式都被禁用了。取而代之的是生成原型後在浏覽器中它會使用内建的樣式。如果你想自定義你的按鈕樣式，請使用形狀按鈕“Shape button”。
• 菜單部件：無法點擊展開子菜單。菜單部件默認是鼠标懸停展示子菜單的。

特别提醒大家，在創建部件時，一定要養成給部件命名的習慣，因為無論是創建交互事件還是進行變量調用，都需要明确部件的名稱。目前我使用的命名方法是“頁面名稱 部件功能”。

現在就去下載Axure，自己玩一遍這些萌萌的部件吧！在認識了部件庫和界面之後，我們就可以自己用Axure畫線框圖了。

#專欄作家#

粽小喵，zong_xiaomiao，人人都是産品經理專欄作家。騰訊産品經理。一個學傳播出身的産品新人，愛好研究原型設計工具。

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!