第2章-用頁(yè)面區(qū)域管理軟件頁(yè)面

第2章

用頁(yè)面區(qū)域管理軟件頁(yè)面

AxureRP原型設(shè)計(jì)圖解微課視頻教程互聯(lián)網(wǎng)＋職業(yè)技能系列極客學(xué)院頁(yè)面區(qū)域位于軟件界面的左上方，是用來(lái)管理頁(yè)面和顯示頁(yè)面的區(qū)域，如圖2.1所示。

管理軟件頁(yè)面關(guān)系軟件的骨架，清晰展示軟件的結(jié)構(gòu)圖2.1管理頁(yè)面層級(jí)本章案例：“百度門戶”欄目規(guī)劃，效果如圖2.2所示。

圖2.2“百度門戶”欄目規(guī)劃效果2.1?頁(yè)面區(qū)域是什么

2.2?

頁(yè)面區(qū)域的功能使用2.3?

實(shí)戰(zhàn)——“百度門戶”欄目規(guī)劃2.4?小結(jié)2.1頁(yè)面區(qū)域是什么2.1.1什么是頁(yè)面區(qū)域頁(yè)面區(qū)域由兩部分組成。一部分是功能菜單，就是一些操作頁(yè)面的按鈕，在頁(yè)面右鍵選項(xiàng)里提供更多操作按鈕，另一部分是頁(yè)面，呈現(xiàn)樹狀結(jié)構(gòu)，與Windows文件存放目錄結(jié)構(gòu)一致。通過(guò)父與子的頁(yè)面關(guān)系、兄弟和兄弟的頁(yè)面關(guān)系，將設(shè)計(jì)的產(chǎn)品頁(yè)面整合起來(lái)，形成產(chǎn)品的文檔，如圖2.3所示。

圖2.3頁(yè)面區(qū)域的結(jié)構(gòu)和功能

2.1.2頁(yè)面區(qū)域能干什么1.頁(yè)面區(qū)域可以用來(lái)規(guī)劃軟件的功能單元或者軟件的結(jié)構(gòu)

2.頁(yè)面區(qū)域可以讓使用者快速地了解軟件的結(jié)構(gòu)

3.頁(yè)面區(qū)域方便使用者快速地找到想要的頁(yè)面

2.1.3使用頁(yè)面區(qū)域注意事項(xiàng)1.制作軟件原型時(shí)要規(guī)劃軟件的功能菜單或者欄目結(jié)構(gòu)2.頁(yè)面的命名要有意義制作原型時(shí)要事先規(guī)劃好軟件的功能菜單或者欄目結(jié)構(gòu)，不要隨意地在站點(diǎn)地圖上新建頁(yè)面，導(dǎo)致頁(yè)面結(jié)構(gòu)混亂，根本看不出軟件的功能結(jié)構(gòu)。頁(yè)面的命名要讓使用者一看，就能知道這個(gè)頁(yè)面所要表達(dá)的含義。要做到顧名思義，不光是頁(yè)面要命名得有意義，部件也要命名得有意義。2.1?站點(diǎn)地圖是什么2.2?頁(yè)面區(qū)域的功能使用2.3?實(shí)戰(zhàn)——“百度門戶”欄目規(guī)劃2.4?小結(jié)2.2頁(yè)面區(qū)域的功能使用頁(yè)面區(qū)域的功能使用包括兩方面內(nèi)容：

功能菜單的使用01OPTION02OPTION頁(yè)面管理圖2.4頁(yè)面的功能菜單

除了使用功能菜單來(lái)管理頁(yè)面，也可以在頁(yè)面上右鍵單擊，通過(guò)彈出的

菜單選項(xiàng)管理頁(yè)面，如圖2.5所示。

圖2.5頁(yè)面右鍵菜單選項(xiàng)

添加：菜單選項(xiàng)，可以所選頁(yè)面之前或之后新增同級(jí)頁(yè)面，新增文件夾或新增子頁(yè)面。它的效果和功能條上的新增頁(yè)面和新增文件夾是一樣的。

移動(dòng)：菜單選項(xiàng)可以移動(dòng)頁(yè)面的前后順序關(guān)系，調(diào)整頁(yè)面的層級(jí)關(guān)系，和功能條上的移動(dòng)操作一致。

刪除：不想要的頁(yè)面或者文件夾可以通過(guò)刪除菜單選項(xiàng)來(lái)進(jìn)行刪除。如果當(dāng)前頁(yè)面下含有子頁(yè)面，Axure會(huì)自動(dòng)提示，單擊提示中的“確認(rèn)”后會(huì)同時(shí)刪除所有子頁(yè)面。

重命名：頁(yè)面的重新命名的方式有3種。

頁(yè)面重新命名的方式有3種：通過(guò)快捷鍵F2進(jìn)行頁(yè)面的重新命名。通過(guò)右鍵菜單選項(xiàng)里的重命名選項(xiàng)來(lái)重新命名；選中頁(yè)面后再單擊頁(yè)面名稱；312通過(guò)圖表（標(biāo)）類型菜單選項(xiàng)來(lái)更改頁(yè)面的圖標(biāo)類型，可以改為頁(yè)面或者流程圖的圖標(biāo)。圖標(biāo)的更改并不會(huì)影響頁(yè)面的內(nèi)容，只是便于對(duì)頁(yè)面的管理。通過(guò)生成流程圖菜單選項(xiàng)，可以生成縱向或者橫向的流程圖。選中index頁(yè)面，然后單擊鼠標(biāo)右鍵，選擇生成流程圖選項(xiàng)，生成縱向流程圖，如圖2.6所示。

