《软件UI设计之道(全彩)》是一本使用Photoshop 进行软件UI 设计制作的案例教程,语言浅显易懂,配合大量精美的软件UI 设计案例,讲解了有关软件UI 设计的相关知识和使用Photoshop 进行软件UI 设计制作的方法与技巧。读者在掌握软件UI 设计各方面知识的同时,能够在软件UI 设计制作的基础上做到活学活用。
《软件UI设计之道(全彩)》共分为7 章,全面介绍了软件UI 设计中的理论设计知识,以及具体案例的制作方法;第1 章为关于软件UI 设计的基础知识,第2 章介绍了软件界面设计要素,第3 章介绍了软件安装与启动界面设计,第4 章介绍了移动APP 软件界面设计,第5 章介绍了家庭智能设备界面设计,第6 章介绍了应用软件界面设计,第7 章介绍了播放器界面设计。
《软件UI设计之道(全彩)》配套光盘中提供了书中所有案例的源文件及素材,方便读者借鉴和使用。
《软件UI设计之道(全彩)》适合有一定Photoshop 软件操作基础的设计初学者及设计爱好者阅读,也可以为一些设计制作人员及相关专业的学习者提供参考。
CHAPTER 1
关于软件UI设计
1.1 软件UI设计基础 2
1.1.1 什么是UI设计 2
1.1.2 软件UI设计 2
1.1.3 网站UI设计和软件UI设计的区别 3
1.2 了解UI设计师 4
1.2.1 研究界面——图形设计师 4
1.2.2 研究人与界面的关系——交互
???设计师 4
1.2.3 研究人——用户测试/研究
???工程师 4
1.3 软件界面设计常见类别 4
1.3.1 Windows应用软件界面 5
1.3.2 网站界面 5
1.3.3 Web应用软件界面 6
1.3.4 移动APP软件界面 6
1.3.5 游戏软件界面 7
1.4 软件界面的设计流程 7
1.5 软件界面设计的黄金法则 8
1.5.1 在实现功能的框下设计 8
1.5.2 层次结构清晰 9
1.5.3 一致性和标准化 12
1.5.4 给予足够的视觉反馈 13
1.6 软件UI的拟物化和扁平化设计 14
1.7 扁平化UI设计的特点 17
1.7.1 快速高效 17
1.7.2 内容与功能更加突出 18
1.7.3 界面简洁清晰 18
1.7.4 修改方便 18
1.8 软件界面中的色彩搭配 19
1.9 本章小结 21
CHAPTER 2
软件界面设计要素
2.1 软件界面的视觉识别元素 24
2.2 软件按钮和图标设计 26
2.2.1 什么是软件图标 26
2.2.2 软件图标设计原则 27
2.2.3 图标的常用格式 29
2.2.4 简约软件图标 30
【自测1】绘制简约纯色图标 31
2.2.5 拟物化软件图标 34
【自测2】绘制拟物化相机图标 35
2.2.6 扁平化软件图标 45
【自测3】绘制扁平化天气图标 47
2.2.7 软件按钮 54
【自测4】绘制精美软件按钮 54
2.3 软件开关和进度条设计 60
2.3.1 软件开关 60
【自测5】绘制软件开关按钮 60
2.3.2 进度条 64
【自测6】绘制圆形加载进度条 65
2.4 软件菜单和工具栏设计 70
2.4.1 菜单的重要性 70
2.4.2 软件菜单的设计要点 70
【自测7】绘制清爽简洁的软件菜单 71
2.4.3 软件工具栏的作用 74
【自测8】绘制软件快捷工具栏 75
2.5 专家支招 80
2.6 本章小结 81
CHAPTER 3
软件安装与启动界面设计
3.1 关于软件安装界面设计 84
【自测1】软件安装界面 87
3.2 了解软件启动界面设计 94
3.2.1 什么是软件启动界面 94
3.2.2 软件启动界面的作用是什么 94
3.2.3 软件启动界面的设计原则 95
3.3 软件启动界面设计需要注意的问题 96
【自测2】软件启动界面 97
3.4 软件面板设计 106
3.4.1 合理安排面板的功能区 106
【自测3】设计事件备忘面板 107
3.4.2 软件面板的设计原则 112
【自测4】设计文件下载管理面板 114
3.5 软件皮肤设计 120
3.5.1 天气应用皮肤设计原则 120
【自测5】设计天气应用皮肤 122
3.5.2 输入法皮肤 129
【自测6】设计酷黑输入法皮肤 129
3.6 专家支招 135
3.7 本章小结 135
CHAPTER 4
移动APP软件界面设计
4.1 关于移动APP软件 138
4.1.1 什么是APP软件 138
4.1.2 智能手机与平板电脑系统 138
4.2 手机屏幕尺寸 140
4.2.1 Android系统手机屏幕尺寸 140
4.2.2 iOS系统手机屏幕尺寸 141
4.2.3 Windows系统手机屏幕尺寸 142
4.2.4 APP软件启动界面 143
【自测1】设计APP软件启动界面 143
4.2.5 APP软件引导界面的设计分类 150
【自测2】设计APP软件引导界面 152
4.3 APP软件界面布局 156
4.3.1 Android系统APP软件布局说明 156
4.3.2 天气APP软件界面 156
【自测3】设计天气APP软件界面 157
4.3.3 iOS系统APP软件布局说明 163
4.3.4 音乐APP软件界面 164
【自测4】设计音乐APP软件界面 164
4.4 APP软件界面的设计要求 173
4.4.1 APP软件界面的特点 173
4.4.2 APP软件界面设计流程 173
4.4.3 APP软件界面的色彩搭配 174
4.4.4 平板电脑软件界面的特点 175
【自测5】设计iPad软件界面 175
4.5 APP软件界面的设计原则 185
【自测6】设计照片分享APP软件界面 186
4.6 专家支招 193
4.7 本章小结 193
CHAPTER 5
家庭智能设备界面设计
5.1 关于智能手表 196
5.2 智能手表界面设计要点 197
【自测1】设计智能手表界面 199
5.3 车载系统界面设计 207
【自测2】设计汽车多媒体系统界面 209
5.4 智能电视界面设计 217
5.4.1 什么是智能电视 217
5.4.2 智能电视界面设计的特点 218
【自测3】设计视频点播系统界面 220
【自测4】设计智能电视界面 227
5.5 专家支招 238
5.6 本章小结 239
CHAPTER 6
应用软件界面设计
6.1 了解应用软件界面设计 242
6.1.1 什么是应用软件界面设计 242
6.1.2 应用软件界面设计要点 242
6.2 Web软件界面设计 243
6.2.1 什么是Web软件 243
6.2.2 Web应用软件界面设计原则 244
【自测1】设计上网测速软件界面 244
【自测2】设计云空间软件界面 255
6.3 软件界面设计的趋势 262
6.3.1 传统软件界面设计 262
【自测3】设计录音软件界面 262
6.3.2 扁平化的软件界面设计 274
【自测4】设计聊天软件界面 275
6.4 软件界面设计规范 284
6.4.1 软件界面的屏幕显示 284
【自测5】设计透明软件界面 284
6.4.2 软件界面的设计原则 295
【自测6】设计视频转换软件界面 295
6.5 专家支招 307
6.6 本章小结 308
CHAPTER 7
播放器界面设计
7.1 关于播放器界面 310
【自测1】设计简约网络视频播放器 310
7.2 人性化的播放器界面设计 319
【自测2】设计音乐播放器界面 320
【自测3】设计简约半透明播放器 326
7.3 播放器界面设计原则 335
7.3.1 对比原则 335
7.3.2 协调原则 336
7.3.3 趣味原则 336
【自测4】设计质感音乐播放器 337
【自测5】设计媒体音乐盒界面 347
【自测6】设计质感视频播放器 360
7.4 专家支招 370
7.5 本章小结 370