HTML5 动画创作技术：DRAGONBONESPDF电子书下载

第1章 初识HTML5动画 1

1.1 什么是HTML5动画 1

1.2 HTML5动画制作软件选择 3

第2章 DragonBones基础 5

2.1 DragonBones Pro的获取和安装 5

2.1.1 Windows平台 5

2.1.2 Mac平台 5

2.2 DragonBones界面介绍 8

2.3 DragonBones工作区布局修改 9

2.3.1 面板的停靠和分组 9

2.3.2 面板组大小的修改 12

第3章 创建简单的帧动画项目——移动的小球 13

3.1 项目概述 13

3.2 新建项目 13

3.3 保存项目 15

3.4 动画制作 16

3.4.1 导入图片并添加到主场景 16

3.4.2 拖动主场景视图 18

3.4.3 放大和缩小主场景视图 19

3.4.4 移动图片 20

3.4.5 创建关键帧 20

3.4.6 播放动画 21

3.4.7 设置运动曲线 22

3.5 在浏览器中预览动画 24

第4章 帧动画进阶——游戏开场动画 26

4.1 项目概述 26

4.2 新建并保存项目 26

4.3 准备工作 27

4.3.1 导入资源 27

4.3.2 拖拽资源到主场景 27

4.3.3 放置图片 29

4.3.4 修改图层层级 29

4.4 游戏开场动画运动介绍 31

4.5 制作小山丘的动画 32

4.5.1 批量添加关键帧 32

4.5.2 创建关键帧动画 32

4.5.3 将运动曲线设置为线性 33

4.5.4 移动关键帧 35

4.6 制作小房子的动画 35

4.7 制作栅栏的动画 36

4.8 制作实例标题的动画 37

4.8.1 动画的时间安排 37

4.8.2 修改图片旋转轴点 37

4.8.3 创建关键帧动画 39

4.8.4 将运动曲线设置为淡出 39

4.8.5 设置其他文字的关键帧动画 40

第5章 创建简单的骨骼动画——小丑盒子 42

5.1 项目概述 42

5.2 新建并保存项目 42

5.3 骨架装配 44

5.3.1 导入资源到舞台 44

5.3.2 生成插槽 45

5.3.3 放置图片 45

5.3.4 修改插槽层级 46

5.3.5 修改骨架名称 47

5.3.6 创建小丑头部的骨骼 48

5.3.7 隐藏插槽和骨骼 50

5.3.8 创建其他部分的骨骼 51

5.3.9 整理骨骼层级 52

5.4 动画制作 52

5.4.1 切换到动画制作模式 52

5.4.2 修改动画剪辑的名字 53

5.4.3 移动及旋转骨骼 53

5.4.4 创建关键帧 55

5.4.5 自动关键帧 55

5.4.6 缩放骨骼 56

5.4.7 完成其他关键姿势 57

5.4.8 复制及粘贴关键帧 58

5.5 导出动画数据 60

第6章 骨骼动画进阶——跑步的人 62

6.1 项目概述 62

6.2 骨架装配 62

6.2.1 导入数据到项目 62

6.2.2 创建角色四肢的骨骼 65

6.2.3 创建身体和头部的骨骼 67

6.2.4 整理骨骼层级 69

6.3 制作跑步动画 69

6.3.1 跑步动作介绍 69

6.3.2 关键姿态的摆放 71

6.3.3 移动和缩放关键帧 75

6.4 制作跳跃动画 77

6.4.1 添加动画剪辑 77

6.4.2 跳跃动作介绍 77

6.4.3 关键姿势的摆放 78

6.4.4 洋葱皮功能 80

6.5 制作空闲动画 82

6.5.1 空闲动作介绍 82

6.5.2 关键姿势的摆放 82

6.5.3 让角色眨眼 83

6.6 设置动画剪辑播放次数和过渡时间 87

6.6.1 设置动画剪辑播放次数 87

6.6.2 设置动画剪辑过渡时间 87

6.7 在浏览器中预览动画并切换动作 88

第7章 创建网格变形动画——跳跳羊 89

7.1 项目概述 89

7.2 从Photoshop中导出数据到DragonBones 89

7.2.1 安装PSD导出插件 89

7.2.2 使用PSD导出插件导出数据到DragonBones 90

7.3 骨架装配 95

7.4 网格装配 96

7.4.1 创建网格 96

7.4.2 设置图片边线 99

7.4.3 添加网格顶点 101

7.5 动画制作 105

7.5.1 跳跳羊动作介绍 105

7.5.2 设置主体的动作 106

7.5.3 设置腿部的动作 109

7.5.4 设置身体的网格变形动作 112

第8章 创建IK和蒙皮动画——悬挂着的小猴子 116

8.1 项目概述 116

8.2 导入数据到项目 116

8.3 创建骨架 117

8.4 创建蒙皮 119

