目 录
第 1 章 做好准备了吗——了解移动平台和移动应用1
1.1 成为用户体验设计师1
1.1.1 UI、ID、UE和GUI,这些都是什么2
1.1.2 了解成功的用户体验设计案例3
1.2 移动设备的三大主流平台7
1.2.1 iOS 平台7
1.2.2 Android 平台10
1.2.3 Windows Phone 平台12
1.3 用户体验设计的基本流程13
1.3.1 创意和原型草图阶段14
1.3.2 原型的中保真阶段 16
1.3.3 高保真原型及设计的完成阶段17
第 2 章 一切从服务用户开始——市场定位和产品目标19
2.1 是移动产品,不是电脑软件19
2.1.1 不为外表华丽20
2.1.2 不为功能强大21
2.1.3 别让它“大而全”23
2.2 做有价值的应用26
2.2.1 它只是成千上万个应用中的一个26
2.2.2 是前无古人还是出类拔萃29
2.2.3 如何才能独树一帜30
2.3 了解应用的使用者32
2.3.1 用户细分32
2.3.2 用户研究34
2.3.3 用户测试36
第 3 章 讨论与初步设计——完成原型的草图设计 37
3.1 会玩“头脑风暴”吗37
3.1.1 一项既有益又有趣的游戏38
3.1.2 有明确的目标39
3.1.3 有合理的分工41
3.1.4 安排好合理的环境和议程45
3.1.5 畅所欲言和遵守规则49
3.1.6 挑选出最有前途的想法50
3.2 把想法和思路画成草图51
3.2.1 手绘的原型草图51
3.2.2 潦草但要认真53
3.2.3 原型工具和原型设计软件57
3.3 检验和分享你的思考结果60
3.3.1 有连贯,有情节,画出应用的故事板61
3.3.2 利用原型草图进行可用性测试62
3.3.3 几种其他类型的草图63
第 4 章 移动应用的交互特点 67
4.1 了解移动设备67
4.1.1 移动设备的种类68
4.1.2 移动设备的规格和像素尺寸69
4.1.3 移动设备的使用方法70
4.2 移动设备的人体工程学特点74
4.2.1 了解你的拇指74
4.2.2 单手操作还是双手操作77
4.2.3 善待你的指尖80
4.3 移动设备的视觉体验84
4.3.1 视觉的运行轨迹85
4.3.2 优化视觉结构86
4.3.3 图片与文字的视觉关系90
4.4 屏幕的旋转92
第 5 章 应用程序导航 95
5.1 iOS 应用的导航模式95
5.1.1 平铺导航96
5.1.2 iOS 的标签导航99
5.1.3 iOS 的树形结构导航101
5.1.4 模态视图104
5.1.5 iOS 的组合导航105
5.2 Android 应用导航模式106
5.2.1 Android 的标签导航107
5.2.2 Android 的树形结构导航109
5.2.3 手机与平板电脑导航的不同110
5.2.4 Android 的组合导航111
5.3 Windows Phone 应用导航模式112
5.3.1 Windows Phone 的标签导航112
5.3.2 面板区域应用程序中心导航114
5.3.3 主面板菜单应用程序中心导航114
第 6 章 标准控件与设计规范 116
6.1 文本输入输出116
6.1.1 文本输出控件116
6.1.2 文本输入控件118
6.2 按钮119
6.2.1 iOS 平台按钮119
6.2.2 Android 平台按钮120
6.2.3 Windows Phone 平台按钮121
6.3 各种“栏”122
6.3.1 状态栏122
6.3.2 iOS 中的工具栏、导航栏和标签栏123
6.3.3 Android 中的菜单栏和操作栏125
6.3.4 Windows Phone 中的菜单栏128
6.3.5 搜索栏129
6.4 滑块控件133
6.4.1 iOS 平台滑块控件133
6.4.2 Android 平台滑块控件134
6.4.3 Windows Phone 平台滑块控件135
6.5 选择控件136
6.5.1 二选一136
6.5.2 单选控件137
6.5.3 多选控件138
6.5.4 拾取器138
6.6 对话框143
6.6.1 iOS 平台中的对话框143
6.6.2 Android 平台中的对话框 145
6.6.3 Windows Phone 平台中的对话框147
6.7 活动指示器和进度条148
6.7.1 iOS 平台中的活动指示器和进度条148
6.7.2 Android 平台的活动指示器和进度条150
6.7.3 Windows Phone 平台中的活动指示器和进度条150
6.8 列表和网格152
6.8.1 iOS 平台列表和网格152
6.8.2 Android 平台列表和网格154
6.8.3 Windows Phone 平台中的列表和网格155
6.9 原型的可用性测试157
第 7 章 视觉体验的个性化 159
7.1 做有个性的应用159
7.1.1 从细节替换入手160
7.1.2 添加装饰、纹理和特效162
7.1.3 纯个性化的用户体验设计164
7.2 图形元素与构成理念165
7.2.1 图形元素是界面视觉印象的根本166
7.2.2 页面布局与构成理念169
7.2.3 处理好图形元素和页面布局间的关系175
7.2.4 同一款应用在不同的平台和设备上177
7.3 应用界面的色彩因素179
7.3.1 了解色彩的规律179
7.3.2 善于把握色调181
7.3.3 丰富的色彩,严谨的搭配183
7.3.4 色彩的倾向性187
7.4 严谨地把握文字188
7.4.1 选择合适的字体189
7.4.2 推敲文字的四个要素191
7.4.3 处理好字群的位置关系193
7.5 界面风格和特效194
7.5.1 拟物化风格194
7.5.2 扁平化设计195
7.5.3 手绘体风格196
第 8 章 做好应用的图标设计 199
8.1 图标设计的原则199
8.1.1 图标设计的“识别性”原则201
8.1.2 图标设计的“一致性”原则201
8.1.3 图标设计的“兼容性”原则203
8.2 启动图标206
8.2.1 建立完美的第一印象206
8.2.2 三大平台启动图标设计规范210
8.2.3 几个简单的启动图标设计思路214
8.3 工具栏图标217
8.3.1 是符号,不是图案217
8.3.2 三大平台工具栏图标的规范和含义218
8.3.3 几个有效的简化图像的方法219
8.4 启动画面和引导帮助221
8.4.1 启动画面221
8.4.2 引导帮助223
第 9 章 用户体验设计项目实战——“价格线”226
9.1 项目概述及工作计划226
9.1.1 项目描述226
9.1.2 工作计划和流程227
9.2 项目的准备阶段228
9.2.1 市场定位及产品分析228
9.2.2 项目的用户需求分析229
9.3 项目的创作及草图阶段230
9.4 项目的中保真原型及可用性测试232
9.4.1 项目的中保真原型232
9.4.2 原型的可用性测试及调整233
9.5 完善界面的个性化设计235
9.5.1 确定风格并收集素材235
9.5.2 隐喻元素的添加及个性化调整236
9.6 应用图标和启动画面设计237
9.6.1 应用图标的创意和设计237
9.6.2 应用的启动画面设计239
评价“品味移动设计”