創(chuàng)意UI Photoshop玩轉(zhuǎn)App設(shè)計(jì)（第2版）

第1章 一起踏入App的世界 

1．1 初識(shí)App 8

1．1．1 什么是App 8

1．1．2 手機(jī)App與平面UI的區(qū)別 9

1．1．3 兩大智能手機(jī)的操作系統(tǒng) 11

1．1．4 App的設(shè)計(jì)要點(diǎn) 12

1．1．5 常見(jiàn)App設(shè)計(jì)的經(jīng)典案例 15

1．2 兩大App主流應(yīng)用商店 16

1．2．1 蘋果商店 17

1．2．2 谷歌商店 17

1．3 App的草圖設(shè)計(jì)流程及方法 19

1．3．1 制作App的市場(chǎng)定位 19

1．3．2 草圖的繪制 19

1．3．3 視覺(jué)設(shè)計(jì) 20

1．3．4 最終定案 21

1．4 常見(jiàn)App設(shè)備標(biāo)準(zhǔn) 22

1．4．1 屏幕尺寸 22

1．4．2 屏幕分辨率 24

1．4．3 屏幕密度 25

1．5 設(shè)備中圖標(biāo)尺寸大小規(guī)格 26

1．5．1 圖標(biāo)尺寸 27

1．5．2 圖標(biāo)格式 27

1．6 App的界面構(gòu)成 28

1．6．1 導(dǎo)航欄 30

1．6．2 屏幕欄 31

1．6．3 下方按鈕欄 31

1．7 給你的App一點(diǎn)顏色看看 32

1．7．1 冷暖色調(diào)對(duì)比 33

1．7．2 色彩搭配技巧 34

1．7．3 常見(jiàn)App界面色彩 34

1．8 那些你不可不知的App分類 35

1．8．1 應(yīng)用程序 35

1．8．2 歡迎界面 36

1．8．3 游戲App設(shè)計(jì) 36

1．9 制作App常用的設(shè)計(jì)軟件 37

1．9．1 Photoshop CS6 37

1．9．2 Illustrator CS6 37

第2章 App設(shè)計(jì)的特點(diǎn)和用戶體驗(yàn)

2．1 App的特性 39

2．1．1 虛擬鍵盤 39

2．1．2 目錄導(dǎo)航 40

2．1．3 功能操作 42

2．1．4 自上而下的操作 43

2．1．5 減少輸入 44

2．1．6 足夠大的按鈕面積 44

2．1．7 多點(diǎn)觸控手勢(shì) 45

2．2 圖標(biāo)的設(shè)計(jì)要點(diǎn) 46

2．2．1 圖標(biāo)的可識(shí)別性 46

2．2．2 注重圖標(biāo)的創(chuàng)新性 50

2．2．3 圖標(biāo)設(shè)計(jì)的連續(xù)性 51

2．3 App的下載平臺(tái) 53

2．3．1 安卓系統(tǒng)下載平臺(tái) 56

2．3．2 iOS系統(tǒng)下載平臺(tái) 57

2．4 App與用戶體驗(yàn) 58

2．4．1 App設(shè)計(jì)要點(diǎn) 59

2．4．2 用戶體驗(yàn) 66

2．5 兩大主流平臺(tái)與App之間的關(guān)系 74

2．5．1 安卓平臺(tái) 75

2．5．2 iOS平臺(tái) 76

第3章 Photoshop創(chuàng)作個(gè)性App 

3．1 基礎(chǔ)圖形的繪制 78

3．1．1 圓形、橢圓 79

3．1．2 正方形、長(zhǎng)方形 82

3．1．3 圓角矩形 84

3．1．4 組合圖形 86

3．1．5 虛線框 88

3．1．6 自定義形狀 90

3．2 手機(jī)App中常見(jiàn)按鈕的制作 92

3．2．1 開(kāi)關(guān) 93

3．2．2 下拉選框 96

3．2．3 滑動(dòng)條 98

3．2．4 對(duì)話框 100

