Axure RP原型設計基礎與案例實戰

冀托 
畢業於北京大學軟件與微電子學院，獲碩士學位。
有6年的產品經理經驗。擅長產品設計和原型設計。
曾經參與過千萬級用戶的產品設計，積累了大量的原型設計經驗。
通過公眾號分享了大量的Axure RP教程、教學視頻、案例和模板文件，深受用戶歡迎。

配套學習資源
前言
第1章.Axure RP基礎1
1.1.Axure RP是乾什麼用的2
1.1.1.Axure RP是原型設計軟件2
1.1.2.Axure RP原型案例2
1.1.3.使用Axure RP原型5
1.2.基礎概念5
1.2.1.軟件界面概述5
1.2.2.畫布7
1.2.3.坐標8
1.2.4.元件庫8
1.2.5.站點地圖20
1.2.6.母版21
1.2.7.屬性21
1.2.8.元件地圖22
1.2.9.發布原型23
1.3.案例1：我的第1個Axure RP原型——註冊頁面27
1.3.1.創建原型文件27
1.3.2.添加元件28
1.3.3.設置頁面樣式30
1.3.4.預覽原型效果30

第2章.樣式設置31
2.1.顏色32
2.1.1.認識顏色窗口32
2.1.2.設置透明效果33
2.1.3.設置漸變效果33
2.2.陰影35
2.3.文字格式36
2.3.1.文字樣式37
2.3.2.調整文本的間距和填充38
2.3.3.調整文本的寬度、高度38
2.4.格式刷39
2.5 “鋼筆”和自定義圖形41
2.5.1.鋼筆41
2.5.2.自定義形狀42
2.6.處理圖片的尺寸43
2.6.1.分割圖片43
2.6.2.裁剪圖片43
2.7.設置按鈕的交互樣式44
2.8.文本框樣式46
2.8.1.文本框類型46
2.8.2.文本框提示47
2.8.3.文本限制48
2.8.4 “提交”按鈕48
2.9.改變形狀48
2.9.1.旋轉48
2.9.2.翻轉49
2.9.3.合併50
2.10.佈局51
2.10.1.順序51
2.10.2.組合52
2.10.3.對齊53
2.10.4.分佈55
2.11.頁面樣式55
2.11.1.頁面排列56
2.11.2.背景56
2.11.3.草圖58
2.11.4.樣式模板59
2.12.案例2：給不同模塊製作不同背景60
2.13.案例3：繪製一個網站原型63
2.13.1.繪製導航欄63
2.13.2.繪製折線圖64
2.13.3.繪製統計數據模塊65
2.13.4.處理圖標、圖片65
2.13.5.總體佈局66
2.13.6.設置頁面樣式66
2.14.案例4：繪製一個APP原型67
2.14.1.繪製手機框67
2.14.2.添加遮罩68
2.14.3.添加陰影69
2.14.4.設置頁面佈局70

第3章.原型設計準則71
3.1.原型做成高保真還是低保真72
3.1.1.什麼是高保真和低保真72
3.1.2.如何選擇高保真與低保真72
3.2.原型中要使用真實的數據73
3.3.產品流程應該盡量完整74
3.3.1.考慮用戶出錯的情況74
3.3.2.考慮系統出錯的情況74
3.3.3.考慮沒有數據的情況75
3.3.4.考慮每一步的狀態75
3.3.5.添加適當的提示76
3.4.原型需要快速迭代76
3.4.1.溝通原型的技巧76
3.4.2.修改原型的技巧77
3.5.頁面應該盡量簡化78
3.5.1.精簡用戶輸入內容78
3.5.2.精簡頁面上的元素79
3.5.3.合併重複的功能80
3.5.4.避免過多的分支流程80
3.5.5.減少確認環節81
3.6.頁面佈局要隨時優化81
3.6.1.用圖形替代文字82
3.6.2.突出重點信息82
3.6.3.把握頁面節奏83
3.7.要保持原型的一致性83
3.7.1.遵從慣例，保持外部一致83
3.7.2.統一樣式，保持內部一致84

第4章.交互動畫87
4.1.基礎概念88
4.1.1.瞭解4個概念88
4.1.2.舉例說明4個概念88
4.1.3.觸發事件89
4.1.4.用例92
4.1.5.交互動作93
4.1.6.條件98
4.2.動態面板102
4.2.1.創建動態面板103
4.2.2.動態面板的狀態104
4.2.3.調整動態面板的尺寸105
4.2.4.拖曳107
4.3.常用交互案例109
4.3.1.案例5：輪播圖109
4.3.2.案例6：切換標籤頁112
4.3.3.案例7：側邊欄115
4.3.4.案例8：通知118
4.3.5.案例9：自動彈出鍵盤120
4.4.複雜交互案例121
4.4.1.案例10：優化的註冊流程121
4.4.2.案例11：錘子開機解鎖133
4.4.3.案例12：企業網站139

