设计必修课：Adobe XD移动UI设计（微课视频版）

图书标准信息

• 作者 卢斌
• 出版社 电子工业出版社
• 出版时间 2022-03
• 版次 1
• ISBN 9787121430299
• 定价 89.00元
• 装帧 其他
• 开本 16开
• 页数 256页
• 字数 460.8千字

【内容简介】

本书从实用的角度出发，全面、系统地讲解了Adobe XD的各项功能和使用方法。书中内容基本涵盖了Adobe XD中的大多数工具的使用方法和重要功能，并将多个精彩实例和移动UI设计规范贯穿于全书讲解的过程中，操作一目了然，语言通俗易懂，适合读者自学。本书适合移动App设计人员、动画制作人员、网页设计人员、大中专院校学生及交互式原型爱好者等参考阅读。

【作者简介】

卢斌，男，博士，云南美术家协会会员，云南艺术学院任教，致力于视觉艺术与设计、设计形态学领域的研究和探索，设计作品多次获省级奖项。从事UI设计多年，有丰富的移动UI设计经验，熟练使用Axure RP和Adobe XD等设计软件，曾出版Indesing CS6完全自学一本通等图书。

【目录】

第1章 了解Adobe XD

1.1  移动端UI设计基础1

1.1.1  了解移动UI设计1

1.1.2  iOS系统与Android系统2

1.1.3  移动端与PC端UI设计的区别6

1.2  移动UI设计流程8

1.2.1  需求分析8

1.2.2  交互原型设计9

1.2.3  视觉界面设计9

1.3  移动UI设计常用工具10

1.4  关于Adobe XD13

1.4.1  Adobe XD简介13

1.4.2  Adobe XD的应用领域14

1.4.3  Adobe XD的特点14

1.5  下载和安装Adobe XD14

1.5.1  下载Adobe XD15

1.5.2  应用案例——安装和启动Adobe XD15

1.5.3  使用Creative Cloud Cleaner Tool16

1.6  Adobe XD的工作界面17

1.6.1  菜单栏17

1.6.2  工具栏18

1.6.3  模式栏19

1.6.4  “属性”面板19

1.6.5  工作区域19

1.7  Adobe XD的帮助资源20

1.8  解惑答疑22

1.8.1  Adobe XD的工作流程是怎样的22

1.8.2  Adobe XD的试用时间为多长22

1.9  总结扩展22

1.9.1  本章小结22

1.9.2  扩展练习——卸载Adobe XD22

第2章 Adobe XD的基本操作

2.1  主页24

2.2  新建文件25

2.3  创建和管理画板25

2.3.1  创建新画板25

2.3.2  应用案例——创建iOS系统App文件27

2.3.3  使用现有画板28

2.3.4  管理画板28

2.3.5  应用案例——创建Android系统App文件31

2.4  打开文件32

2.4.1  “从您的计算机中打开”命令32

2.4.2  “打开”命令33

2.4.3  “在您的计算机上”按钮33

2.4.4  “近打开文件”命令34

2.5  导入文件34

2.6  存储文件35

2.6.1  “保存”命令35

2.6.2  “存储为本地文档”命令36

2.6.3  “重命名”命令36

2.6.4  应用案例——保存iOS和Android系统UI文件37

2.7  获取用户界面套件37

2.8  撤销与恢复操作38

2.8.1  还原与重做38

2.8.2  恢复文件38

2.8.3  文档历史记录39

2.9  辅助工具39

2.9.1  应用案例——为iOS系统UI设计创建参考线39

2.9.2  管理参考线40

2.9.3  使用智能参考线41

2.9.4  应用网格定位对象41

2.9.5  管理网格42

2.10  解惑答疑44

2.10.1  如何在iOS或Android设备中预览XD设计44

2.10.2  Adobe XD为何不提示用户将文件保存在Windows中44

2.11  总结扩展44

2.11.1  本章小结44

2.11.2  扩展练习——为Android系统 UI设计添加参考线45

第3章 使用Adobe XD完成原型设计

3.1  创建对象46

3.1.1  使用“矩形工具”创建对象46

3.1.2  使用“椭圆工具”创建对象47

3.1.3  使用“直线工具”创建对象47

3.1.4  使用“多边形工具”创建对象47

3.1.5  使用“钢笔工具”创建对象49

3.2  为对象设置样式51

3.2.1  设置填充、边界和阴影52

3.2.2  应用案例——绘制iOS系统的状态栏图标57

3.2.3  布尔运算59

3.2.4  应用案例——绘制iOS系统Wi-Fi和电池图标61

3.2.5  形状蒙版62

3.2.6  创建重复元素63

3.3  编辑对象64

3.3.1  选择和移动对象64

3.3.2  复制、粘贴和删除对象65

3.3.3  对齐、分布和排列对象66

3.3.4  应用案例——设计制作扁平风格装饰图标68

3.3.5  调整和旋转对象71

3.3.6  编组和锁定对象72

3.3.7  应用案例——设计制作视频App启动图标73

3.4  创建文本76

3.4.1  输入文本76

3.4.2  拼写检查77

3.4.3  导入文本77

3.5  管理文本79

3.5.1  设置文本格式79

3.5.2  文本变换81

3.5.3  调整段落文本的宽和高82

3.5.4  应用案例——设计制作App高保真原型的上新部分84

3.6  设计画板86

3.6.1  创建垂直滚动86

3.6.2  创建滚动组87

3.6.3  应用案例——设计制作App高保真原型的推荐部分89

3.7  解惑答疑90

3.7.1  如何使用“多边形工具”绘制“收藏”图标90

3.7.2  App图标集的工作流程是否与UI设计一致91

3.8  总结扩展92

