PRODUCT互聯(lián)網(wǎng)產(chǎn)品原型設(shè)計主講人：馬勝銘時間：2026年5-4原型設(shè)計進(jìn)階技巧0102母版的創(chuàng)建母版的拖放行為03母版的應(yīng)用01母版的創(chuàng)建原型設(shè)計進(jìn)階技巧母版核心作用母版的創(chuàng)建減少重復(fù)制作，大幅降低設(shè)計工作量在原型設(shè)計中常遇重復(fù)的頁面元素（如導(dǎo)航欄、頁腳），使用Axure母版功能可實現(xiàn)“一次設(shè)計，處處引用”。避免重復(fù)勞動無需在每個頁面重復(fù)繪制相同的導(dǎo)航條或菜單，解決傳統(tǒng)復(fù)制粘貼帶來的維護(hù)難

題。提升設(shè)計效率修改母版即可同步更新所有引用的頁面，極大地縮短了迭代修改的時間成本。新建母版步驟1母版的創(chuàng)建切換面板區(qū)域在Axure界面左下角找到并點擊“母版”選項卡，進(jìn)入母版管理視圖。執(zhí)行添加操作點擊面板工具欄中的“添加母版”按鈕（+號圖標(biāo)），創(chuàng)建一個新的空白母版。規(guī)范命名管理雙擊新建的母版名稱，將其重命名為“導(dǎo)航條”，以便后續(xù)識別調(diào)用。圖示：添加母版操作制作導(dǎo)航母版內(nèi)容母版的創(chuàng)建01拖入矩形元件在Axure的元件庫面板中找到“矩形”元件，將其拖拽至母版編輯工作區(qū)的中心位置。02復(fù)制并排列復(fù)制該矩形兩次，并將這三個矩形橫向排列對齊，保持間距一致，構(gòu)建導(dǎo)航條的基本骨架。03命名與賦值分別雙擊這三個矩形元件，依次輸入文字內(nèi)容：

“首頁”、“新聞中心”、“社會責(zé)任”。Axure

RP

-

Master

View:Navigation首頁新聞中心社會責(zé)任創(chuàng)建頁面與母版批量引用母版的創(chuàng)建1

創(chuàng)建獨立展示頁面在頁面面板中分別創(chuàng)建“首頁”、“新聞中心”、“社會責(zé)任”三個獨立頁面，作為母版引用的載體。2

母版批量引用右鍵點擊導(dǎo)航條母版選擇“添加到頁面中”，在彈窗中勾選所有目標(biāo)頁面，實現(xiàn)一次性批量部署。母版應(yīng)用效果與移除操作母版的創(chuàng)建查看應(yīng)用效果雙擊“首頁”頁面進(jìn)入編輯區(qū)，即可直觀看到導(dǎo)航條母版已成功同步應(yīng)用。母版內(nèi)容的任何修改都會自動更新到所有引用頁面，實現(xiàn)高效復(fù)用。移除母版關(guān)聯(lián)若需解除關(guān)聯(lián)，在母版面板中右鍵點擊目標(biāo)母版，選擇“從頁面中移除”選項。在彈出的對話框中勾選目標(biāo)頁面，即可快速切斷母版引用。母版第二種創(chuàng)建方法母版的創(chuàng)建方法二：元件直接轉(zhuǎn)換無需重新創(chuàng)建，直接利用現(xiàn)有設(shè)計成果。將頁面中已完成布局和樣式的元件組合，一鍵升級為可復(fù)用的母版，大幅提升設(shè)計效率。1選中目標(biāo)元件在畫布中選擇一個或多個需要復(fù)用的元件2右鍵上下文菜單點擊鼠標(biāo)右鍵喚出操作菜單3轉(zhuǎn)換為母版選擇功能項并命名完成母版創(chuàng)建制作頁面導(dǎo)航條-案例母版的創(chuàng)建拖入元件在首頁畫布中拖入3個矩形元件，作為導(dǎo)航菜單的基礎(chǔ)背景。命名設(shè)置將三個矩形分別命名為“首頁”、“新聞中心”、“社會責(zé)任”。檢查列表觀察左側(cè)概要面板，確認(rèn)元件層級正確，導(dǎo)航條初具雛形。Axure