8.4.1 创建网格 119

8.4.2 将网格绑定到骨骼 120

8.4.3 编辑骨骼权重 121

8.5 创建IK 125

8.6 动画制作 129

8.6.1 小猴子招手动画介绍 129

8.6.2 关键姿势的摆放 129

8.6.3 延迟手部和腿部的动作 131

8.6.4 编辑运动曲线 133

第9章 元件的嵌套——草莓唇膏营销广告 135

9.1 项目概述 135

9.2 新建项目 135

9.3 草莓唇膏营销广告介绍 137

9.4 制作唇膏主体动画 138

9.4.1 新建基本动画元件 138

9.4.2 制作唇膏静止状态的动画剪辑 139

9.4.3 制作唇膏闪光状态的动画剪辑 140

9.5 制作小兔子闻草莓动画 141

9.5.1 骨架装配 141

9.5.2 动画制作 141

9.6 制作主舞台动画 145

9.6.1 资源导入及放置 145

9.6.2 制作唇膏细节及整体设计的展示动画 147

9.6.3 添加小兔子闻草莓的动画 152

9.6.4 制作广告宣传语气泡框动画 154

9.6.5 制作唇膏流光闪烁动画 155

第10章 创建动态漫画 157

10.1 项目概述 157

10.2 导入数据 157

10.3 动态漫画制作界面介绍 159

10.4 动态漫画制作 159

10.4.1 动态漫画交互介绍 159

10.4.2 更改背景颜色 160

10.4.3 为标题添加动画特效 161

10.4.4 修改标题动画顺序及动画组合 165

10.4.5 为漫画内容添加动画特效 169

第11章 播放一个DragonBones动作 176

11.1 项目概述 176

11.2 读取DragonBones资源并解析到工厂 176

11.2.1 读取资源 176

11.2.2 创建并将资源添加到骨骼动画工厂 178

11.3 提取骨架并添加到舞台 178

11.4 播放一个DragonBones动作 179

第12章 多人物动画 182

12.1 项目概述 182

12.2 使用同一动画工厂 182

12.2.1 将骨架加入动画工厂 182

12.2.2 使用同一动画工厂播放不同角色动作 183

12.3 使用不同动画工厂 185

第13章 应用场景案例 187

13.1 项目概述 187

13.2 动态换装 187

13.2.1 替换图片 187

13.2.2 替换子骨架 190

13.3 控制骨骼运动 191

13.4 控制动画速度 194

13.4.1 调节世界时钟 194

13.4.2 调节动画速度 195

13.4.3 调节动作速度 196

13.5 动画遮罩与动画混合 196

13.5.1 动画遮罩 197

13.5.2 动画混合 198

13.6 动画拷贝 200

第14章 骨骼动画事件系统 202

14.1 项目概述 202

14.2 DragonBones系统事件介绍与使用简介 202

14.2.1 DragonBones事件实现机制 202

14.2.2 DragonBones系统事件使用方法 203

14.3 使用DragonBones用户自定义事件 205

第15章 附录 210

15.1 基本概念 210

15.1.1 骨架 210

15.1.2 骨骼 210

15.1.3 插槽 212

15.1.4 图片 213

15.1.5 继承 215

15.1.6 边界框 215

15.1.7 元件及元件嵌套 217

15.2 主界面 219

15.3 工具栏 220

15.3.1 系统工具栏 220

15.3.2 主场景工具栏 221

15.3.3 显示／可选／继承工具 223

15.3.4 编辑模式切换工具 223

15.4 窗口 224

15.4.1 新建项目窗口 224

15.4.2 首选项 225

15.5 面板 226

15.5.1 “场景树”面板 226

15.5.2 “变换”面板 227

15.5.3 “属性”面板 227

15.5.4 “层级”面板 228

15.5.5 “资源”面板 229

15.5.6 “动画”面板 230

15.5.7 “时间轴”面板 231

15.5.8 作品分享 235

15.6 右键菜单 236

15.7 高级功能 237

15.7.1 洋葱皮 237

15.7.2 曲线编辑器 238

15.7.3 IK约束 241

15.7.4 网格 243

15.7.5 蒙皮权重 245

15.8 导入 249

15.8.1 导入 249

15.8.2 导入项目文件夹 249

15.8.3 导入zip包项目 250

15.8.4 导入dbswf格式矢量纹理集 251

15.8.5 导入集成数据PNG 252

15.8.6 导入Photoshop设计图 252

15.8.7 导入Cocos或Spine的导出项目 255

15.8.8 命令行导入 256

15.9 导出 257

15.9.1 导出“动画数据＋纹理” 257

15.9.2 导出“图片” 258

15.9.3 导出中的纹理集设置 259

15.10 快捷键 261

15.11 插件 261

15.11.1 插件管理 261

15.11.2 插件开发规范 264