"曹茂鹏，亿瑞设计艺术总监，设计学硕士（三维设计方向），高校艺术设计专业教师。
多年来深耕于艺术设计、教育培训、项目开发等行业，出版图书多本，如中国高等教育“十二五”规划教材、高等院校艺术类专业教材、Adobe认证考试教材、社会培训示范教材等，多本图书长期位居“全国计算机零售图书排行榜”分类排行前列。"

章 关于UI设计你需要了解的一些知识 1
1.1 什么是APP UI .2
1.2 关于UI 设计师 2
1.2.1 用户研究/测试工程师 .2
1.2.2 图形设计师 2
1.2.3 交互设计师 3
高手小贴士：UI设计师的自我修养 3
1.3 UI 与UE .3
1.4 UI 的分类 .4
1.4.1 手机UI设计 4
1.4.2 网页UI设计 5
1.4.3 软件UI 设计 . 5
1.5 PC 客户端和移动客户端 .5
1.6 手机APP 界面组成 .6
1.6.1 状态栏 6
1.6.2 导航栏 6
1.6.3 标签栏 7
1.6.4 搜索栏 7
1.6.5 工具栏 7
1.6.6 表格视图 7
1.6.7 活动视图 7
1.6.8 动作 7
1.6.9 警告提醒 8
1.6.10 编辑菜单 8
1.6.11 浮动框 8
1.7 iOS 系统和安卓系统 .8
1.7.1 iOS系统 9
1.7.2 安卓系统 9
1.8 UI 设计师常用的工具 .10
1.9 APP UI 设计流程 . 11
第2章 UI色彩与布局. 13
2.1 UI 与色彩 .14
2.1.1 色相、明度、纯度 14
2.1.2 UI设计的色彩搭配 15
2.1.3 邻近色、对比色 17
2.2 UI 信息布局方式 .18
2.3 流行的UI 设计风格 .22
2.3.1 拟物化 22
2.3.2 扁平化 23
2.3.3 微质感 23
2.3.4 渐变色 24
2.3.5 叠加水波纹 24
2.3.6 幽灵按钮 24
2.3.7 抽屉式菜单 25
2.3.8 模糊背景图片 25
2.3.9 无边框界面 26
2.3.10 彩色图标 26
第3章 UI图形处理基础. 27
3.1 认识Photoshop .28
选项解读：Photoshop界面构成详解 .28
高手小贴士：如何让窗口变为默认状态 29
3.2 文件的基本操作.29
3.2.1 新建文件 29
选项解读：“新建文档”对话框设置选项 30
3.2.2 打开图像文件 30
高手小贴士：Photoshop常用的格式 .31
高手小贴士：找不到想要打开的文件怎么办？ 31
3.2.3 置入对象 32
3.2.4 储存文件 33
高手小贴士：存储格式的选择 34
3.2.5 使用“导出为”命令 34
选项解读：“导出为”对话框详解 34
3.2.6 关闭文件 35
3.3 便捷的图像查看工具.35
3.3.1 缩放工具 35
选项解读：“缩放工具”选项栏 36
3.3.2 抓手工具 36
高手小贴士：快速切换到“抓手工具” 37
3.4 错误操作的处理.37
3.4.1 撤销与还原 37
高手小贴士：增加可返回的步骤数目 37
3.4.2 使用“历史记录”面板还原操作 37
3.5 使用图层模式进行编辑.38
选项解读：“图层”面板选项详解 38
3.5.1 选择图层 39
3.5.2 新建图层 39
高手小贴士：在选中图层下方新建图层 39
3.5.3 删除图层 39
3.5.4 复制图层 40
3.5.5 调整图层的堆叠顺序 40
3.5.6 图层的合并 40
3.5.7 栅格化图层 41
3.6 图层的移动、对齐与分布.41
3.6.1 移动图层 41
高手小贴士：移动并复制的方法 42
高手小贴士：移动选区中像素的方法 42
3.6.2 对齐图层 42
高手小贴士：对齐图层的方法 43
3.6.3 分布图层 43
高手小贴士：分布图层的方法 44
案例实战—使用对齐与分布调整网页UI版式 44
3.7 图像处理的基础操作.45
3.7.1 调整图像尺寸 45
3.7.2 修改画布大小 46
选项解读：“画布大小”对话框详解 46
3.7.3 裁剪工具 46
选项解读：“裁剪工具”选项栏 47
3.7.4 旋转画布 47
3.7.5 变换图像 48
案例实战—使用自由变换制作界面展示效果 50
3.7.6 内容识别缩放 52
选项解读：“内容识别缩放”选项栏 52
3.8 辅助工具.52
3.8.1 标尺与辅助线 53
3.8.2 网格 . 54
3.9 打印设置.54
3.9.1 设置打印选项 54
3.9.2 使用“打印一份” 54
第4章 选区基础. 55
4.1 认识选区.56
4.2 轻松制作简单选区.57
选项解读：选框工具组的工具选项栏 57
4.2.1 矩形选框工具 58
高手小贴士：取消选区的选择 58
4.2.2 椭圆选框工具 59
4.2.3 单行/单列选框工具 .59
4.2.4 套索工具 59
4.2.5 多边形套索工具 60
高手小贴士：“多边形套索工具”的使用技巧 60
案例实战—利用多边形套索工具选择图片 60
4.3 选区的基本操作.62
4.3.1 移动选区位置 62
4.3.2 移动选区中的内容 63
4.3.3 删除选区中的内容 63
高手小贴士：删除背景图层选区中的像素会出现的
情况 64
4.3.4 复制/粘贴/剪切选区中的内容 64
高手小贴士：剪切背景图层选区中的像素会出现的
情况 64
4.3.5 快速得到反向选区 65
4.3.6 取消选区 65
4.3.7 重新选择 65
4.3.8 全选 65
4.3.9 隐藏选区、显示选区 66
4.3.10 载入当前图层的选区 66
案例实战—使用选区工具制作简单界面 66
4.4 编辑选区的形态.69
4.4.1 变换选区形态 69
高手小贴士：缩放选区的技巧 69
4.4.2 创建边界选区 69
4.4.3 平滑选区 70
4.4.4 扩展选区 70
4.4.5 收缩选区 71
4.4.6 羽化选区 71
高手小贴士：羽化半径数值过大弹出的对话框 71
第5章 UI图形设计 72
5.1 颜色的设置.73
5.1.1 设置前景色与背景色 73
5.1.2 使用“吸管工具”选取颜色 73
高手小贴士：“吸管工具”使用技巧 74
5.1.3 使用“颜色”面板 74
5.1.4 认识“色板”面板 74
5.2 填色与描边.75
5.2.1 快速填充前景色/背景色 .75
5.2.2 油漆桶工具 75
5.2.3 填充渐变 77
5.2.4 使用填充命令 79
选项解读：“填充”对话框详解 79
5.2.5 描边选区 79
选项解读：“描边”对话框详解 80
案例实战—制作活泼的圆形标志 80
案例实战—使用填充与描边功能制作优惠券 81
案例实战—图文结合的多彩标志设计 84
思维点拨 84
5.3 绘制常见矢量几何图形.85
5.3.1 了解绘图模式 86
5.3.2 设置填充 86
5.3.3 设置描边 87
5.3.4 使用形状工具绘制基本图形 89
选项解读：“矩形工具”选项栏 89
高手小贴士：在“创建圆角矩形”对话框中设置圆角矩形
的参数 90
选项解读：“多边形工具”选项栏参数详解 91
选项解读：“直线工具”参数详解 92
案例实战—使用椭圆工具制作简约计时器 92
5.3.5 创建自定形状 95
5.3.6 设置“路径操作”制作复杂路径 95
案例实战—使用形状工具制作水晶花朵 96
案例实战—使用自定形状工具制作心形按钮 98
5.4 不错绘图工具—钢笔.100
5.4.1 使用“钢笔工具”绘制路径 101
高手小贴士：使用“钢笔工具”的小技巧 101
5.4.2 使用“钢笔工具”绘制带有填色的图形 103
5.4.3 使用“钢笔工具”绘制彩色边框 104
案例实战—使用钢笔绘制复杂的人像选区 104
案例实战—使用钢笔工具制作质感按钮 . 107
案例实战—使用钢笔工具制作应用界面 110
高手小贴士：使用“钢笔工具”绘制形状的小技巧 111
5.4.4 使用“自由钢笔工具” 115
案例实战—使用磁性钢笔工具提取人像 115
5.4.5 使用“弯度钢笔工具” 116
5.4.6 编辑路径形状 117
高手小贴士：删除路径 117
高手小贴士：“路径选择工具”和“直接选择工具”
相互切换 118
高手小贴士：在“钢笔工具”的状态下添加或删除
锚点 118
高手小贴士：路径的自由变换 119
案例实战—购物APP商品信息页面 . 119
案例实战—使用矢量工具制作水晶质感梨 123
5.5 填充与描边路径.126
5.5.1 填充路径 126
5.5.2 使用不同工具对路径描边 127
高手小贴士：“模拟压力”选项的用处 128
5.6 综合实战—手机音乐播放器UI 设计 128
5.6.1 项目分析 128
5.6.2 布局规划 129
5.6.3 色彩搭配 129
5.6.4 实践操作 129
第6章 不透明度与混合模式. 133
6.1 调整图层的不透明度和填充.134
6.2 认识图层“混合模式”.134
高手小贴士：混合模式的应用范围 135
案例实战—使用混合模式制作梦幻色调 139
6.3 综合实战—冷色调音乐APP 播放页面 .140
6.3.1 项目分析 140
6.3.2 布局规划 141
6.3.3 色彩搭配 141
6.3.4 实践操作 141
第7章 画笔与绘图 149
7.1 绘画工具.150
7.1.1 画笔工具 150
选项解读：“画笔工具”选项栏 150
高手小贴士：使用“画笔工具”的小技巧 150
7.1.2 铅笔工具 150
7.1.3 颜色替换工具 151
选项解读：“颜色替换工具”选项栏 151
7.1.4 混合器画笔工具 152
选项解读：“混合器画笔工具”选项栏 152
7.2 “画笔设置”面板.152
7.2.1 笔尖形状设置 153
选项解读：“画笔笔尖形状”选项面板 153
7.2.2 形状动态 154
选项解读：“形状动态”选项面板 154
7.2.3 散布 155
选项解读：“散布”选项面板 155
7.2.4 纹理 155
选项解读：“纹理”选项面板 156
7.2.5 双重画笔 156
7.2.6 颜色动态 157
选项解读：“颜色动态”选项面板 157
7.2.7 传递 158
选项解读：“传递”选项面板 158
7.2.8 画笔笔势 158
选项解读：“画笔笔势”选项面板 159
7.2.9 其他选项 159
选项解读：“杂色”“湿边”“建立”“平滑”“保护
纹理”选项详解 . 159
7.3 擦除工具.160
7.3.1 橡皮擦工具 160
选项解读：“橡皮擦工具”选项栏 160
案例实战—制作斑驳的涂鸦效果 160
高手小贴士：使用“旧版画笔”的小技巧 161
7.3.2 背景橡皮擦工具 162
选项解读：“背景橡皮擦工具”选项栏 162
案例实战—使用背景橡皮擦快速擦除背景 163
7.3.3 魔术橡皮擦工具 164
高手小贴士：“连续”选项的作用 164
7.4 图案图章工具.164
7.5 综合实战—使用画笔工具制作绚丽计时器.165
7.5.1 项目分析 165
7.5.2 布局规划 165
7.5.3 色彩搭配 165
7.5.4 实践操作 166
高手小贴士：暗角涂抹位置 169
第8章 UI文字设计 171
8.1 创建不同类型的文字.172
8.1.1 文字工具选项详解 172
选项解读：文字工具选项栏 172
8.1.2 创建点文字 174
案例实战—使用横排文字工具制作启动页面 175
8.1.3 创建直排文字 177
8.1.4 创建段落文字 177
高手小贴士：文本溢出 177
8.1.5 创建路径文字 178
高手小贴士：调整路径文字的起点和终点位置 178
8.1.6 创建区域文字 178
案例实战—使用段落文字和点文字制作正文页面. 179
8.2 文字蒙版工具.181
8.3 设置文字参数.181
8.3.1 使用“字符”面板 181
选项解读：“字符”面板详解 182
8.3.2 使用“段落”面板 184
选项解读：“段落”面板详解 184
高手小贴士：“直排文字工具”的对齐方式 185
案例实战—制作逼真粉笔字 186
8.4 编辑文字.187
8.4.1 对文字进行变形 187
选项解读：“变形文字”对话框详解 187
高手小贴士：为什么“变形文字”不可用？ 188
8.4.2 将文字栅格化为普通图层 188
案例实战—栅格化文字制作切开的文字 188
8.4.3 将文字转换为“形状” 191
提示：创建文字路径 191
8.4.4 使用其他字体 191
8.5 综合实战—使用横排文字工具制作引导页.192
8.5.1 项目分析 192
8.5.2 布局规划 192
8.5.3 色彩搭配 192
8.5.4 实践操作 193
第9章 图层样式. 199
9.1 图层样式详解.200
9.1.1 添加图层样式 200
高手小贴士：显示所有效果 201
9.1.2 使用“斜面和浮雕”样式 202
选项解读：设置斜面和浮雕 202
选项解读：设置等高线 203
选项解读：设置纹理 204
9.1.3 使用“描边”样式 204
9.1.4 使用“内阴影”样式 205
选项解读：“内阴影”样式参数 205
案例实战—使用图层样式制作立体感按钮 206
9.1.5 使用“内发光”样式 208
高手小贴士：“外发光”样式：“源”和“阻塞”选项 208
9.1.6 使用“光泽”样式 208
9.1.7 使用“颜色叠加”样式 209
9.1.8 使用“渐变叠加”样式 209
案例实战—利用“渐变叠加”样式制作按钮 210
9.1.9 使用“图案叠加”样式 212
9.1.10 使用“外发光”样式 212
选项解读：“外发光”样式参数 213
9.1.11 使用“投影”样式 213
高手小贴士：了解投影效果 214
选项解读：“投影”样式参数 214
案例实战—使用图层样式制作质感启动界面 215
案例实战—剪贴画风格招贴文字 217
案例实战—立体效果卡通字 219
高手小贴士：如何拷贝、粘贴图层样式？ 221
案例实战—添加图层样式制作钻石效果 221
案例实战—迷你播放器小组件 223
案例实战—趣味卡通风格焦点图设计 229
9.2 管理图层样式.232
9.2.1 显示与隐藏图层样式 232
9.2.2 拷贝与粘贴图层样式 232
9.2.3 缩放图层样式 232
9.2.4 清除图层样式 233
高手小贴士：栅格化图层样式 233
案例实战—使用多个图层样式制作标志 233
高手小贴士：矢量工具选项栏 238
案例实战—使用图层样式制作视频播放器 238
9.3 使用“样式”面板.248
9.3.1 使用“样式”面板快速为图层赋予样式 248
9.3.2 将图层样式储存在“样式”面板中 248
9.3.3 存储为样式库文件 249
9.3.4 载入样式库文件 249
案例实战—质感水晶文字 249
案例实战—用斜面与浮雕样式制作可爱按钮 251
案例实战—卡通播放器 253
9.4 综合实战—自然清爽的登录界面.257
9.4.1 项目分析 257
9.4.2 布局规划 258
9.4.3 色彩搭配 258
9.4.4 实践操作 258
0章 图像修饰. 262
10.1 去除画面中的瑕疵.263
10.1.1 污点修复画笔工具 263
选项解读：“污点修复画笔工具”选项栏 263
10.1.2 修复画笔工具 263
选项解读：“修复画笔工具”选项栏 264
10.1.3 修补工具 264
10.1.4 内容感知移动工具 265
10.1.5 红眼工具 265
10.1.6 仿制图章工具 266
10.1.7 内容识别填充 266
高手小贴士：针对背景图层进行填充 266
10.2 修饰图像的局部.267
10.2.1 模糊工具 267
10.2.2 锐化工具 267
10.2.3 涂抹工具 268
10.2.4 减淡工具 268
10.2.5 加深工具 269
案例实战—使用加深减淡工具增强标志立体感 269
10.2.6 海绵工具 270
高手小贴士：在“灰度”色彩模式下使用“海绵
工具” 270
10.2.7 颜色替换工具 270
选项解读：“颜色替换工具”选项栏 271
案例实战—使用颜色替换画笔改变环境颜色 271
1章 调色 273
11.1 调色命令的使用方法 .274
高手小贴士：调整图层的图层蒙版 275
11.2 亮度/ 对比度 275
11.3 色阶 .276
11.4 曲线 .277
案例实战—使用曲线快速打造反转片效果 279
案例实战—曲线与混合模式打造浪漫红树林 280
11.5 曝光度 .281
11.6 自然饱和度 .282
选项解读：“自然饱和度”对话框详解 283
11.7 色相/ 饱和度 284
案例实战—用色相/饱和度打造秋季变夏季 .285
11.8 色彩平衡 .286
选项解读：“色彩平衡”对话框详解 287
11.9 黑白 .288
高手小贴士：“预设”选项 289
案例实战—使用调色命令制作暗调音乐播放器 289
11.10 照片滤镜 .294
11.11 通道混合器 .295
选项解读：“通道混合器”对话框详解 296
11.12 颜色查找 .296
11.13 反相 .297
11.14 色调分离 .297
11.15 阈值 .298
11.16 渐变映射 .298
11.17 可选颜色 .299
高手小贴士：“方法”选项 300
案例实战—沉郁的青灰色调 300
案例实战—打造电影感复古色调 302
案例实战—天空的乐律 304
11.18 阴影/ 高光 306
高手小贴士：“调整”选项组 307
11.19 HDR 色调 .307
高手小贴士：在多个图层的情况下执行“HDR色调”
命令 309
11.20 去色 .309
11.21 匹配颜色 .309
选项解读：“匹配颜色”对话框详解 310
11.22 替换颜色 . 311
11.23 色调均化 .312
11.24 综合实战—平板电脑生活类APP 首页设计 .313
11.24.1 项目分析 313
11.24.2 布局规划 313
11.24.3 色彩搭配 314
11.24.4 实践操作 314
2章 使用滤镜制作特殊效果 321
12.1 初识滤镜.322
12.2 特殊滤镜.323
12.2.1 滤镜库 323
12.2.2 自适应广角 324
选项解读：“自适应广角”工具选项 324
12.2.3 Camera Raw的基本操作 . 324
选项解读：Camera Raw的操作界面 . 325
选项解读：Camera Raw的工具栏 . 325
12.2.4 镜头校正 325
选项解读：“镜头矫正”工具选项 326
选项解读：“镜头矫正”自定选项 326
12.2.5 液化 327
选项解读：“液化”滤镜窗口中的工具 328
选项解读：“液化”窗口右侧的工具选项 330
12.2.6 消失点 331
选项解读：“消失点”滤镜工具 331
12.3 风格化滤镜组.332
12.3.1 查找边缘 332
12.3.2 等高线 332
选项解读：“等高线”对话框详解 333
12.3.3 风 333
选项解读：“风”对话框详解 333
12.3.4 浮雕效果 333
选项解读：“浮雕效果”对话框详解 334
12.3.5 扩散 334
选项解读：“扩散”对话框详解 334
12.3.6 拼贴 334
选项解读：“拼贴”对话框详解 334
12.3.7 曝光过度 335
12.3.8 凸出 335
选项解读：“凸出”对话框详解 335
12.3.9 油画 336
选项解读：“油画”对话框详解 336
12.4 模糊滤镜组.336
12.4.1 表面模糊 336
选项解读：“表面模糊”对话框详解 337
12.4.2 动感模糊 337
选项解读：“动感模糊”对话框详解 337
12.4.3 方框模糊 337
12.4.4 高斯模糊 338
案例实战—更换手机屏幕内容 338
12.4.5 进一步模糊 340
12.4.6 径向模糊 341
选项解读：“径向模糊”对话框详解 341
12.4.7 镜头模糊 341
选项解读：“镜头模糊”对话框详解 342
12.4.8 模糊 342
12.4.9 平均 343
12.4.10 特殊模糊 343
选项解读：“特殊模糊”对话框详解 343
12.4.11 形状模糊 344
选项解读：“形状模糊”对话框详解 344
12.5 模糊画廊滤镜组.344
12.5.1 场景模糊 344
选项解读：“场景模糊”选项详解 345
12.5.2 光圈模糊 345
12.5.3 移轴模糊 346
选项解读：“移轴模糊”选项详解 347
12.5.4 路径模糊 347
12.5.5 旋转模糊 348
12.6 扭曲滤镜组.349
12.6.1 波浪 349
选项解读：“波浪”对话框详解 349
12.6.2 波纹 349
12.6.3 极坐标 350
12.6.4 挤压 350
12.6.5 切变 351
选项解读：“切变”对话框详解 351
12.6.6 球面化 352
选项解读：“球面化”对话框详解 352
12.6.7 水波 352
选项解读：“水波”对话框详解 353
12.6.8 旋转扭曲 353
选项解读：“旋转扭曲”对话框详解 353
12.6.9 置换 354
选项解读：“置换”对话框详解 354
12.7 锐化滤镜组.354
12.7.1 USM锐化 354
选项解读：“USM锐化”对话框详解 355
12.7.2 防抖 355
选项解读：“防抖”对话框详解 355
12.7.3 进一步锐化 355
12.7.4 锐化 356
12.7.5 锐化边缘 356
12.7.6 智能锐化 356
选项解读：“智能锐化”对话框详解 356
12.8 像素化滤镜组.357
12.8.1 彩块化 357
12.8.2 彩色半调 358
选项解读：“彩色半调”对话框详解 358
12.8.3 点状化 358
12.8.4 晶格化 358
12.8.5 马赛克 359
12.8.6 碎片 359
12.8.7 铜版雕刻 359
选项解读：“铜版雕刻”对话框详解 359
12.9 渲染滤镜组.360
12.9.1 火焰 360
选项解读：“火焰”对话框基本选项 360
选项解读：“火焰”对话框不错选项 360
12.9.2 图片框 361
12.9.3 树 361
12.9.4 分层云彩 361
12.9.5 光照效果 362
选项解读：“预设”选项 362
选项解读：聚光灯、点光和无限光 363
选项解读：“属性”面板 363
12.9.6 镜头光晕 364
选项解读：“镜头光晕”对话框详解 365
12.9.7 纤维 366
选项解读：“纤维”对话框详解 366
12.9.8 云彩 366
12.10 杂色滤镜组.366
12.10.1 减少杂色 366
选项解读：“减少杂色”基本选项 367
选项解读：“减少杂色”不错选项 367
12.10.2 蒙尘与划痕 367
选项解读：“蒙尘与划痕”对话框详解 367
12.10.3 去斑 368
12.10.4 添加杂色 368
选项解读：“添加杂色”对话框详解 368
案例实战—打造胶片相机效果 368
12.10.5 中间值 371
12.11 其它滤镜组 .371
12.11.1 HSB/HSL 371
12.11.2 高反差保留 371
12.11.3 位移 372
选项解读：“位移”对话框详解 372
12.11.4 自定 372
12.11.5 优选值 372
选项解读：“优选值”对话框详解 373
12.11.6 最小值 373
12.12 综合实战—旅行产品详情展示页面.373
12.12.1 项目分析 373
12.12.2 布局规划 374
12.12.3 色彩搭配 374
12.12.4 实践操作 374
......

本书主要介绍了使用Photoshop 进行UI 设计的快速入门与提高的方法和技巧，其内容包括 UI 设计基础知识、UI 色彩与布局、UI 图形处理基础、选区基础、UI 图形设计、不透明度与混合模式、画笔与绘图、UI 文字设计、图层样式、图像修饰、调色、使用滤镜制作特殊效果、抠图与合成、UI 动态效果设计等。很后两章通过具体的案例，介绍 Photoshop 在 APP 图标设计、APP 界面设计等方面的应用，带领读者为以后的实际工作提前“练兵”。
本书适用于 Photoshop 初学者，同时可作为 UI 设计相关人员自学 Photoshop 的参考书，也可作为计算机培训学校的教学用书。