目前移動(dòng)設(shè)備產(chǎn)品日益增多，移動(dòng)應(yīng)用程序的市場(chǎng)呈現(xiàn)出百花齊放的勝景。為了能夠迎合用戶、提高用戶體驗(yàn)，越來(lái)越多的移動(dòng)應(yīng)用程序產(chǎn)品開(kāi)始提倡“以用戶為中心”的設(shè)計(jì)理念，這就要求移動(dòng)UI視覺(jué)設(shè)計(jì)師們要有敏銳的設(shè)計(jì)嗅覺(jué)和完整的設(shè)計(jì)流程及思維。

本書為移動(dòng)UI界面設(shè)計(jì)暢銷書全新升級(jí)版，包含了大量精美的界面元素、App界面視覺(jué)設(shè)計(jì)的案例，利用詳細(xì)的布局規(guī)劃、創(chuàng)意思維、配色方案、組件分析等內(nèi)容來(lái)對(duì)案例的創(chuàng)作思路進(jìn)行闡述，告訴讀者移動(dòng)UI視覺(jué)設(shè)計(jì)的創(chuàng)作技巧。

本書從移動(dòng)UI視覺(jué)設(shè)計(jì)的基礎(chǔ)知識(shí)出發(fā)，通過(guò)分析和講解兩大主流系統(tǒng)的設(shè)計(jì)規(guī)范和設(shè)計(jì)技巧，將移動(dòng)UI視覺(jué)設(shè)計(jì)中的創(chuàng)意思路與操作案例有機(jī)地結(jié)合在一起，力求在幫助讀者提高UI界面制作能力的同時(shí)，拓展移動(dòng)UI視覺(jué)設(shè)計(jì)的創(chuàng)作思路。

本書包含三部分，共12個(gè)Part的內(nèi)容。第1部分為基礎(chǔ)篇（Part1~Part3）：介紹移動(dòng)UI視覺(jué)設(shè)計(jì)的基礎(chǔ)知識(shí)，Photoshop軟件的常用操作功能，以及移動(dòng)UI界面中基礎(chǔ)元素的設(shè)計(jì)規(guī)范；第2部分介紹兩大主流系統(tǒng)（Part4~Part5）：分別對(duì)兩大系統(tǒng)進(jìn)行有針對(duì)性的講解，通過(guò)相關(guān)的案例介紹移動(dòng)UI視覺(jué)設(shè)計(jì)的制作方法和技巧；第3部分講解App應(yīng)用實(shí)例（Part6~Part12）：以完整的App界面設(shè)計(jì)為主要內(nèi)容，展示不同風(fēng)格移動(dòng)UI界面設(shè)計(jì)的特點(diǎn)和制作方法。

本書配有下載資源，內(nèi)含不同類型App應(yīng)用設(shè)計(jì)的講解視頻，以及書中的實(shí)例源文件及相關(guān)素材，讀者可以更好、更快地學(xué)習(xí)移動(dòng)UI界面設(shè)計(jì)。

創(chuàng)銳設(shè)計(jì)，由一支優(yōu)秀的平面設(shè)計(jì)師與圖形圖像資深編輯隊(duì)伍組成。出版過(guò)眾多優(yōu)秀的圖形圖像方面的專業(yè)書籍，不僅在國(guó)內(nèi)處于領(lǐng)先地位，還有大量作品輸出過(guò)海外版權(quán)，備受讀者青睞。在課程教材方面，由于他們擁有多年教育培訓(xùn)的經(jīng)驗(yàn)，因此十分了解初學(xué)讀者的心理需求，從而研究出了一套行之有效的教學(xué)方法；此外，他們又參加過(guò)多個(gè)商業(yè)項(xiàng)目的設(shè)計(jì)工作，熟悉行業(yè)規(guī)范、了解客戶需求，擁有較高的設(shè)計(jì)水平，積累了豐富的制作經(jīng)驗(yàn)、為專業(yè)進(jìn)階讀者指出了技術(shù)進(jìn)階的明路；在他們的圖書中，選擇的實(shí)例不僅融會(huì)貫通了軟件技法，更能通過(guò)分享圖像處理經(jīng)驗(yàn)，激發(fā)讀者的靈感、迸發(fā)創(chuàng)意火花，達(dá)到事半功倍的效果。