RP

9-首頁導(dǎo)航制作元件轉(zhuǎn)母版操作母版的創(chuàng)建圖5-55將元件轉(zhuǎn)換為母版1選中目標(biāo)元件在畫布中框選或按住Shift鍵，依次選中已制作好的“首頁”、“新聞中心”、“社會責(zé)任”三個矩形元件。右鍵轉(zhuǎn)換母版保持選中狀態(tài)，點擊鼠標(biāo)右鍵喚出菜單，在列表中找到并選擇“轉(zhuǎn)換為母版”選項。命名并保存系統(tǒng)彈出創(chuàng)建對話框后，輸入母版名稱“導(dǎo)航菜單”，點擊確定即可完成從元件到母版的轉(zhuǎn)換。元件轉(zhuǎn)母版注意事項母版的創(chuàng)建坐標(biāo)默認(rèn)歸零機(jī)制元件被轉(zhuǎn)換為母版后，其內(nèi)部元件的坐標(biāo)屬性(X,Y)

將默認(rèn)重置為(0,0)。這意味著母版內(nèi)容將以母版容器的左上角為原點進(jìn)行對齊。實例位置獨立性在具體頁面中移動母版實例，僅改變該實例在當(dāng)前頁面的顯示位置，絕不會改變母版源文件本身的內(nèi)部結(jié)構(gòu)或位置設(shè)定。防止布局錯位設(shè)計時需特別留意坐標(biāo)變化帶來的視覺差異。建議在轉(zhuǎn)換前確認(rèn)好元件間的相對位置關(guān)系，避免因坐標(biāo)重置導(dǎo)致整體布局出現(xiàn)意外錯位。Axure

RP

-Properties02母版的拖放行為原型設(shè)計進(jìn)階技巧母版3種拖放行為母版的拖放行為任意位置Anywhere母版可在引用頁面中自由拖動與定

位，且內(nèi)容修改后會同步更新至所有頁面，適用于通用型組件。鎖定位置Lock

to

MasterLocation固定在引用頁面的底層，位置坐標(biāo)與母版內(nèi)保持絕對一致，非常適合制作背景圖或固定導(dǎo)航條。從母版脫離Break

Away切斷頁面實例與母版的關(guān)聯(lián)，轉(zhuǎn)換為普通元件獨立編輯，適用于需要基于模板進(jìn)行個性化修改的場景。02母版的應(yīng)用原型設(shè)計進(jìn)階技巧模板應(yīng)用實操案例母版的應(yīng)用海瀾集團(tuán)官網(wǎng)原型制作結(jié)合所學(xué)母版知識，使用Axure制作官網(wǎng)原型。重點在于將重復(fù)出現(xiàn)的導(dǎo)航欄與底部版權(quán)信息轉(zhuǎn)換為母版，體驗“一次修改，全局同步”的高效設(shè)計流程。導(dǎo)航菜單母版化統(tǒng)一管理首頁、新聞中心等頁面入口底部信息復(fù)用批量應(yīng)用版權(quán)聲明與聯(lián)系方式至全站交互動態(tài)效果設(shè)置鼠標(biāo)懸停樣式與菜單選中狀態(tài)原型效果預(yù)覽官網(wǎng)原型制作模塊與要點母版的應(yīng)用四大制作模塊導(dǎo)航菜單母版布局設(shè)計與結(jié)構(gòu)規(guī)劃底部版權(quán)信息母版復(fù)用與信息展示動態(tài)效果制作導(dǎo)航菜單交互實現(xiàn)內(nèi)容補(bǔ)充各頁面專屬內(nèi)容填充核心設(shè)計要點元件組合應(yīng)用熟練使用文本標(biāo)簽、水平線、占位符、圖片