游戲UI設(shè)計(jì)之道（第二版 全彩）

CHAPTER　1
關(guān)于游戲UI設(shè)計(jì) 1　
1.1　UI設(shè)計(jì)與GUI設(shè)計(jì) 2
1.1.1　什么是UI設(shè)計(jì) 2
1.1.2　什么是GUI設(shè)計(jì) 2
1.1.3　關(guān)于用戶體驗(yàn) 3
1.1.4　認(rèn)知心理學(xué)與UI設(shè)計(jì)的關(guān)系 4
1.1.5　游戲UI與UI設(shè)計(jì)的區(qū)別 4
1.2　理解游戲UI設(shè)計(jì) 5
1.2.1　 什么是游戲UI設(shè)計(jì) 5
1.2.2　游戲UI設(shè)計(jì)的重要性 6
1.3　游戲UI設(shè)計(jì)的準(zhǔn)備工作 7
1.3.1　了解游戲的世界觀 7
1.3.2　確定游戲UI的設(shè)計(jì)風(fēng)格 8
1.3.3　 游戲UI設(shè)計(jì)的流程 10
1.4　游戲UI設(shè)計(jì)原則 12
1.5　游戲界面設(shè)計(jì)的3種形式 15
1.6　本章小結(jié) 16
CHAPTER　2
游戲UI設(shè)計(jì)基本元素 17
2.1　游戲UI設(shè)計(jì)中的基本視覺元素 18
2.2　圖形元素設(shè)計(jì) 19
【自測1】設(shè)計(jì)游戲圖標(biāo) 21
【自測2】設(shè)計(jì)游戲啟動圖標(biāo) 28
2.3　文字元素設(shè)計(jì) 39
【自測3】設(shè)計(jì)游戲文字 40
2.4　動態(tài)控制元素設(shè)計(jì) 48
2.4.1　按鈕元素 49
【自測4】設(shè)計(jì)游戲按鈕 50
2.4.2　進(jìn)度條元素 54
【自測5】設(shè)計(jì)游戲加載進(jìn)度條 55
2.4.3　滾動條元素 58
2.4.4　列表選項(xiàng)元素 59
【自測6】設(shè)計(jì)游戲選項(xiàng)面板 59
2.4.5　文本輸入元素 70
2.5　其他元素設(shè)計(jì) 71
2.5.1　視聽元素的重要性 71
2.5.2　聲音元素的作用 72
2.5.3　合理配色的重要性 72
【自測7】設(shè)計(jì)游戲背景 73
2.6　專家支招 80
2.7　本章小結(jié) 80
CHAPTER　３
網(wǎng)頁游戲UI設(shè)計(jì) 81
3.1　了解網(wǎng)頁游戲 82
3.1.1　網(wǎng)頁游戲的優(yōu)勢 82
3.1.2　網(wǎng)頁游戲的用戶群 82
3.1.3　網(wǎng)頁游戲的分類 83
3.1.4　網(wǎng)頁游戲的不足 85
3.2　網(wǎng)頁游戲UI設(shè)計(jì)流程 85
【自測1】設(shè)計(jì)網(wǎng)頁游戲按鈕 86
【自測2】設(shè)計(jì)網(wǎng)頁游戲?qū)Ш?94
3.3　網(wǎng)頁游戲UI設(shè)計(jì)原則 99
3.3.1　界面風(fēng)格統(tǒng)一 99
3.3.2　方便用戶操控游戲 100
3.3.3　界面要足夠友善 100
3.3.4　簡潔易用 100
3.3.5　及時(shí)的信息反饋 101
3.3.6　增強(qiáng)游戲玩家的沉浸感 101
【自測3】設(shè)計(jì)網(wǎng)頁游戲登錄界面 101
【自測4】設(shè)計(jì)拼圖網(wǎng)頁游戲界面 109
3.4　網(wǎng)頁游戲界面設(shè)計(jì)目標(biāo) 117
3.4.1　可用性目標(biāo) 117
3.4.2　用戶體驗(yàn)?zāi)繕?biāo) 118
【自測5】設(shè)計(jì)桌球網(wǎng)頁游戲界面 118
3.5　專家支招 128
3.6　本章小結(jié) 129
CHAPTER?。?br />iOS系統(tǒng)游戲UI設(shè)計(jì) 131
4.1　iOS系統(tǒng)游戲UI設(shè)計(jì)基礎(chǔ) 132
4.1.1　iOS系統(tǒng)UI尺寸 132
4.1.2　iOS系統(tǒng)圖標(biāo)尺寸 133
4.2　iOS系統(tǒng)游戲UI設(shè)計(jì)原則 133
【自測1】制作連字手機(jī)游戲界面 137
4.3　手機(jī)游戲的特點(diǎn) 143
4.3.1　手機(jī)游戲的優(yōu)勢 143
4.3.2　手機(jī)游戲的缺點(diǎn) 144
【自測2】設(shè)計(jì)iOS游戲圖標(biāo) 144
【自測3】設(shè)計(jì)五子棋手機(jī)游戲
　　 界面 149
4.4　iPad游戲視覺設(shè)計(jì)要素 159
4.4.1　圓角、陰影和高光 159
4.4.2　半透明 160
4.4.3　擬物化 160
4.4.4　空間感 161
4.4.5　擬物音效 161
【自測4】設(shè)計(jì)iPad游戲登錄界面 162
【自測5】設(shè)計(jì)iPad游戲開始界面 173
【自測6】設(shè)計(jì)iPad游戲運(yùn)行界面 183
4.5　專家支招 191
4.6　本章小結(jié) 192
CHAPTER?。?br />Android系統(tǒng)游戲UI設(shè)計(jì) 193
5.1　 Android系統(tǒng)UI設(shè)計(jì)基礎(chǔ) 194
5.1.1　Android系統(tǒng)UI尺寸 194
5.1.2　Android系統(tǒng)圖標(biāo)尺寸 194
5.1.3　Android系統(tǒng)圖標(biāo)的設(shè)計(jì)
規(guī)則 195
5.2　Android手機(jī)游戲UI設(shè)計(jì)
規(guī)范 195
【自測1】設(shè)計(jì)消除類手機(jī)游戲
圖標(biāo) 197
【自測2】設(shè)計(jì)消除類手機(jī)游戲
界面 204
5.3　手機(jī)游戲界面設(shè)計(jì)的色彩
搭配 215
5.3.1　手機(jī)游戲界面設(shè)計(jì)中的色彩
表現(xiàn) 215
5.3.2　手機(jī)游戲界面設(shè)計(jì)中的色彩
設(shè)計(jì)方法 216
【自測3】設(shè)計(jì)休閑類手機(jī)游戲
界面 217
5.4　傳統(tǒng)游戲與手機(jī)游戲UI設(shè)計(jì)
的異同 225
5.4.1　傳統(tǒng)游戲與手機(jī)游戲UI設(shè)計(jì)
的相同點(diǎn) 225
5.4.2　傳統(tǒng)游戲與手機(jī)游戲UI設(shè)計(jì)
的不同點(diǎn) 225
【自測4】設(shè)計(jì)釣魚手機(jī)游戲
界面 226
5.5　手機(jī)游戲UI設(shè)計(jì)常見問題 235
5.5.1　同類元素外觀類型不一致 236
5.5.2　使用過多的字體類型 236
5.5.3　游戲界面之間的切換處理
不當(dāng) 237
【自測5】設(shè)計(jì)Q版手機(jī)游戲界面 237
5.6　專家支招 249
5.7　本章小結(jié) 250

CHAPTER?。?br />網(wǎng)絡(luò)游戲UI設(shè)計(jì) 251
6.1　游戲類別與UI設(shè)計(jì)的關(guān)系 252
6.1.1　按游戲種類劃分 252
6.1.2　按游戲模式劃分 253
6.2　網(wǎng)絡(luò)游戲界面設(shè)計(jì)要求 255
6.3　棋牌游戲UI設(shè)計(jì) 257
【自測1】棋牌游戲UI設(shè)計(jì) 257
6.4　《賽馬》游戲UI設(shè)計(jì) 275
【自測2】《賽馬》游戲UI設(shè)計(jì) 275
6.5　《劍俠》游戲UI設(shè)計(jì) 295
【自測3】《劍俠》游戲UI設(shè)計(jì) 295
6.6　《古神志》游戲UI設(shè)計(jì) 309
【自測3】《古神志》游戲UI設(shè)計(jì) 310
6.7　專家支招 324
6.8　本章小結(jié) 324