Axure RP 9 實用教程：原型 + 高保真 + 交互 + 設計

祁興華

十年互聯網從業經驗，曾就職於中國電信等上市公司擔任高級產品經理，
擅長交互設計及原型製作，能夠熟練運用Axure做出各種仿真交互。
同時也是簡書互聯網優秀作者，人人都是產品經理專欄作家，Axure中文網推薦作者。
多篇原型設計類文章被各大平台官方運營轉載。

第1章　繪製線框圖
1．1　Axure RP 9的安裝與漢化 2
1．1．1　下載安裝包與漢化包 2
1．1．2　安裝Axure RP 9 3
1．1．3　Axure RP 9漢化 5
1．2　Axure RP 9的優化與改進 7
1．2．1　界面佈局改版 7
1．2．2　元件功能優化 8
1．2．3　交互設置流程優化 9
1．2．4　其他改進 9
1．2．5　小結 9
1．3　初識Axure RP 9 10
1．3．1　操作界面 10
1．3．2　自定義工作界面 10
1．3．3　菜單欄 11
1．3．4　工具欄 12
1．3．5　頁面與大綱面板 13
1．3．6　元件庫與母版面板 14
1．3．7　樣式/交互/註釋面板 16
1．4　元件說明（一） 18
1．4．1　元件概述 18
1．4．2　形狀元件 18
1．4．3　圖片元件 22
1．4．4　水平線和垂直線 25
1．4．5　圖像熱區 26
1．5　元件說明（二） 27
1．5．1　動態面板 27
1．5．2　內部框架 29
1．5．3　中繼器 30
1．6　元件說明（三） 34
1．6．1　文本框 34
1．6．2　文本域 35
1．6．3　下拉列表 35
1．6．4　列錶框 36
1．6．5　複選框 36
1．6．6　單選按鈕 37
1．6．7　樹 38
1．6．8　表格 39
1．6．9　水平菜單和垂直菜單 39
1．6．10　標記 40
1．7　元件操作 41
1．7．1　基本操作 41
1．7．2　編輯元件樣式 43
1．7．3　元件專有屬性 43
1．7．4　元件“樣式”面闆說明 45
1．7．5　元件樣式管理 46
1．8　頁面樣式說明 46
1．8．1　頁面樣式 46
1．8．2　頁面樣式管理 48
1．8．3　標尺/尺寸/網格 48
1．8．4　輔助線 49
1．8．5　元件對齊設置 50
1．9　生成原型 50
1．9．1　概述 50
1．9．2　原型預覽 50
1．9．3　生成與查看HTML文件 51
1．9．4　生成Word說明書 54
1．9．5　生成CSV報告 58
1．9．6　打印設置 59

第2章　掌握基礎交互
2．1　基礎交互 62
2．1．1　交互概述 62
2．1．2　交互事件 62
2．1．3　交互情形 65
2．1．4　交互動作 66
2．1．5　案例說明 68
2．2　基礎交互案例 70
2．1．1　導航菜單 70
2．2．2　顯示/隱藏對話框 72
2．1．3　幻燈片輪播 73
2．3　母版 74
2．3．1　母版基礎知識 74
2．3．2　重寫母版數據 76
2．3．3　母版引發事件 76
2．3．4　引發事件使用案例 77
2．4　動態面板 78
2．4．1　什麼是動態面板 78
2．4．2　添加動態面板 79
2．4．3　動態面板事件 79
2．4．4　案例說明――發現魅力 80
2．5　流程圖 83
2．5．1　流程圖概述 83
2．5．2　繪製流程圖 84
2．5．3　流程圖標記 85
2．5．4　快照 85
2．5．5　生成流程圖 86
2．6　調色板 86
2．6．1　顏色三要素 86
2．6．2　單色 87
2．6．3　線性漸變 88
2．6．4　徑向漸變 89
2．6．5　顏色屬性 89
2．6．6　其他說明 90
2．6．7　案例講解 91
2．7　鋼筆工具 93
2．7．1　鋼筆工具概述 93
2．7．2　繪製圖形 93
2．7．3　管理節點 94
2．7．4　變換形狀 94
2．7．5　形狀與圖片的轉換 95
2．7．6　案例：emoji表情 96