Part 1 移動(dòng)UI設(shè)計(jì)基礎(chǔ) / 1
1．1 UI設(shè)計(jì)存在的意義 / 2
1．1．1 人機(jī)交互的橋梁 / 2
1．1．2 操作邏輯系統(tǒng)的展現(xiàn) / 3
1．1．3 展現(xiàn)系統(tǒng)的整體風(fēng)格 / 3
1．2 移動(dòng)UI設(shè)計(jì)的原則 / 4
1．2．1 視覺(jué)一致性原則 / 4
1．2．2 視覺(jué)簡(jiǎn)易性原則 / 5
1．2．3 從用戶的習(xí)慣考慮 / 6
1．2．4 操作的靈活性及人性化 / 8
1．3 兩大主流操作系統(tǒng)的特點(diǎn)對(duì)比 / 9
1．4 不同系統(tǒng)UI視覺(jué)的主要組成要素及特征 / 10
1．4．1 iOS系統(tǒng)中的組成要素及特征 / 10
1．4．2 Android系統(tǒng)中的組成要素及特征 / 11
1．5 認(rèn)識(shí)移動(dòng)終端的分辨率和像素 / 13
1．6 移動(dòng)UI的創(chuàng)意與靈感收集 / 14
1．6．1 各種經(jīng)驗(yàn)和靈感的記錄 / 14
1．6．2 將對(duì)象抽象化 / 15
1．6．3 設(shè)計(jì)靈感的轉(zhuǎn)移 / 16
1．7 移動(dòng)UI的視覺(jué)設(shè)計(jì)流程 / 18

Part 2 PS在移動(dòng)UI設(shè)計(jì)中的常用功能簡(jiǎn)介 / 21
2．1 繪圖工具的介紹 / 22
2．1．1 規(guī)則形狀的繪制 / 22
2．1．2 自定義形狀的繪制 / 23
2．1．3 繪制任意所需的形狀 / 25
2．2 圖層樣式的運(yùn)用 / 26
2．2．1 增強(qiáng)立體感的圖層樣式 / 26
2．2．2 發(fā)光效果的圖層樣式 / 28
2．2．3 更改色彩的圖層樣式 / 29
2．3 蒙版的編輯 / 31
2．3．1 圖層蒙版 / 31
2．3．2 剪貼蒙版 / 32
2．4 文字的添加 / 34
2．4．1 文字的添加與設(shè)置 / 34
2．4．2 文字的高級(jí)編輯 / 35

Part 3 移動(dòng)UI界面中基本元素的制作 / 37
3．1 按鈕 / 38
3．1．1 按鈕設(shè)計(jì)的基礎(chǔ)知識(shí) / 38
3．1．2 扁平化按鈕的設(shè)計(jì) / 39
3．2 開(kāi)關(guān) / 42
3．2．1 開(kāi)關(guān)設(shè)計(jì)的基礎(chǔ)知識(shí) / 42
3．2．2 簡(jiǎn)易色塊開(kāi)關(guān)的設(shè)計(jì) / 44
3．2．3 擬物化開(kāi)關(guān)的設(shè)計(jì) / 45
3．3 進(jìn)度條 / 47
3．3．1 進(jìn)度條設(shè)計(jì)的基礎(chǔ)知識(shí) / 47
3．3．2 扁平化進(jìn)度條的設(shè)計(jì) / 49
3．3．3 層次感強(qiáng)烈的進(jìn)度條設(shè)計(jì) / 50
3．4 搜索欄 / 54
3．4．1 搜索欄設(shè)計(jì)的基礎(chǔ)知識(shí) / 54
3．4．2 扁平化搜索欄的設(shè)計(jì) / 56
3．5 列表框 / 61
3．5．1 列表框設(shè)計(jì)的基礎(chǔ)知識(shí) / 61
3．5．2 簡(jiǎn)易列表框的設(shè)計(jì) / 62
3．5．3 立體化列表框的設(shè)計(jì) / 64
3．6 標(biāo)簽欄 / 68
3．6．1 標(biāo)簽欄設(shè)計(jì)的基礎(chǔ)知識(shí) / 68
3．6．2 線性化標(biāo)簽欄設(shè)計(jì) / 69
3．6．3 木紋質(zhì)感的標(biāo)簽欄設(shè)計(jì) / 70
3．7 圖標(biāo)欄 / 73
3．7．1 圖標(biāo)欄設(shè)計(jì)的基礎(chǔ)知識(shí) / 73
3．7．2 線性化圖標(biāo)欄設(shè)計(jì) / 74
3．7．3 紙箱紋理的圖標(biāo)欄設(shè)計(jì) / 77

