第1章 了解移动UI设计 10
1.1 认识移动UI设计 10
1.2 UI设计的流程 11
1.3 移动UI设计的原则 13
1.3.1 一致性原则 13
1.3.2 习惯性原则 14
1.3.3 清晰性原则 16
1.3.4 易用性原则 16
1.3.5 人性化原则 17
1.4 提升用户体验的UI设计技巧 18
1.4.1 简化操作流程 18
1.4.2 手势与动画的结合 19
1.4.3 选择适当的图像尺寸与格式 21
1.4.4 使用高对比度配色方案 21
1.4.5 使用易读的字体 22
1.5 移动UI设计常用的布局方式 23
1.5.1 列表式布局 23
1.5.2 陈列馆式布局 23
1.5.3 宫格式布局 24
1.5.4 选项卡式布局 24
1.5.5 旋转木马式布局 25
1.5.6 行为扩展式布局 26
1.5.7 多面板式布局 26
1.5.8 图表式布局 26
1.6 移动UI设计常用尺寸单位 27
第2章 iOS系统特点及设计规范 31
2.1 iOS系统的发展历程 31
2.2 iOS系统的UI特色 32
2.2.1 以内容为核心 33
2.2.2 保证清晰度 34
2.2.3 用深度来体现层次 36
2.3 iOS系统的基础UI组件 36
2.3.1 栏 37
2.3.2 内容视图 40
2.3.3 临时视图 43
2.4 了解主流的iOS设备 44
2.5 iOS系统的UI设计规范 46
2.5.1 文字 46
2.5.2 颜色 48
2.5.3 图标 51
2.5.4 边距和间距 56
第3章 Android系统特点及设计规范 58
3.1 Android系统的优势 58
3.2 Android系统UI设计的演变历程 60
3.2.1 锁屏 60
3.2.2 桌面 61
3.2.3 Android应用商店 61
3.2.4 通知面板 62
3.2.5 图库 63
3.2.6 音乐播放器 63
3.2.7 拨号界面 64
3.2.8 设置界面 64
3.3 Android系统UI的构成 65
3.3.1 主屏幕和任务列表 65
3.3.2 系统栏 66
3.3.3 通知面板 66
3.3.4 通用UI组件 66
3.4 Android系统的UI设计规范 67
3.4.1 度量单位和像素密度 67
3.4.2 UI尺寸 69
3.4.3 字体 70
3.4.4 颜色 71
3.4.5 图标 74
第4章 Photoshop常用功能 78
4.1 图形的绘制 78
4.1.1 基础图形的绘制 78
4.1.2 自定义形状的绘制 82
4.1.3 其他复杂图形的绘制 84
4.2 文本的应用 86
4.2.1 文本的添加 86
4.2.2 设置文本属性 87
4.2.3 编辑段落文本 88
4.3 图像的选择 88
4.3.1 规则图像的选择 89
4.3.2 不规则图像的选择 91
4.3.3 根据颜色选择图像 93
4.4 图像的合成 94
4.4.1 图层蒙版 94
4.4.2 矢量蒙版 96
4.4.3 剪贴蒙版 98
4.5 必备的样式效果 100
4.5.1 斜面和浮雕 100
4.5.2 投影和内阴影 101
4.5.3 渐变叠加 102
4.5.4 图案叠加 103
4.5.5 内发光和外发光 104
4.5.6 描边 106
第5章 移动UI常用基本元素设计 107
5.1 图标设计 107
5.1.1 轻拟物化图标设计 107
5.1.2 扁平化图标设计 110
5.1.3 线性图标设计 113
5.1.4 立体图标设计 116
5.2 常规按钮设计 119
5.2.1 多彩下载按钮设计 119
5.2.2 金属质感按钮设计 122
5.3 开关设计 124
5.3.1 单选按钮开关设计 124
5.3.2 复选框开关设计 127
5.3.3 ON/OFF开关设计 130
5.4 搜索栏设计 133
5.4.1 清新自然的搜索栏设计 133
5.4.2 木纹效果的搜索栏设计 136
5.5 Tab标签设计 139
5.5.1 线性风格的Tab标签设计 139
5.5.2 图文结合的Tab标签设计 141
5.6 进度条设计 144
5.6.1 线形进度条设计 144
5.6.2 圆形进度条设计 147
5.6.3 蓝色创意进度条设计 150
5.7 列表框设计 152
5.7.1 简洁列表框设计 153
5.7.2 立体化列表框设计 155
5.8 对话框设计 157
5.8.1 半透明的登录对话框设计 158
5.8.2 可爱的游戏对话框设计 160
第6章 扁平化风格的旅游App 166
6.1 分析用户需求 166
6.2 定义设计风格 166
6.3 颜色搭配技巧 167
6.4 案例操作详解 168
第7章 清新风格的电商App 182
7.1 分析用户需求 182
7.2 定义设计风格 182
7.3 颜色搭配技巧 183
7.4 案例操作详解 183
第8章 绚彩风格的美食App 198
8.1 分析用户需求 198
8.2 定义设计风格 198
8.3 颜色搭配技巧 199
8.4 案例操作详解 199
第9章 时尚风格的音乐App 216
9.1 分析用户需求 216
9.2 定义设计风格 216
9.3 颜色搭配技巧 217
9.4 案例操作详解 217
第10章 线性风格的智能家居App 233
10.1 分析用户需求 233
10.2 定义设计风格 233
10.3 颜色搭配技巧 234
10.4 案例操作详解 234
第11章 活泼可爱的早教App 248
11.1 分析用户需求 248
11.2 定义设计风格 248
11.3 颜色搭配技巧 249
11.4 案例操作详解 250