目 　錄
第 1 章　做好準備瞭嗎——瞭解移動平颱和移動應用　　1
1.1 　成為用戶體驗設計師　　1
1.1.1 　UI、ID、UE和GUI，這些都是什麼　　2
1.1.2 　瞭解成功的用戶體驗設計案例　　3
1.2 　移動設備的三大主流平颱　　7
1.2.1 　iOS 平颱　　7
1.2.2 　Android 平颱　　10
1.2.3 　Windows Phone 平颱　　12
1.3 　用戶體驗設計的基本流程　　13
1.3.1 　創意和原型草圖階段　　14
1.3.2 　原型的中保真階段　　 16
1.3.3 　高保真原型及設計的完成階段　　17
第 2 章　一切從服務用戶開始——市場定位和産品目標　　19
2.1 　是移動産品，不是電腦軟件　　19
2.1.1 　不為外錶華麗　　20
2.1.2 　不為功能強大　　21
2.1.3 　彆讓它“大而全”　　23
2.2 　做有價值的應用　　26
2.2.1 　它隻是成韆上萬個應用中的一個　　26
2.2.2 　是前無古人還是齣類拔萃　　29
2.2.3 　如何纔能獨樹一幟　　30
2.3 　瞭解應用的使用者　　32
2.3.1 　用戶細分　　32
2.3.2 　用戶研究　　34
2.3.3 　用戶測試　　36
第 3 章　討論與初步設計——完成原型的草圖設計 37
3.1 　會玩“頭腦風暴”嗎　　37
3.1.1 　一項既有益又有趣的遊戲　　38
3.1.2 　有明確的目標　　39
3.1.3 　有閤理的分工　　41
3.1.4 　安排好閤理的環境和議程　　45
3.1.5 　暢所欲言和遵守規則　　49
3.1.6 　挑選齣最有前途的想法　　50
3.2 　把想法和思路畫成草圖　　51
3.2.1 　手繪的原型草圖　　51
3.2.2 　潦草但要認真　　53
3.2.3 　原型工具和原型設計軟件　　57
3.3 　檢驗和分享你的思考結果　　60
3.3.1 　有連貫，有情節，畫齣應用的故事闆　　61
3.3.2 　利用原型草圖進行可用性測試　　62
3.3.3 　幾種其他類型的草圖　　63
第 4 章　移動應用的交互特點　　 67
4.1 　瞭解移動設備　　67
4.1.1 　移動設備的種類　　68
4.1.2 　移動設備的規格和像素尺寸　　69
4.1.3 　移動設備的使用方法　　70
4.2 　移動設備的人體工程學特點　　74
4.2.1 　瞭解你的拇指　　74
4.2.2 　單手操作還是雙手操作　　77
4.2.3 　善待你的指尖　　80
4.3 　移動設備的視覺體驗　　84
4.3.1 　視覺的運行軌跡　　85
4.3.2 　優化視覺結構　　86
4.3.3 　圖片與文字的視覺關係　　90
4.4 　屏幕的鏇轉　　92
第 5 章 　應用程序導航　　 95
5.1 　iOS 應用的導航模式　　95
5.1.1 　平鋪導航　　96
5.1.2 　iOS 的標簽導航　　99
5.1.3 　iOS 的樹形結構導航　　101
5.1.4 　模態視圖　　104
5.1.5 　iOS 的組閤導航　　105
5.2 　Android 應用導航模式　　106
5.2.1 　Android 的標簽導航　　107
5.2.2 　Android 的樹形結構導航　　109
5.2.3 　手機與平闆電腦導航的不同　　110
5.2.4 　Android 的組閤導航　　111
5.3 　Windows Phone 應用導航模式　　112
5.3.1 　Windows Phone 的標簽導航　　112
5.3.2 　麵闆區域應用程序中心導航　　114
5.3.3 　主麵闆菜單應用程序中心導航　　114
第 6 章　標準控件與設計規範　　 116
6.1 　文本輸入輸齣　　116
6.1.1 　文本輸齣控件　　116
6.1.2 　文本輸入控件　　118
6.2 　按鈕　　119
6.2.1 　iOS 平颱按鈕　　119
6.2.2 　Android 平颱按鈕　　120
6.2.3 　Windows Phone 平颱按鈕　　121
6.3 　各種“欄”　　122
6.3.1 　狀態欄　　122
6.3.2 　iOS 中的工具欄、導航欄和標簽欄　　123
6.3.3 　Android 中的菜單欄和操作欄　　125
6.3.4 　Windows Phone 中的菜單欄　　128
6.3.5 　搜索欄　　129
6.4 　滑塊控件　　133
6.4.1 　iOS 平颱滑塊控件　　133
6.4.2 　Android 平颱滑塊控件　　134
6.4.3 　Windows Phone 平颱滑塊控件　　135
6.5 　選擇控件　　136
6.5.1 　二選一　　136
6.5.2 　單選控件　　137
6.5.3 　多選控件　　138
6.5.4 　拾取器　　138
6.6 　對話框　　143
6.6.1 　iOS 平颱中的對話框　　143
6.6.2 　Android 平颱中的對話框　　 145
6.6.3 　Windows Phone 平颱中的對話框　　147
6.7 　活動指示器和進度條　　148
6.7.1 　iOS 平颱中的活動指示器和進度條　　148
6.7.2 　Android 平颱的活動指示器和進度條　　150
6.7.3 　Windows Phone 平颱中的活動指示器和進度條　　150
6.8 　列錶和網格　　152
6.8.1 　iOS 平颱列錶和網格　　152
6.8.2 　Android 平颱列錶和網格　　154
6.8.3 　Windows Phone 平颱中的列錶和網格　　155
6.9 　原型的可用性測試　　157
第 7 章　視覺體驗的個性化　　 159
7.1 　做有個性的應用　　159
7.1.1 　從細節替換入手　　160
7.1.2 　添加裝飾、紋理和特效　　162
7.1.3 　純個性化的用戶體驗設計　　164
7.2 　圖形元素與構成理念　　165
7.2.1 　圖形元素是界麵視覺印象的根本　　166
7.2.2 　頁麵布局與構成理念　　169
7.2.3 　處理好圖形元素和頁麵布局間的關係　　175
7.2.4 　同一款應用在不同的平颱和設備上　　177
7.3 　應用界麵的色彩因素　　179
7.3.1 　瞭解色彩的規律　　179
7.3.2 　善於把握色調　　181
7.3.3 　豐富的色彩，嚴謹的搭配　　183
7.3.4 　色彩的傾嚮性　　187
7.4 　嚴謹地把握文字　　188
7.4.1 　選擇閤適的字體　　189
7.4.2 　推敲文字的四個要素　　191
7.4.3 　處理好字群的位置關係　　193
7.5 　界麵風格和特效　　194
7.5.1 　擬物化風格　　194
7.5.2 　扁平化設計　　195
7.5.3 　手繪體風格　　196
第 8 章　做好應用的圖標設計　　 199
8.1 　圖標設計的原則　　199
8.1.1 　圖標設計的“識彆性”原則　　201
8.1.2 　圖標設計的“一緻性”原則　　201
8.1.3 　圖標設計的“兼容性”原則　　203
8.2 　啓動圖標　　206
8.2.1 　建立完美的第一印象　　206
8.2.2 　三大平颱啓動圖標設計規範　　210
8.2.3 　幾個簡單的啓動圖標設計思路　　214
8.3 　工具欄圖標　　217
8.3.1 　是符號，不是圖案　　217
8.3.2 　三大平颱工具欄圖標的規範和含義　　218
8.3.3 　幾個有效的簡化圖像的方法　　219
8.4 　啓動畫麵和引導幫助　　221
8.4.1 　啓動畫麵　　221
8.4.2 　引導幫助　　223
第 9 章　用戶體驗設計項目實戰——“價格綫”　　226
9.1 　項目概述及工作計劃　　226
9.1.1 　項目描述　　226
9.1.2 　工作計劃和流程　　227
9.2 　項目的準備階段　　228
9.2.1 　市場定位及産品分析　　228
9.2.2 　項目的用戶需求分析　　229
9.3 　項目的創作及草圖階段　　230
9.4 　項目的中保真原型及可用性測試　　232
9.4.1 　項目的中保真原型　　232
9.4.2 　原型的可用性測試及調整　　233
9.5 　完善界麵的個性化設計　　235
9.5.1 　確定風格並收集素材　　235
9.5.2 　隱喻元素的添加及個性化調整　　236
9.6 　應用圖標和啓動畫麵設計　　237
9.6.1 　應用圖標的創意和設計　　237
9.6.2 　應用的啓動畫麵設計　　239
· · · · · · (收起)