Part 4 iOS系統(tǒng)及其組件的設(shè)計(jì) / 81
4．1 iOS系統(tǒng)設(shè)計(jì)特點(diǎn) / 82
4．1．1 充分利用整個(gè)屏幕 / 82
4．1．2 使用半透明底板 / 82
4．1．3 信息的清晰呈現(xiàn) / 83
4．2 iOS系統(tǒng)設(shè)計(jì)的規(guī)范 / 85
4．2．1 設(shè)計(jì)原則 / 85
4．2．2 色彩和字體 / 88
4．2．3 圖標(biāo)的設(shè)計(jì) / 92
4．3 iOS系統(tǒng)界面設(shè)計(jì)實(shí)訓(xùn) / 96
4．3．1 扁平化圖標(biāo)的設(shè)計(jì) / 96
4．3．2 半透明效果的界面設(shè)計(jì) / 104

Part 5 Android系統(tǒng)及其組件的設(shè)計(jì) / 111
5．1 Android系統(tǒng)的特點(diǎn) / 112
5．2 Android系統(tǒng)的設(shè)計(jì)規(guī)范 / 114
5．2．1 度量單位 / 114
5．2．2 字體的使用標(biāo)準(zhǔn) / 116
5．2．3 色彩的應(yīng)用規(guī)范 / 117
5．2．4 四種類型的圖標(biāo) / 120
5．3 六種標(biāo)準(zhǔn)的Widget規(guī)范 / 122
5．3．1 Widget框架簡(jiǎn)介 / 122
5．3．2 Widget框架的標(biāo)準(zhǔn)尺寸 / 124
5．3．3 4×1的Widget框架設(shè)計(jì) / 125
5．3．4 3×3的Widget框架設(shè)計(jì) / 129
5．3．5 2×2的Widget框架設(shè)計(jì) / 133
5．3．6 4×1的加長(zhǎng)Widget框架設(shè)計(jì) / 136
5．3．7 3×3的橫向Widget框架設(shè)計(jì) / 140
5．3．8 2×2的橫向Widget框架設(shè)計(jì) / 145
5．4 Android系統(tǒng)界面設(shè)計(jì)實(shí)訓(xùn) / 150
5．4．1 立體化的圖標(biāo)設(shè)計(jì) / 150
5．4．2 超強(qiáng)立體感的界面設(shè)計(jì) / 159

Part 6 孕媽幫手App設(shè)計(jì) / 171
界面布局規(guī)劃 / 172
創(chuàng)意思路剖析 / 172
確定配色方案 / 173
定義組件風(fēng)格 / 174
制作步驟詳解 / 174

Part 7 美食網(wǎng)站App設(shè)計(jì) / 185
界面布局規(guī)劃 / 186
創(chuàng)意思路剖析 / 186
確定配色方案 / 187
定義組件風(fēng)格 / 188
制作步驟詳解 / 188

Part 8 籃球運(yùn)動(dòng)App設(shè)計(jì) / 201
界面布局規(guī)劃 / 202
創(chuàng)意思路剖析 / 202
確定配色方案 / 203
定義組件風(fēng)格 / 203
制作步驟詳解 / 204

Part 9 流量銀行App設(shè)計(jì) / 217
界面布局規(guī)劃 / 218
創(chuàng)意思路剖析 / 218
確定配色方案 / 219
定義組件風(fēng)格 / 219
制作步驟詳解 / 220

Part 10 藏寶游戲App設(shè)計(jì) / 231
界面布局規(guī)劃 / 232
創(chuàng)意思路剖析 / 232
確定配色方案 / 233
定義組件風(fēng)格 / 234
制作步驟詳解 / 234

Part 11 音樂(lè)播放App設(shè)計(jì) / 247
界面布局規(guī)劃 / 248
創(chuàng)意思路剖析 / 248
確定配色方案 / 249
定義組件風(fēng)格 / 250
制作步驟詳解 / 250

Part 12 旅游資訊App設(shè)計(jì) / 267
界面布局規(guī)劃 / 268
創(chuàng)意思路剖析 / 268
確定配色方案 / 269
定義組件風(fēng)格 / 270
制作步驟詳解 / 270