3．3 讓人過(guò)目不忘的啟動(dòng)圖標(biāo) 102

3．3．1 安卓系統(tǒng)啟動(dòng)圖標(biāo) 103

3．3．2 iOS系統(tǒng)啟動(dòng)圖標(biāo) 105

3．4 個(gè)性圖標(biāo)的制作 106

3．4．1 扁平化圖標(biāo) 107

3．4．2 高清質(zhì)感圖標(biāo) 109

3．4．3 游戲圖標(biāo) 112

3．5 單擊圖標(biāo)后的界面 116

3．5．1 手機(jī)App登錄頁(yè)面UI設(shè)計(jì) 117

3．5．2 手機(jī)App引導(dǎo)頁(yè)UI設(shè)計(jì) 121

3．5．3 手機(jī)App啟動(dòng)頁(yè)UI設(shè)計(jì) 124

3．6 化腐朽為神奇的圖片效果處理 128

3．6．1 調(diào)整照片色調(diào) 129

3．6．2 畫(huà)中畫(huà)效果 131

3．6．3 外邊框效果 133

3．6．4 卷頁(yè)效果 135

第4章 界面要素決定App風(fēng)格

4．1 扁平化風(fēng)格界面制作 142

安卓手機(jī)界面扁平化風(fēng)格制作 142

蘋果手機(jī)界面扁平化風(fēng)格制作 147

4．2 立體圖標(biāo)界面制作 151

彩虹立體按鈕涂圖標(biāo)界面 151

水晶立體圖標(biāo)界面 157

金屬質(zhì)感界面 162

4．3 照片圖像界面制作 166

日照光效界面 166

光效處理界面 170

翻頁(yè)照片界面 175

4．4 寫實(shí)風(fēng)格界面制作 179

超寫實(shí)風(fēng)格界面 179

中國(guó)風(fēng)寫實(shí)木紋界面 183

4．5 繪畫(huà)藝術(shù)界面制作 189

手繪涂鴉藝術(shù)界面 189

動(dòng)漫風(fēng)格藝術(shù)界面 195

矢量插畫(huà)風(fēng)格界面 201

第5章 不同應(yīng)用系統(tǒng)界面

5．1 工具應(yīng)用系統(tǒng)界面 207

通信主界面 207

鬧鐘應(yīng)用界面 212

天氣應(yīng)用界面 216

手電應(yīng)用界面 219

計(jì)算器應(yīng)用界面 224

5．2 主題應(yīng)用系統(tǒng)界面 229

超萌繪畫(huà)界面 229

簡(jiǎn)潔創(chuàng)意界面 236

清新主題手機(jī)界面 241

5．3 程序軟件應(yīng)用系統(tǒng)界面 250

手機(jī)社交應(yīng)用界面 250

手機(jī)相機(jī)應(yīng)用界面 254

手機(jī)音樂(lè)應(yīng)用界面 258

5．4 游戲應(yīng)用系統(tǒng)界面 262

經(jīng)典消除游戲界面 262

棋牌游戲界面 271

闖關(guān)游戲界面 280

附錄

A App資源共享 290

A．1 App精致圖標(biāo)欣賞 290

A．2 你不可不知的優(yōu)秀界面欣賞 291

A．3 你所需要的分層素材共享 292

B App界面構(gòu)成組件 293

B．1 主屏模式 294

B．2 聲音 295

B．3 顯示 295

B．4 應(yīng)用程序管理器 296

B．5 語(yǔ)言和輸入 296

B．6 日期和時(shí)間 297

B．7 輔助功能 297

C App產(chǎn)品設(shè)計(jì)禁忌 298

C．1 App屏幕設(shè)計(jì)禁忌 298

C．2 App文字設(shè)計(jì)禁忌 300

C．3 App選項(xiàng)設(shè)計(jì)禁忌 301

C．4 App按鈕圖標(biāo)設(shè)計(jì)禁忌 302

C．5 App空間性設(shè)計(jì)禁忌 304