UI动效设计从入门到精通

?内容全面：围绕两大主流动效应用端（移动端和Web端），展示了各类典型动效实现方法。
?平台多样：包括After Effects、Android、Illustrator、JavaScript、CSS3、DragonBones、Animate、Cinema 4D等。
?体系完整：从简单到复杂、从理论到实践、从进阶到高阶、从二维到三维，为读者搭建了完整的知识体系。
?视角独特：有序介绍了动效的作用、设计原则、分类、动效设计方法及动效制作软件，展示了基础动效、高级动效、3D动效等实现方法。
?应用性强：每一部分均配有典型的应用实例，帮助读者汲取动效开发的技术精粹，火速上手实际工作中。
?无缝连接：将After Effects动效导出到Android和Web应用中，将Cinema 4D动效导出到After Effects等。

动效是科技产品“情感化设计”的纽带，的动效设计在提升产品体验、用户黏性方面能够起到积极作用，
让产品充满生命力，使用户和界面之间产生情感的联系，从而提升用户体验。目前，动效已成为APP产品交互
设计和界面设计必不可少的元素之一。
本书是关于UI动效设计的实战教程图书，内容涵盖两种*典型、应用*广泛的动效应用端：移动端和Web端，
包括动效的作用、设计原则、分类、动效设计方法、动效典型制作软件及各类动效实例，其中，制作平台包
括After Effects、Android、Adobe Illustrator、 JavaScript、CSS3、DragonBones、Adobe Animate和
Cinema 4D等，动效实例包括基础动效、高级动效、3D动效等。
本书可作为UI设计等相关从业人员的参考手册，也可作为大中专院校设计相关专业的培训教程，还可作为广
大视觉设计和动效开发爱好者的拓展学习资料。

博士后、北京市高创名师、北京市教学名师、北京市专业创新团队带头人。2010年至今指导学生参加全国职业技能竞赛获得一等奖4项、二等奖5项，曾出版著作十余本，撰写发表论文几十篇，涉及EI检索论文3篇、国际会议论文5篇、核心期刊4篇，以及教育改革十余篇等。

