本書由淺入深地介紹了原型設(shè)計(jì)制作的方法，以Axure RP 8.0為主要軟件繪制原型并輸出查看。以知識(shí)點(diǎn)和實(shí)例的制作講解為主，同時(shí)講解了大量的Axure RP 8.0的基礎(chǔ)知識(shí)，為原型設(shè)計(jì)的制作打下基礎(chǔ)。本書配套的多媒體教學(xué)光盤中不但提供了本書所有實(shí)例的源文件和素材，還提供了所有實(shí)例的多媒體教學(xué)視頻，以幫助讀者迅速掌握使用Axure RP 8.0進(jìn)行原型設(shè)計(jì)制作的精髓，從零起步，進(jìn)而跨入高手行列。

目錄

第1章 熟悉Axure RP 8.0 1
1.1 關(guān)于Axure RP 1
1.2 Axure的主要功能 2
1.2.1 網(wǎng)站構(gòu)架圖 2
1.2.2 示意圖 2
1.2.3 流程圖 2
1.2.4 交互設(shè)計(jì) 2
1.2.5 輸出網(wǎng)站原型 3
1.2.6 輸出Word 格式規(guī)格文件 3
1.3 Axure的安裝與啟動(dòng) 3
1.3.1 安裝Axure RP 8.0 4
應(yīng)用案例——安裝Axure RP 8.0 4
1.3.2 啟動(dòng)和退出Axure RP 8.0 5
1.4 Axure的操作界面 6
1.4.1 菜單欄 6
1.4.2 工具欄 8
1.4.3 功能區(qū) 9
1.4.4 隱藏/ 顯示面板 10
1.4.5 自定義工作面板 11
1.4.6 重置視圖 11
1.5 Axure RP 8.0的新增功能 12
1.5.1 界面改變 12
1.5.2 新增默認(rèn)元件 12
1.5.3 新的元件樣式 13
1.5.4 鋼筆工具和矢量圖形 13
1.5.5 流程圖 13
1.5.6 新增事件、動(dòng)效和事件 14
1.5.7 快照元件 14
1.5.8 打印選項(xiàng) 15
1.5.9 更好的團(tuán)隊(duì)協(xié)作 15
1.6 使用Axure 的幫助資源 15
1.7 查看視圖 16
應(yīng)用案例——查看視圖 16
1.8 使用標(biāo)尺 17
1.9 輔助線 18
1.9.1 輔助線的分類 19
1.9.2 刪除輔助線 20
1.9.3 鎖定輔助線 20
1.9.4 創(chuàng)建輔助線 21
應(yīng)用案例——創(chuàng)建輔助線 21
1.9.5 輔助線設(shè)置 22
1.10 使用網(wǎng)格 22
1.10.1 顯示網(wǎng)格 22
1.10.2 網(wǎng)格設(shè)置 23
1.11 設(shè)置遮罩 23
1.12 對(duì)齊/分布對(duì)象 24
1.12.1 對(duì)齊面板 24
1.12.2 分布面板 25
1.13 對(duì)齊網(wǎng)格和輔助線 26
1.14 專家支招 26
1.14.1 什么是原型 26
1.14.2 Axure 在交互設(shè)計(jì)中主要應(yīng)用到哪些方面 26
1.15 總結(jié)擴(kuò)展 27
1.15.1 本章小結(jié) 27
1.15.2 舉一反三——Axure RP 8.0 的卸載 27
第2章 Axure RP 8.0的基本操作 29
2.1 新建文件 29
2.1.1 新建文件 29
2.1.2 紙張尺寸與設(shè)置 29
應(yīng)用案例——新建iPhone 6 Plus 原型尺寸 30
2.1.3 新建團(tuán)隊(duì)項(xiàng)目 31
2.2 存儲(chǔ)文件 32
2.2.1 保存文件 32
2.2.2 另存文件 32
2.2.3 存儲(chǔ)格式 33
2.3 自動(dòng)備份 33
2.3.1 啟動(dòng)自動(dòng)備份 34
2.3.2 從備份中恢復(fù) 34
2.4 打開(kāi)文件 35
2.4.1 打開(kāi)文件 35
2.4.2 打開(kāi)團(tuán)隊(duì)項(xiàng)目 35
2.5 從RP文件導(dǎo)入 36
應(yīng)用案例——導(dǎo)入RP 文件素材 36
2.6 對(duì)象的操作 37
2.6.1 選擇對(duì)象 37
2.6.2 移動(dòng)和縮放對(duì)象 39
2.6.3 旋轉(zhuǎn)對(duì)象 40
2.6.4 復(fù)制對(duì)象 40
2.6.5 剪切和刪除對(duì)象 41
2.7 還原與恢復(fù)操作 41
2.7.1 撤銷 41
2.7.2 重做 42
2.8 專家支招 42
2.8.1 如何保證原型尺寸能夠在移動(dòng)設(shè)備中測(cè)試 42
2.8.2 手機(jī)平臺(tái)和電腦平臺(tái)設(shè)置制作要點(diǎn) 42
2.9 總結(jié)擴(kuò)展 43
2.9.1 本章小結(jié) 43
2.9.2 舉一反三——通過(guò)復(fù)制的方法制作水平導(dǎo)航 43
第3章 頁(yè)面的管理 45
3.1 了解站點(diǎn) 45
3.2 頁(yè)面管理 45
3.2.1 添加頁(yè)面 45
應(yīng)用案例——新建網(wǎng)站頁(yè)面 46
3.2.2 重命名頁(yè)面 48
3.2.3 移動(dòng)頁(yè)面 48
3.2.4 查找頁(yè)面 48
3.3 頁(yè)面編輯區(qū) 49
3.3.1 使用頁(yè)面編輯區(qū) 49
3.3.2 頁(yè)面樣式 50
3.4 自適應(yīng)視圖 52
應(yīng)用案例——添加自適應(yīng)視圖 53
3.5 圖表類型 54
3.6 生成流程圖 55
應(yīng)用案例——生成流程圖 55
3.7 鋼筆工具 56
3.7.1 繪制圖形 57
3.7.2 轉(zhuǎn)換錨點(diǎn)類型 57
3.7.3 編輯鋼筆工具繪制圖形 58
應(yīng)用案例——使用鋼筆工具繪制圖形 59
3.8 組合對(duì)象 61
3.8.1 組合對(duì)象 61
3.8.2 取消組合 61
3.9 鎖定對(duì)象 61
3.10 隱藏對(duì)象 62
3.11 專家支招 63
3.11.1 要保留頁(yè)面文件的舊版本 63
3.11.2 如何處理原型中的文字在不同瀏覽器
上效果不一樣的情況 63
3.12 總結(jié)擴(kuò)展 64
3.12.1 本章小結(jié) 64
3.12.2 舉一反三—— 使用元件制作一個(gè)標(biāo)簽面板 64
第4章 使用元件 65
4.1 使用“元件”面板 65
4.2 基本元件 66
4.2.1 矩形 66
4.2.2 圖片 67
4.2.3 占位符 69
4.2.4 按鈕 69
4.2.5 標(biāo)題 69
4.2.6 文本標(biāo)簽和文本段落 70
應(yīng)用案例——制作商品購(gòu)買頁(yè) 70
4.2.7 水平線和垂直線 72
4.2.8 熱區(qū) 73
4.2.9 動(dòng)態(tài)面板 73
應(yīng)用案例——使用動(dòng)態(tài)面板顯示隱藏對(duì)象 74
4.2.10 內(nèi)聯(lián)框架 75
4.2.11 中繼器 76
應(yīng)用案例——使用中繼器制作產(chǎn)品列表頁(yè) 77
4.3 表單元件 79
4.3.1 文本框 80
4.3.2 多行文本框 80
4.3.3 下拉列表框 80
4.3.4 列表框 81
4.3.5 復(fù)選框 82
4.3.6 單選按鈕 82
4.3.7 提交按鈕 83
應(yīng)用案例——制作會(huì)員登錄頁(yè) 83
4.4 菜單和表格 84
4.4.1 樹狀菜單 84
應(yīng)用案例——美化樹狀菜單的圖標(biāo) 86
4.4.2 表格 87
4.4.3 水平菜單 88
4.4.4 垂直菜單 89
4.5 標(biāo)記元件 90
4.5.1 頁(yè)面快照 90
4.5.2 水平箭頭和垂直箭頭 91
4.5.3 便簽 92
4.5.4 圓形標(biāo)記和水滴標(biāo)記 92
4.6 流程圖 93
4.6.1 矩形和矩形組 93
4.6.2 圓角矩形和圓角矩形組 94
4.6.3 斜角矩形 94
4.6.4 菱形 94
4.6.5 文件和文件組 94
4.6.6 括弧 95
4.6.7 半圓形 95
4.6.8 三角形 95
4.6.9 梯形 95
4.6.10 橢圓形 95
4.6.11 六邊形 95
4.6.12 平行四邊形 96
4.6.13 角色 96
4.6.14 數(shù)據(jù)庫(kù) 96
4.6.15 頁(yè)面快照 96
4.6.16 圖片 96
4.7 專家支招 97
4.7.1 如何制作樹狀菜單元件的圖標(biāo) 97
4.7.2 盡量用一個(gè)元件完成功能 97
4.8 總結(jié)擴(kuò)展 97
4.8.1 本章小結(jié) 98
4.8.2 舉一反三——制作一個(gè)手機(jī)展示原型 98
第5章 元件的屬性和樣式 99
5.1 元件的轉(zhuǎn)換 99
5.1.1 轉(zhuǎn)換為形狀 99
5.1.2 轉(zhuǎn)換為自定義形狀 100
5.1.3 轉(zhuǎn)換為圖片 100
5.2 頁(yè)面的屬性和樣式 100
5.2.1 頁(yè)面排列 101
5.2.2 背景色 101
5.2.3 背景圖片 102
5.3 元件的屬性 103
5.3.1 元件說(shuō)明 103
5.3.2 元件形狀 104
應(yīng)用案例——制作八卦圖圖形 105
5.3.3 元件提示 106
5.4元件的樣式 107
5.4.1 位置和尺寸 107
5.4.2 元件外形樣式 107
5.4.3 字體樣式 111
5.4.4 對(duì)齊 112
5.4.5 填充 113
5.5 創(chuàng)建和管理樣式 113
5.5.1 創(chuàng)建和應(yīng)用頁(yè)面樣式 113
5.5.2 創(chuàng)建和應(yīng)用元件樣式 114
5.5.3 樣式的編輯及修改 115
5.6 使用格式刷 116
應(yīng)用案例——使用格式刷為表格添加樣式 117
5.7 元件的管理 118
5.8 專家支招 119
5.8.1 制作頁(yè)面之前要設(shè)置好樣式 119
5.8.2 使用字體圖標(biāo)而不是圖片 119
5.9 總結(jié)擴(kuò)展 119
5.9.1 本章小結(jié) 120
5.9.2 舉一反三——使用格式刷完成頁(yè)面制作 120
第6章 母版和第三方元件庫(kù) 121
6.1 母版的概念 121
6.1.1 母版的應(yīng)用 121
6.1.2 使用母版的好處 122
6.2 使用“母版”面板 122
6.2.1 添加母版 122
6.2.2 添加文件夾 122
6.2.3 查找母版 123
6.3 母版的創(chuàng)建編輯 123
6.3.1 創(chuàng)建母版 124
應(yīng)用案例——創(chuàng)建網(wǎng)站頂部母版 124
6.3.2 創(chuàng)建子母版 126
應(yīng)用案例——創(chuàng)建網(wǎng)站頂部子母版 126
6.4 轉(zhuǎn)換為母版 127
6.5 母版的使用 128
6.5.1 拖放行為 128
6.5.2 添加到頁(yè)面中 129
6.5.3 從頁(yè)面中移除 130
6.6 母版的使用情況 130
6.7 使用第三方元件庫(kù) 131
6.7.1 下載元件庫(kù) 131
6.7.2 載入元件庫(kù) 132
6.8 創(chuàng)建元件庫(kù) 133
6.8.1 了解元件庫(kù)界面 133
6.8.2 編輯元件庫(kù) 134
6.8.3 卸載元件庫(kù) 135
6.9 專家支招 135
6.9.1 不要復(fù)制對(duì)象，而是將其轉(zhuǎn)成母版 135
6.9.2 如何將較大的組合轉(zhuǎn)換為母版 135
6.10 總結(jié)擴(kuò)展 136
6.10.1 本章小結(jié) 136
6.10.2 舉一反三——創(chuàng)建微信元件庫(kù) 136
第7章 簡(jiǎn)單交互設(shè)計(jì) 137
7.1 頁(yè)面交互基礎(chǔ) 137
7.1.1 頁(yè)面交互事件 137
7.1.2 用例編輯對(duì)話框 137
7.1.3 打開(kāi)鏈接 138
應(yīng)用案例——制作彈出窗口 138
7.1.4 關(guān)閉窗口 141
7.1.5 在框架中打開(kāi)鏈接 141
7.1.6 滾動(dòng)到元件 141
7.1.7 設(shè)置自適應(yīng)視圖 142
7.2 元件交互基礎(chǔ) 143
7.2.1 元件交互事件 143
7.2.2 創(chuàng)建鏈接 143
7.2.3 顯示/ 隱藏 144
應(yīng)用案例——制作視頻分類頁(yè)面 144
7.2.4 設(shè)置面板狀態(tài) 147
應(yīng)用案例——制作網(wǎng)站焦點(diǎn)圖片效果 147
7.2.5 設(shè)置文本 149
應(yīng)用案例——設(shè)置按鈕元件文字 150
7.2.6 設(shè)置圖片 151
7.2.7 設(shè)置選中 152
7.2.8 啟用/ 禁用 153
7.2.9 移動(dòng) 153
7.2.10 旋轉(zhuǎn) 154
7.2.11 設(shè)置尺寸 154
7.2.12 置于頂層/ 底層 156
7.2.13 獲取焦點(diǎn) 156
7.2.14 展開(kāi)/ 折疊樹節(jié)點(diǎn) 157
7.3 交互樣式設(shè)置 157
應(yīng)用案例——制作動(dòng)態(tài)按鈕 158
7.4 專家支招 160
7.4.1 如何通過(guò)動(dòng)態(tài)面板實(shí)現(xiàn)自動(dòng)輪播的效果 160
7.4.2 使用“設(shè)置尺寸”完成進(jìn)度條的制作 160
7.5 總結(jié)擴(kuò)展 161
7.5.1 本章小結(jié) 161
7.5.2 舉一反三——制作展開(kāi)/ 折疊菜單 161
第8章交互設(shè)計(jì) 163
8.1 變量的使用 163
8.1.1 全局變量 163
應(yīng)用案例——使用變量實(shí)現(xiàn)點(diǎn)贊效果 166
8.1.2 局部變量 168
應(yīng)用案例——制作找回密碼效果 169
8.1.3 添加條件 171
應(yīng)用案例——制作提交留言效果 174
8.1.4 變量的計(jì)算 175
應(yīng)用案例——使用變量完成計(jì)算 176
8.2 中繼器 177
8.2.1 中繼器動(dòng)作 178
應(yīng)用案例——制作網(wǎng)店產(chǎn)品列表 178
8.2.2 使用數(shù)據(jù)集 181
應(yīng)用案例——使用中繼器實(shí)現(xiàn)自增 181
8.3 “其他”動(dòng)作 183
8.4 關(guān)于Axure RP函數(shù) 183
8.4.1 使用函數(shù) 183
8.4.2 常見(jiàn)函數(shù) 184
應(yīng)用案例——實(shí)現(xiàn)讀取當(dāng)前時(shí)間效果 190
8.5 專家支招 192
8.5.1 不要設(shè)計(jì)不必要的交互動(dòng)作 192
8.5.2 什么情況下會(huì)使用全局變量 193
8.6 總結(jié)擴(kuò)展 193
8.6.1 本章小結(jié) 193
8.6.2 舉一反三——制作一個(gè)手機(jī)滑動(dòng)的產(chǎn)品原型 193
第9章 團(tuán)隊(duì)合作 195
9.1 創(chuàng)建共享的項(xiàng)目位置 195
9.1.1 下載SVN 軟件 195
9.1.2 安裝VisualSVN server 196
9.1.3 安裝Tortoise SVN 197
9.1.4 VisualSVN Server 創(chuàng)建版本庫(kù) 198
9.1.5 使用Tortoise SVN 客戶端 203
9.1.6 修改共享位置中的文件 205
9.2 使用團(tuán)隊(duì)項(xiàng)目 207
9.2.1 了解團(tuán)隊(duì)項(xiàng)目 207
9.2.2 團(tuán)隊(duì)合作項(xiàng)目的環(huán)境 207
9.2.3 簽出和簽入 208
9.3 創(chuàng)建團(tuán)隊(duì)項(xiàng)目 209
9.3.1 創(chuàng)建團(tuán)隊(duì)項(xiàng)目 209
9.3.2 上傳團(tuán)隊(duì)項(xiàng)目到服務(wù)器 211
9.3.3 完成團(tuán)隊(duì)項(xiàng)目后的準(zhǔn)備工作 211
9.3.4 關(guān)于DO-NOT-EDIT 211
9.4 打開(kāi)團(tuán)隊(duì)項(xiàng)目 212
9.5 團(tuán)隊(duì)項(xiàng)目的編輯 213
9.6“團(tuán)隊(duì)”菜單 215
9.7 使用Axure Share 216
9.7.1 創(chuàng)建Axure Share 賬號(hào) 216
9.7.2 Axure Share 的協(xié)作功能 217
9.7.3 上傳原型到Axure Share 218
9.7.4 發(fā)布到Axure Share 218
9.8 專家支招 219
9.8.1 為什么要團(tuán)隊(duì)協(xié)作和使用版本管理工具 219
9.8.2 Axure RP 共享項(xiàng)目有幾種頁(yè)面狀態(tài) 219
9.9 總結(jié)擴(kuò)展 219
9.9.1 本章小結(jié) 219
9.9.2 舉一反三——制作滑動(dòng)屏幕動(dòng)畫原型 220
第10章 發(fā)布與輸出 221
10.1瀏覽器中查看原型 221
10.2更改默認(rèn)打開(kāi)頁(yè)面 222
10.3原型、Word文檔及生成器 223
10.3.1 原型 224
10.3.2 生成Word 文檔 224
10.3.3 生成器和配置文件 224
10.4 HTML生成器 226
10.5 Word生成器 229
10.6 CSV報(bào)告生成器和打印生成器 230
10.6.1 CSV 報(bào)告生成器 230
10.6.2 打印生成器 231
10.7 專家支招 232
10.7.1 制作的APP 原型如何在手機(jī)上演示 232
10.7.2 如何將原型導(dǎo)出為圖片 233
10.8 總結(jié)擴(kuò)展 233
10.8.1 本章小結(jié) 233
10.8.2 舉一反三——發(fā)布生成一個(gè)HTML 文件 233
第11章 Axure RP 8.0的綜合應(yīng)用 235
11.1 制作產(chǎn)品分類頁(yè)面 235
11.1.1 案例描述 235
11.1.2 案例分析 235
11.1.3 制作步驟 236
11.2 制作新浪微博用戶評(píng)價(jià) 239
11.2.1 案例描述 239
11.2.2 案例分析 239
11.2.3 制作步驟 239
11.3 制作騰訊QQ注冊(cè)頁(yè)面 242
11.3.1 案例描述 243
11.3.2 案例分析 243
11.3.3 制作步驟 243
11.4 制作騰訊網(wǎng)站登錄頁(yè)面 248
11.4.1 案例描述 248
11.4.2 案例分析 248
11.4.3 制作步驟 248
11.5 制作騰訊QQ找回密碼頁(yè)面 254
11.5.1 案例描述 254
11.5.2 案例分析 254
11.5.3 制作步驟 254
11.6 制作微信讀書APP登錄效果 261
11.6.1 案例描述 261
11.6.2 案例分析 261
11.6.3 制作步驟 261
11.7 制作微信讀書APP原型 266
11.7.1 案例描述 266
11.7.2 案例分析 267
11.7.3 制作步驟 267
附錄一 Axure 常用快捷鍵 276
附錄二 Axure與Photoshop 277
附錄三 Axure與HyperSnap 280