Axure 是創建軟件原型的快速有力的工具。上手很容易，但是，其中存在一個危險。這款軟件是如此的直觀以至于很多用戶可以在沒有接受過任何正式培訓的情況下進行使用。他們可能不知道的是他們可能沒有以恰當的方式來使用 Axure。

作為一位有經驗的用戶體驗設計師，我很少在畫一頁的時候第一次就能把它設計正確。大部分時候，我要經歷5到10次的反復迭代（iterations）。當你的用戶體驗設計是用來作為敏捷項目（agile project）的藍圖，那你可能需要在項目周期內跟上整個項目。有時候，這些變化將會影響到十幾頁或是更多的設計頁。正是在這種情況下，Axure 的一些不太明顯的特征可以為設計師節省巨大的時間。

我一般在團隊中的工作是創建線框圖和原型。為此，我會使用Axure 中的「共享項目」功能（在Axure 7中叫做「團隊項目」）。能多人實時協同設計一個項目是我最喜歡Axure 的地方，但它的確要求簡潔的和結構化的工作方式。毫無疑問，你將會發現別人正在你設計過的設計稿上工作，或者你正在別人的設計稿上工作。我已經把這些使用Axure的準則記在了心里，因為那是我現在工作的工具，而且我相信這些建議也同樣適用于其它軟件工具。

從長遠角度來看，我認為我提出的這10條建議是節約時間的重要方法（crucial?techniques）。這種工作方式并不總是在短期內體現它的優勢，但是它確實可以比正常情況更加具有靈活性（But it does allow for optimal flexibility further down the line.）。

一、用一個控件就可以完成的事永遠不要用兩個控件

我看到的最浪費時間的行為是 Axure 的初級和高級用戶都在使用不必要的控件。我發現自己仍然在犯這個錯誤，所以必須不斷提醒自己這是第一條準則。每一個你添加到項目中的控件，當在未來需要改變時都要耗費更多的工作時間。所有這些工作在經過十次迭代后會逐漸增加。舉個簡單的例子，兩個在視覺上完全一樣的對象怎樣能夠用不同的方式被建立起來呢？

圖1

上面兩個例子說明了一種情況，即有些人使用一個文本標簽加一個按鈕這種分離式的控件。當這個人想對整個對象添加 OnClick 事件的時候，他們有兩種選擇。第一個方法是在整個部件上添加一個熱區，這種方法使得三個控件都需要被維護。第二種方法是為每一個元素添加一個 OnClick 的交互事件，這種方法使得兩個交互動作需要被維護。

當部件需要被修改的時候，這兩種方式都會花費不必要的時間。一個更為簡單的方法是通過在矩形框上添加文字的方式來創建對象。

圖2

那么你的文字可以使用「對齊和填充」工具欄進行調整位置。你現在只有一個控件需要維護而且只需要一個交互事件。

圖3

二、不要復制對象，而是把對象轉成母版

當我發現自己處在一個設計階段的后期且我們需要改變每一頁主導航的時候，我體驗了巨大的喜悅。不是因為我喜歡一大堆（a big pile of）的重復性工作，而是因為我所要做的僅僅只是編輯單個母版，然后很快（presto）整個項目就被更新了。

為主導航使用母版似乎是相當平淡無奇的，但是創建一個母版是值得的，當你使用任何操作超過一次的時候。無論何時你發現自己一直在復制和粘貼一組控件，永遠記住，創建一個母版可能是更好的選擇。

圖4

創建了母版后，例如上面的產品展示圖 "tile" ，如果你決定改變按鈕上的文字為 "Buy now" ，你將只需要編輯一次，然后發現模板中的每個實例都發生了改變。

圖5

記住，不要把太大的組合對象變成母版。越是大的組合對象，越是有可能需要在母版的很多地方做出修改。把一些母版和另外一個母版合并起來一般會是更好的辦法。當你只需要在一個母版中做些改變的時候這種方法就變得很方便。也就是說一些元素一直被包含而其它一些元素一直要變化，比如下圖：

圖6

這個基礎母板沒有包含價格的信息，但是它可以結合另外一個母版來為所有的產品展示圖創建新的母版。

圖7

三、在創建母版之前要設置好樣式（Place Styles）

母版對于創建需要重復利用的元素是很好的，但它們不允許變化。一個母版的每個實例都是一模一樣的。這個時候樣式來了。假設你有一個按鈕需要被復制到多個頁面，但在按鈕上的標簽需要修改，樣式可以幫你很容易地完成。每個按鈕的屬性可以通過樣式去設置，你需要做的就是修改文本標簽。

圖8

按鈕的作用往往是增加鼠標懸停等相關事件。在 Axure 中，這些事件往往通過使用動態面板來創建。不同的狀態被放置在不同的動態面板和腳本中。然而，使用這種方法你將要進入每個動態面板的狀態來修改這個按鈕。

