前言

如今移动端App 应用种类繁多，如何才能够让自己设计的移动App 应用脱颖而出呢？设计师需要考虑的，不仅仅是产品如何更合理地展现结构与功能，更重要的是思考所开发的移动应用App 如何做到简便易懂的同时又带给用户新颖感。此时，有限的屏幕空间仅靠文字的提示是不够的，移动应用App 需要更多的新鲜血液——动效设计。动效设计可以拓展空间内容，简化引导流程，降低学习成本，更重要的是给用户带来意想不到的惊喜，它就像人类的肢体语言，通过肢体语言传达更多的抽象信息和性格特征。

动效是物体空间关系与功能有意识的流动之美，它让用户更了解交互。《After Effects CC移动网站UI交互动效设计全程揭秘》紧跟移动交互设计的发展趋势，向读者详细介绍UI 交互动效设计的相关知识，并讲解目前流行的交互动效制作软件After Effects，通过基础知识与实例操作相结合的方式，使读者在理解的基础上能够更加快速动手制作出各种实用的界面交互动效，真正做到学以致用。

《After Effects CC移动网站UI交互动效设计全程揭秘》从交互设计的基础知识开始，由浅入深地详细介绍UI 交互动效设计的知识，以及如何使用After Effects 软件制作各种常见的交互动效，将知识点与实例相结合，使学习过程不再枯燥乏味。全书共分6 章，各章内容介绍如下。

第1 章　理解UI 交互设计，本章主要介绍UI 交互设计以及用户体验的相关基础知识，使读者对UI 交互设计有基本的了解，动效设计的最终目的就是为了提升UI 界面的交互体验。

第2 章　初识UI 交互动效，本章主要介绍UI 交互动效设计的基础知识，使读者能够更好地理解什么是交互动效，以及交互动效与UI 设计之间的关系，并且能够理解UI 交互动效的应用范围和常见表现效果。

第3 章　After Effects 软件基础操作，本章主要介绍交互动效制作软件After Effects，从认识该软件的工作界面着手，到软件的基本操作方法、重要的功能面板和操作技巧，并通过一些简单的交互动效实例的制作，使读者能够快速掌握After Effects CC 软件的基本操作和使用方法。

第4 章　在After Effects 中制作动效并输出，本章主要介绍在After Effects 中制作交互动效最重要的关键帧的概念及其操作方法，还介绍了有关运动路径、蒙版等高级动画的表现方法，以及如何将After Effects 中所制作的动效进行渲染输出的方法。

第5 章　制作UI 元素交互动效，本章主要介绍UI 界面中各种元素交互动效的表现和设计方法，并结合实例练习，使读者能够快速掌握各种UI 元素交互动效的制作方法。

第6 章　UI 界面动效设计，本章主要介绍UI 界面交互动效设计的相关知识，包括加载动效、引导界面动效、导航菜单动效、界面切换动效和其他界面动效等，通过知识点的学习使读者能够理解UI 界面动效设计的要点，通过实例的制作使读者掌握UI 界面动效的制作方法。

《After Effects CC移动网站UI交互动效设计全程揭秘》由张晨起编著，另外张晓景、李晓斌、高鹏、胡敏敏、张国勇、贾勇、林秋、胡卫东、姜玉声、周晓丽、郭慧等人也参与了《After Effects CC移动网站UI交互动效设计全程揭秘》的部分编写工作。《After Effects CC移动网站UI交互动效设计全程揭秘》在写作过程中力求严谨，由于作者水平所限，书中难免有疏漏和不足之处，希望广大读者批评、指正，欢迎与我们沟通和交流。

QQ 群名称：网页设计与开发交流群；QQ 群号：705894157。

为了方便读者学习，《After Effects CC移动网站UI交互动效设计全程揭秘》为每个实例提供了教学视频，只要扫描一下书中实例名称旁边的二维码，即可直接打开视频进行观看，或者推送到自己的邮箱中下载后进行观看。《After Effects CC移动网站UI交互动效设计全程揭秘》配套的立体化学习资源中提供了书中所有实例的素材源文件、最终文件、教学视频和PPT 课件，并附赠海量实用资源。读者在学习时可扫描下面的二维码，然后将内容推送到自己的邮箱中，即可下载获取相应的资源( 注意：请将这两个二维码下的压缩文件全部下载完毕后，再进行解压，即可得到完整的文件内容)。

编　者