第1章 初入移动UI设计的世界 15
1.1认识移动UI设计 16
1.1.1什么是移动UI设计 16
1.1.2移动UI设计的目的和重要性 17
1.1.3平面设计和移动UI的不同 18
1.1.4移动UI设计的重要元素 19
1.2移动UI设计的原则 20
1.2.1功能决定界面设计风格 20
1.2.2界面设计要统一 20
1.2.3界面设计要清晰 21
1.2.4界面设计内容要实用 22
1.2.5界面设计要有层次感 22
1.3移动设备的主流平台 23
1.3.1 iOS系统平台 23
1.3.2 Android系统平台 27
1.3.3其他系统平台 28
第2章 设计优秀移动UI的条件 29
2.1移动UI设计常用软件 30
2.1.1Photoshop 30
2.1.2Illustrator 31
2.1.3 3ds Max 32
2.2移动UI设计常用图像格式 33
2.2.1 JPEG格式 33
2.2.2 PNG格式 33
2.2.3 GIF格式 34
2.2.4有损压缩与无损压缩 34
2.3移动设备的尺寸标准 35
2.3.1英寸 35
2.3.2分辨率 35
2.3.3屏幕密度 36
2.3.4图标尺寸大小 36
2.4移动UI的设计布局和分类 38
2.4.1界面设计的布局 38
2.4.2界面设计的分类 39
2.5移动UI的色彩搭配 42
2.5.1色彩的心理效应 42
2.5.2色彩的搭配原则 42
2.6如何制作出优秀的移动UI 44
2.6.1设计的UI与常规思维保持一致 44
2.6.2用户能自由操作界面 44
2.6.3对用户群的了解 45
2.6.4设计要做到简约 46
2.6.5 UI的文本清晰 47
2.7移动UI设计的流程 48
2.7.1设计前的交流讨论 48
2.7.2草图设计 48
2.7.3用软件绘制界面 49
2.8如何提升自己的设计能力 50
2.8.1保证绘制图形的形状 50
2.8.2美术基础 50
2.8.3对色彩的敏感度 50
2.8.4视觉体验 51
2.8.5精细的细节 52
第3章 移动UI的基本绘制 53
3.1基础图形的绘制 54
3.1.1选框工具 54
3.1.2形状工具 55
实战：使用矩形工具绘制移动地图图标 55
实战：使用圆角矩形工具绘制计算器图标 57
实战：使用椭圆工具绘制音乐图标 58
实战：使用多种工具绘制移动UI图标 59
3.1.3钢笔工具 60
实战：使用钢笔工具绘制天气图标 60
3.2必知的三大功能 62
3.2.1文字工具 62
3.2.2渐变工具 62
3.2.3蒙版 63
3.3必备的样式效果 64
3.3.1斜面与浮雕 64
3.3.2描边 65
3.3.3内阴影 65
3.3.4渐变叠加 65
3.3.5图案叠加 66
3.3.6外发光 66
3.3.7投影 66
3.4添加画面质感 67
3.4.1模糊 67
3.4.2杂色 67
实战：制作翻页日历图标 68
第4章 移动UI的控件制作 77
4.1常见控件的制作 78
4.1.1图标 78
实战：制作图标 79
4.1.2状态栏 80
实战：制作状态栏 80
4.1.3导航栏 82
实战：制作导航栏 83
4.1.4工具栏 84
实战：制作工具栏 84
4.1.5标签栏 85
实战：制作标签栏 86
4.1.6搜索栏 87
实战：制作搜索栏 87
4.1.7选择栏 88
实战：制作选择栏 88
4.1.8滚动条 90
实战：制作滚动条 91
4.1.9切换器 92
实战：制作切换器 93
4.2控件构成界面的制作 96
4.2.1 Assistive touch按钮 96
实战：制作Assistive touch按钮 96
4.2.2 3DTouch 99
实战：制作3DTouch 99
4.2.3 iOS 9上拉菜单 101
实战：制作iOS 9上拉菜单 101
第5章 不同平台的控件设计 103
5.1 iOS系统的发展及标准 104
5.1.1 iOS系统的发展 104
5.1.2 iOS的控件构成和尺寸 106
5.2 iOS系统的控件特点 108
5.2.1界面美观 108
5.2.2一致性 108
5.2.3控制 108
5.2.4反馈 108
5.2.5设计元素 109
5.3 iOS控件界面设计 110
实战：制作通知界面 110
实战：制作iOS 10上拉界面 114
实战：制作音乐上拉界面 118
5.4 Android系统的界面元素 122
5.5 Android系统的控件特点 122
5.5.1设计原则 122
5.5.2风格 122
5.5.3 Android的控件构成和尺寸 124
5.6 Android控件界面设计 125
实战：制作闹钟设置界面 125
实战：制作社交界面 130
实战：制作设置界面 134
第6章 不同风格的UI设计 141
6.1 小清新风格手机界面 142
6.2时尚风格手机界面 147
6.3可爱风格手机界面 154
6.4手绘风格手机界面 156
6.5卡通风格手机界面 162
6.6方格风格手机界面 167
6.7扁平化风格手机界面 171
6.8线性风格手机界面 181
第7章 iOS界面设计 197
7.1扁平化风格界面 198
7.1.1iOS应用主界面 198
7.1.2 iOS应用评论界面 202
7.1.3 iOS侧边选项栏 204
7.2冷色系风格界面 206
7.2.1 iOS音乐界面 206
7.2.2 iOS日历界面 211
第8章 Android界面设计 219
8.1线稿风格界面 220
8.1.1 Android主界面 220
8.1.2 Android拨号界面 224
8.2创意风格界面 228
8.2.1 Android锁屏界面 228
8.2.2 Android菜单界面 235