互動原型設計軟體 Axure RP Pro 5 中文教程
阿新 • • 發佈：2020-10-09
先提供Axure RP pro 4.6版本的下載
http://www.jojobox.cn/blog/p_w_uploads/month_0803/AxureRP-Pro-Setup.zip
（軟體僅供學習使用，反對商業用途 -_-！！！） Part I : 介紹(Introduce) 網際網路行業產品經理的一項重要工作，就是進行產品原型設計(Prototype Design)。而產品原型設計最基礎的工作，就是結合批註、大量的說明以及流程圖畫框架圖wireframe，將自己的產品原型完整而準確的表述給UI、UE、程式工程師，市場人員，並通過溝通會議，反覆修改prototype 直至最終確認，開始投入執行。 進行產品原型設計的軟體工具也有很多種，我寫的這個教程所介紹的Axure RP，是taobao、dangdang等國內大型網路公司的團隊在推廣使用的原型設計軟體。同時，此軟體也在產品經理圈子中廣為流傳。之所以Axure RP得到了大家的認同和推廣，正是因為其簡便的操作和使用，符合了產品經理、互動設計師們的需求。 在正式談Axure RP之前，我們先來看看做產品原型設計，現在大致有哪些工具可以使用，而他們的利弊何在。 紙筆：簡單易得，上手難度為零。有力於瞬間創意的產生與記錄，有力於對文件即時的討論與修改。但是保真度不高，難以表述頁面流程，更難以表述互動資訊與程式需求細節。
PPT：上手難度普通。易於畫框架圖，易於做批註，也可以表達互動流程，也擅長演示。但是不利於大篇幅的文件表達。
Visio：功能相對比較複雜。善於畫流程圖，框架圖。不利於批註與大篇幅的文字說明。同樣不利於互動的表達與演示。
Photshop/fireworks：操作難度相對較大，易於畫框架圖、流程圖。不利於表達互動設計，不擅長文字說明與批註。
Dreamweave：操作難度大，需要基礎的html知識。易於畫框架圖、流程圖、表達互動設計。不擅長文字說明與批註。 以上這些工具，都是產品經理經常會使用到的，但是從根本上來說，這些工具都不是做prototype design的專門利器，需要根據產品開發不同的目的，不同的開發階段，選擇不同的工具搭配使用，才能達到表達、溝通的目的。 比如使用紙筆，更適合在產品創意階段使用，可以快速記錄閃電般的思路和靈感；也可以在即時討論溝通時使用，通過圖形快速表達自己的產品思路，及時的畫出來，是再好不過的方法。而word則適合在用文字詳細表達產品，對產品進行細節說明時使用，圖片結合文字的排版，是word最擅長的工作。而ppt自然是演示時更好。visio則可以適用於各種流程圖、關係圖的表達，更可通過畫use case 獲取使用者需求。PS/FW是圖片處理的工具，DW則是所見即所得的網頁開發軟體，這些是設計師的看家本領，對於普通的產品經理來說，需要耗費太多的精力去掌握。 其實每件工具，每個軟體，在創造它的初期，軟體設計師們都給它賦予了性格、氣質。因為每個工具的產生，都是為了滿足人類的某一方面需求。比如鋤頭是鋤土的，起子是起螺絲的，電熨斗是燙衣服的。但是不同的工具都有自己的工作領域，在其他領域它並不擅長。而以上的軟體在創造的初期，並非為了幫助產品經理、ue完成產品原型設計，因此他們都不能在prototype design 這件工作上得心應手。而Axure RP正是在網際網路產品大張其道的前提下，為滿足prototype design建立的需求，應運而生。 Axure RP 能幫助網站需求設計者，快捷而簡便的建立 基於目錄組織的原型文件、功能說明、互動介面以及帶註釋的wireframe網頁，並可自動生成用於演示的網頁檔案和word文件，以提供演示與開發。 沒錯！Axure RP 的特點是： 快速建立帶註釋的wireframe檔案，並可根據所設定的時間週期，軟體自動儲存文件，確保檔案安全。
根據設計稿，一鍵生成一致而專業的word版本的原型設計文件。
說到這裡相信很多人已經激起了興趣，但是在開始學習之前，我認為我們還是有必要先了解一下軟體短短的歷史，創造這一軟體的公司—Axure Software Solutions, Inc.該公司創建於2002年五月，Axure RP是這一軟體公司的旗艦產品，2003年一月Axure RP第一版本上線發表，至今已經正式發行到了第四個版本，而我提筆寫到這裡的時候，Axure 5.0版本beta版本已經正式提供下載試用，雖然我已經下載使用，但是我想，寫教程還是應該先從穩定的4.6版說起，至於5.0版，我們可以伴隨著軟體一起成長。 接下來我會結合圖片，分幾個步驟分享我對Axure的認識，
二、 工具欄
三、 站點地圖
四、 元件與使用方法
五、 複用模板與使用
六、 互動功能與註釋
七、 例項 當然，在書寫的過程中我會根據具體的情況再進行調整，儘量做到圖文並茂，易於理解。寫這個教程的目的，一方面為自己熟悉與更加理解Axure，另一方面也鞭策自己完善自己的blog網站www.2tan.net，同時也希望以自己的綿薄之力，為希望學習Axure的朋友分享一點經驗。由於這是我第一次嘗試寫教程，難免會出現偏頗，也希望朋友們能夠不吝賜教，共同進步。 為e文好的朋友附上自學Axure RP的幾個途徑：
1、 開啟軟體，按F1調取幫助文件，對照文件學習。
2、 登入http://www.axure.com/au-home.aspx 檢視flash視訊學習。
3、 登入 Axure 部落格 http://axure.com/cs/blogs/Default.aspx，瞭解軟體最新資訊。
4、 登入討論組http://axure.com/cs/forums/Default.aspx，參與討論。 Part II : 介面與功能(Interface & Function)
不論學習什麼，打基礎是很重要的。關於基礎練習，我印象最深的故事是王羲之練習書法的故事，將一池水染黑，需要怎樣的毅力？再有就是達芬奇與雞蛋的故事，一個簡單的雞蛋，達芬奇畫了無數次。我相信正是他們的一步一個腳印，才讓他們有了後來偉大的成就。故事老套，道理淺顯，可是我認為很重要。 學習軟體，應該先熟悉每個面板，每個基礎功能，才能夠真正談到運用。所以我的學習方法是瞭解軟體的基礎功能開始。 一、歡迎介面與功能
執行Axure RP後，首先彈出的是歡迎介面，它擁有的功能和其他軟體的歡迎介面沒有什麼特別的不同。 功能區1：文件區，這個區域顯示使用者最近開啟的Axure RP檔案，使用者可以快捷的開啟之前編輯的檔案。同時也提供快捷按鈕，可以建立新文件與開啟Axure RP預設資料夾。 功能區2：認證區，這個區域顯示註冊資訊。
已經註冊的使用者，顯示註冊者名稱，與已經獲得認證的圖示。
未註冊使用者，顯示註冊連結，引導使用者完成註冊註冊。 功能區3：Axure RP學習中心。主要包括線上學習、幫助文件、問題反饋三個環節。
a、線上學習提供了三個連結：
video tutorial：點選後進入視訊學習中心，可以通過觀看相關的flash教程學習Axure RP，不過都是e文解說。
online community：進入Axure RP的官方討論組，線上討論學習。
Axure blog：進入Axure的官方論壇，瞭解最新資訊。
b、幫助文件也提供了兩個連結，但是其實起到的是一樣的效果，都是開啟幫助文件，只是跳往不同的章節罷了。 c、問題反饋，通過點選連結可以發郵件到[email protected]，以尋求獲得幫助。 在歡迎介面中，Axure還提醒使用者，用4.6高版本的軟體建立儲存的Axure檔案，無法用以前的低版本檢視。 同時，如果我們不希望下次開啟軟體再看到這個面板，我們可以通過選擇“Don't show this at startup”實現。 二、軟體主介面與功能
關閉歡迎介面後，我們進入軟體的主介面，淡藍色調的ui，並不是很張揚。 功能區1：命令區，和我們操作的所有office軟體一樣，包含檔案、編輯、檢視和幫助，這些功能大抵是差不多的。table也很容易理解，就是對錶格編輯的命令。而Axure特有的幾個特殊的命令欄目是 a、wireframe：線框，包含所有畫原型線框圖的相關命令。
b、object：包含所有對工作區物體的操作命令，操作放入工作區的所有widgets，包括組合、排序、鎖定以及腳註命令等。
c、generate：自動生成html演示檔案、word說明文件，以及對生成規則進行自行編輯、定義。 功能區2：工具欄，基本和office風格一模一樣，功能也很容易上手。 功能區3：工作區，這就是我們平常操作工具，建立prototype的舞臺，將自己的構思在這裡釋放，將自己的想法在這裡展現。 工作區的上部顯示開啟的檔名，可同時開啟多文件，進行操作。 功能區4：站點地圖，Axsure RP建立的檔案是模擬真實網站頁面關係的，sitemap就是通過樹形目錄關係，管理所有的站點頁面檔案與流程圖檔案。科學的檔案關係結構，對有效的演示文件與生成易讀的說明文件相當重要。 我的操作習慣是先畫流程圖，然後根據流程圖構建頁面檔案框架，最後才開始頁面的具體設定。期間可以將檔案分為LOFI（低保真）與HIFI（高保真）兩個部分進行分別展示，有利於不同的需求者使用。 功能區5：器具箱，囤積了所有用來畫wireframe與流程圖的物件。我們可以通過拖拽的方式將小圖形放入工作區，進行操作。對於這裡面的物件，我們有必要一一詳細瞭解。 功能區6：複用模組區，這裡建立的頁面檔案和sitemap的頁面相似，唯一不同的是，master的每個檔案，可以當作一個整體，被sitemap反覆呼叫。這個功能就相當於程式開發中的程式複用，用好這個功能，可以減少我們很大一部的工作量。也更容易理解網頁檔案的關係，瞭解網頁設計師、程式設計師是怎麼構建網站的頁面的。 功能區7：頁面筆記，用來對當前創作頁面進行註釋與說明。同時可以在這裡對頁面裡的關鍵欄位和特殊問題進行詳細的描述。 功能區8：頁面載入時的互動功能。通過在這裡設定，不同條件下，頁面初次開啟時的狀況。 功能區9：註釋與互動區。這個註釋和互動和7、8不同，7、8針對的是頁面，而9針對的是頁面中的元素，也就是一個個widgets。 功能區的上面部分設定互動條件。通過滑鼠點選、滑入、滑出，設定觸發的事件，與對應widgets相應的變化。這一部分對沒有程式基礎的人可能會有一點難度，我稍後會做詳細解釋。 功能區的下面部分是註釋部分，使用者可以對選定的物件進行詳細的註釋。Axure已經設定了幾個預設的註釋欄位，但是其實這些預設的註釋欄位，大家完全可以不使用，因為它可能和你要說明的東西風馬牛不相及。
那麼該怎麼辦呢？Axure提供了自主設定欄位，只要你自己設定好自己常用的欄位，然後按照自己的習慣編寫就可以了。比如說你要說明物件的功能、優先順序、引數，那麼你在設定中加入這三個欄位就好了。Axure最大的優勢就是你設定的這些註釋，在生成說明文件時，Axure自動幫你生成PRD規格的表格文件，你可以省去相當大的編號工作，與文件工作。這些我在之後也會做說明。 這些就是Axure的主要功能區，但是其實還有兩個小的角落大家可能會忽略，那就是6、7、8區下面的一行系統資訊，這裡顯示的資訊很重要，但是一般人卻經常會忽視。我只所以說重要，因為我們在給ui設計師wireframe的時候他們總會問，這裡多少畫素，那裡多少畫素，可是我們在畫wireframe的時候卻無法度量。Axure建立的wireframe，完全可以生成html，因此我們可以在畫的時候就度量好每個畫素距離。但是我們要怎麼做呢？這就需要利用到下面這行小資訊欄了。 資訊欄左邊顯示的是文件儲存情況。而右邊呢，當你將一個widgets放入工作區，並選擇這個widget時，這裡就有用了，它顯示的是你所選擇widget的高寬，以及距離頁面頂部和左邊的px距離。通過使用上下左右鍵，結合這個資訊欄，你可以一步一步將它移動到你想去的地方。有意思吧？ Part III : 文件管理(Document)
開章要說的是文件管理。文件管理看似簡單，但是這是從操作功能上來說的，而我在說功能上的時候，想把我對文件管理的理解也一併說一下。
文件管理的目的，其實是為了有一個清晰的產品思路。剛開始工作的時候，我發現很多剛從學校出來的朋友對文件的命名與放置都是隨心所欲的，我也不例外。沒有好的整理習慣，這直接導致每次尋找先前的文件都要花費相當長的時間，甚至不小心誤刪，如果恰好有事請假，別的同事也無法接手工作。
所以，做一個prototype需要首先構建一個清晰的文件關係，這樣一方面能夠讓自己清楚檔案關係與位置，更主要的是讓開發者與接受者能清晰理解你的思路，生成更合理的產品說明word文件。
Axure RP的sitemap，與windows的樹形目錄相似，是以父子關係構建頁面關係的，每個頁面既可以是一個頁面page，也可以是一個流程圖flow。
一、工具功能條
1、增加一個子頁面：為所選擇的頁面建立一個子頁面。
2、頁面上移：同等級的頁面中，將所選頁面的上下排列次序，上移一個位置。
3、頁面下移：同等級的頁面中，將所選頁面的上下排列次序，下移一個位置。
4、頁面降序：將所選頁面等級降序，作為原等級中，排列在所選頁面上方之頁面的子頁面。
5、頁面升序：將所選頁面等級升序，將所選頁面的頁面等級，升序為父頁面的同等級頁面。
6、刪除頁面：將所選頁面刪除，同時刪除其子頁面。
7、編輯頁面：在工作區開啟所選擇頁面，進行編輯。 二、右鍵—增加為滑鼠右擊檔案所顯示命令，下同。
1、增加一個子頁面：同 一，1。（表示和第一大點，第1小點功能相同，以下同此）
2、在所選頁面之上增加一個同等級頁面。
3、在所選頁面之下增加一個同等級頁面。 三、右鍵—移動
1、頁面上移：同一，2。
2、頁面下移：同一，3。
3、頁面降序：同一，4。
4、頁面升序：同一，5。 四、右鍵—複製
1、複製頁面：複製所選頁面，作為同級頁面顯示在所選頁面下方。不包含所選頁面子頁面。
2、複製分支：複製所選頁面以及子頁面，作為同級分支顯示在所選頁面分支下方。 五、右鍵—頁面型別
1、wireframe：頁面型別定為線框圖，檔案圖示顯示頁面圖示。
2、flow：頁面型別定位流程圖，檔案圖示顯示流程圖示。 六、右鍵—其他
1、刪除頁面：同一、6。
2、重新命名頁面：為所選頁面重新命名。
3、編輯頁面：同一、7。
4、生成流程表：將所選頁面以及其子頁面關係，生成流程圖。生產圖有兩種頁面佈局方式可選。標準模式，頁面按照父子關係從上自下排列；階梯模式，頁面按照父子關係從左上至右下，以階梯方式進行排列。
5、複製頁面連結到剪下板。 以上就是sitemap所有命令，其實這些命令都很簡單，也很容易理解，關鍵在於怎麼去使用。 由於頁面有兩種型別，wireframe與flow，所以要善於用這兩種標記頁面，從而讓人理解你的意圖。我總結大致這兩種標記可以如下利用。 flow圖為父頁面，wireframe圖為子頁面：先畫流程圖，然後根據流程圖構建頁面關係。這樣在流程圖的指引下結構頁面關係，可以更清晰的理解頁面框架。 wireframe為父頁面，flow為子頁面：為頁面線框圖中的特殊部分做流程解釋。可以對頁面的細節部分進行詳盡的解釋。 當然，這兩種結構方式要活學活用，在複雜的產品頁面結構中，他們完全是你中有我，我中有你的。 Part IV : 模板複用(Templates)
masters和sitemap面板很相似，文件操作也一樣，它們的本質區別是，sitemap裡的檔案是最終展示頁面，masters裡的檔案卻只是一個模組，是頁面的一個部分。 masters的英文直譯是主人或僱主，但是我認為這裡可以叫做模板，或者複用模組。masters的檔案，是頁面中重複的模組，由於在不同頁面中這些模組是一樣的，所以拿出來作為一個模組編輯，然後在不同頁面中進行呼叫。 這個功能類似於網頁程式開發中的程式複用，不同頁面中呼叫同一段程式，一般把這段程式單獨做成一段頁面程式，然後用include命令進行呼叫。master的檔案就相當於這段被呼叫的頁面程式。dreamweaver也有類似的功能，就是template，可以參照理解。 一、功能條
master的功能條功能基本和sitemap一模一樣，功能也基本一樣。唯一不同的是master可以建立資料夾，可以通過資料夾收納不同的檔案，因此唯一不同的就是第一個功能按鈕，功能作用是增加一個資料夾。 二、右鍵單擊文件——增加
增加功能的功能模組功能除了增加資料夾其他和sitemap相同，大家可以參考教程三中的二大條。 而masters的文件組織結構主要依靠資料夾完成，頁面檔案之間不存在父子關係。這是文件操作與組織中與sitemap的最大不同。 三、右鍵單擊文件——移動
檔案移動功能基本上也和sitemap完全相同，但是父子關係的文件移動是檔案相對於資料夾完成，而不是相對於檔案進行。 功能，基本上也可以參考教程三的第三點。 四、右鍵單擊檔案——檔案身份“行為”
behavior是行為的意思，這個功能是axure升級到4版本後加入的，是針對master的不同使用情況而新增的一個功能，也是要重點介紹的功能。 1、normal：普通檔案。就是一般的複用檔案。是預設建立的複用檔案。 2、place in background：定位的複用模板，這類模板的特點是定位於頁面的底層，並且鎖定模板中的widgets在他原來建立的位置。這類複用模組主要用於建立head、foot、側邊欄等明確定位的複用模組。 3、custom widgets behavior：自定義模組。這類模組就類似於自創了一個widgets。 這類模組與其他型別的複用模組的不同在於，其他模組與複用到頁面的模組是完全相同的，模組的功能設定是什麼，功能說明是什麼，頁面中的模組設定和功能說明就是什麼。 而自定義模組與頁面中被複用的模組是母子關係。自定義模組只決定了模組的功能和位置，但是進入到特定的頁面中，模組中的各自部分的說明和功能可以重新定義。 充分理解三種不同型別的複用模組的區別，根據不同環境有效的選擇，也是非常重要的。 五、右鍵單擊檔案——其他
1、2、3功能都是文件文件操作功能，和sitemap一樣，分別是刪除、重新命名和編輯master。 4、5功能是對應的。前者是將所選模板檔案批量運用於頁面，後者是將所選模板檔案，批量從頁面中去除。通過選擇此功能，會彈出sitemap檔案的樹形目錄，你可以通過選擇需要新增模板的頁面，從而完成模板使用或移除。
check all：選擇所有頁面
uncheck all：所有頁面都不選擇
check all children：選擇所選頁面以及其所有子頁面
uncheck all children：不選擇所選頁面以及其所有字頁面 在4中有特殊的position設定和options命令， position中有兩個命令
place in blackground：將檔案至於頁面背景
specify location：是特殊定位，可以通過設定距離左側和上邊的距離，來將模板檔案放入特定的位置。
options裡的多選框的意思是“只有頁面中沒有此模板時才置入”，預設是選擇的。如果不選擇而置入頁面，就會出現如果頁面中已經有模板，模板被再次置入的情況。當然如果有特殊需要的模組，就可以這麼使用了。
6、usage report：使用報告，點選後彈出面板，顯示所有使用了此複用模板的列表，顯示的是檔名稱，通過雙擊檔名，可以在工作區開啟，直接編輯。 PartV:Widget工具 Axure RP的widgets工具欄，就是我們用來畫線框圖wireframe、流程圖flow的工具，也可以說是組成我們最終輸出圖表的零件。好比我們小時候玩的組裝積木，這些工具就是組裝積木裡的一個個小部件，組成什麼？組合得怎樣？完全依靠個人的經驗和智慧。因此，熟悉每一個工具的用法和用途，才能隨心所欲的畫出腦海中的圖形。 Widgets工具欄，下分兩類工具：
wireframe線框圖工具：基本上對應著web頁面中的各種圖形。針對頁面中互動行為的表達，Axure RP專門增加了p_w_picpath map region 影象對映區、dynamic panel動態面版、menu（vertical/horizontal）水平/垂直選單等幾個特殊的工具。 Flow工具：流程圖所需的基本圖形框架。 我們先談wireframe線框圖工具。學習這部分工具，如果事先有html基礎，或者對web頁面元素有比較充分的理解，就很容易入手。以下我根據圖片中的編碼，依次講解。
1、p_w_picpath圖片：給wireframe中插入一個圖片站位，也可以直接置入真實的圖片。 2、text panel文字：插入文字。相當於插入了一個< text >標籤。是不帶連結的文字。但是其實也可以帶連結，在interactions中我們會提到。 3、hyperlink超連結：插入帶連結的文字。相當於插入了一段帶< a >標籤的文字。但其實在Axure中它與普通文字除了外型不同，沒有本質區別。
之所以將兩類文字區分開來，目的還是為了在視覺表達中讓人直觀的理解連結文字和普通文字，而這對於設計人員理解也非常重要，因此建議畫圖時儘量標準的區分連結文字和普通文字。 4、rectangle矩形：插入一個矩形。可以對其進行圖形樣式編輯。此圖形通暢被用來表達板塊的邊界。 5、placeholder佔位符：插入一個佔位符。佔位符通常用來表達在頁面中某些特殊區域，比如情況複雜，或者在系統升級中不需要修改，又或者無關緊要的區域等等。作者需要結合說明文字，進行對應的詳細表達。
6、button按鈕：插入一個按鈕，相當於< button >標籤。按鈕一般結合表單使用，當然也可以作為強化的提示連結使用。 7、teble表格：插入一個表格。Axure的表格使用起來不是很方便，增加行、列，修改行、列寬度都不方便，算是一個敗筆。期待在下一個版本的時候能夠有更好的進步。與標準化製作網頁一樣，表格的使用在畫wireframe的時候就應該明確其作用，是用來作為資料列表展示使用，而不是作為網頁佈局的控制元件。 8、text field文字輸入框：結合表單使用。一般用作表單中提交資料。比如搜尋框、使用者登入框、註冊資訊填寫框等。用作欄位提交或單行資料提交。 9、text area文字區：結合表單使用。一般用作大段文字編輯、提交。比如文章編輯、留言等板塊。 10、droplist下拉列表框：結合表單使用。一般用作下拉選單或者下拉列表選項，比如在搜尋中，可以通過下拉列表框來定位搜尋分類的範圍。也有人用它來做友情連結，可以通過下拉選擇直接進行頁面跳轉。 11、listbox列表選擇框：結合表單使用。通過文字框列表選項，通常使用在多項列表選擇，比如在填寫簡歷表的時候，選擇你所感興趣的行業，會提供列表選擇框。不過列表選擇框都會結合按鈕使用。 12、checkbox多項選擇：多項選擇通常使用在表單中，以提供多項選擇。比如在有些有些註冊要求使用者選擇興趣愛好，會提供十多個選項，因為選項可以並列進行，因此使用的是多項選擇。 13、raido button單項選擇：在一組選擇中選擇適合選項，選項關係非此即彼。比如在填寫性別的時候提供男女選擇，使用者非男即女，只取一項。當然，不排除再多提供一個雙性選擇，這樣就是三選一，但是同樣是非此即彼的單一選擇。 14、15、horizontal line水平線、vertical line垂直線：用以分割頁面中的不同板塊區域。由於web頁面中只能存在垂直與水平線，為了系統生成用於演示的html檔案，特將兩種線條分開使用。 16、button shape形狀按鈕：相當於圖形按鈕，多用於導航，或者多幀切換的版面切換按鈕。可進行邊角編輯。 17、p_w_picpath map region影象對映區：它用於在web頁面中製造一片不可見的區域，一般是圖片的部分割槽域，相當於圖片的熱區，從而新增說明與互動。在現實的網頁中經常會有一張大圖中有某個區域是觸發按鈕，而影象對映區就可以用來說明這個區域的的功能和互動內容。 18、inline frame框架：類似於html中的< iframe >物件。用於在頁面中製造頁面框架，每個框架中嵌入不同的頁面。我們經常看到後臺系統分左右兩欄，一般都是使用了框架，左側載入的是導航頁面，右側是載入的管理頁面。
Axure的缺點是，暫時不支援百分比，因此iframe都是按畫素度量的，和實際頁面效果還是有差距。 19、dynamic panel動態面版：是Axure為了表現多幀區域內容而製造的一個工具。它的圖示很形象的說明了它的結構。它是不同的state疊加的一個動態區域，預設顯示其中一個state，當用戶觸發按鈕、圖片或者下拉列表等時，可以設定相應動態面版切換到不同的state。不同state的關係，類似於photoshop的層，也類似於html中的css屬性layer。
我們可以通過右擊dynamic panel進行state編輯，然後通過開啟對應state進行編輯，編輯方式和編輯頁面相同。 20、21、menu（vertical/horizontal）水平/垂直選單：用於製作水平或者垂直的選單，可以新增漂浮的的子選單，新增方法很簡單，就是選擇所要新增的選單項，新增submenu。 Axure RP pro 的widgets工具欄，另一個重要的工具組就是flow，流程工具。
對於畫流程圖，是我們經常會遇到的問題。我們和程式工程師溝通，用再多的口水，也無法挑明的事情，畫一張簡明的流程圖，就能很直白的說明關鍵問題。
有時候你可能會懊惱，因為程式設計師的思維猶如計算機，你告訴他為什麼沒有用，你就告訴他該怎麼做，是左是右，是0是1就好了。這個時候，產品經理需要的是理性思維，清晰的思路，如果你不清晰，工程師大多數會跟著你的思路亂做一團。所以多畫幾個流程，多根據頁面需求畫清晰的流程，就能解決實際的問題。
話不多說，本章主要介紹flow裡面的工具，因為圖形其實很好介紹，簡單的英文翻譯就好了，所以也順帶說說這些圖形在流程裡的作用。方式還和以前一樣，編號，對號入座，咱們來一個蘿蔔，一個坑：
1、rectangle：矩形
作用：一般用作要執行的處理（process），在程式流程圖中做執行框。
在axure中如果是畫頁面框架圖，那麼也可以指代一個頁面。有時候我會把頁面和執行命令放在同一個流程中做說明，這個時候將兩類不同的矩形做色彩區別，然後做說明就好了。 2、rounded rectangle：圓角矩形或者扁圓
作用：表示程式的開始或者結束，在程式流程圖中用作為起始框或者結束框。 3、beveled rectangle：斜角矩形
作用：斜角矩形我幾乎不使用，可以視情況自行定義。或者在其他的流程圖中，有特殊含義，暫不知曉，也希望有識之士指點一二。 4、diamond：菱形
作用：表示決策或判斷（例如：If...Then...Else）,在程式流程圖中，用作判別框。 5、file：檔案
作用：表達為一個檔案，可以是生成的檔案，或者是呼叫的檔案。如何定義，需要自己根據實際情況做解釋。 6、bracket：括弧
作用：註釋或者說明，也可以做條件敘述。一般流程到一個位置，做一段執行說明，或者特殊行為時，我會用到它。 7、semicircle：半圓形
作用：半圓在使用中常作為流程頁面跳轉、流程跳轉的標記。 8、triangle：三角形
作用：控制傳遞，一般和線條結合使用，畫資料傳遞。 9、trapezoid：梯形
作用：一般用作手動操作。 10、ellipse：橢圓形或圓形
作用：如果畫小圓，一般是用來表示按順序資料的流程。
如果是畫橢圓形，很多人用作流程的結束。如果是在use case用例圖中，橢圓就是一個用例了。 11、hexagon：六邊形
作用：表示準備之意，大多數人用作流程的起始，類似起始框。 12、parallelogram：平行四邊形
作用：一般表示資料，或確定的資料處理。或者表示資料輸入（Input）。 13、actor：角色
作用：來自於use case 用例，模擬流程中執行操作的角色是誰。需要注意的時，角色並非一定是人，有時候是機器自動執行，有時候也可是是模擬一個系統管理。 14、database：資料
作用：就是指儲存我們網站資料的資料庫。 15、p_w_picpath：圖片
作用：表示一張圖片，或者置入一個已經畫好的圖片、流程或者一個環境。 基本上，axure講基本流程圖、頁面框架圖、use case 用例圖涉及到的一些關鍵圖形都囊括在flow流程工具中，模糊了流程圖的區別，而儘量貼近互動設計時的工作內容。 流程圖無疑只是一個表達的工具，我們在使用的時候應該根據自己的實際情況使用，而不應該死鑽牛角尖，非要知道某個圖形的通用標準。理解和溝通是第一位的。而對於某些具有標準性含義的圖形，大家人所共知，則我們應該遵循共同的準則，這樣就能達到表達的目的。 其實axure裡面由於不涉及到具體的程式流程，所以有些標準的圖形並沒有提供，如不規則圖形、側面雙矩形等，大家可以自己google一下或者baidu一下很容易就知道。大多數情況下，還是自己自定義一下自己的符號標準，就跟prd文件加上名詞解釋一樣，才是解決方法。
PartVI:註釋annotations
Axure rp將interaction互動與annotations註釋說明功能放在了一個面版上，同時又針對整個頁面有一個互動與註釋說明。 互動功能設定的是使用者通過不同方式觸發頁面中元素或者載入頁面時，發生的互動動作。而註釋說明則用文字詳細說明對應元素的細節或頁面的說明。由於針對整個頁面的說明和互動，與針對頁面中某個元素的說明與互動在文件表現和生成的不同，而被分開，但是他們的實際功能是一致的，可以一起來說。 針對頁面和針對頁面元素的功能，分別預設處於軟體介面的右側和底側。如下面兩張圖片所示：
底部
右側 對於互動與註釋說明，有必要分開講述。這一節主要講述annotations，即註釋說明。 首先，我定義一下對互動與註釋說明的解釋。
Interaction：互動功能，用以設定頁面中的互動事件，如頁面跳轉、面版跳轉。從而實現框架圖中不同物件的實際功能。在生成html框架頁面時，產生相應的物件功能，用以演示操作。 Annotations：註釋說明，用以對頁面或頁面中的特定物件進行說明註釋。可以根據實際情況分類編寫說明內容。比如優先順序、功能型別、互動效果、說明等。讓程式在開發的時清楚瞭解該物件或該頁面的程式實現詳情與細節。 那麼，現在重點來說註釋。
1、自定義註釋與說明
你也許看到e文會頭大，你也許第一次看到annotations面版中specification、status、benefit、effect等一連串的英文單詞腦袋發暈，那麼我告訴你，你完全不用在意這些單詞和選項的意義，因為也許它們根本就不適合你，而你可以自定義一套自己的說明選項。 我之所以說你不必去理解，出於兩個理由，一是因為這些定義，是axure根據一些歐美公司文件中常見的欄位歸納出來的，他不適合我們的國情和我們自己公司的實際情況，二則是一個文件中該向你的程式設計師、設計師表達什麼，並沒有一個完全的框架。你儘可以根據你要說明的事情，以及你們往常的溝通方式來定義。那麼現在看看，我們怎麼來定義吧。 如果是定義右側的物件註釋，選擇 annotations & interactions > customize fields and viwe
如果是定義底部的頁面註釋，選擇 page notes – default > manage notes
就彈出了自定義視窗，由於功能類似，所以我只選擇複雜的右側的物件註釋來說明 如圖所示，我們看到了兩個區域：
區域一：Fields：這是管理系統所有的說明欄位的，這裡定義了針對物件你要說明它的哪些屬性，這些屬性，用什麼型別type的文字進行表述。 A)新增欄位 先在前面的下拉選擇框中定義該欄位的type型別，有四種類型：
Text：文字文字。說明欄位中用大段的文字進行說明。
Number：數字。說明欄位中只包含數字說明。
Date：日期。說明欄位只有日期
Selectlist：選擇列表。通過設定特定的選擇條件，以供選擇。 然後在後面的填空框中輸入欄位的名稱，比如我想設定一個對頁面中物件的開發優先順序的說明欄位，那麼我就可以給這個欄位命名為“優先順序”。然後點選add按鈕，你所設定的說明欄位就被新增到下面的欄位列表了。 B)管理欄位
管理欄位，首選必須選中你要管理的欄位。 然後可以通過選擇右側的功能按鈕，對欄位進行管理：
[b]Remove：[/b]刪除此欄位。
Rename：對欄位重新命名。
Move up：將欄位排列順序上移一格。
Move down：將欄位排列順序下移一格。
Edit selectlist：編輯選擇列表中的專案，該功能只有當你所選擇的說明欄位的type型別是selectlist時，你才能選擇。選擇後會彈出編輯視窗，你可以根據自己的需求，填寫不同的選擇項，Axure定義，每一行為一個選擇項。 點ok之後，你就完成了對所選項的管理。 區域二Custom views：這裡是定義了我們自定義檔案的版本。我們可以選擇幾個常用的說明欄位，歸納起來生成一個自定義版本。
A）新增使用者自定義說明 新增說明很簡單，只要在輸入框中輸入一個名稱，點選add，就會彈出一個選擇框 你可以通過add field下拉列表選擇你的自定義說明中要包含的說明欄位專案，然後點add新增到你的自定義說明中。
當你都選擇完成後，點done，就建立了一個你自己的自定義說明。 B）管理自定義說明
管理自定說明，和管理說明欄位一樣，在管理前，你必須選中你要管理的自定義說明。
Rename：對欄位重新命名。
Edit：重新定義此自定義說明中所包含的fields說明欄位。彈出選擇框，供你重新選擇。
Remove：刪除此自定義說明。 最後，當你即完成了對欄位的處理，又完成了自定義說明的生成後，點done，你就定義完成了你自己的註釋與說明。這個時候，你再選擇annotations & interactions，你將會看到你自己的自定義說明： 選擇後，右側的註釋與說明的欄位就都是你自己的了： 2、自定義註釋與說明的現實意義
那麼這些自定義說明到底對於我們有什麼現實的意義呢？有的，下面我來說明一下。
這涉及到axure rp的兩個文件生成功能 生成演示文件：我們利用axure完成文件的編寫後，需要給程式演示，那麼我們怎麼演示呢？
請按下f5鍵，會彈出提示框，按照預設設定確定後，就會生成html演示檔案。你就可以拿這些html檔案，給程式設計師、設計師們演示你的檔案了。
而我們自定義的這些說明，在編寫好的時候會出現在如圖中的位置： 就是說明面版的啟用按鈕，點選彈出你的說明文字。這樣，使用者就可以在不明白的時候在頁面中調出說明文字，一一查看了。 生成word文件：我們也可以生成word的文件的說明檔案，這樣的檔案甚至可以當作PRD文件使用，而說明則會根據label的標籤以及編號，對應生成table說明文件。
生成word的快捷鍵是F6，生成specification說明書。 綜上所述，運用好了annotations，就可以解決好prd文件中最重要的工作，即功能說明。至於設定怎樣的註釋，完全就靠你自己來掌控了。 Ps：頁面notes更加簡單，因為針對頁面的說明只能有一段文字，不存在特殊說明欄位的編輯。 ============ 最默默無聞的分割線，以下是2008.07.22更新的內容 ============ PartVII:互動interactions(上) Axure RP Pro5終於釋出了，直觀操作上，最明顯的變化之一就是在命令列多了“share.分享”，其次所有視窗可以以浮動形式編輯了。為了與時俱進，以後的教程將以Axure RP Pro5為基礎來繼續寫。 話說上次功能說到註釋annotations，這次就來說它的“親兄弟”互動interactions。之所以說他們是親兄弟，除了因為他們長在同一個面版上，更因為他們需要結合起來使用，這樣才能清楚的表明功能詳情。 打個不恰當的比方，如果要說明的功能物件是人，那麼註釋annotations標註的是這個人的基本屬性，比如“性別、年齡、學歷……”，互動interactions則是說明人根據外部條件，做出的迴應。比如你父母做好飯菜給你，你就吃飯；給你10塊錢，一個瓶子，囑託你買醬油，你就會一溜煙小跑去打醬油（這個比喻有點過時，現在都不這麼買了）。當然，我們說的是絕對條件下的絕對反應，這就是機器語言。 我們以一條簡單的文字連結為例：“hawking 的 axure rp 5 文章列表”。我們來對它新增互動行為。 我把互動分為三個部分的：互動觸發、互動條件、互動行為。這樣的區分，其實是參考程式程式設計的結構而做的，這就把程式構成人性化、語義化了。 這章我著重講解互動觸發與互動行為中的快速連結，詳情的互動行為與互動條件留待後面兩章進行詳解。還是照例先給三個名詞做出名詞解釋。 互動觸發：是發生互動的×××，說明引起互動的觸發動作是什麼。
以此文字鏈為例，互動的觸發原因，是“點選文字鏈”。 互動條件：是達成我們目標行為的前提條件。如果目標行為只有一個，對觸發沒有任何條件限制，互動條件則可以被忽略。
再以此文字連結為例，如果對檢視文章列表沒有任何限制，則不設定互動條件，使用者點選文字鏈，直接發生互動行為。如果對檢視文章列表有許可權限制，只允許作者檢視，則觸發交 互行為的條件就是“以文章作者hawking的身份登入”。
PS：有條件本身，就必然會有條件的反面。或者有多個條件，就會有多個條件之外的例外情況。在寫文件的時候，必須考慮進去，說明清楚，這一點最容易疏漏，而造成程式設計師在開發的時候想當然，或者再回來問你。針對這個例子，條件的反面就是“登入者不是hawking，或沒有登入”。 互動行為：是機器依據觸發事件與條件，做出的反應動作或行動。
此文字連結的的互動行為，就是“頁面跳轉到hawking 的 axure rp 5 文章列表頁面”。 一、互動觸發 觸發主要有兩種，一種是頁面載入觸發，一種是滑鼠行為觸發。 1、頁面載入觸發，針對的物件就是我們所編輯的頁面，axure將其放在了page notes&page interactions面版中。如下圖所示，就是page interactions。 Axure暫時僅支援一種頁面觸發條件，就是OnPageLoad當頁面載入時。 如圖所示，針對我們設定的case事件，axure提供了三個功能。
Add case：給所選物件增加事件。
Edit case：編輯所選事件。（功能前提，選擇你索要編輯的事件，比如滑鼠選擇case 1）。
Delete case：刪除所選事件。（功能前提，選擇你索要編輯的事件，比如滑鼠選擇case 1）。 2、滑鼠行為觸發是當用戶使用滑鼠操作介面時，引發互動。 Axure支援的滑鼠觸發行為根據你所選擇的物件不同而不同，選擇圖形、文字、連結會出現三種觸發行為：
Onclick：當滑鼠點選目標時，觸發互動行為。
OnMouseEnter：當滑鼠移入目標熱區時，觸發互動行為。
OnMouseOut：當滑鼠從目標熱區移出時，觸發互動行為。 如果選擇的是輸入框、多選框等則會出現對應功能的觸發行為：
OnKeyUp：Fires when the user releases a key.當釋放鍵盤時觸發互動行為。
OnFocus：當滑鼠選擇、聚焦到物件時，觸發互動行為。
OnLostFocus：當滑鼠失去對目標物件的選擇、聚焦時，觸發互動行為。 特別的，選擇下拉框、列表框會出現：
Onchange：當所選項被更改時，觸發互動行為。 而選擇我們所編輯的物件後，如果物件之前沒有編輯過互動事件，則有兩個選項
Add case：給所選物件增加事件。
Quick link：快速新增連結。 如果曾經編輯過互動事件，則有三個功能，和頁面載入觸發是一樣的，這裡也就不再累述。 二、互動行為—快速連結 選擇好互動觸發後，在對互動沒有特定條件設定的前提下，我們可以直接設定此次觸發引起的互動行為。由於連結跳轉是網頁中最常用的互動行為，因此axure特意提供了一個快速連結的功能。 選擇物件後，點選快速連結則會彈出如下link properties 連結屬性面版： 如圖所示，此面版中有四條可選命令：
1、link to a page in this design：連結到這個專案中的某一特定頁面。
你可以通過滑鼠點選，選擇你想要跳轉的，樹型目錄中的相應頁面。 2、link to an external url or file：連結到一個外部連結或者檔案。
你可以通過在hyperlink框中輸入連結地址，完成連結導向。
注意：連結最好是絕對連結地址，不然就容易出錯。 3、reload current page：重新載入當前頁面。
Variable changes are applied變數變化生效。 4、back to previous page：返回瀏覽前一頁面。
Varable changes are not applied變數變化不生效。 文章轉載自“折折熊de互動論”（http://www.jojobox.cn）
http://www.jojobox.cn/blog/p_w_uploads/month_0803/AxureRP-Pro-Setup.zip
（軟體僅供學習使用，反對商業用途 -_-！！！） Part I : 介紹(Introduce) 網際網路行業產品經理的一項重要工作，就是進行產品原型設計(Prototype Design)。而產品原型設計最基礎的工作，就是結合批註、大量的說明以及流程圖畫框架圖wireframe，將自己的產品原型完整而準確的表述給UI、UE、程式工程師，市場人員，並通過溝通會議，反覆修改prototype 直至最終確認，開始投入執行。 進行產品原型設計的軟體工具也有很多種，我寫的這個教程所介紹的Axure RP，是taobao、dangdang等國內大型網路公司的團隊在推廣使用的原型設計軟體。同時，此軟體也在產品經理圈子中廣為流傳。之所以Axure RP得到了大家的認同和推廣，正是因為其簡便的操作和使用，符合了產品經理、互動設計師們的需求。 在正式談Axure RP之前，我們先來看看做產品原型設計，現在大致有哪些工具可以使用，而他們的利弊何在。 紙筆：簡單易得，上手難度為零。有力於瞬間創意的產生與記錄，有力於對文件即時的討論與修改。但是保真度不高，難以表述頁面流程，更難以表述互動資訊與程式需求細節。
PPT：上手難度普通。易於畫框架圖，易於做批註，也可以表達互動流程，也擅長演示。但是不利於大篇幅的文件表達。
Visio：功能相對比較複雜。善於畫流程圖，框架圖。不利於批註與大篇幅的文字說明。同樣不利於互動的表達與演示。
Photshop/fireworks：操作難度相對較大，易於畫框架圖、流程圖。不利於表達互動設計，不擅長文字說明與批註。
Dreamweave：操作難度大，需要基礎的html知識。易於畫框架圖、流程圖、表達互動設計。不擅長文字說明與批註。 以上這些工具，都是產品經理經常會使用到的，但是從根本上來說，這些工具都不是做prototype design的專門利器，需要根據產品開發不同的目的，不同的開發階段，選擇不同的工具搭配使用，才能達到表達、溝通的目的。 比如使用紙筆，更適合在產品創意階段使用，可以快速記錄閃電般的思路和靈感；也可以在即時討論溝通時使用，通過圖形快速表達自己的產品思路，及時的畫出來，是再好不過的方法。而word則適合在用文字詳細表達產品，對產品進行細節說明時使用，圖片結合文字的排版，是word最擅長的工作。而ppt自然是演示時更好。visio則可以適用於各種流程圖、關係圖的表達，更可通過畫use case 獲取使用者需求。PS/FW是圖片處理的工具，DW則是所見即所得的網頁開發軟體，這些是設計師的看家本領，對於普通的產品經理來說，需要耗費太多的精力去掌握。 其實每件工具，每個軟體，在創造它的初期，軟體設計師們都給它賦予了性格、氣質。因為每個工具的產生，都是為了滿足人類的某一方面需求。比如鋤頭是鋤土的，起子是起螺絲的，電熨斗是燙衣服的。但是不同的工具都有自己的工作領域，在其他領域它並不擅長。而以上的軟體在創造的初期，並非為了幫助產品經理、ue完成產品原型設計，因此他們都不能在prototype design 這件工作上得心應手。而Axure RP正是在網際網路產品大張其道的前提下，為滿足prototype design建立的需求，應運而生。 Axure RP 能幫助網站需求設計者，快捷而簡便的建立 基於目錄組織的原型文件、功能說明、互動介面以及帶註釋的wireframe網頁，並可自動生成用於演示的網頁檔案和word文件，以提供演示與開發。 沒錯！Axure RP 的特點是： 快速建立帶註釋的wireframe檔案，並可根據所設定的時間週期，軟體自動儲存文件，確保檔案安全。
根據設計稿，一鍵生成一致而專業的word版本的原型設計文件。
說到這裡相信很多人已經激起了興趣，但是在開始學習之前，我認為我們還是有必要先了解一下軟體短短的歷史，創造這一軟體的公司—Axure Software Solutions, Inc.該公司創建於2002年五月，Axure RP是這一軟體公司的旗艦產品，2003年一月Axure RP第一版本上線發表，至今已經正式發行到了第四個版本，而我提筆寫到這裡的時候，Axure 5.0版本beta版本已經正式提供下載試用，雖然我已經下載使用，但是我想，寫教程還是應該先從穩定的4.6版說起，至於5.0版，我們可以伴隨著軟體一起成長。 接下來我會結合圖片，分幾個步驟分享我對Axure的認識，
二、 工具欄
三、 站點地圖
四、 元件與使用方法
五、 複用模板與使用
六、 互動功能與註釋
七、 例項 當然，在書寫的過程中我會根據具體的情況再進行調整，儘量做到圖文並茂，易於理解。寫這個教程的目的，一方面為自己熟悉與更加理解Axure，另一方面也鞭策自己完善自己的blog網站www.2tan.net，同時也希望以自己的綿薄之力，為希望學習Axure的朋友分享一點經驗。由於這是我第一次嘗試寫教程，難免會出現偏頗，也希望朋友們能夠不吝賜教，共同進步。 為e文好的朋友附上自學Axure RP的幾個途徑：
1、 開啟軟體，按F1調取幫助文件，對照文件學習。
2、 登入http://www.axure.com/au-home.aspx 檢視flash視訊學習。
3、 登入 Axure 部落格 http://axure.com/cs/blogs/Default.aspx，瞭解軟體最新資訊。
4、 登入討論組http://axure.com/cs/forums/Default.aspx，參與討論。 Part II : 介面與功能(Interface & Function)
不論學習什麼，打基礎是很重要的。關於基礎練習，我印象最深的故事是王羲之練習書法的故事，將一池水染黑，需要怎樣的毅力？再有就是達芬奇與雞蛋的故事，一個簡單的雞蛋，達芬奇畫了無數次。我相信正是他們的一步一個腳印，才讓他們有了後來偉大的成就。故事老套，道理淺顯，可是我認為很重要。 學習軟體，應該先熟悉每個面板，每個基礎功能，才能夠真正談到運用。所以我的學習方法是瞭解軟體的基礎功能開始。 一、歡迎介面與功能
執行Axure RP後，首先彈出的是歡迎介面，它擁有的功能和其他軟體的歡迎介面沒有什麼特別的不同。 功能區1：文件區，這個區域顯示使用者最近開啟的Axure RP檔案，使用者可以快捷的開啟之前編輯的檔案。同時也提供快捷按鈕，可以建立新文件與開啟Axure RP預設資料夾。 功能區2：認證區，這個區域顯示註冊資訊。
已經註冊的使用者，顯示註冊者名稱，與已經獲得認證的圖示。
未註冊使用者，顯示註冊連結，引導使用者完成註冊註冊。 功能區3：Axure RP學習中心。主要包括線上學習、幫助文件、問題反饋三個環節。
a、線上學習提供了三個連結：
video tutorial：點選後進入視訊學習中心，可以通過觀看相關的flash教程學習Axure RP，不過都是e文解說。
online community：進入Axure RP的官方討論組，線上討論學習。
Axure blog：進入Axure的官方論壇，瞭解最新資訊。
b、幫助文件也提供了兩個連結，但是其實起到的是一樣的效果，都是開啟幫助文件，只是跳往不同的章節罷了。 c、問題反饋，通過點選連結可以發郵件到[email protected]，以尋求獲得幫助。 在歡迎介面中，Axure還提醒使用者，用4.6高版本的軟體建立儲存的Axure檔案，無法用以前的低版本檢視。 同時，如果我們不希望下次開啟軟體再看到這個面板，我們可以通過選擇“Don't show this at startup”實現。 二、軟體主介面與功能
關閉歡迎介面後，我們進入軟體的主介面，淡藍色調的ui，並不是很張揚。 功能區1：命令區，和我們操作的所有office軟體一樣，包含檔案、編輯、檢視和幫助，這些功能大抵是差不多的。table也很容易理解，就是對錶格編輯的命令。而Axure特有的幾個特殊的命令欄目是 a、wireframe：線框，包含所有畫原型線框圖的相關命令。
b、object：包含所有對工作區物體的操作命令，操作放入工作區的所有widgets，包括組合、排序、鎖定以及腳註命令等。
c、generate：自動生成html演示檔案、word說明文件，以及對生成規則進行自行編輯、定義。 功能區2：工具欄，基本和office風格一模一樣，功能也很容易上手。 功能區3：工作區，這就是我們平常操作工具，建立prototype的舞臺，將自己的構思在這裡釋放，將自己的想法在這裡展現。 工作區的上部顯示開啟的檔名，可同時開啟多文件，進行操作。 功能區4：站點地圖，Axsure RP建立的檔案是模擬真實網站頁面關係的，sitemap就是通過樹形目錄關係，管理所有的站點頁面檔案與流程圖檔案。科學的檔案關係結構，對有效的演示文件與生成易讀的說明文件相當重要。 我的操作習慣是先畫流程圖，然後根據流程圖構建頁面檔案框架，最後才開始頁面的具體設定。期間可以將檔案分為LOFI（低保真）與HIFI（高保真）兩個部分進行分別展示，有利於不同的需求者使用。 功能區5：器具箱，囤積了所有用來畫wireframe與流程圖的物件。我們可以通過拖拽的方式將小圖形放入工作區，進行操作。對於這裡面的物件，我們有必要一一詳細瞭解。 功能區6：複用模組區，這裡建立的頁面檔案和sitemap的頁面相似，唯一不同的是，master的每個檔案，可以當作一個整體，被sitemap反覆呼叫。這個功能就相當於程式開發中的程式複用，用好這個功能，可以減少我們很大一部的工作量。也更容易理解網頁檔案的關係，瞭解網頁設計師、程式設計師是怎麼構建網站的頁面的。 功能區7：頁面筆記，用來對當前創作頁面進行註釋與說明。同時可以在這裡對頁面裡的關鍵欄位和特殊問題進行詳細的描述。 功能區8：頁面載入時的互動功能。通過在這裡設定，不同條件下，頁面初次開啟時的狀況。 功能區9：註釋與互動區。這個註釋和互動和7、8不同，7、8針對的是頁面，而9針對的是頁面中的元素，也就是一個個widgets。 功能區的上面部分設定互動條件。通過滑鼠點選、滑入、滑出，設定觸發的事件，與對應widgets相應的變化。這一部分對沒有程式基礎的人可能會有一點難度，我稍後會做詳細解釋。 功能區的下面部分是註釋部分，使用者可以對選定的物件進行詳細的註釋。Axure已經設定了幾個預設的註釋欄位，但是其實這些預設的註釋欄位，大家完全可以不使用，因為它可能和你要說明的東西風馬牛不相及。
那麼該怎麼辦呢？Axure提供了自主設定欄位，只要你自己設定好自己常用的欄位，然後按照自己的習慣編寫就可以了。比如說你要說明物件的功能、優先順序、引數，那麼你在設定中加入這三個欄位就好了。Axure最大的優勢就是你設定的這些註釋，在生成說明文件時，Axure自動幫你生成PRD規格的表格文件，你可以省去相當大的編號工作，與文件工作。這些我在之後也會做說明。 這些就是Axure的主要功能區，但是其實還有兩個小的角落大家可能會忽略，那就是6、7、8區下面的一行系統資訊，這裡顯示的資訊很重要，但是一般人卻經常會忽視。我只所以說重要，因為我們在給ui設計師wireframe的時候他們總會問，這裡多少畫素，那裡多少畫素，可是我們在畫wireframe的時候卻無法度量。Axure建立的wireframe，完全可以生成html，因此我們可以在畫的時候就度量好每個畫素距離。但是我們要怎麼做呢？這就需要利用到下面這行小資訊欄了。 資訊欄左邊顯示的是文件儲存情況。而右邊呢，當你將一個widgets放入工作區，並選擇這個widget時，這裡就有用了，它顯示的是你所選擇widget的高寬，以及距離頁面頂部和左邊的px距離。通過使用上下左右鍵，結合這個資訊欄，你可以一步一步將它移動到你想去的地方。有意思吧？ Part III : 文件管理(Document)
開章要說的是文件管理。文件管理看似簡單，但是這是從操作功能上來說的，而我在說功能上的時候，想把我對文件管理的理解也一併說一下。
文件管理的目的，其實是為了有一個清晰的產品思路。剛開始工作的時候，我發現很多剛從學校出來的朋友對文件的命名與放置都是隨心所欲的，我也不例外。沒有好的整理習慣，這直接導致每次尋找先前的文件都要花費相當長的時間，甚至不小心誤刪，如果恰好有事請假，別的同事也無法接手工作。
所以，做一個prototype需要首先構建一個清晰的文件關係，這樣一方面能夠讓自己清楚檔案關係與位置，更主要的是讓開發者與接受者能清晰理解你的思路，生成更合理的產品說明word文件。
Axure RP的sitemap，與windows的樹形目錄相似，是以父子關係構建頁面關係的，每個頁面既可以是一個頁面page，也可以是一個流程圖flow。
一、工具功能條
1、增加一個子頁面：為所選擇的頁面建立一個子頁面。
2、頁面上移：同等級的頁面中，將所選頁面的上下排列次序，上移一個位置。
3、頁面下移：同等級的頁面中，將所選頁面的上下排列次序，下移一個位置。
4、頁面降序：將所選頁面等級降序，作為原等級中，排列在所選頁面上方之頁面的子頁面。
5、頁面升序：將所選頁面等級升序，將所選頁面的頁面等級，升序為父頁面的同等級頁面。
6、刪除頁面：將所選頁面刪除，同時刪除其子頁面。
7、編輯頁面：在工作區開啟所選擇頁面，進行編輯。 二、右鍵—增加為滑鼠右擊檔案所顯示命令，下同。
1、增加一個子頁面：同 一，1。（表示和第一大點，第1小點功能相同，以下同此）
2、在所選頁面之上增加一個同等級頁面。
3、在所選頁面之下增加一個同等級頁面。 三、右鍵—移動
1、頁面上移：同一，2。
2、頁面下移：同一，3。
3、頁面降序：同一，4。
4、頁面升序：同一，5。 四、右鍵—複製
1、複製頁面：複製所選頁面，作為同級頁面顯示在所選頁面下方。不包含所選頁面子頁面。
2、複製分支：複製所選頁面以及子頁面，作為同級分支顯示在所選頁面分支下方。 五、右鍵—頁面型別
1、wireframe：頁面型別定為線框圖，檔案圖示顯示頁面圖示。2、flow：頁面型別定位流程圖，檔案圖示顯示流程圖示。 六、右鍵—其他
1、刪除頁面：同一、6。
2、重新命名頁面：為所選頁面重新命名。
3、編輯頁面：同一、7。
4、生成流程表：將所選頁面以及其子頁面關係，生成流程圖。生產圖有兩種頁面佈局方式可選。標準模式，頁面按照父子關係從上自下排列；階梯模式，頁面按照父子關係從左上至右下，以階梯方式進行排列。
5、複製頁面連結到剪下板。 以上就是sitemap所有命令，其實這些命令都很簡單，也很容易理解，關鍵在於怎麼去使用。 由於頁面有兩種型別，wireframe與flow，所以要善於用這兩種標記頁面，從而讓人理解你的意圖。我總結大致這兩種標記可以如下利用。 flow圖為父頁面，wireframe圖為子頁面：先畫流程圖，然後根據流程圖構建頁面關係。這樣在流程圖的指引下結構頁面關係，可以更清晰的理解頁面框架。 wireframe為父頁面，flow為子頁面：為頁面線框圖中的特殊部分做流程解釋。可以對頁面的細節部分進行詳盡的解釋。 當然，這兩種結構方式要活學活用，在複雜的產品頁面結構中，他們完全是你中有我，我中有你的。 Part IV : 模板複用(Templates)
masters和sitemap面板很相似，文件操作也一樣，它們的本質區別是，sitemap裡的檔案是最終展示頁面，masters裡的檔案卻只是一個模組，是頁面的一個部分。 masters的英文直譯是主人或僱主，但是我認為這裡可以叫做模板，或者複用模組。masters的檔案，是頁面中重複的模組，由於在不同頁面中這些模組是一樣的，所以拿出來作為一個模組編輯，然後在不同頁面中進行呼叫。 這個功能類似於網頁程式開發中的程式複用，不同頁面中呼叫同一段程式，一般把這段程式單獨做成一段頁面程式，然後用include命令進行呼叫。master的檔案就相當於這段被呼叫的頁面程式。dreamweaver也有類似的功能，就是template，可以參照理解。 一、功能條
master的功能條功能基本和sitemap一模一樣，功能也基本一樣。唯一不同的是master可以建立資料夾，可以通過資料夾收納不同的檔案，因此唯一不同的就是第一個功能按鈕，功能作用是增加一個資料夾。 二、右鍵單擊文件——增加
增加功能的功能模組功能除了增加資料夾其他和sitemap相同，大家可以參考教程三中的二大條。 而masters的文件組織結構主要依靠資料夾完成，頁面檔案之間不存在父子關係。這是文件操作與組織中與sitemap的最大不同。 三、右鍵單擊文件——移動
檔案移動功能基本上也和sitemap完全相同，但是父子關係的文件移動是檔案相對於資料夾完成，而不是相對於檔案進行。 功能，基本上也可以參考教程三的第三點。 四、右鍵單擊檔案——檔案身份“行為”
behavior是行為的意思，這個功能是axure升級到4版本後加入的，是針對master的不同使用情況而新增的一個功能，也是要重點介紹的功能。 1、normal：普通檔案。就是一般的複用檔案。是預設建立的複用檔案。 2、place in background：定位的複用模板，這類模板的特點是定位於頁面的底層，並且鎖定模板中的widgets在他原來建立的位置。這類複用模組主要用於建立head、foot、側邊欄等明確定位的複用模組。 3、custom widgets behavior：自定義模組。這類模組就類似於自創了一個widgets。 這類模組與其他型別的複用模組的不同在於，其他模組與複用到頁面的模組是完全相同的，模組的功能設定是什麼，功能說明是什麼，頁面中的模組設定和功能說明就是什麼。 而自定義模組與頁面中被複用的模組是母子關係。自定義模組只決定了模組的功能和位置，但是進入到特定的頁面中，模組中的各自部分的說明和功能可以重新定義。 充分理解三種不同型別的複用模組的區別，根據不同環境有效的選擇，也是非常重要的。 五、右鍵單擊檔案——其他
1、2、3功能都是文件文件操作功能，和sitemap一樣，分別是刪除、重新命名和編輯master。 4、5功能是對應的。前者是將所選模板檔案批量運用於頁面，後者是將所選模板檔案，批量從頁面中去除。通過選擇此功能，會彈出sitemap檔案的樹形目錄，你可以通過選擇需要新增模板的頁面，從而完成模板使用或移除。
check all：選擇所有頁面
uncheck all：所有頁面都不選擇
check all children：選擇所選頁面以及其所有子頁面
uncheck all children：不選擇所選頁面以及其所有字頁面 在4中有特殊的position設定和options命令， position中有兩個命令
place in blackground：將檔案至於頁面背景
specify location：是特殊定位，可以通過設定距離左側和上邊的距離，來將模板檔案放入特定的位置。
options裡的多選框的意思是“只有頁面中沒有此模板時才置入”，預設是選擇的。如果不選擇而置入頁面，就會出現如果頁面中已經有模板，模板被再次置入的情況。當然如果有特殊需要的模組，就可以這麼使用了。
6、usage report：使用報告，點選後彈出面板，顯示所有使用了此複用模板的列表，顯示的是檔名稱，通過雙擊檔名，可以在工作區開啟，直接編輯。 PartV:Widget工具 Axure RP的widgets工具欄，就是我們用來畫線框圖wireframe、流程圖flow的工具，也可以說是組成我們最終輸出圖表的零件。好比我們小時候玩的組裝積木，這些工具就是組裝積木裡的一個個小部件，組成什麼？組合得怎樣？完全依靠個人的經驗和智慧。因此，熟悉每一個工具的用法和用途，才能隨心所欲的畫出腦海中的圖形。 Widgets工具欄，下分兩類工具：
wireframe線框圖工具：基本上對應著web頁面中的各種圖形。針對頁面中互動行為的表達，Axure RP專門增加了p_w_picpath map region 影象對映區、dynamic panel動態面版、menu（vertical/horizontal）水平/垂直選單等幾個特殊的工具。 Flow工具：流程圖所需的基本圖形框架。 我們先談wireframe線框圖工具。學習這部分工具，如果事先有html基礎，或者對web頁面元素有比較充分的理解，就很容易入手。以下我根據圖片中的編碼，依次講解。
1、p_w_picpath圖片：給wireframe中插入一個圖片站位，也可以直接置入真實的圖片。 2、text panel文字：插入文字。相當於插入了一個< text >標籤。是不帶連結的文字。但是其實也可以帶連結，在interactions中我們會提到。 3、hyperlink超連結：插入帶連結的文字。相當於插入了一段帶< a >標籤的文字。但其實在Axure中它與普通文字除了外型不同，沒有本質區別。
之所以將兩類文字區分開來，目的還是為了在視覺表達中讓人直觀的理解連結文字和普通文字，而這對於設計人員理解也非常重要，因此建議畫圖時儘量標準的區分連結文字和普通文字。 4、rectangle矩形：插入一個矩形。可以對其進行圖形樣式編輯。此圖形通暢被用來表達板塊的邊界。 5、placeholder佔位符：插入一個佔位符。佔位符通常用來表達在頁面中某些特殊區域，比如情況複雜，或者在系統升級中不需要修改，又或者無關緊要的區域等等。作者需要結合說明文字，進行對應的詳細表達。
6、button按鈕：插入一個按鈕，相當於< button >標籤。按鈕一般結合表單使用，當然也可以作為強化的提示連結使用。 7、teble表格：插入一個表格。Axure的表格使用起來不是很方便，增加行、列，修改行、列寬度都不方便，算是一個敗筆。期待在下一個版本的時候能夠有更好的進步。與標準化製作網頁一樣，表格的使用在畫wireframe的時候就應該明確其作用，是用來作為資料列表展示使用，而不是作為網頁佈局的控制元件。 8、text field文字輸入框：結合表單使用。一般用作表單中提交資料。比如搜尋框、使用者登入框、註冊資訊填寫框等。用作欄位提交或單行資料提交。 9、text area文字區：結合表單使用。一般用作大段文字編輯、提交。比如文章編輯、留言等板塊。 10、droplist下拉列表框：結合表單使用。一般用作下拉選單或者下拉列表選項，比如在搜尋中，可以通過下拉列表框來定位搜尋分類的範圍。也有人用它來做友情連結，可以通過下拉選擇直接進行頁面跳轉。 11、listbox列表選擇框：結合表單使用。通過文字框列表選項，通常使用在多項列表選擇，比如在填寫簡歷表的時候，選擇你所感興趣的行業，會提供列表選擇框。不過列表選擇框都會結合按鈕使用。 12、checkbox多項選擇：多項選擇通常使用在表單中，以提供多項選擇。比如在有些有些註冊要求使用者選擇興趣愛好，會提供十多個選項，因為選項可以並列進行，因此使用的是多項選擇。 13、raido button單項選擇：在一組選擇中選擇適合選項，選項關係非此即彼。比如在填寫性別的時候提供男女選擇，使用者非男即女，只取一項。當然，不排除再多提供一個雙性選擇，這樣就是三選一，但是同樣是非此即彼的單一選擇。 14、15、horizontal line水平線、vertical line垂直線：用以分割頁面中的不同板塊區域。由於web頁面中只能存在垂直與水平線，為了系統生成用於演示的html檔案，特將兩種線條分開使用。 16、button shape形狀按鈕：相當於圖形按鈕，多用於導航，或者多幀切換的版面切換按鈕。可進行邊角編輯。 17、p_w_picpath map region影象對映區：它用於在web頁面中製造一片不可見的區域，一般是圖片的部分割槽域，相當於圖片的熱區，從而新增說明與互動。在現實的網頁中經常會有一張大圖中有某個區域是觸發按鈕，而影象對映區就可以用來說明這個區域的的功能和互動內容。 18、inline frame框架：類似於html中的< iframe >物件。用於在頁面中製造頁面框架，每個框架中嵌入不同的頁面。我們經常看到後臺系統分左右兩欄，一般都是使用了框架，左側載入的是導航頁面，右側是載入的管理頁面。
Axure的缺點是，暫時不支援百分比，因此iframe都是按畫素度量的，和實際頁面效果還是有差距。 19、dynamic panel動態面版：是Axure為了表現多幀區域內容而製造的一個工具。它的圖示很形象的說明了它的結構。它是不同的state疊加的一個動態區域，預設顯示其中一個state，當用戶觸發按鈕、圖片或者下拉列表等時，可以設定相應動態面版切換到不同的state。不同state的關係，類似於photoshop的層，也類似於html中的css屬性layer。
我們可以通過右擊dynamic panel進行state編輯，然後通過開啟對應state進行編輯，編輯方式和編輯頁面相同。 20、21、menu（vertical/horizontal）水平/垂直選單：用於製作水平或者垂直的選單，可以新增漂浮的的子選單，新增方法很簡單，就是選擇所要新增的選單項，新增submenu。 Axure RP pro 的widgets工具欄，另一個重要的工具組就是flow，流程工具。
對於畫流程圖，是我們經常會遇到的問題。我們和程式工程師溝通，用再多的口水，也無法挑明的事情，畫一張簡明的流程圖，就能很直白的說明關鍵問題。
有時候你可能會懊惱，因為程式設計師的思維猶如計算機，你告訴他為什麼沒有用，你就告訴他該怎麼做，是左是右，是0是1就好了。這個時候，產品經理需要的是理性思維，清晰的思路，如果你不清晰，工程師大多數會跟著你的思路亂做一團。所以多畫幾個流程，多根據頁面需求畫清晰的流程，就能解決實際的問題。
話不多說，本章主要介紹flow裡面的工具，因為圖形其實很好介紹，簡單的英文翻譯就好了，所以也順帶說說這些圖形在流程裡的作用。方式還和以前一樣，編號，對號入座，咱們來一個蘿蔔，一個坑：
1、rectangle：矩形作用：一般用作要執行的處理（process），在程式流程圖中做執行框。
在axure中如果是畫頁面框架圖，那麼也可以指代一個頁面。有時候我會把頁面和執行命令放在同一個流程中做說明，這個時候將兩類不同的矩形做色彩區別，然後做說明就好了。 2、rounded rectangle：圓角矩形或者扁圓
作用：表示程式的開始或者結束，在程式流程圖中用作為起始框或者結束框。 3、beveled rectangle：斜角矩形
作用：斜角矩形我幾乎不使用，可以視情況自行定義。或者在其他的流程圖中，有特殊含義，暫不知曉，也希望有識之士指點一二。 4、diamond：菱形
作用：表示決策或判斷（例如：If...Then...Else）,在程式流程圖中，用作判別框。 5、file：檔案
作用：表達為一個檔案，可以是生成的檔案，或者是呼叫的檔案。如何定義，需要自己根據實際情況做解釋。 6、bracket：括弧
作用：註釋或者說明，也可以做條件敘述。一般流程到一個位置，做一段執行說明，或者特殊行為時，我會用到它。 7、semicircle：半圓形
作用：半圓在使用中常作為流程頁面跳轉、流程跳轉的標記。 8、triangle：三角形
作用：控制傳遞，一般和線條結合使用，畫資料傳遞。 9、trapezoid：梯形
作用：一般用作手動操作。 10、ellipse：橢圓形或圓形
作用：如果畫小圓，一般是用來表示按順序資料的流程。
如果是畫橢圓形，很多人用作流程的結束。如果是在use case用例圖中，橢圓就是一個用例了。 11、hexagon：六邊形
作用：表示準備之意，大多數人用作流程的起始，類似起始框。 12、parallelogram：平行四邊形
作用：一般表示資料，或確定的資料處理。或者表示資料輸入（Input）。 13、actor：角色
作用：來自於use case 用例，模擬流程中執行操作的角色是誰。需要注意的時，角色並非一定是人，有時候是機器自動執行，有時候也可是是模擬一個系統管理。 14、database：資料
作用：就是指儲存我們網站資料的資料庫。 15、p_w_picpath：圖片
作用：表示一張圖片，或者置入一個已經畫好的圖片、流程或者一個環境。 基本上，axure講基本流程圖、頁面框架圖、use case 用例圖涉及到的一些關鍵圖形都囊括在flow流程工具中，模糊了流程圖的區別，而儘量貼近互動設計時的工作內容。 流程圖無疑只是一個表達的工具，我們在使用的時候應該根據自己的實際情況使用，而不應該死鑽牛角尖，非要知道某個圖形的通用標準。理解和溝通是第一位的。而對於某些具有標準性含義的圖形，大家人所共知，則我們應該遵循共同的準則，這樣就能達到表達的目的。 其實axure裡面由於不涉及到具體的程式流程，所以有些標準的圖形並沒有提供，如不規則圖形、側面雙矩形等，大家可以自己google一下或者baidu一下很容易就知道。大多數情況下，還是自己自定義一下自己的符號標準，就跟prd文件加上名詞解釋一樣，才是解決方法。
PartVI:註釋annotations
Axure rp將interaction互動與annotations註釋說明功能放在了一個面版上，同時又針對整個頁面有一個互動與註釋說明。 互動功能設定的是使用者通過不同方式觸發頁面中元素或者載入頁面時，發生的互動動作。而註釋說明則用文字詳細說明對應元素的細節或頁面的說明。由於針對整個頁面的說明和互動，與針對頁面中某個元素的說明與互動在文件表現和生成的不同，而被分開，但是他們的實際功能是一致的，可以一起來說。 針對頁面和針對頁面元素的功能，分別預設處於軟體介面的右側和底側。如下面兩張圖片所示：
底部
右側 對於互動與註釋說明，有必要分開講述。這一節主要講述annotations，即註釋說明。 首先，我定義一下對互動與註釋說明的解釋。
Interaction：互動功能，用以設定頁面中的互動事件，如頁面跳轉、面版跳轉。從而實現框架圖中不同物件的實際功能。在生成html框架頁面時，產生相應的物件功能，用以演示操作。 Annotations：註釋說明，用以對頁面或頁面中的特定物件進行說明註釋。可以根據實際情況分類編寫說明內容。比如優先順序、功能型別、互動效果、說明等。讓程式在開發的時清楚瞭解該物件或該頁面的程式實現詳情與細節。 那麼，現在重點來說註釋。
1、自定義註釋與說明
你也許看到e文會頭大，你也許第一次看到annotations面版中specification、status、benefit、effect等一連串的英文單詞腦袋發暈，那麼我告訴你，你完全不用在意這些單詞和選項的意義，因為也許它們根本就不適合你，而你可以自定義一套自己的說明選項。 我之所以說你不必去理解，出於兩個理由，一是因為這些定義，是axure根據一些歐美公司文件中常見的欄位歸納出來的，他不適合我們的國情和我們自己公司的實際情況，二則是一個文件中該向你的程式設計師、設計師表達什麼，並沒有一個完全的框架。你儘可以根據你要說明的事情，以及你們往常的溝通方式來定義。那麼現在看看，我們怎麼來定義吧。 如果是定義右側的物件註釋，選擇 annotations & interactions > customize fields and viwe
如果是定義底部的頁面註釋，選擇 page notes – default > manage notes
就彈出了自定義視窗，由於功能類似，所以我只選擇複雜的右側的物件註釋來說明 如圖所示，我們看到了兩個區域：
區域一：Fields：這是管理系統所有的說明欄位的，這裡定義了針對物件你要說明它的哪些屬性，這些屬性，用什麼型別type的文字進行表述。 A)新增欄位 先在前面的下拉選擇框中定義該欄位的type型別，有四種類型：
Text：文字文字。說明欄位中用大段的文字進行說明。
Number：數字。說明欄位中只包含數字說明。
Date：日期。說明欄位只有日期
Selectlist：選擇列表。通過設定特定的選擇條件，以供選擇。 然後在後面的填空框中輸入欄位的名稱，比如我想設定一個對頁面中物件的開發優先順序的說明欄位，那麼我就可以給這個欄位命名為“優先順序”。然後點選add按鈕，你所設定的說明欄位就被新增到下面的欄位列表了。 B)管理欄位
管理欄位，首選必須選中你要管理的欄位。 然後可以通過選擇右側的功能按鈕，對欄位進行管理：
[b]Remove：[/b]刪除此欄位。
Rename：對欄位重新命名。
Move up：將欄位排列順序上移一格。
Move down：將欄位排列順序下移一格。
Edit selectlist：編輯選擇列表中的專案，該功能只有當你所選擇的說明欄位的type型別是selectlist時，你才能選擇。選擇後會彈出編輯視窗，你可以根據自己的需求，填寫不同的選擇項，Axure定義，每一行為一個選擇項。 點ok之後，你就完成了對所選項的管理。 區域二Custom views：這裡是定義了我們自定義檔案的版本。我們可以選擇幾個常用的說明欄位，歸納起來生成一個自定義版本。
A）新增使用者自定義說明 新增說明很簡單，只要在輸入框中輸入一個名稱，點選add，就會彈出一個選擇框 你可以通過add field下拉列表選擇你的自定義說明中要包含的說明欄位專案，然後點add新增到你的自定義說明中。
當你都選擇完成後，點done，就建立了一個你自己的自定義說明。 B）管理自定義說明
管理自定說明，和管理說明欄位一樣，在管理前，你必須選中你要管理的自定義說明。
Rename：對欄位重新命名。
Edit：重新定義此自定義說明中所包含的fields說明欄位。彈出選擇框，供你重新選擇。
Remove：刪除此自定義說明。 最後，當你即完成了對欄位的處理，又完成了自定義說明的生成後，點done，你就定義完成了你自己的註釋與說明。這個時候，你再選擇annotations & interactions，你將會看到你自己的自定義說明： 選擇後，右側的註釋與說明的欄位就都是你自己的了： 2、自定義註釋與說明的現實意義
那麼這些自定義說明到底對於我們有什麼現實的意義呢？有的，下面我來說明一下。
這涉及到axure rp的兩個文件生成功能 生成演示文件：我們利用axure完成文件的編寫後，需要給程式演示，那麼我們怎麼演示呢？
請按下f5鍵，會彈出提示框，按照預設設定確定後，就會生成html演示檔案。你就可以拿這些html檔案，給程式設計師、設計師們演示你的檔案了。
而我們自定義的這些說明，在編寫好的時候會出現在如圖中的位置： 就是說明面版的啟用按鈕，點選彈出你的說明文字。這樣，使用者就可以在不明白的時候在頁面中調出說明文字，一一查看了。 生成word文件：我們也可以生成word的文件的說明檔案，這樣的檔案甚至可以當作PRD文件使用，而說明則會根據label的標籤以及編號，對應生成table說明文件。
生成word的快捷鍵是F6，生成specification說明書。 綜上所述，運用好了annotations，就可以解決好prd文件中最重要的工作，即功能說明。至於設定怎樣的註釋，完全就靠你自己來掌控了。 Ps：頁面notes更加簡單，因為針對頁面的說明只能有一段文字，不存在特殊說明欄位的編輯。 ============ 最默默無聞的分割線，以下是2008.07.22更新的內容 ============ PartVII:互動interactions(上) Axure RP Pro5終於釋出了，直觀操作上，最明顯的變化之一就是在命令列多了“share.分享”，其次所有視窗可以以浮動形式編輯了。為了與時俱進，以後的教程將以Axure RP Pro5為基礎來繼續寫。 話說上次功能說到註釋annotations，這次就來說它的“親兄弟”互動interactions。之所以說他們是親兄弟，除了因為他們長在同一個面版上，更因為他們需要結合起來使用，這樣才能清楚的表明功能詳情。 打個不恰當的比方，如果要說明的功能物件是人，那麼註釋annotations標註的是這個人的基本屬性，比如“性別、年齡、學歷……”，互動interactions則是說明人根據外部條件，做出的迴應。比如你父母做好飯菜給你，你就吃飯；給你10塊錢，一個瓶子，囑託你買醬油，你就會一溜煙小跑去打醬油（這個比喻有點過時，現在都不這麼買了）。當然，我們說的是絕對條件下的絕對反應，這就是機器語言。 我們以一條簡單的文字連結為例：“hawking 的 axure rp 5 文章列表”。我們來對它新增互動行為。 我把互動分為三個部分的：互動觸發、互動條件、互動行為。這樣的區分，其實是參考程式程式設計的結構而做的，這就把程式構成人性化、語義化了。 這章我著重講解互動觸發與互動行為中的快速連結，詳情的互動行為與互動條件留待後面兩章進行詳解。還是照例先給三個名詞做出名詞解釋。 互動觸發：是發生互動的×××，說明引起互動的觸發動作是什麼。
以此文字鏈為例，互動的觸發原因，是“點選文字鏈”。 互動條件：是達成我們目標行為的前提條件。如果目標行為只有一個，對觸發沒有任何條件限制，互動條件則可以被忽略。
再以此文字連結為例，如果對檢視文章列表沒有任何限制，則不設定互動條件，使用者點選文字鏈，直接發生互動行為。如果對檢視文章列表有許可權限制，只允許作者檢視，則觸發交 互行為的條件就是“以文章作者hawking的身份登入”。
PS：有條件本身，就必然會有條件的反面。或者有多個條件，就會有多個條件之外的例外情況。在寫文件的時候，必須考慮進去，說明清楚，這一點最容易疏漏，而造成程式設計師在開發的時候想當然，或者再回來問你。針對這個例子，條件的反面就是“登入者不是hawking，或沒有登入”。 互動行為：是機器依據觸發事件與條件，做出的反應動作或行動。
此文字連結的的互動行為，就是“頁面跳轉到hawking 的 axure rp 5 文章列表頁面”。 一、互動觸發 觸發主要有兩種，一種是頁面載入觸發，一種是滑鼠行為觸發。 1、頁面載入觸發，針對的物件就是我們所編輯的頁面，axure將其放在了page notes&page interactions面版中。如下圖所示，就是page interactions。 Axure暫時僅支援一種頁面觸發條件，就是OnPageLoad當頁面載入時。 如圖所示，針對我們設定的case事件，axure提供了三個功能。
Add case：給所選物件增加事件。
Edit case：編輯所選事件。（功能前提，選擇你索要編輯的事件，比如滑鼠選擇case 1）。
Delete case：刪除所選事件。（功能前提，選擇你索要編輯的事件，比如滑鼠選擇case 1）。 2、滑鼠行為觸發是當用戶使用滑鼠操作介面時，引發互動。 Axure支援的滑鼠觸發行為根據你所選擇的物件不同而不同，選擇圖形、文字、連結會出現三種觸發行為：
Onclick：當滑鼠點選目標時，觸發互動行為。
OnMouseEnter：當滑鼠移入目標熱區時，觸發互動行為。
OnMouseOut：當滑鼠從目標熱區移出時，觸發互動行為。 如果選擇的是輸入框、多選框等則會出現對應功能的觸發行為：
OnKeyUp：Fires when the user releases a key.當釋放鍵盤時觸發互動行為。
OnFocus：當滑鼠選擇、聚焦到物件時，觸發互動行為。
OnLostFocus：當滑鼠失去對目標物件的選擇、聚焦時，觸發互動行為。 特別的，選擇下拉框、列表框會出現：
Onchange：當所選項被更改時，觸發互動行為。 而選擇我們所編輯的物件後，如果物件之前沒有編輯過互動事件，則有兩個選項
Add case：給所選物件增加事件。
Quick link：快速新增連結。 如果曾經編輯過互動事件，則有三個功能，和頁面載入觸發是一樣的，這裡也就不再累述。 二、互動行為—快速連結 選擇好互動觸發後，在對互動沒有特定條件設定的前提下，我們可以直接設定此次觸發引起的互動行為。由於連結跳轉是網頁中最常用的互動行為，因此axure特意提供了一個快速連結的功能。 選擇物件後，點選快速連結則會彈出如下link properties 連結屬性面版： 如圖所示，此面版中有四條可選命令：
1、link to a page in this design：連結到這個專案中的某一特定頁面。
你可以通過滑鼠點選，選擇你想要跳轉的，樹型目錄中的相應頁面。 2、link to an external url or file：連結到一個外部連結或者檔案。
你可以通過在hyperlink框中輸入連結地址，完成連結導向。
注意：連結最好是絕對連結地址，不然就容易出錯。 3、reload current page：重新載入當前頁面。
Variable changes are applied變數變化生效。 4、back to previous page：返回瀏覽前一頁面。
Varable changes are not applied變數變化不生效。 文章轉載自“折折熊de互動論”（http://www.jojobox.cn）