一個更快的方式來處理按鈕的事件是使用「交互樣式」對話框。使用這個功能，僅僅需要為不同的事件狀態設置不同的樣式（With this feature, simply set different styles for each behavior state），然后只需要復制按鈕和設置大小一次。

圖9

圖10

提示：可以在按鈕上使用在 Axure 7中介紹的「自動適應寬度」的功能。如果你在樣式中使用了左右填充的功能，你要修改的是僅僅是按鈕的文本，然后按鈕的大小會自動適應。

圖11

四、保持項目的組織性和命名的清晰性

Axure提供了許多選項來保持項目的組織性。你放置在頁面上的每個元素都擁有獨一無二的命名。頁面可以被命名然后組織成一個樹狀結構。例如母版可以被命名然后在文件夾中排序等等。但是為什么要花費力氣來給每個對象一個清晰的命名呢？

1）保持東西的組織性

當你有一個精心制作的網頁，然后你想通過動態面板來創建一個交互，你將不得不通過一長列表的元素來找到你想要的那個。你可以使用搜索框——但這只是在你已經考慮周到地為你的項目命了名的情況下。

2）允許團隊成員介入

可能像我一樣，你在團隊中，你的項目總是會發生意料之外的事情。你或你的同事可能會生病或意外地必須工作在另一個項目中。至關重要的地方是這個項目建立得非常清晰以至于他人可以順利地介入然后接管事務。由其他人添加的交互事件可以完成得特別復雜。

3）可以和第三方分享

一般我參與的項目中，我的線框圖至少需要和10位同事分享。有些人會坐在我桌旁，然后我可以指導他們。其他人，我們永遠不會見面，然后我不知道他們對線框圖的理解情況。理想狀態下，一個原型應該是清晰易懂不需要解釋的（viewable autonomously）。

我會做如下的事情來完成任務。

創建一個登錄頁面

你可以設置你的原型主頁作為一個起始頁來解釋說明人們是看到是什么內容和如何使用它。另外，你可以在流程圖上提供你的聯系方式或是一個鏈接。

圖12

給頁面一個獨一無二的、可以自我解釋的命名

如果頁面的命名是清晰的而且說明了每個頁面的內容，那么這個原型將更容易理解。人們也會在以后的交流中使用這些名稱。舉個例子，如果一位平面設計師基于你的設計做出了一份樣稿（comp），他們可能像你一樣為頁面使用相同的命名。如果一個頁面的名稱不是獨一無二的，那么將會出現一個頁面有兩個不同的名字。

創建最常見的流程圖

大多數的人不把設計頁做成樹狀結構，他們喜歡根據活動流程圖來設計。你可以在 Axure 中創建流程圖來反應重要的用戶流程，并且鏈接到相關頁面。然后你會提供額外的方式瀏覽原型。（流程圖上的名稱是基于那些站點地圖的名稱。因此，你是否命名清楚就變得很重要了。）

圖13

五、養成使用全局輔助線和網格的習慣

Axure 允許用戶創建兩種輔助線：一種是局部輔助線，只存在于一個頁面上，一種是全局輔助線，存在于全部的頁面上。輔助線可以使用「創建輔助線」對話框來設置。例如，如果你設置了一個960px 的網格，然后再在不同的頁面定位元素就變得容易多了。與此同時，你的團隊成員將在一個共享項目中看到這些全局輔助線。

圖14

使用網格可以幫助你保持設計的整潔和結構化。我經常設置我的網格是10×10px ，然后以10的倍數的尺寸來創建我的對象。例如，60×20像素的按鈕，而不是55×18像素。當你把這些對象放在網格上的時候，一切變得更容易對齊了，而且可以滿足你的任何強迫癥。當然，允許那些需要不同尺寸的特殊對象偏離網格。

提示：在Axure 7中，你可以為移動端和網頁端建立不同的全局輔助線。下面是我喜歡用的一個移動端網格的應用實例：

圖15

六、不要忘記導入功能

在大多數項目中，人們制作的元素對其他項目也都是有用的。不需要重新發明輪子，而是重復使用那些在過去工作中使用過的元素。許多基礎的東西在整個項目中都要保持一致，例如樣式，輔助線和母版。雖然復制粘貼一個項目從這一個 .rp 文件到另一個 .rp 文件是可以的，但并不是所有的信息都會在。當你粘貼一個具有獨特風格的按鈕，樣式并不會跟著一起粘貼過去。

重復使用元素的最好方法就是使用超強的導入功能。這使您可以導入頁面和母版，還有樣式和輔助線。

圖16

提示：創建一個「母的」.rp 文件來導入新的項目，在那兒你可以保持標準的母版。

七、要保留網頁的舊版本

我經常發現自己需要回到一個項目的一個舊版本。在過去的日子里，我經常需要在Visio中創建線框圖，管理有很多頁面的項目是困難的，所以我最終會丟失頁面。

