Part 1 移动UI设计基础 1
1.1 UI设计存在的意义 2
1.1.1人机交互的桥梁 2
1.1.2操作逻辑系统的展现 3
1.1.3展现系统的整体风格 3
1.2移动UI设计的原则 4
1.2.1视觉一致性原则 4
1.2.2视觉简易性原则 5
1.2.3从用户的习惯考虑 6
1.2.4操作的灵活性及人性化 8
1.3两大主流操作系统的特点对比 9
1.4不同系统UI视觉的主要组成要素及特征 10
1.4.1 iOS系统中的组成要素及特征 10
1.4.2 Android系统中的组成要素及特征 11
1.5认识移动终端的分辨率和像素 13
1.6移动UI的创意与灵感收集 14
1.6.1各种经验和灵感的记录 14
1.6.2将对象抽象化 15
1.6.3设计灵感的转移 16
1.7移动UI的视觉设计流程 18
Part 2 PS在移动UI设计中的常用功能简介 21
2.1绘图工具的介绍 22
2.1.1规则形状的绘制 22
2.1.2自定义形状的绘制 23
2.1.3绘制任意所需的形状 25
2.2图层样式的运用 26
2.2.1增强立体感的图层样式 26
2.2.2发光效果的图层样式 28
2.2.3更改色彩的图层样式 29
2.3蒙版的编辑 31
2.3.1图层蒙版 31
2.3.2剪贴蒙版 32
2.4文字的添加 34
2.4.1文字的添加与设置 34
2.4.2文字的高级编辑 35
Part 3 移动UI界面中基本元素的制作 37
3.1按钮 38
3.1.1按钮设计的基础知识 38
3.1.2扁平化按钮的设计 39
3.2开关 42
3.2.1开关设计的基础知识 42
3.2.2简易色块开关的设计 44
3.2.3拟物化开关的设计 45
3.3进度条 47
3.3.1进度条设计的基础知识 47
3.3.2扁平化进度条的设计 49
3.3.3层次感强烈的进度条设计 50
3.4搜索栏 54
3.4.1搜索栏设计的基础知识 54
3.4.2扁平化搜索栏的设计 56
3.5列表框 61
3.5.1列表框设计的基础知识 61
3.5.2简易列表框的设计 62
3.5.3立体化列表框的设计 64
3.6标签栏 68
3.6.1标签栏设计的基础知识 68
3.6.2线性化标签栏设计 69
3.6.3木纹质感的标签栏设计 70
3.7图标栏 73
3.7.1图标栏设计的基础知识 73
3.7.2线性化图标栏设计 74
3.7.3纸箱纹理的图标栏设计 77
Part 4 iOS系统及其组件的设计 81
4.1 iOS系统设计特点 82
4.1.1充分利用整个屏幕 82
4.1.2使用半透明底板 82
4.1.3信息的清晰呈现 83
4.2 iOS系统设计的规范 85
4.2.1设计原则 85
4.2.2色彩和字体 88
4.2.3图标的设计 92
4.3 iOS系统界面设计实训 96
4.3.1扁平化图标的设计 96
4.3.2半透明效果的界面设计 104
Part 5 Android系统及其组件的设计 111
5.1 Android系统的特点 112
5.2 Android系统的设计规范 114
5.2.1度量单位 114
5.2.2字体的使用标准 116
5.2.3色彩的应用规范 117
5.2.4四种类型的图标 120
5.3六种标准的Widget规范 122
5.3.1 Widget框架简介 122
5.3.2 Widget框架的标准尺寸 124
5.3.3 4×1的Widget框架设计 125
5.3.4 3×3的Widget框架设计 129
5.3.5 2×2的Widget框架设计 133
5.3.6 4×1的加长Widget框架设计 136
5.3.7 3×3的横向Widget框架设计 140
5.3.8 2×2的横向Widget框架设计 145
5.4 Android系统界面设计实训 150
5.4.1立体化的图标设计 150
5.4.2超强立体感的界面设计 159
Part 6 孕妈帮手App设计 171
界面布局规划 172
创意思路剖析 172
确定配色方案 173
定义组件风格 174
制作步骤详解 174
Part 7 美食网站App设计 185
界面布局规划 186
创意思路剖析 186
确定配色方案 187
定义组件风格 188
制作步骤详解 188
Part 8 篮球运动App设计 201
界面布局规划 202
创意思路剖析 202
确定配色方案 203
定义组件风格 203
制作步骤详解 204
Part 9 流量银行App设计 217
界面布局规划 218
创意思路剖析 218
确定配色方案 219
定义组件风格 219
制作步骤详解 220
Part 10 藏宝游戏App设计 231
界面布局规划 232
创意思路剖析 232
确定配色方案 233
定义组件风格 234
制作步骤详解 234
Part 11 音乐播放App设计 247
界面布局规划 248
创意思路剖析 248
确定配色方案 249
定义组件风格 250
制作步骤详解 250
Part 12 旅游资讯App设计 267
界面布局规划 268
创意思路剖析 268
确定配色方案 269
定义组件风格 270
制作步骤详解 270