先看一下博客園的登錄表單,然后用Axure RP一步一步把這個表單原型做出來。

運行Axure RP軟件,馬上開始動手:
1、添加一個頁面,把頁面命名為"博客園",然后在"博客園"這個頁面下添加一個子頁面叫"登錄頁面"。
1)添加一個頁面

2)在這個頁面上點擊右鍵,選擇"Rename"菜單,將頁面重命名為"博客園"

3)給"博客園"頁面添加一個子頁面。選中"博客園"頁面,然后點擊添加圖片,添加一個子頁面。或者在"博客園"頁面上點擊鼠標右鍵,選擇菜單ADD--->Child Page。最后將這這個子頁面重命名為"登錄頁面"。

我們這樣做的目的是以清晰的樹結構組織所有的頁面,方便管理。相應的操作都可以點擊相應的功能圖標或者點擊鼠標右鍵選擇相應的菜單來完成。另外重命名可以選中頁面后,摁一下F2鍵,就可以快速的進入編輯狀態。
2、雙擊"登錄頁面",使這個頁面在設計區域處於編輯狀態。

3、從控件面板中把矩形控件拖到設計區域中的登錄頁面。然后將矩形控件調整到合適的大小。

4、設計登錄表單頂部的"登錄到博客園"標簽文字和"立即注冊"鏈接。這需要用到控件面板中的 Text Panel控件。
1)從控件面板拖動兩個Text Panel到設計區域的登錄頁面中

2)接下來對這兩個Text Panel顯示的文字、字體、大小、顏色進行設置

5、設計登錄表單的用戶名和密碼輸入框。需要用到控件面板中的Text Panel控件和Text Field控件。
1)先拖入一個Text Panel用於顯示"用戶名",接着拖入一個Text Field用於用戶名的輸入框,接着拖入一個Text Panel用於顯示"找回用戶名"鏈接;接着再拖入一個Text Panel用於顯示"密碼",接着再拖入一個Text Field用於密碼輸入框,接着再拖入一個Text Panel用於顯示"找回密碼"鏈接。

2)設置這些控件的文本顯示、字體、顏色、大小、下划線等

6、就剩下登錄表單底部的是否保存密碼選擇框、登錄按鈕和一些超鏈接了。這里要用到控件面板中的Button控件和Checkbox控件。
1)拖入相關控件到設計區域的登錄頁面中

2)設置控件文本相關的屬性

7、這個登錄表單原型就設計完成了,然后需要輸出網頁原型。Axure RP生產的網頁原型是可以直接在瀏覽器上觀看的。所以觀看網站原型的人僅需要一般瀏覽器,不需要安裝Axure RP軟件。
1)點擊Axure RP頂部菜單區域的Generate菜單,選擇Prototype選項,或者按F5就可以打開生成原型對話框。一般我們只需選擇好保存的文件夾即可,其他選項使用默認就可以了。

2)看看最后生成的網頁效果
8、生成規格文檔,輸出到Office Word中。
1)想要輸出規格文件或設定(Configure Specification)輸出格式的話,請按下Axure RP軟件上方主功能選單「Generate」菜單,選擇「Specification(F6)」,就可以打開生成規格文檔對話框,可以對文檔的格式進行設定等等,不多說了。
一些提示:
1)處於設計區域的頁面中的控件,選中后,直接用Ctrl+C復制、Ctrl+V粘貼,就可以生成同樣的控件,就無需再從控件面板拖進來了。
2)處於設計區域的頁面中的控件,選中后,可以使用鍵盤上的四個方向鍵進行控件擺放位置的微調。
3)超鏈接的顯示效果可以使用下划線+藍色字體顯示出來。當然,在后面的學交互性習中,還會加上事件,使超鏈接真正具有實際的功能。
4)當您設計網站原型的技巧越純熟,網站項目會越來越大,導致輸出網站原型的時間會隨着項目而變大。萬一您只是調整其中的某一頁,卻得等待整個網站重新全部輸出,那就太浪費時間了。想要重新產生某一頁網頁,只要在Axure RP打開該頁Wireframe,接着按下Axure RP主功能選單「Generate」菜單,選擇「Regenerate Current Page to Prototype(CTRL+F5)」。當您選擇這個動作,或者直接按下熱鍵CTRL+F5,Axure RP不會產生任何對話窗口,您只會感覺到鼠標指針閃了一下,此時,再回到網站原型(HTML Prototype)上去reload這一頁,或click這一頁網頁名稱,就會看到已經更新的頁面了。(網上摘錄的一段話,挺有用)