在Axure中，追蹤舊版本是容易的。僅僅是創建一個命名為 "Bin" 的文件夾（或者在Axure 6.5 或更早的版本中創建一個頁面）。

圖17

把舊版本的頁面放在那兒，以便于當你需要及時返回去的時候能很容易找到。當需要導出的時候，只要選擇部分就行了，不需要全選頁面。這樣的話，你可以向您的客戶分享一個簡潔的版本，而且舊版本任然可以被直接訪問。

圖18

八、不要設計不必要的交互動作

Axure 的初始用戶通常對Axure 可以很輕松地將交互動作添加到原型中留下深刻印象。一開始的時候，我忍不住對我創建的每一頁添加交互動作。然而，在許多情況下，我可以清楚地傳達設計而不需要任何交互——僅僅是靜態圖像。現在，我只會對下面這些問題當中有一個回答"Yes"的時候才增加交互動作。

1. 「我確實要交互動作才能明確無誤地表達我的設計嗎？」

如果你提供的僅僅是靜態圖像而沒有交互元素的時候，你的設計會被錯誤理解嗎？這可能是一個需要依賴于一定的動畫才能被理解的情況。

2. 「從長遠角度來看，這個交互設計節省時間嗎？」

創建一個元素的交互會比展示不同頁面的不同狀態更快嗎？比如，創建和維護一個交互式網頁的標簽會比為每個頁面創建多個標簽更容易。

3. 「我需要說服某些人一些交互元素的概念嗎？」

我拿出了一個我認為是問題的最佳的解決方案，但我知道這個方案很難被推進發展，那么我需要別人支持我的想法。我發現做交互原型可以幫助我傳播想法。

但是，如果所有這些問題的答案是否定的，那么我寧愿去創建僅僅顯示一個交互元素不同狀態的多個版本。

九、要使用字體圖標（Icon Font）而不是圖片

另一個簡單的但經常被忽視的保持 Axure 項目可管理性的方式是使圖片的數量最小化。在一個原型中想要改變一個圖片的顏色，你就不得不經過好幾個步驟。你需要打開一個圖片編輯器，對圖片進行更改，再導出一個新的位圖，最后導入您的 Axure 項目。

另一個選擇是使用一個字體圖標。一，你可以在 Axure 中改變顏色和圖標的比例。一個很棒的基本的字體圖標資源站是?http://copypastecharacter.com/?，它的圖標在很多平臺上都能立即使用。

圖19?

對于字體圖標，你可以在一個按鈕上添加一個圖形，但是任然需要聽從第一條建議。

十、在瀏覽器或是設備上預覽原型

如果設計師得知他們的原型在 Axure 中和在瀏覽器中看到的不一樣時，他們會感到沮喪的。尤其是文字的間距和位置不一樣。更糟糕的是，它們在不同的瀏覽器中顯示得也不一樣。為避免差錯，你需要在瀏覽器中不斷地預覽你的原型，如果是移動端原型則在設備上預覽。

即使你永遠不能消除 Axure 和瀏覽器之間所有的差異，下面有一些減小差異的方法。

文字環繞

下面是文字如何環繞：

圖20?

下面顯示瀏覽器如何文本換行：

?圖21

為了防止文本框從環繞變成到了下一行，請確保你的文本框有足夠的冗余空間。最安全的方法就是給文本框可能需要的足夠大的空間。因此，如果將來你需要編輯這個文本，你將不需要改變文本框的大小，它將使用文字環繞的方式。

垂直間距

垂直間距可以看出瀏覽器和 Axure 之間的不同。你可以在 Axure 里微調間距，直到你發現文本在瀏覽器中看起來很好，但是這是相當努力然后換來了一個不確定的結果。確定文本位置的唯一方法就是要么 break up the copy into chunks ，要么把文字轉換成圖形。不幸的是，第一個選擇打破了第一條建議，然而有時候它是不可避免的。

總結

從短期來看，這些建議很少能顯示出效果，但是從長遠來看，它有很多好處。也許更重要的是，縮短工作時間能使你工作更快樂。

我希望這些建議像對我一樣對你們也是有幫助的。我相信，有人會認為其他的一些規則會更重要，我們很樂意聽到它們，所以請在下面的評論框發表您的想法。

如果你還沒有 Axure 的話，試試 Axure 7 測試版。一些變化真的有助于保持工作的組織性。

最后一點：這些規則，像任何其他的規則一樣，是用來被打破的。不要讓它們影響你的工作。聰明的設計師們，我們需要知道何時打破規則。

譯文地址：點擊跳轉

本文由@曉馬 原創翻譯，本文禁止在本人未允許的情況下，任何形式的全文轉載和部分轉載。若您喜歡本文，請分享本文的鏈接到您喜歡的平臺。