第5章.數據操作147
5.1.變量148
5.1.1.使用變量148
5.1.2.全局變量149
5.1.3.元件變量153
5.1.4.局部變量157
5.1.5.頁面、窗口和鼠標指針變量159
5.2.函數162
5.2.1.數字函數162
5.2.2.字符串函數162
5.2.3.數學函數163
5.2.4.日期函數163
5.2.5.布爾函數165
5.3.中繼器Repeater165
5.3.1.複製165
5.3.2.數據集166
5.3.3.樣式167
5.3.4.觸發事件168
5.3.5.中繼器變量169
5.3.6.交互動作170
5.4.數據操作案例178
5.4.1.案例13：模擬製作“奇妙清單”APP178
5.4.2.案例14：Layout圖片編輯191
5.4.3.案例15：雅虎天氣200

第6章.複雜原型的規劃209
6.1.可維護性210
6.1.1.可理解性210
6.1.2.可修改性210
6.2.巧命名211
6.2.1.使用有意義的名稱211
6.2.2.命名規範212
6.2.3.頁面的命名212
6.3.善用“說明”功能212
6.3.1.元件的“說明”212
6.3.2.對整個原型的“說明”213
6.3.3.結構圖、流程圖214
6.4.結構規劃215
6.4.1.原型結構——選擇“頁面”或.“動態面板”215
6.4.2.減少重複的動作和數據216
6.4.3.分割用例217
6.5.案例16：Flappy Bird遊戲案例217
6.5.1.原型規劃218
6.5.2.開場218
6.5.3.背景移動219
6.5.4.飛行控制221
6.5.5.碰撞檢測224
6.5.6.結束225
6.5.7.得分227

第7章.帶地圖的原型231
7.1.地圖開放平臺232
7.1.1.接口232
7.1.2.示例232
7.1.3.設置控件234
7.1.4.地圖風格235
7.1.5.覆蓋物236
7.1.6.信息窗口238
7.2.案例17：製作LBS應用“踩紅包”的原型239
7.2.1.初始化地圖頁面239
7.2.2.在地圖上添加紅包241
7.2.3.在地圖上添加信息窗口242
7.2.4.整合發布244

第8章.響應式原型設計247
8.1.響應式設計248
8.1.1.響應式設計介紹248
8.1.2.為什麼做響應式設計248
8.1.3.響應式設計思維249
8.2.自適應視圖249
8.2.1.添加子視圖250
8.2.2.繼承251
8.3.案例18：響應式網站256
8.3.1.自適應視圖改變佈局257
8.3.2.窗口改變時調整元件寬度259

第9章.手機上可訪問的原型263
9.1.讓原型適應手機尺寸264
9.1.1.設置適應手機的原型尺寸264
9.1.2.通過視口標籤，讓原型自適應瀏覽器264
9.2.生成分享鏈接266
9.2.1.註冊Axure Share賬號並分享原型266
9.2.2.利用“新浪雲”自建原型服務器268
9.3.案例19：H5小測試——色彩感覺心理測試270
9.3.1.製作測試題271
9.3.2.製作測試結果272
9.3.3.設置視口標籤273
9.3.4.發布274

第10章.母版275
10.1.創建母版276
10.1.1.在母版欄直接添加276
10.1.2.將元件轉換為母版277
10.2.使用母版277
10.2.1.拖放行為277
10.2.2.使用情況278
10.3.案例20：利用母版，解決“積分商城”的重複建設278
10.3.1.導航欄279
10.3.2.彈出菜單280
10.3.3.底部欄282
10.3.4.使用母版282

第11章.元件庫285
11.1.使用元件庫286
11.1.1.下載元件庫286
11.1.2.加載元件庫286
11.1.3.切換元件庫287
11.1.4.元件庫的其他操作288
11.2.創建元件庫288
11.3.案例21：自定義元件庫290
11.3.1.手機外框290
11.3.2.按鈕290
11.3.3.搜索框291
11.3.4.餅狀圖291
11.3.5.評論292
11.3.6.查看元件庫293

第12章.團隊協作295
12.1.團隊項目介紹296
12.2.創建團隊項目296