动效基础知识
1.1为什么要为APP设计动效/
1.2动效应用/
1.2.1移动APP动效/
1.2.2Web网站动效/
1.3移动APP动效设计/
1.3.1什么是移动APP的交互动
效设计/
1.3.2移动APP动效的作用/
1.3.3移动APP动效设计原则/
1.3.4移动APP交互动效分类/
1.4Web网站动效设计/
1.4.1Web网站动效设计原则/
1.4.2动效网站设计欣赏/
1.5动效设计方法/
1.6动效制作软件/
1.6.1After Effects/
1.6.2Adobe Photoshop/
1.6.3Adobe Illustrator/
1.6.4Adobe Edge Animate/
1.6.5Adobe Animate CC/
1.6.6Quartz Composer/
1.6.7Principle/
1.6.8Framer/
1.6.9jQuery/
1.6.10Origami/
1.6.11Cinema 4D/
1.6.12Flinto/
1.6.13Hype /
1.7动效设计流程/
1.8本章小结/
动效的分类和作用
2.1基础动效/
2.1.1运动/
2.1.2放大和缩小/
2.1.3消失和出现/
2.1.4翻转/
2.1.5旋转/
2.1.6变形/
2.1.7变色/
2.2动效作用/
2.2.1使界面充满动感/
2.2.2系统状态动态提示/
2.2.3使界面友好有趣/
2.2.4流畅的过渡/
2.2.5界面元素的灵活隐藏和
展示/
2.2.6增强操纵感/
2.2.7高效反馈/
2.2.8引导作用/
2.2.9创新体验/
2.3动效分类/
2.3.1视觉反馈动效/
2.3.2空间拓展动效/
2.3.3功能改变动效/
2.3.4层次结构交互动效/
2.3.5视觉提示动效/
2.3.6系统应用提示动效/
2.3.7趣味交互动效/
2.3.8转场动效/
2.4动效评判/
2.5本章小结/After Effects的应用
3.1After Effects简介/
3.1.1After Effects软件及
特点/
3.1.2After Effects CC工作
界面/
3.1.3After Effects CC的
合成/
3.1.4After Effects CC的图层/
3.1.5After Effects CC的
渲染/
3.2After Effects CC 动画/
3.2.1关键帧动画/
3.2.2效果动画/
3.2.3蒙版动画/
3.2.4文字动画/
3.2.5表达式动画/
3.2.63D动画/
3.3After Effects动画导出/
3.3.1导出为视频和图像
序列/
3.3.2应用Bodymovin把After Effects
动画转换成Web/Android/iOS
原生动画/
3.3.3应用Lottie库实现Android/
iOS/Web加载After Effects
动画/
3.4在Android中应用After Effects
动画/
3.5在Web中应用After Effects
动画/
3.6本章小结/
Android基础动画
4.1绘图动画/
4.1.1Graphics类基础/
4.1.2Matrix类变换图片/
4.1.3绘制路径文字/
4.1.4绘制图片倒影/
4.1.5drawBitmapMesh实现图像
扭 /
4.2矢量动画/
4.2.1Android SVG动画/
4.2.2插值动画/
4.3Drawable动画/
4.3.1Drawable类/
4.3.2Drawable实现Frame动画
效果/
4.3.3Drawable的高效用法/
4.4Tween补间动画/
4.5属性动画/
4.5.1Animator/
4.5.2ObjectAnimator/
4.5.3AnimatorSet/
4.6控件动画/
4.6.1图片滑动切换/
4.6.2图片手势放大缩小/
4.6.3PhotoView和ViewPager
实现图片滑动和缩放/
4.6.4列表折叠/
4.7本章小结/
APP基本动效
5.1滑动/
5.2缩放/
5.3展开折叠/
5.4横竖屏切换/
5.5堆叠切换/
5.6提示/
5.7图表/
5.7.1MPAndroidChart/
5.7.2HelloCharts/
5.7.3AChartEngine/
5.7.4XCLCharts/
5.7.5GraphView/
5.7.6HTML5数据图表/
5.8滑动删除/
5.9GitHub中优秀的开源动效
项目/
5.10本章小结/
APP进阶动效
6.1图标/
6.1.1PS打造相机图标/
6.1.2AI打造动感立体图标/
6.2导航和菜单动效/
6.2.1BottomTabBar实现导航
动效/
6.2.2DrawerLayout和Navigation
View实现Android策划
菜单/
6.2.3jQuery和CSS3制作手风琴
折叠菜单/
6.2.4jQuery和CSS3实现导航
菜单/
6.3Loading动效/
6.3.1Android中进度条/
6.3.2Progress Wheel/
6.3.3AE制作水波纹
Loading/
6.3.4AE插件Loadup轻松创建
各式Loading进度条/
6.4手势动画/
6.4.1Android手势动画/
6.4.2点击波网页动画特效/
6.4.3AE手势动画库/
6.5文字动效/
6.5.1AI与AE打造漂亮字体
动效/
6.5.2AE Saber插件制作字体
动效/
6.5.3jQuery和CSS3实现彩色霓虹灯发光文字动效/
6.5.4网页SVG文字动效/
6.5.5AE Super Text Pack/
6.6AE Trapcode 插件/
6.6.1安装Trapcode/
6.6.2Trapcode Particular粒子
特效/
6.6.3Trapcode 3D Stroke制作
文字描边/
6.6.4Trapcode Mir制作变形
动画/
6.7本章小结/
Android中的3D动画
7.1Camera 3D动画实现/
7.1.1Camera 3D实现图片旋转
动画/
7.1.2Roate3dAnimation实现旋转
图片动画/
7.1.3Rotate3D实现3D旋转
动画/
7.1.4Camera与Matrix实现3D
立方体/
7.2OpenGL ES/
7.2.1OpenGL ES基础/
7.2.2在Android中使用OpenGL
ES/
7.2.3Android中OpenGL ES
基本操作/
7.2.4OpenGL ES实现彩色旋转
的立方体/
7.3本章小结/
HTML5动画
8.1HTML5动画简介/
8.1.1canvas元素结合
JavaScript/
8.1.2纯粹的CSS3

