第 1章 初识UI设计
1.1 UI设计的相关概念 002
1.1.1 UI设计的基本概念 002
1.1.2 UI与WUI、GUI的关系 002
1.1.3 UI设计的常用术语 002
1.1.4 UI设计常用软件 003
1.2 UI设计项目流程 003
1.2.1 项目设计流程 003
1.2.2 UI设计流程 004
1.3 UI设计的风格表现 004
1.4 UI设计的行业发展 006
1.4.1 UI设计行业现状 006
1.4.2 UI设计发展趋势 008
1.5 UI设计的学习方法 008
第 2章 图标设计
2.1 图标的基础知识 012
2.1.1 图标的概念 012
2.1.2 图标设计的流程 013
2.1.3 图标设计的原则 014
2.2 图标的设计规范 016
2.2.1 App图标设计规范 016
2.2.2 网页图标设计规范 020
2.2.3 软件图标设计规范 022
2.3 图标的风格类型 026
2.3.1 像素风格 026
2.3.2 扁平化风格 027
2.3.3 拟物化风格 030
2.3.4 微拟物化风格 030
2.3.5 立体风格 030
2.4 课堂案例——绘制扁平化风格的不透明色块面性图标 031
2.5 课堂案例——绘制扁平化风格的不透明叠加效果图标 033
2.6 课堂练习 037
2.6.1 绘制扁平化风格的单色面性图标 037
2.6.2 绘制扁平化风格的微渐变面性图标 037
2.7 课后习题 038
2.7.1 绘制扁平化风格的光影效果图标 038
2.7.2 绘制扁平化风格的折纸投影图标 038
第3章 App界面设计
3.1 App基础知识 040
3.1.1 App的概念 040
3.1.2 App的设计流程 040
3.1.3 App的设计原则 043
3.2 App的设计规范 047
3.2.1 App设计的尺寸 047
3.2.2 App设计的结构 050
3.2.3 App设计的布局 052
3.2.4 App设计的文字 054
3.3 App常用界面类型 057
3.3.1 闪屏页 057
3.3.2 引导页 058
3.3.3 首页 060
3.3.4 个人中心页 061
3.3.5 详情页 062
3.3.6 注册登录页 062
3.4 课堂案例——制作Delicacy App界面 063
3.5 课堂案例——制作侃侃App界面 094
3.6 课堂练习——制作美食到家 App界面 117
3.7 课后习题——制作美食来了 App界面 118
第4章 网页界面设计
4.1 网页界面设计基础知识 120
4.1.1 网页界面设计的概念 120
4.1.2 网页界面设计的流程 120
4.1.3 网页界面设计的原则 122
4.2 网页界面设计的规范 124
4.2.1 网页界面设计的尺寸 124
4.2.2 网页界面设计的结构 126
4.2.3 网页界面设计的布局 126
4.2.4 网页界面设计的文字 128
4.3 网页设计常用界面类型 129
4.4 课堂案例——制作装饰家居电商网站界面 131
4.4.1 制作装饰家居电商网站首页 131
4.4.2 制作装饰家居电商网站产品列表页 140
4.4.3 制作装饰家居电商网站产品详情页 149
4.5 课堂练习——制作Easy Life家居电商网站界面 161
4.6 课后习题——制作Artsy家居电商网站界面 162
第5章 软件界面设计
5.1 软件界面设计基础知识 164
5.1.1 软件界面设计的概念 164
5.1.2 软件界面设计的流程 164
5.1.3 软件界面设计的原则 165
5.2 软件界面设计的规范 166
5.2.1 软件界面设计的尺寸及单位 167
5.2.2 软件界面设计的结构 167
5.2.3 软件界面设计的布局 167
5.2.4 软件界面设计的文字 170
5.3 软件常用界面类型 170
5.4 课堂案例——制作More音乐播放器软件界面 172
5.4.1 制作More音乐播放器软件首页 172
5.4.2 制作More音乐播放器软件歌单页 184
5.4.3 制作More音乐播放器软件歌曲列表页 190
5.5 课堂练习——制作Song音乐播放器软件界面 197
5.6 课后习题——制作CoolPlayer音乐播放器软件界面 198
第6章 游戏界面设计
6.1 游戏界面设计的基础知识 200
6.1.1 游戏界面设计的概念 200
6.1.2 游戏界面设计的流程 200
6.1.3 游戏界面设计的原则 202
6.2 游戏界面设计的规范 203
6.2.1 游戏界面设计的尺寸 203
6.2.2 游戏界面设计的结构 203
6.2.3 游戏界面设计的布局 203
6.2.4 游戏界面设计的文字 205
6.3 游戏常用界面的类型 205
6.4 课堂案例——制作Boom游戏界面 207
6.5 课堂练习——制作水果消消消游戏界面 216
6.6 课后习题——制作Pet Fun游戏界面 216