Axure RP 8.0基礎(chǔ)培訓(xùn)教程

第1章 初識(shí)Axure RP 8．0 11
1．1 Axure RP 8．0的用途 12
1．2 Axure RP 8．0的工作界面 12
1．2．1 菜單欄 13
1．2．2 工具欄 13
1．2．3 功能區(qū)——頁(yè)面 15
1．2．4 功能區(qū)——元件庫(kù) 15
1．2．5 功能區(qū)——母版 16
1．2．6 功能區(qū)——設(shè)計(jì)區(qū)域 16
1．2．7 功能區(qū)——檢視 16
1．2．8 功能區(qū)——概要 17
1．2．9 賬號(hào)的注冊(cè)與登錄 17
1．3 文件的操作 19
1．3．1 新建文件 19
1．3．2 打開(kāi)文件 20
1．3．3 保存文件 21
1．3．4 導(dǎo)入頁(yè)面 21
1．3．5 導(dǎo)出頁(yè)面為圖片 22
1．3．6 自動(dòng)備份設(shè)置 23
1．3．7 從備份中恢復(fù) 23
1．4 Axure RP 8．0的基礎(chǔ)配置 24
1．4．1 網(wǎng)格 24
1．4．2 輔助線 26
1．4．3 對(duì)齊元件 31
1．4．4 自定義設(shè)計(jì)區(qū)域中的輔助元素 32
第2章 元件庫(kù) 35
2．1 基本元件 36
2．1．1 矩形類元件 36
2．1．2 占位符 39
2．1．3 圖片 40
2．1．4 水平線和垂直線 42
2．1．5 熱區(qū) 42
2．1．6 課堂案例：設(shè)置文字在鼠標(biāo)指針懸停時(shí)的樣式 43
2．2 表單元件 44
2．2．1 文本框和多行文本框 44
2．2．2 下拉列表框 46
2．2．3 列表框 47
2．2．4 復(fù)選框 48
2．2．5 單選按鈕 48
2．2．6 提交按鈕 49
2．2．7 課堂案例：自定義文本框樣式 49
2．3 菜單和表格 50
2．3．1 樹(shù)狀菜單 50
2．3．2 水平菜單和垂直菜單 51
2．3．3 表格 52
2．4 動(dòng)態(tài)面板 53
2．4．1 課堂案例：輪播圖基礎(chǔ) 53
2．4．2 元件介紹 56
2．4．3 課堂案例：“返回頂部”懸浮按鈕 59
2．4．4 課堂案例：滾動(dòng)消息 60
2．5 內(nèi)聯(lián)框架 62
2．5．1 課堂案例：實(shí)現(xiàn)菜單跳轉(zhuǎn)效果 62
2．5．2 元件介紹 63
2．6 中繼器基礎(chǔ) 65
2．6．1 課堂案例：基礎(chǔ)學(xué)生名單 65
2．6．2 元件介紹 66
2．6．3 課堂案例：完善學(xué)生名單 69
2．7 標(biāo)記元件 71
2．7．1 頁(yè)面快照 72
2．7．2 便簽和標(biāo)記 74
2．7．3 箭頭 75
2．8 流程圖元件 75
2．8．1 繪制流程圖 75
2．8．2 生成頁(yè)面流程圖 76
2．9 課堂練習(xí) 76
2．9．1 課堂練習(xí)：分類導(dǎo)航的水平拖動(dòng)效果 77
2．9．2 課堂練習(xí)：App信息流 77
2．10 課后習(xí)題 77
2．10．1 課后習(xí)題：按鈕的禁用樣式制作 77
2．10．2 課后習(xí)題：制作App中的“開(kāi)關(guān)”元件 78
2．10．3 課后習(xí)題：切換標(biāo)簽頁(yè) 78
2．10．4 課后習(xí)題：訂單列表 78
第3章 母版 79
3．1 母版基礎(chǔ) 80
3．2 母版的應(yīng)用 80
3．2．1 創(chuàng)建母版 80
3．2．2 母版實(shí)例 81
3．2．3 母版的拖放行為 81
3．2．4 應(yīng)用母版 83
3．2．5 移除母版 83
3．3 課后習(xí)題：關(guān)于母版的思考與練習(xí) 84
第4章 交互 85
4．1 交互基礎(chǔ)詳解 86
4．1．1 課堂案例：彈框的燈箱效果 86
4．1．2 事件、用例和動(dòng)作 88
4．2 條件用例 90
4．2．1 課堂案例：評(píng)論區(qū)制作 90
4．2．2 條件用例詳解 92
4．2．3 If和Else If 93
4．2．4 課堂案例：登錄驗(yàn)證 93
4．3 變量 95
4．3．1 課堂案例：顯示登錄時(shí)所使用的用戶名 95
4．3．2 變量詳解 97
4．3．3 課堂案例：獲取驗(yàn)證碼時(shí)的倒計(jì)時(shí)效果 100
4．4 函數(shù) 104
4．4．1 課堂案例：自動(dòng)獲取頁(yè)面名稱 104
4．4．2 函數(shù)詳解 106
4．4．3 函數(shù)列表 107
4．4．4 課堂案例：生成4位驗(yàn)證碼 111
4．5 母版自定義事件 114
4．5．1 課堂案例：用母版制作菜單被選中時(shí)突出顯示的效果 114
4．5．2 母版自定義事件詳解 118
4．6 課堂練習(xí) 121
4．6．1 課堂練習(xí)：二級(jí)聯(lián)動(dòng)下拉菜單 121
4．6．2 課堂練習(xí)：增減購(gòu)物車中的商品數(shù)量 121
4．7 課后習(xí)題 122
4．7．1 課后習(xí)題：登錄時(shí)增加4位驗(yàn)證碼的校驗(yàn) 122
4．7．2 課后習(xí)題：利用母版自定義事件顯示不同的個(gè)人信息 122
第5章 中繼器進(jìn)階 123
5．1 中繼器排序 124
5．1．1 課堂案例：添加排序方式 124
5．1．2 課堂案例：移除排序方式 126
5．2 中繼器篩選 127
5．2．1 課堂案例：添加篩選方式 127
5．2．2 課堂案例：移除篩選方式 129
5．3 中繼器分頁(yè) 130
5．3．1 課堂案例：切換分頁(yè) 130
5．3．2 課堂案例：動(dòng)態(tài)設(shè)置每頁(yè)顯示的數(shù)據(jù)條數(shù) 132
5．4 編輯中繼器數(shù)據(jù)集 136
5．4．1 課堂案例：添加行 136
5．4．2 課堂案例：標(biāo)記行和取消標(biāo)記行 138
5．4．3 課堂案例：刪除行 140
5．4．4 課堂案例：更新行 142
5．5 課堂練習(xí)：跨頁(yè)面添加列表數(shù)據(jù) 147
5．6 課后習(xí)題：Web端商品列表的篩選和排序 147
第6章 原型的分享 149
6．1 生成交互說(shuō)明書(shū) 150
6．1．1 頁(yè)面說(shuō)明 150
6．1．2 元件說(shuō)明 150
6．1．3 生成Word說(shuō)明書(shū) 151
6．1．4 生成CSV報(bào)告 154
6．2 利用Axshare在線分享 154
6．2．1 Axshare簡(jiǎn)介 155
6．2．2 發(fā)布和更新原型 155
6．2．3 參與討論 156
6．2．4 管理原型 157
6．3 生成HTML文件 159
6．3．1 生成本地HTML文件 159
6．3．2 選擇生成的頁(yè)面 160
6．3．3 選擇頁(yè)面說(shuō)明字段 160
6．3．4 選擇元件說(shuō)明字段 161
6．3．5 設(shè)置交互效果的相關(guān)內(nèi)容 162
6．3．6 設(shè)置HTML頁(yè)面左側(cè)工具欄的標(biāo)志 162
6．3．7 設(shè)置Web字體 163
6．3．8 設(shè)置字體映射 164
6．3．9 在移動(dòng)設(shè)備中預(yù)覽App原型 164
6．3．10 高級(jí)設(shè)置 166
6．3．11 設(shè)置是否開(kāi)放討論 166
6．4 課堂練習(xí)：生成原型的交互說(shuō)明書(shū) 166
6．5 課后習(xí)題：練習(xí)配置HTML頁(yè)面 166
第7章 利用Axshare創(chuàng)建和管理團(tuán)隊(duì)項(xiàng)目 167
7．1 創(chuàng)建與獲取團(tuán)隊(duì)項(xiàng)目 168
7．1．1 團(tuán)隊(duì)項(xiàng)目工作原理 168
7．1．2 創(chuàng)建團(tuán)隊(duì)項(xiàng)目 168
7．1．3 獲取團(tuán)隊(duì)項(xiàng)目 170
7．2 如何進(jìn)行團(tuán)隊(duì)項(xiàng)目協(xié)作 170
7．2．1 簽出和簽入/獲取和提交變更 171
7．2．2 常規(guī)管理 172
7．2．3 版本管理 173
7．3 課后習(xí)題：體驗(yàn)在團(tuán)隊(duì)項(xiàng)目中工作 174
第8章 自定義元件庫(kù) 175
8．1 認(rèn)識(shí)自定義元件庫(kù) 176
8．1．1 概述 176
8．1．2 自定義元件庫(kù)與母版的對(duì)比 176
8．2 自定義元件庫(kù)的使用 176
8．2．1 創(chuàng)建自定義元件庫(kù) 176
8．2．2 載入自定義元件庫(kù) 177
8．2．3 卸載自定義元件庫(kù) 178
8．3 課后習(xí)題：制作屬于自己的元件庫(kù) 178
第9章 自適應(yīng)視圖 179
9．1 “響應(yīng)式布局”與自適應(yīng)視圖 180
9．2 使用自適應(yīng)視圖 180
9．3 課后習(xí)題：體驗(yàn)自適應(yīng)視圖 182
第10章 綜合案例實(shí)訓(xùn) 183
10．1 案例：點(diǎn)贊和取消點(diǎn)贊效果 184
10．2 案例：自定義文本框的交互樣式 186
10．3 案例：自定義復(fù)選框的交互樣式 187
10．4 案例：手風(fēng)琴導(dǎo)航菜單 188
10．5 案例：局部滾動(dòng)的篩選菜單 192
10．6 案例： Web端個(gè)人中心快捷入口 193
10．7 案例：加載百分比進(jìn)度條 195
10．8 案例：雙向選擇列表 197
10．9 課后習(xí)題：自定義單選按鈕的交互效果 199
10．10 課后習(xí)題：自定義下拉列表框的交互樣式 199
10．11 課后習(xí)題：Web端商品大圖切換效果 200
10．12 課后習(xí)題：滾動(dòng)吸附效果 200
第11章 商業(yè)案例實(shí)訓(xùn) 201
11．1 移動(dòng)App原型尺寸詳解 202
11．2 商業(yè)案例：新聞App 202
11．2．1 標(biāo)簽欄菜單切換 202
11．2．2 搜索聯(lián)想 206
11．2．3 上滑加載更多 210
11．3 商業(yè)案例：音樂(lè)App 214
11．3．1 啟動(dòng)頁(yè)倒計(jì)時(shí)后跳轉(zhuǎn) 214
11．3．2 包含狀態(tài)指示器的banner廣告 217
11．3．3 抽屜菜單 220
11．4 課后習(xí)題：制作新聞App的視頻和個(gè)人中心頁(yè)面 224