Photoshop熱門手機(jī)APP與游戲界面設(shè)計(jì)實(shí)戰(zhàn)從入門到精通（第2版）

第1篇 基礎(chǔ)入門篇
第01章 UI設(shè)計(jì)快速入行
1.1 UI設(shè)計(jì)的基礎(chǔ)...................................... 16
實(shí)例001 設(shè)計(jì)的要義..................................16
實(shí)例002 設(shè)計(jì)的創(chuàng)作思路............................16
實(shí)例003 設(shè)計(jì)的分類..................................17
實(shí)例004 什么是UI設(shè)計(jì)...............................17
實(shí)例005 UI設(shè)計(jì)的分類.............................. 18
實(shí)例006 UI設(shè)計(jì)的規(guī)范.............................. 18
實(shí)例007 設(shè)計(jì)基本原則.............................. 20
實(shí)例008 設(shè)計(jì)流程及方法............................21
實(shí)例009 項(xiàng)目需求分析...............................21
實(shí)例010 UI設(shè)計(jì)者與產(chǎn)品設(shè)計(jì)團(tuán)隊(duì).............. 22
1.2 Photoshop UI設(shè)計(jì)快速入門.................. 22
實(shí)例011 了解Photoshop和UI的關(guān)系.......... 22
實(shí)例012 啟動(dòng)Photoshop應(yīng)用程序............. 23
實(shí)例013 退出Photoshop應(yīng)用程序............. 24
實(shí)例014 了解Photoshop工作界面............. 24
實(shí)例015 了解Photoshop的工具箱............. 26
實(shí)例016 管理Photoshop面板................... 29
實(shí)例017 管理Photoshop工作窗口............. 30
實(shí)例018 優(yōu)化Photoshop系統(tǒng)參數(shù)..............31
實(shí)例019 控制Photoshop圖像窗口............. 32
實(shí)例020 控制Photoshop圖像顯示............. 35
實(shí)例021 控制Photoshop圖像畫布............. 40
實(shí)例022 應(yīng)用Photoshop輔助工具..............41
1.3 圖像處理基本操作................................. 46
實(shí)例023 新建文件.................................... 46
實(shí)例024 存儲(chǔ)文件.................................... 47
實(shí)例025 關(guān)閉文件.................................... 48
實(shí)例026 管理圖像.................................... 49
實(shí)例027 自由變換圖像.............................. 50
實(shí)例028 選取顏色.................................... 56
實(shí)例029 填充顏色與圖案........................... 59
第02章 手機(jī)APP界面設(shè)計(jì)入門
2.1 手機(jī)界面設(shè)計(jì)的基礎(chǔ).............................. 62
實(shí)例030 什么是手機(jī)界面設(shè)計(jì).................... 62
實(shí)例031 界面構(gòu)成的基本區(qū)域..................... 62
實(shí)例032 手機(jī)界面效果的規(guī)范性................. 63
實(shí)例033 手機(jī)界面效果的個(gè)性化................. 63
實(shí)例034 手機(jī)UI設(shè)計(jì)基本流程.................... 64
實(shí)例035 手機(jī)界面設(shè)計(jì)常用的5種布局........ 65
2.2 手機(jī)界面的視覺(jué)效果.............................. 66
實(shí)例036 簡(jiǎn)約明快型................................. 67
實(shí)例037 趣味與獨(dú)創(chuàng)型.............................. 67
實(shí)例038 高貴華麗型................................. 68
2.3 安卓與蘋果手機(jī)系統(tǒng)組件介紹.................. 68
實(shí)例039 安卓系統(tǒng)基礎(chǔ)組件....................... 68
實(shí)例040 蘋果系統(tǒng)基礎(chǔ)組件....................... 69
第2篇 手機(jī)APP篇
第03章 手機(jī)APP常用元素設(shè)計(jì)
3.1 了解手機(jī)APP常用元素.......................... 72
實(shí)例041 手機(jī)APP常用圖形元素................. 72
實(shí)例042 手機(jī)APP常用控件....................... 72
實(shí)例043 手機(jī)APP啟動(dòng)圖標(biāo)....................... 74
3.2 手機(jī)APP常用元素設(shè)計(jì).......................... 74
實(shí)例044 完成按鈕設(shè)計(jì).............................. 74
實(shí)例045 選項(xiàng)框設(shè)計(jì)................................. 78
實(shí)例046 電話圖標(biāo)設(shè)計(jì).............................. 83
3.3 手機(jī)APP Logo設(shè)計(jì)案例演練.................. 87
實(shí)例047 音樂(lè)Logo設(shè)計(jì)............................ 87
實(shí)例048 照片Logo設(shè)計(jì)............................ 90
實(shí)例049 視頻Logo設(shè)計(jì)............................ 95
3.4 手機(jī)APP常用元素設(shè)計(jì)案例演練............. 100
實(shí)例050 搜索框設(shè)計(jì)................................100
實(shí)例051 解鎖滑塊設(shè)計(jì).............................103
實(shí)例052 背光時(shí)間列表框設(shè)計(jì)...................107
第04章 手機(jī)APP登錄界面設(shè)計(jì)
4.1 手機(jī)APP登錄界面設(shè)計(jì)理論....................114
實(shí)例053 什么是登錄界面設(shè)計(jì)................... 114
實(shí)例054 登錄界面設(shè)計(jì)的分類................... 114
實(shí)例055 登錄界面的設(shè)計(jì)原則................... 115
實(shí)例056 登錄界面的構(gòu)成元素................... 115
實(shí)例057 登錄界面的常見(jiàn)布局................... 116
4.2 手機(jī)微信登錄界面設(shè)計(jì)..........................116
實(shí)例058 設(shè)計(jì)界面背景效果...................... 116
實(shí)例059 設(shè)計(jì)界面主體效果...................... 117
實(shí)例060 設(shè)計(jì)界面整體效果...................... 119
4.3 手機(jī)WiFi登錄界面設(shè)計(jì).........................121
實(shí)例061 設(shè)計(jì)界面背景效果....................... 121
實(shí)例062 設(shè)計(jì)界面按鈕效果......................122
實(shí)例063 設(shè)計(jì)界面復(fù)選框效果...................126
實(shí)例064 設(shè)計(jì)界面細(xì)節(jié)效果......................128
實(shí)例065 設(shè)計(jì)界面文字效果...................... 131
4.4 手機(jī)QQ登錄界面設(shè)計(jì)......................... 132
實(shí)例066 設(shè)計(jì)界面背景效果......................132
實(shí)例067 設(shè)計(jì)界面主體效果......................133
實(shí)例068 設(shè)計(jì)界面整體效果......................137
4.5 手機(jī)云空間登錄界面設(shè)計(jì)...................... 139
實(shí)例069 手機(jī)云空間背景效果...................140
實(shí)例070 手機(jī)云空間主體效果................... 141
實(shí)例071 手機(jī)云空間裝飾效果....................144
實(shí)例072 手機(jī)云空間整體效果...................145
第05章 手機(jī)實(shí)用APP界面設(shè)計(jì)
5.1 安卓與蘋果手機(jī)系統(tǒng)組件介紹................. 149
實(shí)例073 安卓手機(jī)數(shù)字鍵盤設(shè)計(jì)................149
實(shí)例074 安卓手機(jī)音量列表框設(shè)計(jì).............153
實(shí)例075 蘋果手機(jī)日歷圖標(biāo)設(shè)計(jì)............... 158
實(shí)例076 蘋果手機(jī)日歷表設(shè)計(jì)...................162
實(shí)例077 蘋果手機(jī)已用空間檢測(cè)區(qū)設(shè)計(jì)......165
5.2 安卓手機(jī)智能撥號(hào)界面設(shè)計(jì)................... 168
實(shí)例078 設(shè)計(jì)界面背景效果..................... 168
實(shí)例079 設(shè)計(jì)界面主體效果......................170
實(shí)例080 設(shè)計(jì)界面整體效果......................173
5.3 手機(jī)郵箱界面設(shè)計(jì)............................... 175
實(shí)例081 設(shè)計(jì)界面背景效果.......................175
實(shí)例082 設(shè)計(jì)界面主體效果......................176
實(shí)例083 設(shè)計(jì)界面整體效果..................... 178
5.4 安卓應(yīng)用程序界面設(shè)計(jì)......................... 180
實(shí)例084 設(shè)計(jì)界面背景效果..................... 180
實(shí)例085 設(shè)計(jì)界面主體效果...................... 181
實(shí)例086 設(shè)計(jì)界面整體效果..................... 184
5.5 蘋果手機(jī)磁盤檢測(cè)界面設(shè)計(jì)................... 185
實(shí)例087 設(shè)計(jì)界面背景效果..................... 185
實(shí)例088 設(shè)計(jì)界面主體效果..................... 186
實(shí)例089 設(shè)計(jì)界面整體效果..................... 188
5.6 蘋果手機(jī)天氣預(yù)報(bào)界面設(shè)計(jì)................... 189
實(shí)例090 設(shè)計(jì)界面背景效果..................... 189
實(shí)例091 設(shè)計(jì)界面主體效果....................... 191
實(shí)例092 設(shè)計(jì)界面整體效果......................195
第06章 手機(jī)商業(yè)性軟件類界面設(shè)計(jì)
6.1 軟件類熱門界面元素設(shè)計(jì)...................... 198
實(shí)例093 軟件按鈕設(shè)計(jì)........................... 198
實(shí)例094 軟件圖標(biāo)設(shè)計(jì)........................... 200
實(shí)例095 書架框設(shè)計(jì).............................. 203
6.2 手機(jī)微鋪界面元素設(shè)計(jì)......................... 204
實(shí)例096 設(shè)計(jì)界面背景效果.................... 204
實(shí)例097 設(shè)計(jì)界面主體效果.................... 206
實(shí)例098 設(shè)計(jì)界面整體效果.................... 208
6.3 手機(jī)淘淘界面設(shè)計(jì)............................... 209
實(shí)例099 設(shè)計(jì)界面背景效果.................... 209
實(shí)例100 設(shè)計(jì)界面主體效果..................... 209
實(shí)例101 設(shè)計(jì)界面整體效果...................... 211
6.4 美亭秀秀界面設(shè)計(jì).............................. 212
實(shí)例102 設(shè)計(jì)界面背景效果......................212
實(shí)例103 設(shè)計(jì)界面主體效果......................212
實(shí)例104 設(shè)計(jì)界面整體效果......................214
第07章 播放器熱門界面設(shè)計(jì)
7.1 手機(jī)播放器界面設(shè)計(jì)案例演練................. 219
實(shí)例105 功能按鈕設(shè)計(jì)............................219
實(shí)例106 播放進(jìn)度滑塊設(shè)計(jì)..................... 220
實(shí)例107 播放區(qū)的播放界面設(shè)計(jì).............. 223
7.2 手機(jī)視頻播放器界面設(shè)計(jì)...................... 226
實(shí)例108 設(shè)計(jì)界面背景效果..................... 226
實(shí)例109 設(shè)計(jì)界面主體效果..................... 227
實(shí)例110 設(shè)計(jì)界面整體效果..................... 230
7.3 手機(jī)APP音樂(lè)播放器界面設(shè)計(jì)................ 231
實(shí)例111 設(shè)計(jì)界面背景效果.......................231
實(shí)例112 設(shè)計(jì)界面主體效果..................... 233
實(shí)例113 設(shè)計(jì)界面整體效果..................... 235
第3篇 游戲界面篇
第08章 網(wǎng)頁(yè)熱門界面設(shè)計(jì)
8.1 網(wǎng)頁(yè)界面設(shè)計(jì)案例演練......................... 238
實(shí)例114 網(wǎng)頁(yè)導(dǎo)航欄設(shè)計(jì)........................ 238
實(shí)例115 網(wǎng)站導(dǎo)航按鈕設(shè)計(jì)..................... 239
實(shí)例116 借書網(wǎng)站按鈕設(shè)計(jì)......................241
實(shí)例117 網(wǎng)站Logo設(shè)計(jì).......................... 244
實(shí)例118 網(wǎng)站橫幅廣告設(shè)計(jì)..................... 245
實(shí)例119 網(wǎng)站搜索表單設(shè)計(jì)..................... 247
8.2 企業(yè)文化宣傳網(wǎng)頁(yè)界面設(shè)計(jì)................... 250
實(shí)例120 設(shè)計(jì)界面背景效果..................... 250
實(shí)例121 設(shè)計(jì)界面主體效果......................251
實(shí)例122 設(shè)計(jì)界面整體效果..................... 253
8.3 婚紗店網(wǎng)頁(yè)界面設(shè)計(jì)............................ 254
實(shí)例123 設(shè)計(jì)界面背景效果..................... 254
實(shí)例124 設(shè)計(jì)界面主體效果..................... 255
實(shí)例125 設(shè)計(jì)界面整體效果..................... 258
8.4 攝影作品展網(wǎng)頁(yè)界面設(shè)計(jì)...................... 259
實(shí)例126 設(shè)計(jì)界面背景效果..................... 259
實(shí)例127 設(shè)計(jì)界面主體效果..................... 260
實(shí)例128 設(shè)計(jì)界面整體效果..................... 264
8.5 美食信息聚合網(wǎng)頁(yè)界面設(shè)計(jì)................... 265
實(shí)例129 設(shè)計(jì)界面背景效果..................... 265
實(shí)例130 設(shè)計(jì)界面主體效果..................... 268
實(shí)例131 設(shè)計(jì)界面整體效果......................271
第09章 游戲界面效果設(shè)計(jì)
9.1 游戲界面設(shè)計(jì)案例演練......................... 277
實(shí)例132 登錄文本框設(shè)計(jì)........................ 277
實(shí)例133 信息提示框設(shè)計(jì)........................ 279
實(shí)例134 游戲主題設(shè)計(jì)............................281
9.2 臺(tái)球高手游戲界面設(shè)計(jì)......................... 284
實(shí)例135 設(shè)計(jì)界面背景效果..................... 284
實(shí)例136 設(shè)計(jì)界面主體效果..................... 287
實(shí)例137 設(shè)計(jì)界面整體效果..................... 290
9.3 大魚抓小魚游戲界面設(shè)計(jì)...................... 291
實(shí)例138 設(shè)計(jì)界面背景效果......................291
實(shí)例139 設(shè)計(jì)界面主體效果..................... 292
實(shí)例140 設(shè)計(jì)界面整體效果..................... 294
第10章 手機(jī)游戲熱門界面設(shè)計(jì)
10.1 手機(jī)游戲熱門元素設(shè)計(jì)........................ 297
實(shí)例141 操作鼠標(biāo)形狀設(shè)計(jì)..................... 297
實(shí)例142 文字修飾設(shè)計(jì)........................... 299
實(shí)例143 游戲按鈕樣式設(shè)計(jì)......................301
10.2 手機(jī)休閑游戲界面設(shè)計(jì)....................... 303
實(shí)例144 設(shè)計(jì)界面背景效果..................... 303
實(shí)例145 設(shè)計(jì)界面主體效果..................... 304
實(shí)例146 設(shè)計(jì)界面整體效果..................... 305
10.3 寶寶猜謎游戲界面設(shè)計(jì)....................... 307
實(shí)例147 設(shè)計(jì)界面背景效果..................... 307
實(shí)例148 設(shè)計(jì)界面主體效果..................... 308
實(shí)例149 設(shè)計(jì)界面整體效果......................310