第3章　成為交互高手
3．1　中繼器 98
3．1．1　中繼器概述 98
3．1．2　中繼器排序 98
3．1．3　數據篩選 99
3．1．4　分頁 100
3．1．5　添加/移除中繼器的項 100
3．2　中繼器案例 103
3．2．1　案例：商品列表 103
3．2．2　案例2：用戶信息 108
3．3　變量說明 112
3．3．1　變量概述 112
3．3．2　局部變量 113
3．3．3　全局變量 114
3．4　變量案例 115
3．4．1　案例：table標籤切換 115
3．4．2　案例：登錄歡迎頁 117
3．4．3　小結 118
3．5　函數說明 118
3．5．1　概述 118
3．5．2　函數分類 118
3．5．3　函數使用說明 118
3．6　函數案例 123
3．6．1　案例：知乎詳情導航 123
3．6．2　案例：簡易計算器 125
3．6．3　案例：滑桿 127
3．6．4　案例：文字計數 130
3．7　邏輯條件 131
3．7．1　邏輯條件概述 131
3．7．2　如果或否則 131
3．7．3　條件關係――全部和任何 132
3．7．4　運算符和表達式 133
3．7．5　多條件情形 134
3．7．6　條件邏輯案例 135
3．8　自定義元件 138
3．8．1　自定義元件概述 138
3．8．2　新建自定義元件 139
3．8．3　添加自定義元件 139
3．8．4　添加註釋和交互 139
3．8．5　元件庫按文件夾分類 140
3．8．6　自定義樣式及屬性 140
3．9　自適應視圖 141
3．9．1　為什麼需要自適應視圖 141
3．9．2　創建自適應視圖 141
3．9．3　編輯自適應視圖 142
3．9．4　預覽和生成自適應視圖 144
3．9．5　自適應案例：文章列表 144
3．10　Axure Share 145
3．10．1　什麼是Axure Share? 145
3．10．2　註冊Axure Share賬號 146
3．10．3　項目上傳與更新 146
3．10．4　項目管理 148
3．10．5　討論 149
3．10．6　插件 150
3．10．7　漂亮網址 151
3．10．8　重定向 152

第4章元件案例章
4．1　返回頂部 154
4．1．1　返回頂部概述 154
4．1．2　交互分析 154
4．1．3　素材準備 154
4．1．4　交互設置 155
4．2　驗證碼 158
4．2．1　圖文驗證碼 158
4．2．2　滑塊驗證碼 159
4．3　倒計時 165
4．3．1　概述 165
4．3．2　交互分析 166
4．3．3　素材準備 166
4．3．4　交互設置 166
4．4　五星好評 171
4．4．1　概述 171
4．1．2　交互分析 171
4．1．3　素材準備 171
4．4．4　交互設置 172
4．5　輪播圖 177
4．5．1　概述 177
4．5．2　交互分析 177
4．5．3　素材準備 177
4．5．4　交互設置 178
4．6　評論字數限制與清空 181
4．6．1　評論概述 181
4．6．2　交互分析 181
4．6．3　素材準備 181
4．6．4　交互設置 182
4．7　百度搜索提示 183
4．7．1　概述 183
4．7．2　交互分析 184
4．7．3　元件素材準備 184
4．7．4　交互設置 185

第5章 綜合案例
5．1　彈幕 188
5．1．1　彈幕概述 188
5．1．2　交互分析 188
5．1．3　元件素材準備 189
5．1．4　交互設置 190
5．2　下拉刷新 191
5．2．1　概述 191
5．2．2　以簡書、知乎為代表的下拉刷新 192
5．2．3　以微博、頭條為代表的下拉刷新 195
5．3　註冊與登錄 198
5．3．1　概述 198
5．3．2　註冊 199
5．3．3　登錄 205
5．4　購物車 209
5．4．1　購物車概述 209
5．4．2　準備元件素材 209
5．4．3　交互分析 212
5．4．4　交互設置 212
5．5　QQ音樂 229
5．5．1　概述 229
5．5．2　線框圖準備 230
5．5．3　交互分析 230
5．5．4　交互設置 231
5．6　微信 235
5．6．1　概述 235
5．6．2　微信架構 235
5．6．3　交互設計 237
5．7　簡書 262
5．7．1　概述 262
5．7．2　簡書是什麼 262
5．7．3　頁面結構 262
5．7．4　交互設計 263
附錄A：原型設計規範 280
附錄B：Axure RP 9 快捷鍵 285