感谢您选择本书，为了帮助您更好地学习本书的知识，请阅读下面的内容。
动效是科技产品“情感化设计”的纽带，在设计清晰的逻辑和漂亮的界面以后，需要使用动效将这些漂亮的设计衔接起来。
界面、交互、动效构成了情感化设计的三大载体，其中的动效不仅仅是界面的润滑剂，它的作用更多地体现在交互逻辑、
视觉渲染和创新实践上。
本书是关于APP动效设计的实战教程图书，全书共9章，从移动和网站开发的视角，有序介绍了动效的作用、设计原则、分类、
动效设计方法、动效制作软件、APP基础动效的制作、APP高级动效的制作、Android中的3D动画、HTML5动画和使用Cinema 4D制
作3D 特效等内容，具体如下。
第1章为动效基础知识，包括动效的应用、APP动效设计原则和分类、动效设计方法及动效制作软件。
第2章介绍动效的分类和作用，包括常见的各种基础动效的描述、动效的各种作用的描述、动效的各种分类的描述及动效的评判方法。
第3章介绍了动效设计软件After Effects（简称AE）的应用，包括该软件的特点、工作界面、合成、图层、渲染和输出，使用Bodymovin
插件导出动画的方法，在Android中使用Lottie导入AE动画的方法及Web中使用AE动画的方法。
第4章介绍Android基础动画，包括Android中的绘图动画、矢量动画、Drawable动画、属性动画和控件动画的实现方法。
第5章介绍APP基本动效的制作方法，讲解了APP各种典型动效的实现方法、APP各种类型图表的制作方法及GitHub中优秀的开源动效项目。
第6章介绍APP进阶动效的制作方法，包括图标、导航和菜单动效、Loading动效、手势动画、文字动效和After Effects高级动效，并结
合具体实例展示了详细操作步骤。
第7章介绍Android中的3D动画。在Android应用程序中，3D动画具有更好的表现效果。本章结合具体实例介绍在Android中实现3D动画效果
的两种典型方法：一是Camera实现3D动画，二是使用OpenGL ES动画库实现3D动画。
第8章介绍了HTML5动画。HTML5动画是目前网页广泛使用的动画，本章介绍了HTML5 动画的三种典型形式：（1）Canvas元素结合JavaScript；
（2）纯粹的CSS3动画；（3）jQuery动画。除此之外，本章还详细介绍了HTML5动画的两个制作工具DragonBones和Adobe Animate CC的应用方法。
第9章介绍使用Cinema 4D制作3D 特效的方法。Cinema 4D是目前主流的3D效果制作软件，用于3D建模、绘制、动画和渲染。本章介绍了Cinema 4D
的基本操作、运动图形、角色动画及RealFlow插件，并结合相关实例进行了说明。
本书具有下列特点。
（1）内容全面：内容涵盖两种 典型的动效应用端：移动端和Web端，基于这两种平台介绍了典型的动效实现方法。
（2）制作平台多样：本书涵盖多种典型的动效制作平台，包括After Effects、Android、Adobe Illustrator、 JavaScript、CSS3、DragonBones、
Adobe Animate、 Cinema 4D等，通过这些典型制作软件的展示，让您了解各平台的优点和适用范围。
（3）系统完整：从简单到复杂、从低级到高级、从二维到三维，系统介绍了动效的完整知识体系。
（4）视角独特：从移动和网站开发的视角，有序介绍动效的作用、设计原则、分类、动效设计方法及动效制作软件，循序渐进地介绍了基础、高级、
3D等动效的实现方法。
（5）应用性强：每一部分配以应用实例，让您轻松领会动效开发的精髓，快速提高开发技能。
由于编写时间仓促，加之作者水平有限，书中疏漏和错误之处在所难免，望广大专家、读者提出宝贵意见，以便修订时加以改正。