软件UI设计之道（第二版 全彩）

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