移动终端UI设计实战教程 / 高等职业教育教材·三维数字、数字媒体技术专业系列
¥55.00定价
作者: 张洪民
出版时间:2020
出版社:北京师范大学出版社
- 北京师范大学出版社
- 9787303244553
- 1-2
- 264853
- 67227894-2
- 16开
- 2020
- 176
- 工学
- 计算机科学与技术
- TN929.5
- 专业基础课
作者简介
目录
第1章 移动UI设计概述 5
1.1 移动UI的概念 5
1.1.1 什么是移动UI 5
1.1.2 APP与UI视觉设计的关系 6
1.1.4 移动UI设计的重要性 7
1.1.5 移动UI设计原则 8
1.2 移动UI设计过程 9
1.2.1 产品定位及市场分析阶段 9
1.2.2 初步构思及框架设计阶段 10
1.2.3 修饰美化及界面设计阶段 10
1.2.4 产品上线及优化方案阶段 11
1.3移动设备尺寸的相关概念 11
1.3.1 英寸 11
1.3.2 显示分辨率 11
1.3.3 像素密度 12
1.4 色彩在移动UI设计中的重要性 12
1.4.1 色彩的基本概念 13
1.4.2 移动UI设计中的色彩 14
1.4.3 UI设计中的情感表达 16
1.4.4 移动UI中的颜色深度 16
1.4.5 UI中的色彩应用规则 17
1.5移动UI设计工具软件 17
1.5.1 矢量图形Illustrator 17
1.5.2 图像编辑软件Photoshop 23
1.5.3 UI设计软件Photoshop的核心功能 23
第2章 图形在移动UI图标设计中的应用 41
2.1 图形与图标的关系 41
2.2 图形在图标中的作用 41
2.2.1 装饰 41
2.2.2 表意 42
2.2.3 趣味 42
2.2.4 品牌宣传 42
2.2.5 图形设计过程 43
2.3 图形设计步骤 44
2.3.1 图形设计步骤 44
2.3.2线框图案例 46
2.4 动物图形图标设计案例 48
2.4.1基本框架 48
2.4.2 美学一致性 48
2.4.3可识别性 49
2.4.4本案例设计法则 49
2.5 扁平化图标设计案例 54
2.5.1 常规扁平化 55
2.5.2 长投影 57
2.5.3 渐变式 58
2.5.4 投影式 59
2.6 拟物化时钟设计案例 59
2.7 常见图形设计案例 66
2.8 质感设计 73
2.8.1 塑料质感设计案例 73
2.8.2金属质感——指南针设计案例 80
第3章UI常用元素制作 96
3.1 APP LOGO设计案例 96
3.2 APP中的艺术线条 98
3.2.1 线条艺术造型 98
3.2.2 色彩处理 100
3.3 启动图标制作 102
3.3.1 实例图标案例 102
3.4 苹果手机制作案例 107
3.5 APP SPLASH SCREEN设计 114
3.5.1 前期准备 114
3.5.2 UI闪屏设计案例 115
第4章 图标设计与制作 121
4.1 图标设计基础知识 121
4.1.1 图标的含义 121
4.1.2 图标的分类 121
4.1.3 整理图标创意 122
4.1.4 图标设计制作的原则 123
4.1.5 图标设计规范 123
4.2 实践一:扁平化图标设计制作 125
4.2.1 分析实践对象 125
4.2.2 理清设计思路 125
4.2.3 任务实现 126
4.3 实践二:微扁平化图标设计制作 130
4.3.1 分析实践对象 130
4.3.2 理清设计思路 130
4.3.3 任务实现 131
4.4 实践三:拟物化图标设计制作 136
4.4.1 分析实践对象 136
4.4.2 理清设计思路 137
4.4.3 任务实现 137
第5章 界面设计 148
5.1 欢迎界面 148
5.2 功能界面1 153
5.3 功能界面2 164
5.4课后实例 171
第6章 手机视频播放器界面设计 204
6.1 设计界面背景效果实例1 204
6.1.1 设计界面主体效果 207
6.1.2 设计界面整体效果 212
6.2设计界面背景效果实例2 214
6.2.1 设计界面主体效果 217
6.2.2 设计界面整体效果 220
6.3课后实例 222
第7章 音悦电台界面设计 240
7.1 制作背景 240
7.2 绘制界面 243
7.3 添加图形元素 250
7. 4 绘制功能控件 252
第8章 手机UI设计—导航页面设计与制作 256
8.1 初识手机UI设计 256
8.1.1 手机UI界面设计原则 256
8.1.2 认识导航页面 256
8.2 舵式导航页面设计 259
8.2.1 分析实践对象 260
8.2.2 理清设计思路 260
8.2.3 任务实现 260
8.3 标签式导航页面设计 264
8.3.1 标签式导航分类 265
8.3.2 分析实践对象 266
8.3.3 理清设计思路 266
8.3.4 任务实现 266
第9章 青少年护眼专科APP项目设计 273
9.1 APP项目分析 273
9.1.1 需求分析 273
9.1.2 项目定位 273
9.1.3 设计思路 273
9.1.4 绘制草图 274
9.1.5 绘制原型图 274
9.2 APP项目设计定位 276
9.2.1设计风格 276
9.2.2颜色定位 276
9.2.3 字体运用 276
9.3 项目剖析 277
9.3.1 Logo设计 277
9.3.2 应用图标设计 277
9.3.3 加载页面设计 277
9.3.4 首页设计 278
9.3.5 个人页面设计 281
9.3.6 护眼页面设计 282
第10章 优秀炫酷图标欣赏 283
10.1流行风格界面赏析 283
10.1.1经典拟物化图标 283
10.1.2游戏类图标 284
10.1.3质感类控件 285
10.1.4扁平化界面 286
10.1.5游戏界面 288
10.2 UI设计网站汇总 289
1.1 移动UI的概念 5
1.1.1 什么是移动UI 5
1.1.2 APP与UI视觉设计的关系 6
1.1.4 移动UI设计的重要性 7
1.1.5 移动UI设计原则 8
1.2 移动UI设计过程 9
1.2.1 产品定位及市场分析阶段 9
1.2.2 初步构思及框架设计阶段 10
1.2.3 修饰美化及界面设计阶段 10
1.2.4 产品上线及优化方案阶段 11
1.3移动设备尺寸的相关概念 11
1.3.1 英寸 11
1.3.2 显示分辨率 11
1.3.3 像素密度 12
1.4 色彩在移动UI设计中的重要性 12
1.4.1 色彩的基本概念 13
1.4.2 移动UI设计中的色彩 14
1.4.3 UI设计中的情感表达 16
1.4.4 移动UI中的颜色深度 16
1.4.5 UI中的色彩应用规则 17
1.5移动UI设计工具软件 17
1.5.1 矢量图形Illustrator 17
1.5.2 图像编辑软件Photoshop 23
1.5.3 UI设计软件Photoshop的核心功能 23
第2章 图形在移动UI图标设计中的应用 41
2.1 图形与图标的关系 41
2.2 图形在图标中的作用 41
2.2.1 装饰 41
2.2.2 表意 42
2.2.3 趣味 42
2.2.4 品牌宣传 42
2.2.5 图形设计过程 43
2.3 图形设计步骤 44
2.3.1 图形设计步骤 44
2.3.2线框图案例 46
2.4 动物图形图标设计案例 48
2.4.1基本框架 48
2.4.2 美学一致性 48
2.4.3可识别性 49
2.4.4本案例设计法则 49
2.5 扁平化图标设计案例 54
2.5.1 常规扁平化 55
2.5.2 长投影 57
2.5.3 渐变式 58
2.5.4 投影式 59
2.6 拟物化时钟设计案例 59
2.7 常见图形设计案例 66
2.8 质感设计 73
2.8.1 塑料质感设计案例 73
2.8.2金属质感——指南针设计案例 80
第3章UI常用元素制作 96
3.1 APP LOGO设计案例 96
3.2 APP中的艺术线条 98
3.2.1 线条艺术造型 98
3.2.2 色彩处理 100
3.3 启动图标制作 102
3.3.1 实例图标案例 102
3.4 苹果手机制作案例 107
3.5 APP SPLASH SCREEN设计 114
3.5.1 前期准备 114
3.5.2 UI闪屏设计案例 115
第4章 图标设计与制作 121
4.1 图标设计基础知识 121
4.1.1 图标的含义 121
4.1.2 图标的分类 121
4.1.3 整理图标创意 122
4.1.4 图标设计制作的原则 123
4.1.5 图标设计规范 123
4.2 实践一:扁平化图标设计制作 125
4.2.1 分析实践对象 125
4.2.2 理清设计思路 125
4.2.3 任务实现 126
4.3 实践二:微扁平化图标设计制作 130
4.3.1 分析实践对象 130
4.3.2 理清设计思路 130
4.3.3 任务实现 131
4.4 实践三:拟物化图标设计制作 136
4.4.1 分析实践对象 136
4.4.2 理清设计思路 137
4.4.3 任务实现 137
第5章 界面设计 148
5.1 欢迎界面 148
5.2 功能界面1 153
5.3 功能界面2 164
5.4课后实例 171
第6章 手机视频播放器界面设计 204
6.1 设计界面背景效果实例1 204
6.1.1 设计界面主体效果 207
6.1.2 设计界面整体效果 212
6.2设计界面背景效果实例2 214
6.2.1 设计界面主体效果 217
6.2.2 设计界面整体效果 220
6.3课后实例 222
第7章 音悦电台界面设计 240
7.1 制作背景 240
7.2 绘制界面 243
7.3 添加图形元素 250
7. 4 绘制功能控件 252
第8章 手机UI设计—导航页面设计与制作 256
8.1 初识手机UI设计 256
8.1.1 手机UI界面设计原则 256
8.1.2 认识导航页面 256
8.2 舵式导航页面设计 259
8.2.1 分析实践对象 260
8.2.2 理清设计思路 260
8.2.3 任务实现 260
8.3 标签式导航页面设计 264
8.3.1 标签式导航分类 265
8.3.2 分析实践对象 266
8.3.3 理清设计思路 266
8.3.4 任务实现 266
第9章 青少年护眼专科APP项目设计 273
9.1 APP项目分析 273
9.1.1 需求分析 273
9.1.2 项目定位 273
9.1.3 设计思路 273
9.1.4 绘制草图 274
9.1.5 绘制原型图 274
9.2 APP项目设计定位 276
9.2.1设计风格 276
9.2.2颜色定位 276
9.2.3 字体运用 276
9.3 项目剖析 277
9.3.1 Logo设计 277
9.3.2 应用图标设计 277
9.3.3 加载页面设计 277
9.3.4 首页设计 278
9.3.5 个人页面设计 281
9.3.6 护眼页面设计 282
第10章 优秀炫酷图标欣赏 283
10.1流行风格界面赏析 283
10.1.1经典拟物化图标 283
10.1.2游戏类图标 284
10.1.3质感类控件 285
10.1.4扁平化界面 286
10.1.5游戏界面 288
10.2 UI设计网站汇总 289