第1章 UI设计基础知识 1
1.1 手机UI设计基础 2
1.1.1 手机的品牌 2
1.1.2 手机样式 2
1.1.3 手机的屏幕色彩 4
1.1.4 手机的功能分类 5
1.1.5 智能手机的屏幕分辨率 7
1.2 UI设计基础 8
1.2.1 什么是UI设计 9
1.2.2 手机UI设计的要点 9
1.2.3 手机UI与Web UI的区别 11
1.3 设计尺寸的单位 12
1.3.1 英寸 12
1.3.2 分辨率 13
1.3.3 屏幕密度 13
1.4 iOS系统概述 14
1.4.1 iOS系统的发展历史 14
1.4.2 iOS 7的设计主题 16
1.4.3 iOS 7与iOS 6的不同 16
1.5 Android系统概述 18
1.5.1 Android系统的发展历史 18
1.5.2 Android系统UI设计要点 20
1.5.3 Android启动图标的设计标准 22
1.6 Windows Phone系统概述 23
1.6.1 Windows Phone系统的发展历史 23
1.6.2 Windows Phone系统的特色 24
1.6.3 Windows Phone的控件 25
1.7 本章小结 26
第2章 iOS系统实例 27
2.1 iOS界面的设计原则 28
2.1.1 美 28
2.1.2 一致性 29
2.1.3 直接控制 29
2.1.4 反馈 29
2.1.5 暗喻 30
2.1.6 用户控制 30
2.2 iOS界面的设计规范 31
2.2.1 确保程序在iPad和iPhone上通用 31
2.2.2 重新考虑基于Web的设计 31
2.3 iOS界面基本图形——直线 32
实战1 制作iOS6语言设置界面 33
操作难点分析 39
对比分析 39
2.4 iOS界面基本图形——图形 40
2.4.1 矩形 40
2.4 2圆角矩形 40
2.4.3 圆 41
2.4.4 其他形状 41
实战2 制作iOS 7快捷设置界面 42
操作难点分析 48
对比分析 49
2.5 控件的绘制 49
2.5.1 搜索栏 49
2.5.2 细节展开按钮 50
实战3 制作iOS6地址搜索界面 50
操作难点分析 56
对比分析 56
2.5.3 滚动条 57
2.5.4 切换器 57
实战4 制作iOS 6亮度设置界面 58
操作难点分析 65
对比分析 65
2.6 iOS图标的绘制 66
2.6.1 程序图标 66
实战5 制作iOS6便签图标 67
操作难点分析 74
对比分析 74
2.6.2 小图标 75
2.6.3 文档图标 75
2.6.4 Web快捷方式图标 76
2.6.5 导航栏、工具栏和Tab栏上用的图标 76
2.7 设计中的图片 77
2.7.1 登录图片 77
2 7.2 为Retina屏幕设计 78
2.8 iOS 7的设计特点 80
2.8.1 新界面 80
实战6 制作iOS 7锁屏界面 80
操作难点分析 83
对比分析 84
实战7 制作iOS 7主界面 84
操作难点分析 89
对比分析 89
2.8.2 更新 90
2.9 iOS 6与iOS 7对比 92
2.9.1 依从用户的操作界面 92
2.9.2 扁平化代替拟物化 93
2.9.3 易读性强的动态字体 93
2.9.4 无边框按钮 93
2.9.5 半透明的导航元素 93
2.9.6 留白内容 93
2.9.7 层次感的表现 93
2.9.8 尽量不使用启动画面 93
实战8 制作iOS 6文本编辑界面 94
操作难点分析 101
对比分析 101
实战9 制作iOS 7文本编辑界面 102
操作难点分析 108
对比分析 108
综合实战10 制作时间设置界面 109
操作难点分析 120
对比分析 120
综合实战11 制作iPad文件浏览界面 121
操作难点分析 130
对比分析 131
综合实战12 制作游戏界面 131
操作难点分析 141
对比分析 141
2.1 0本章小结 142
第3章 Android系统实例 143
3.1 Android APP UI概览 144
3.2 UI设计原则 145
3.3 Android界面设计风格 148
3.3.1 设备与显示 148
3.3.2 主题样式 149
3.3.3 标准和网格 149
3.3.4 触摸与反馈 150
3.3.5 字体 151
3.3.6 颜色 152
3.3.7 图标 152
3.3.8 写作风格 154
3.4 Android APP的常用结构 155
实战1 制作操作栏 157
实战2 制作选择栏 159
实战3 制作通知 162
实战4 制作启动图标 164
操作难点分析 170
对比分析 170
实战5 制作主界面 171
操作难点分析 176
对比分析 176
3.5 控件设计 177
3.5.1 控件的分类 177
3.5 2控件的设计规范 179
实战6 制作网格列表 185
操作难点分析 188
对比分析 188
实战7 制作声音设置界面 189
操作难点分析 193
对比分析 193
实战8 制作音量调节对话框 194
操作难点分析 197
对比分析 197
实战9 制作信息编辑界面 198
操作难点分析 204
对比分析 204
实战10 制作添加联系人界面 205
操作难点分析 209
对比分析 209
3.6 特效的使用 210
实战11 制作锁屏界面 211
操作难点分析 214
对比分析 215
综合实战12 制作天气界面 215
操作难点分析 223
对比分析 223
综合实战13 制作游戏界面 223
操作难点分析 229
对比分析 229
3.7 本章小结 229
第4章 Windows Phone 系统实例 230
4.1 Windows Phone的设计原则 231
4.2 关于度量单位 232
4.3 关于游戏U I的设计 232
4 4用户界面框架 233
4.4.1 主界面 233
实战1 制作WP系统主界面 234
操作难点分析 240
对比分析 240
4.4.2 状态栏 240
4.4.3 应用程序栏 241
4.4.4 应用程序栏的图标 242
4.4.5 屏幕方向 242
4.4.6 字体 243
实战2 制作功能设置界面 244
操作难点分析 247
对比分析 247
4.5 推送通知 247
4.5.1 “瓦片式”通知 248
4.5.2 烤面包式通知 248
4.5.3 原生通知 249
4.6 界面框架设计 249
4.6.1 页面标题 249
4.6 2主题 250
4.6.3 进度指示器 250
实战3 制作视频播放界面 251
操作难点分析 254
对比分析 254
4.6.4 屏幕键盘 254
实战4 制作新建信息界面 255
操作难点分析 259
对比分析 259
4.7 应用程序界面控件 260
4.7.1 按键 260
实战5 制作应用商店界面 260
操作难点分析 264
对比分析 264
4.7.2 复选框 265
实战6 制作添加键盘界面 265
操作难点分析 268
对比分析 268
4.7.3 超链接 269
4.7.4 列表框 269
实战7 制作应用程序列表 270
操作难点分析 273
对比分析 273
4.7.5 全景视图 274
实战8 制作全景视图 275
操作难点分析 280
对比分析 280
4.7.6 密码框 281
4.7.7 进度条 281
4.7.8 单选按钮 281
实战9 制作同步设置界面 282
操作难点分析 284
对比分析 284
4.7.9 文本块 285
实战10 制作语音设置界面 285
操作难点分析 287
对比分析 288
4.7.1 0输入框 288
综合实战11 制作计算器界面 289
操作难点分析 297
对比分析 297
综合实战12 制作可爱游戏界面 297
操作难点分析 305
对比分析 305
4.8 本章小结 305
附录1 Photoshop CC新增功能 306
附录2 常见手机尺寸 308
附录3 图标的设计标准 308
附录4 字体设计规范 310