3.8.1  本章小结93

3.8.2  扩展练习——   设计制作Android系统App原型界面93

第4章 使用Adobe XD完成UI设计

4.1  使用处理设计系统94

4.1.1  创建库资源94

4.1.2  管理库资源97

4.1.3  共享库资源99

4.1.4  应用案例——创建移动UI处理设计系统101

4.2  使用图层102

4.2.1  “图层”面板102

4.2.2  搜索图层102

4.2.3  管理图层103

4.2.4  应用案例——绘制App收藏界面的心形元素105

4.3  为对象设置效果106

4.3.1  使用模糊效果107

4.3.2  应用案例——设计制作App收藏界面108

4.3.3  使用混合效果109

4.3.4  应用案例——绘制App界面中的卡片模块112

4.4  设计UI界面的结构113

4.4.1  响应式调整大小113

4.4.2  创建和使用组件115

4.4.3  应用案例——设计制作Android系统App主题界面116

4.4.4  覆盖组件实例118

4.4.5  为组件添加多个状态119

4.4.6  应用案例——为移动端UI设计添加不同状态121

4.4.7  使用嵌套组件123

4.5  使用3D变换进行透视设计124

4.5.1  启用3D变换124

4.5.2  旋转物体125

4.5.3  应用案例——绘制App界面的基础结构125

4.5.4  使用Z轴应用深度128

4.5.5  应用案例——设计制作Android系统App点餐界面128

4.6  解惑答疑130

4.6.1  如何确定移动App UI项目中的配色130

4.6.2  如何处理Adobe XD中的缺失字体131

4.7  总结扩展132

4.7.1  本章小结132

4.7.2  扩展练习——设计制作iOS系统图片浏览界面133

第5章 使用Adobe XD完成UX设计

5.1  添加交互134

5.1.1  设置主页屏幕134

5.1.2  建立链接135

5.1.3  设置交互效果137

5.1.4  应用案例——设计制作App聊天气泡交互动效140

5.1.5  链接上一个画板144

5.1.6  取消链接144

5.1.7  应用案例——设计制作App猫爪菜单交互动效144

5.2  交互动画147

5.2.1  创建交互动画147

5.2.2  应用案例——设计制作App删除和置顶交互动效148

5.3  使用其他方式创建交互152

5.3.1  使用键盘和游戏手柄创建交互152

5.3.2  使用“语音”命令和“语音放”操作类型创建交互153

5.4  创建定时过渡155

5.4.1  使用“时间”触发条件创建交互155

5.4.2  应用案例——   设计制作App加载界面交互动效155

5.5  添加叠加157

5.5.1  使用“叠加”操作类型创建交互157

5.5.2  应用案例——设计制作App搜索界面交互动效157

5.6  创建锚点链接159

5.7  预览UI与UX设计160

5.7.1  预览UI设计161

5.7.2  应用案例——预览App界面中的交互动效162

5.8  解惑答疑164

5.8.1  交互用户的工作内容164

5.8.2  动效设计制作工具有哪些165

5.9  总结扩展167

5.9.1  本章小结167

5.9.2  扩展练习——设计制作App界面中的轮播图167

第6章 输出、标注和共享UI设计

6.1  使用Adobe XD输出设计资源169

6.1.1  导出切片资源169

6.1.2  不同格式的切片资源172

6.2  输出iOS系统的UI设计175

6.2.1  iOS系统向下和向上适配176

6.2.2  适配切片命名规范178

6.2.3  应用案例——完成iOS系统UI界面的切片输出180

6.3  输出Android系统的UI设计181

6.3.1  Android系统中的“点9”切图181

6.3.2  适配输出中的一稿两用185

6.3.3  应用案例——完成Android系统UI界面的切片输出186

6.4  标注移动App UI设计187

6.4.1  App界面标注内容187

6.4.2  标注的声明文档188

6.4.3  应用案例——使用PxCook标注App浏览界面189

6.4.4  UI设计的标注规范190

6.4.5  应用案例——使用PxCook标注App主题界面192

6.5  共享移动App UI设计193

6.5.1  共享UI设计193

6.5.2  使用共享UI设计197

6.5.3  创建共享链接198

6.5.4  应用案例——共享移动App UI界面200

6.5.5  使用设计规范200

6.5.6  应用案例——发布与共享App的设计规范202

6.6  解惑答疑203

6.6.1  切片的尺寸为什么必须是双数203

6.6.2  如何协同编辑共享的UI设计203

6.7  总结扩展203

6.7.1  本章小结204

6.7.2  扩展练习——完成UI界面的切片输出204

第7章 综合案例

7.1  设计制作美妆App项目205

7.1.1  美妆App项目分析205

7.1.2  制作美妆App草图206

7.1.3  美妆App界面色彩搭配208

7.1.4  美妆App界面元素分析209

7.1.5  美妆App UI设计211

7.1.6  美妆App 交互设计213

7.1.7  输出美妆App切片资源215

7.1.8  标注美妆App217

7.2  设计制作社交App项目219

7.2.1  社交App项目分析220

7.2.2  制作社交App草图220

7.2.3  社交App界面色彩搭配222

7.2.4  社交App界面元素分析223

7.2.5  社交App UI设计225

7.2.6  社交App交互设计227

7.2.7  输出社交App切片资源230

7.2.8  标注社交App232

7.3  设计制作日历App项目234

7.3.1  日历App项目分析234

7.3.2  制作日历App草图234

7.3.3  日历App界面色彩搭配237

7.3.4  日历App界面元素分析237

7.3.5  日历App UI设计239

7.3.6  日历App交互设计240

7.3.7  输出日历App切片资源242

7.3.8  标注日历App244