本书根据艺术设计专业应用型人才培养目标的要求编写，包括新媒体动态设计概述、动态设计的创意构思、动态设计的实现方法、动态设计在新媒体中的应用、动态设计的优化和测试、新媒体动态设计案例分析、动态设计进阶技巧。本书注重培养读者的动态设计思维和实现动态效果的能力，引用分析了大量专业教学成果以及相关行业优秀案例，以帮助读者了解新媒体动态设计领域的发展历史、发展前沿以及创作流程，进而展现出新媒体动态设计的轮廓概貌。
本书适合作为高等院校和职业院校设计相关专业教材，也可以作为该领域的从业者和爱好者的参考用书。

鲁美传媒动画学院，副教授，艺术与科技专业学科带头人，负责实验及本科教学工作。负责的相关课程有：计算基础、数字动态设计基础、自媒体动画设计、动画短片设计。

第一章 新媒体动态设计概述 001
第一节 动态设计的发展历程 002
一、动态设计的起源 002
二、动画产业的崛起 002
三、动态设计的初步探索 003
四、移动设备和应用的崛起 003
五、动态设计的挑战和前景 003
第二节 动态设计的基本概念 004
一、什么是动态设计 004
二、动态设计在新媒体中的应用 005
三、基本动画技巧 006
第三节 新媒体动态设计的优势和应用 008
一、新媒体动态设计的特点 009
二、新媒体动态设计的优势 009
三、新媒体动态设计的应用 009
四、新媒体动态设计的设计要点 010
第四节 动态设计的设计元素和设计原则 010
一、设计元素 011
二、设计原则 011
三、迪士尼动画的十二原则 012
第五节 常见动态设计软件和工具 016
一、二维动画软件 017
二、三维动画软件 018
第六节 新媒体动态设计的发展趋势和前景展望 019
一、技术驱动的创新 020
二、用户体验的重塑 020
三、跨媒体融合与互联性 020
四、数据驱动 020
五、设计伦理与社会责任 021
六、可持续性设计 021

第二章 新媒体动态设计的创意构思 023
第一节 创意构思的流程和方法 024
一、常见的创意构思流程 024
二、 动态设计创意构思方法 025
第二节 设计思维的应用 026
一、用户观察与人性化设计 026
二、问题定义与原型测试 026
三、创新与品牌差异化 027
四、敏捷设计和快速迭代 027
五、跨学科合作 028
第三节 创意构思的案例分析 028
一、常见的网站动态设计的创意应用 028
二、可视化数据 029
三、交互游戏 030
四、艺术品展示 030
五、品牌与产品宣传 031

第三章 新媒体动态设计的实现方法 033
第一节 HTML 基础与动态设计准备 034
一、HTML 简介 034
二、HTML 的基础结构 034
三、常用HTML 元素简介 035
四、CSS 和JavaScript 与HTML 的互动 036
五、HTML5 新特性与动态设计 036
六、开发者工具与动态设计 036
第二节 使用JavaScript 制作动画 037
一、JavaScript 及其在动画制作中的角色 037
二、JavaScript 的基础知识 037
三、使用JavaScript 进行DOM 操作 039
四、使用JavaScript 创建动画 040
五、实战：使用JavaScript 制作一个简单的动画 042
六、JavaScript 动画的优化 043
七、JavaScript 动画库 044
第三节 使用CSS 制作动画 046
一、CSS 及其在动画制作中的角色 046
二、CSS 基础知识 046
三、初识CSS 动画 047
四、深入理解CSS transition 049
五、深入理解CSS animation 051
六、CSS 动画的优化 052
七、CSS 动画库 053
第四节 使用动态设计软件实现动态效果　　 055
一、 动态网页设计工具概述 055
二、 Adobe Dreamweaver：综合网页设计工具 056
三、 Adobe XD：从静态到动态 057
四、 Webflow：无代码网页动态设计 058
五、 跨平台设计工具 059

第四章 动态设计在新媒体中的应用 061
第一节 动态设计在网页设计中的应用 062
一、动画效果 062
二、页面转场效果 066
第二节 动态设计在APP 设计中的应用 067
一、交互性元素 067
二、动态过渡效果 068
三、动态加载 069
四、导航菜单 071
五、数据可视化 074
第三节 动态设计在品牌形象设计中的应用 075
一、动态品牌标志 075
二、动态字体设计 076
三、动画包装设计 076
四、动态广告设计 077
五、品牌的动态社交媒体营销 077
六、虚拟现实和增强现实体验 078

第五章 新媒体动态设计的优化和测试 081
第一节 动态设计的优化方法 082
一、硬件、软件的优化 082
二、关键帧动画优化 082
三、动画合并 083
四、减少细节 084
五、素材优化 085
六、预渲染和缓存 085
七、层次化动画 086
八、质量和性能平衡 087
第二节 动态设计的测试方法 087
一、观察与分析 087
二、动作演绎 087
三、遵循动画法则 088
四、用户反馈与用户交互 088
五、原型测试 089
六、提供优雅降级方案 089
七、专家评审 089
第三节 动态设计的调整和改进 089
一、姿势和动作的流畅性 089
二、时间和节奏 091
三、表情和姿态 092
四、造型优化 094
五、特效和粒子效果 095
六、反馈和迭代 095

第六章 新媒体动态设计案例分析 097
第一节 网页动态设计案例 098
一、菜单导航 098
二、页脚设计 101
三、鼠标悬停 103
四、加载 105
第二节 APP 动态设计案例 106
一、视觉反馈 106
二、按钮点击反馈 107
三、菜单展开和折叠 107
四、元素视觉引导 108
五、系统状态 109
六、有趣的动效 109
第三节 品牌形象动态设计案例 110
一、标志设计的动态化 110
二、海报设计的动态化 112
三、表现形式的动态化 115
四、未来趋势与挑战 119

第七章 新媒体动态设计进阶技巧 121
第一节 利用SVG 实现动态效果 122
一、SVG 入门 122
二、掌握SVG 基础 122
三、SVG 颜色和样式 123
四、SVG 变换和动画 124
五、SVG 天气图标项目实战 126
第二节 利用Canvas 实现动态效果 127
一、Canvas 入门 127
二、掌握Canvas 基础 128
三、Canvas 颜色和样式 131
四、Canvas 图形变换 131
五、Canvas 事件和交互 132
六、Canvas 像素操作和性能优化 132
七、Canvas 项目实战 134
第三节 利用WebGL 实现动态效果 136
一、WebGL 简介 136
二、WebGL 环境和基本语法 136
三、WebGL 图形渲染基础 139
四、WebGL 坐标系统和变换 139
五、WebGL 光照 143
六、WebGL 动画和交互 148
七、 WebGL 性能优化 150

参考文献 152