圖2.6縱向流程圖2.1?站點(diǎn)地圖是什么2.2

頁(yè)面區(qū)域的功能使用2.3?

實(shí)戰(zhàn)——“百度門戶”欄目規(guī)劃2.4?小結(jié)2.3實(shí)戰(zhàn)——“百度門戶”欄目規(guī)劃

結(jié)合前兩節(jié)學(xué)習(xí)的內(nèi)容，我們來(lái)做一個(gè)“百度”欄目規(guī)劃的案例，打開瀏覽器，輸入地址“”，打開百度門戶頁(yè)面，如圖2.7所示。

圖2.7百度門戶百度門戶，它有7個(gè)一級(jí)菜單，也就是被劃分為7個(gè)大的功能模塊。123456（一）首頁(yè)：這個(gè)是很多網(wǎng)站都存在的模塊，展示網(wǎng)站的綜合信息。（二）百度介紹：也就是企業(yè)介紹，也是必有的一個(gè)模塊。（三）新聞中心：用來(lái)介紹公司的一些新聞事件。（四）產(chǎn)品中心：這個(gè)模塊可以根據(jù)實(shí)際情況來(lái)選擇是否有。（五）商業(yè)中心：是百度的營(yíng)銷推廣模塊，可以根據(jù)實(shí)際情況來(lái)選擇（六）招賢納士：是很多門戶網(wǎng)站都存在的功能模塊。7（七）聯(lián)系我們：是很多門戶網(wǎng)站都存在的功能模塊。1.將index頁(yè)面重新命名為“百度門戶”，在百度門戶下面建立7個(gè)頁(yè)面，分別命名為“首頁(yè)”“百度介紹”“新聞中心”“產(chǎn)品中心”“商業(yè)中心”“招賢納士”和“聯(lián)系我們”，如圖2.8所示。

圖2.8百度一級(jí)菜單

在百度介紹頁(yè)面新增兩個(gè)子頁(yè)面，有兩種方式：一種是通過(guò)功能條，另一種是通過(guò)右鍵單擊

菜單選項(xiàng)。將兩個(gè)子頁(yè)面分別命名為“百度文化”和“百度之路”，如圖2.9所示。在產(chǎn)品中心頁(yè)面新增3個(gè)子頁(yè)面，分別命名為“產(chǎn)品大全”“用戶幫助”和“投訴中心”，

可以把暫時(shí)不需要展示的子頁(yè)面收縮起來(lái)，如圖2.10所示。

圖2.9百度介紹二級(jí)菜單

圖2.10產(chǎn)品中心二級(jí)菜單

在商業(yè)中心頁(yè)面新增4個(gè)子頁(yè)面，分別命名為“百度推廣”“營(yíng)銷中心”“互動(dòng)營(yíng)銷”和

聯(lián)盟合作”，如圖2.11所示。在招賢納士頁(yè)面新增3個(gè)子頁(yè)面，分別命名為“社會(huì)招聘”“校園招聘”和“百度校園”，

如圖2.12所示。

圖2.11商業(yè)中心二級(jí)菜單

圖2.12招賢納士二級(jí)菜單

6. 在聯(lián)系我們頁(yè)面新增一個(gè)子頁(yè)面，命名為“參觀百度”，如圖2.13所示。

圖2.13聯(lián)系我們二級(jí)菜單2.1?頁(yè)面區(qū)域是什么

2.2?

頁(yè)面區(qū)域的功能使用2.3?

實(shí)戰(zhàn)——“百度門戶”欄目規(guī)劃2.4

小結(jié)2.4小結(jié)

本章主要學(xué)習(xí)頁(yè)面區(qū)域的使用，通過(guò)頁(yè)面區(qū)域管理頁(yè)面，應(yīng)當(dāng)做到以下幾點(diǎn)。

（1）了解什么是頁(yè)面區(qū)域，頁(yè)面區(qū)域由兩部分組成：功能菜單和頁(yè)面。它可以管理軟件的頁(yè)面關(guān)系。

（2）通過(guò)功能菜單和右鍵菜單選項(xiàng)來(lái)管理頁(yè)面，包括新增頁(yè)面、移動(dòng)頁(yè)面、刪除頁(yè)面及搜索頁(yè)面等。

（3）學(xué)會(huì)如何規(guī)劃軟件欄目結(jié)構(gòu)。謝謝觀賞AxureRP原型設(shè)計(jì)圖解微課視頻教程互聯(lián)網(wǎng)＋職業(yè)技能系列極客學(xué)院海量圖書方便查詢免費(fèi)申請(qǐng)樣書下載配套資源優(yōu)惠購(gòu)書成為作者更多樣書申請(qǐng)和資源下載需求，請(qǐng)登錄人郵教育社區(qū)（)囊括各大品類，