第2章界面原型設(shè)計標準模塊一項目準備階段教學重點難點PARTONE設(shè)計尺寸與規(guī)范PARTTWO頁面與自適應(yīng)視圖PARTTHREE元件詳解PARTFOUR交互事件與動態(tài)面板PARTFIVE中繼器與母版PARTSIX目錄CONTENTS.變量函數(shù)與團隊協(xié)作PARTSEVEN教學小結(jié)與課堂作業(yè)PARTEIGHT目錄CONTENTS.（01）教學重點難點PART-牢記各類終端的統(tǒng)一設(shè)計尺寸與基礎(chǔ)規(guī)范，熟練運用Axure中的頁面、自適應(yīng)視圖、元件、動態(tài)面板、中繼器、母版、變量與函數(shù)、團隊協(xié)作與發(fā)布功能。教學重點教學重點與難點在有限時間內(nèi)將規(guī)范尺寸與元件邏輯準確轉(zhuǎn)化為可交互原型；理解自適應(yīng)視圖與動態(tài)面板、中繼器之間的配合關(guān)系；掌握變量與函數(shù)在復(fù)雜交互中的實際應(yīng)用，避免邏輯沖突。教學難點（02）設(shè)計尺寸與規(guī)范PART-設(shè)計尺寸參考各類終端原型設(shè)計尺寸參考為保證演示文件效果規(guī)范，建議統(tǒng)一采用AxureUX提供的各類終端原型設(shè)計尺寸標準，僅限定寬度，高度隨內(nèi)容自動變化。圖2-1所示為AxureUX目前所采用的各類終端原型設(shè)計尺寸標準，基本符合主流設(shè)計規(guī)范，便于后續(xù)跨設(shè)備展示。設(shè)計時建議使用輔助線幫助排版，使頁面效果更規(guī)范。輔助線排版基礎(chǔ)設(shè)計規(guī)范參考WEB端橫向區(qū)塊列數(shù)常用2、3、4列，圖2-2給出各設(shè)計尺寸下每列內(nèi)容區(qū)塊寬度對照表。內(nèi)容區(qū)塊間距常用10px或20px，Axure中按住Shift鍵+方向鍵每次移動10px。區(qū)塊列數(shù)與間距創(chuàng)建新項目時應(yīng)先設(shè)置元件及頁面默認樣式，確保原型樣式統(tǒng)一。推薦字號18px、16px、14px、12px，行間距28、24、20，均使用偶數(shù)。設(shè)置頁面樣式（03）頁面與自適應(yīng)視圖PART-AxureRP9中，頁面用于設(shè)計和展示界面布局與樣式，每個頁面可包含按鈕、輸入框、列表等元件，用戶可添加、刪除、重命名和組織頁面。自適應(yīng)視圖用于測試不同分辨率與設(shè)備的界面布局與自適應(yīng)性，用戶可預(yù)覽不同分辨率效果并測試設(shè)備上的自適應(yīng)性能。頁面與自適應(yīng)視圖頁面與自適應(yīng)視圖概念（04）元件詳解PART-MAINAxureRP9元件是構(gòu)建原型的基本構(gòu)建塊，圖2-5展示元件面板。常用元件包括按鈕、標簽、文本框、下拉框、復(fù)選框、單選框、圖像、輪播圖、列表、進度條、導(dǎo)航欄等。高級元件有交互面板、面板組、滑塊等，支持自定義元件庫，便于快速創(chuàng)建和測試不同用戶界面與交互方式。元件功能常用元件功能一覽CONTENT（05）交互事件與動態(tài)面板PART-交互決定部件和頁面動態(tài)行為，如單擊按鈕導(dǎo)航或鼠標懸停顯示部件，可在交互窗格創(chuàng)建和管理，圖2-6示意交互窗格，圖2-7示意交互用例。動態(tài)面板是容器，將部件保存在狀態(tài)中，一次僅顯示一種狀態(tài)，圖2-8示意動態(tài)面板結(jié)構(gòu)。動態(tài)面板支持拖動滑動及固定位置，適合輪播、幻燈片、導(dǎo)航標題和側(cè)邊欄。動態(tài)面板非常適合創(chuàng)建輪播和幻燈片，因為可以動態(tài)設(shè)置可見狀態(tài)，實現(xiàn)不同內(nèi)容的切換展示。交互事件動態(tài)面板應(yīng)用場景交互事件與動態(tài)面板（06）中繼器與母版PART-中繼器是高級部件，用于顯示文本、圖像等重復(fù)集合，圖2-9示意中繼器結(jié)構(gòu)。數(shù)據(jù)驅(qū)動，可動態(tài)排序篩選，適合動態(tài)表或產(chǎn)品列表。中繼器母版是部件集合，可集中維護并重復(fù)使用，修改自動更新所有實例，圖2-10示意母版管理，常用于頁眉、頁腳、導(dǎo)航欄，提升效率與一致性。母版中繼器與母版功能（07）變量函數(shù)與團隊協(xié)作PART-變量與函數(shù)Axure函數(shù)為特殊變量，通過調(diào)用獲取特定值，僅用于表達式。圖2-13示意編輯文字對話框，用于插入變量、屬性、函數(shù)或運算符。函數(shù)變量包括全局變量和局部變量，可存儲文本數(shù)字供后續(xù)使用，圖2-11示意全局變量，圖2-12示意局部變量。變量可在元件文本、條件邏輯、函數(shù)表達式中調(diào)用。變量團隊合作與發(fā)布輸出團隊合作與發(fā)布團隊項目允許多個AxureRP9用戶共同創(chuàng)作原型，圖2-14示意創(chuàng)建團隊項目對話框?？赏ㄟ^菜單新建或轉(zhuǎn)換現(xiàn)有項目為團隊項目。設(shè)計完成后，單擊預(yù)覽按鈕或發(fā)布→預(yù)覽命令直接預(yù)覽，也可選擇發(fā)布→生成原型文件，在發(fā)布項目對話框設(shè)置信息后輸出，便于他人使用與測試。（08）教學小結(jié)與課堂作業(yè)PART-通過本章學習，學生應(yīng)掌握統(tǒng)一設(shè)計尺寸與基礎(chǔ)規(guī)范，熟練運用Axure頁面、自適應(yīng)視圖、元件、動態(tài)面板、中繼器、母版、變量與函數(shù)，理解團隊協(xié)作與發(fā)布流程，為后續(xù)高保真原型制作奠定理論與操作基礎(chǔ)。教學小結(jié)整體教學小結(jié)任務(wù)1：按本章尺寸規(guī)范繪制首頁低保真線框圖；任務(wù)2：使用動態(tài)面板實現(xiàn)輪播圖，中繼器展示商品列表；任務(wù)3：創(chuàng)建母版統(tǒng)一頁眉頁腳。作業(yè)任務(wù)提交Axure源文件及300字設(shè)計說明，說明如何確保尺寸規(guī)范與元件復(fù)用。提交要求校園二手書交易平臺原型標準實踐。作業(yè)主題課堂綜合作業(yè)任選一款常用APP，完成“規(guī)范符合度”評估報告：列出3處未遵循本章尺寸或規(guī)范的具體界面元素，用Ax