配套课件-APP交互动画设计从入门到精通.ppt

1、 第1章 交互设计的基础知识第1章 交互设设计的基础知识交互设计的概述什么是交互设计？交互设计定义了两个或多个互动的个体之间交流的结构和内容，使之相互配合，共同达成某种目的。这些个体指的是人及其使用的产品和接受的服务。交互设计努力去创造和建立的是人与产品及服务之间的有意义的关系。交互设计以“在充满社会复杂性的物质世界中嵌入信息技术”为中心。交互性，并不仅限于技术系统，还包括其他非电子类产品和服务，甚至可以是组织。从本质上说，所有人都拥有交互的能力，人们从成为一个物种以来一直在交互，并且人类的交流方式，不管是语言的还是非语言的，都是交互性的。但是“交互”成为一个设计话题仅仅是最近30 年的事情，

2、与计算机、信息和通信技术的发展一切相关。第1章 交互设设计的基础知识计算机的人机界面设计是交互设计起源从1666 年英国人Samuel Morland 发明了可以计算加数及减数的一部机械计数机开始，到20世纪中期电子计算机的出现，计算机只是替代人，从事数据计算的一台机器。设计这些笨重的计算机器唯一的是使机器运行速度更快，计算机能力更加强大。直到20 世纪70 年代，计算机一直属于少数专业技术人员操控的特殊机器，这些技术人员非常了解这些机器的运作机制。他们的工作是把一个复杂的计算机过程加以分解，从数值计算和逻辑电路的基本操作的角度，撰写一连串令普通人费解的编码，并用穿孔纸带输入，控制计算机的运行

3、，计算机的工作主要是科学计算，离普通人的生活很遥远。第1章 交互设设计的基础知识交互设计的对象成为计算机1979 年出现了首批真正的个人计算机程序，其中包含VisiCorp 公司的VisiValc，这是第一种基于个人计算机的电子数据表，Micropro 公司的Wordstar 文字处理软件。正式由于这样的一批应用软件是的计算机从爱好这的玩具变成了现代办公司必备的设备。个人计算机开始普及，应用软件越来越多，易用性的问题便凸显出来。在1981 年Xerox Alto 机器的商用版本star 的开发中，交互界面的设计问题受到重视。从Star 开始，“设计”开始被有意识地应用到解决人机交互界面问题中。

4、1981 年，Bill Maggridge 设计出第一台笔记本电脑“Grid Compass”，随后1984 年他在一次会议中提出交互设计的概念，一开始只是想着将软件与用户界面设计的结合，因此称为“softface”(软件界面)，随后更名为“Interaction Deign”(交互设计)。第1章 交互设设计的基础知识工业设计与交互设计工业设计的核心原理和交互设计是重合的，工业设计的很多理念和工作方法在交互设计中被采用，尤其是以用户为中心的工作方法。广义上，工业设计师的责任是定义产品、使用者及环境的相互关系，通过产品创造新的生活方式，满足人们的需要。不可或缺的工作内容是通过设计产品的形式向使用

5、者创达产品功能品质等信息，即为一个产品找到其恰当的表现形式，创造出适用于用户和目标市场的不同的结构外观和风格。第1章 交互设设计的基础知识艺术与交互设计新媒体艺术包含的交互是在最近的20 年被人们激烈的讨论甚至争论的主题，而现在我们在艺术作品里看见的那些交互一直不断地在扩大艺术与交互的定义。就像很多电脑游戏能被当做是艺术，很多艺术作品能被当做是交互设计，还有一直不断扩张的项目也可以被归类进艺术画廊或者设计展览。区分交互艺术和交互设计并没有很大的意义。虽然这些不同领域的专业各不相同，但是其实他们都是有同样的目的。他们的目的是为用户设计产品或者体验，重要的是他们有着同样的工具以及工作流程，就是先从

6、思路到方案，最后再到最终成品的展示。第1章 交互设设计的基础知识了解交互设计的系统观交互可以定义为两个或两个以上活动的参与这之间的信息流程。交互活动的参与者，一方是某个有感知和反馈的物体系统，这是交互设计的对象。另一方是与系统发生交互的人，被称为用户，交互设计的目的是设计某种让人能够以有意义的方式与之互动的系统。作为一个交互设计者，必须去理解用户想要的以及系统应如何反应。系统可以是任何东西；一个游戏，一份菜单，一系列连接的感应器与灯，一个复杂的物理互动器械，甚至是一群人。第1章 交互设设计的基础知识不产生误解创建交互应用最困难的任务之一是去理解系统怎样看待来自用户的信息，以及用户怎样看待系统提

7、供的信息。交互性程度很高的应用能为用户和系统完成更多任务，也能允许更复杂的信息传递，但同时用户和系统对话时更容易搞不清楚对方的意思。当一方的信息不能被理解时，帮助另一方理解信息以及怎样解决问题是很重要的。如果读者不理解别人对他说的话，读者会要求他重复一遍。如果读者请求进入一个不存在的网页，服务器就会回应读者一个错误页面，告诉读者那个网页不存在。每一方拥有的自由度越高，错误的和意外的信息出现的可能性越大，因此培养一方了解对方理解了哪些信息以及这种理解是怎样建立的就变得更有必要了。第1章 交互设设计的基础知识体验更加完美避免交互过程中的误解，只是交互设计的一个基本方面，起终点在于产品界面和文档的易

8、学习性、易用性和满意度等方面，而现在交互设计一个更吸引人的话题是完整的用户体验，包括产品的品牌、审美、趣味性和愉悦性。这种发展的依据是用户的阶梯形需求，功能性在最底部(有用)，易用性在中间(好用)，而愉悦和感情的满足在顶部(想用)。作为愉悦性设计的倡导者，PatrickJordan 形容从功能性到愉悦性的进步与马斯洛的人类需求层次相类似，在底层需求满足以后人们就追求更高层次的需求。最新的一些情感化设计、愉悦性设计和趣味学等方面的书籍和文章都表明了这一趋势。第1章 交互设设计的基础知识如何描述交互设计如同建筑领域土木工程师中研究建筑结构的设计，而建筑师则设计人们居住在此结构内的生活方式一样，在计

9、算机的世界里，工程师主要担当了设计计算机系统的颜色，确保了系统的稳定性，而交互设计师则设计使用者与计算机系统和产品的交互方式，确保系统可用和有吸引力。交互设计工作的创作步骤真实的交互工作的创作流程大致上是由以下的过程结合而成的：用户研究和设计调研、概念设计、设计、实验和原型、实验和原型。第1章 交互设设计的基础知识交互形式文本命令行和提示符界面直到现在还在使用，用户在一个终端输入命令代码，然后运行，结果在屏幕上以文字的形式显示。这种交互理念是通过一个被计算机预定识别的命令系统来实现的。使用者必须掌握丰富的知识，或者至少适应于空白界面上请求帮助。真正的用户界面改革并没有很多，键盘的发明，鼠标，画

10、板，台式机图形用户界面，还有现在的电容触摸屏。这些都是科学技术的进步，它们同时也改变了人们使用电脑的方法。革命性的界面模型不只是一个工具诞生的途经，还重新定义了一个工具如何被使用的可能性。第1章 交互设设计的基础知识交互设计动画是一个很明显的动态过程，人与人之间的交互就很容易，你问他答，你来我往，以及传统文化中的礼尚往来。交互式双方向彼此都对对方产生影响，进而影响到对方下一步的反应。这是人与人之间的交互，随着科技的发展，交互已经不仅仅局限于人与人之间的交互，还存在与人与机器之间的交互。例如手机，手机作为媒介将用户想要表达的传递出去，为了能够更加完美的传递用户所要表达的内容，人与手机的交互成为了

11、目前比较流行的交互设计，在实现这一交互之前，设计人员首先要将这一交互所要展现的效果设计出来，进行逐一的实验，讨论与研究，最终选择最为优秀的交互设计，然后传递给后方的开发人员来实现这一交互的最终效果。在这一过程中交互设计师要做出满足于用户群体的人机交互动画。将适用于用户群体的交互设计制作成动画的效果，供后发的开发人员理解与实现交互的最终效果。第1章 交互设设计的基础知识了解After EffectAdobe 公司最新推出的After Effects CC 后期特效制作软件，很快受到视频影像爱好者和广播电视从业人员的青睐和欢迎，虽然影视制作软件对计算机硬件要求很高，然而随着计算机硬件技术，尤其是处

12、理器和图像/视频设备的飞速发展，性能大幅度提高的同时硬件价格越来越平易近人，促进了影像技术进入更多电脑爱好者的视野。Adobe After Effects CC 软件使用行业标准工具创建动态图形和视觉效果，无论用户身处广播电视、电影行业，还是为在线移动设备处理作品，Adobe After Effects CC 软件都可以帮助设计者创建出震撼的动态图形和出众的视觉效果。第1章 交互设设计的基础知识After Effects 的应用领域随着社会的进步，科技的发展，电视、计算机、网络、移动多媒体等媒体设备越来越广泛地普及到我们的生活中。每天我们都通过不同的媒体观看了解多彩的新闻时事、生活资讯、娱乐节

13、目，这已经成为我们生活不可缺少的一部分。正因为有了这些载体，影视后期处理的发展也越来越快，影视后期处理软件的应用领域也越来越广泛。其中包括：电影特效、影视动画、点电视栏目及频道片头、城市形象宣传片、楼盘建筑宣传片、产品宣传广告、企业宣传片、专题活动宣传、交互设计动画制作。第1章 交互设设计的基础知识常见的交互动画效果经过前面的学习了解到，交互设计指的是设计人和产品或服务互动的一种机制。以用户体验为基础进行人机交互设计师要考虑用户的背景、使用经验以及在操作过程中的感受，从而设计符合最终用户需求的产品。保存与格式的输出完成交互设计动画的制作，可以将项目进行保存，默认的保存格式为.aep 格式，保存

14、的源文件可以同时保存After Effects 当时所有面板的状态，例如面板位置、大小和参数，便于以后进行修改。第1章 交互设设计的基础知识本章中主要向读者讲述了交互设计的起源、交互设计的实质、交互设计的基础目标以及交互设计的意义和步骤，通过一系列的了解与掌握，最终过渡到交互设计动画效果的制作，了解大众所熟悉的影视剪辑软件，并知道其在交互设计动画制作上的使用。通过简单的实例操作，对软件操作有一个初步的了解。为日后的学习打下基础。第2章 辅助设计的软件基础第2章 辅助设计的软件基础在前面的章节中已经简单的了解了After Effects，接下来在本小节中对After Effects 安装的系统要

15、求进行细致的掌握，以便于辅助交互设计效果的实现。接下来主要对Windows 操作系统和MacOS 操作系统进行细致的介绍。1.Windows 操作系统要求 2.Mac OS 操作系统要求第2章 辅助设计的阮籍基础如何切换工作区After Effects 中有多种工作区，其中包括标准、所有面板、效果、浮动面板、简约、动画、文本、绘画和运动跟踪等工作区。不同的界面适合不同的工作需求，使用起来更加方便快捷。工具栏的使用执行“窗口 工具”命令，或者按快捷键Ctrl+1，可以在工作界面中显示或隐藏工具栏。工具栏中包含了常用的编辑工具，使用这些工具可以在“合成”窗口中对素材进行编辑操作，如移动、缩放、旋转

16、、绘制图形和输入文字等，After Effect CC 中的工具栏。第2章 辅助设计的阮籍基础“项目”面板“项目”面板主要用于组织、管理项目中所使用的素材。动画制作所使用的素材都要首先导入到“项目”面板中，在该面板中可以对素材进行预览，“项目”面板。单击“项目”面板右上角的向下三角按钮，可以弹出“项目”面板菜单，在菜单中选择相应的选项，可以进行相应的操作。“合成”窗口“合成”窗口是动画效果的预览区，在进行动画项目的安排时，它是最重要的窗口，在该窗口中可以预览到编辑时每一帧的效果。如果要在“合成”窗口中显示画面，首先需要将素材添加到时间线上，并将时间滑块移动到当前素材的有效帧内才可以显示。第2章

17、 辅助设计的阮籍基础“时间轴”面板“时间轴”面板是After Effect 工作界面的核心组成部分，动画编辑工作的大部分操作都是在该面板中进行的，它是进行素材组织和主要操作的区域。当添加不同的素材后，将产生多层效果，然后通过层的控制来完成动画的制作。使用菜单栏在After Effects CC 中，根据功能和使用目的将菜单命令分为9 类，每个菜单项中包含多个子菜单命令。文件菜单中包含着相应的新建、打开项目、打开最近的文件、在Bridge 中浏览等相应的命令。执行不同的命令为用户实现相应的效果。第2章 辅助设计的阮籍基础“信息”面板“信息”面板主要用来显示素材的相关信息，在“信息”面板的上部分，

18、主要显示如RGB 值、Alpha 通道值、鼠标在“合成”窗口的坐标位置；在“信息”面板的下部分，根据选择素材的不同，主要显示素材的名称、位置、持续时间和出入点等信息。“对齐”面板“对齐”面板主要用对素材进行对齐与分布处理。执行“窗口 对齐”命令，可以打开或关闭“对齐”面板。第2章 辅助设计的阮籍基础“音频”面板在“音频”面板中可以对项目中的音频素材进行控制，实现对音频素材的编辑，执行“窗口 音频”命令，或按快捷键Ctrl+4，可以打开或者关闭“音频”面板，“音频”面板的面板菜单。“预览”面板“预览”面板主要对合成内容进行预览操作，并且可以控制素材的播放与停止，还可以进行预览的相关设置。第2章

19、辅助设计的阮籍基础“效果和预设”面板“效果和预设”面板中包含了动画预设、3D 通道、实用工具、扭曲、文本、时间、杂色和颗粒等多种特效，是进行动画编辑的重要部分，主要针对时间线上的素材进行特效处理。一般常见的特效都是使用“效果和预设”面板中的特效来完成的。“图层”面板“图层”面板与“合成”窗口类似，不同的是“合成”窗口显示的是当前合成中多个图层素材的最终效果，而“图层”面板中显示的只是单一图层中素材的原始效果。第2章 辅助设计的阮籍基础“效果控件”面板“效果控件”面板主要用对于对各种特效进行参数设置。当前一种特效添加到素材上时，该面板将显示该特效的相关参数设置，用户可以通过参数的设置对特效进行修

20、改，从而达到所需要的效果。“图层”面板“对齐”面板主要用对素材进行对齐与分布处理。执行“窗口 对齐”命令，可以打开或关闭“对齐”面板。第2章 辅助设计的阮籍基础项目文件的基础操作运行After Effects CC 软件后，需要新建项目和合成，这是After Effects CC 最基本的操作之一，当用户完成了对项目文件的相应制作时，需要做的就是对项目进行保存和关闭了。导入素材的文件在After Effects 中，当创建了一个新的项目文件后，通常需要将相关的素材导入到“项目”面板中，对于不同类型的素材，After Effects 有着不同的导入设置，根据选项设置的不同，所导入的图片也不同，根

21、据格式的不同其导入的方法也不相同。第2章 辅助设计的阮籍基础素材的基础操作在使用After Effects 软件进行动画编辑的时候，完成导入素材的操作后，这些素材只是出现在“项目”面板中，如果想要进一步对项目进行编辑，就需要对这些素材进行一些基本的操作。辅助功能的使用在使用After Effects CC 对素材进行编辑时，往往需要配合一些辅助功能使用，包括网格、快照、标尺、参考线、安全框、通道和预览区域等，通过这些辅助功能的使用，可以使编辑素材的操作变得更加得心应手。第2章 辅助设计的阮籍基础After Effects 中的基本工作流程在After Effects CC 中进行影视特效后期制

22、作时，需要新建项目和合成。在启动After Effects 时，会自动创建一个空的项目，而此时并没有合成存在，所以在开始创建之前必须先新建合成。完成了项目和合成的创建后，接下来可以将相关的素材导入到所创建的项目中，以便于在After Effects CC 中进行合成处理。在项目中导入相应的素材后，可以将素材添加到合成的“时间轴”面板中，为素材添加相应的特效进行处理。在合成的处理中，不仅可以为素材添加相应的特效，还可以在项目合成中添加文字，并制作文字效果。在软件中除了可以添加静态的文字，还可以为文字添加动画效果，使最终的效果更加具有动态。在软件中完成项目效果的处理后，可以将项目保证，并且渲染输出

23、所制作的项目，这样就可以看到所自作的项目效果。第2章 辅助设计的阮籍基础本章主要介绍了After Effects CC 基本知识，并详细地介绍了基本的操作方法和操作过程。目的是在日后的交互动画制作过程中对软件的操作更加熟练。设计出更加完美的交互动画。第3章 使用After Effects中的图层与时间线第3章 使用After Effects中的图层与时间线素材图层素材层是通过将外部的图像、音频、视频导入到After Effects CC 软件中，添加到“时间线”面板中自动生成的层，可以通过修改变换属性达到移动、缩放和透明等效果。文本图层After Effects CC 中的文字层能够在动画中添

24、加相应的文字及文字动画，执行“图层 新建文本”命令或者按快捷键Ctrl+Alt+Shift+T，即可新建文本图层。创建文本图层后，在“字符”面 板中对文字的大小、颜色和字体等进行设置，即可在“合成”窗口中输入想要的文字。第3章 使用After Effects中的图层与时间线固态图层纯色层在影片中主要用来制作蒙版效果，同时也可以作为承载编辑的图层，在固态层上制作各种效果。执行“图层 新建 纯色”命令或者按快捷键Ctrl+Y，弹出“纯色设置”对话框，在对话框中完成各项参数的设计，单击“确定”按钮，既可以创建一个固态层。灯光层灯光层是用来模拟不同种类的真实光源，如家用电灯、舞台灯等。灯光层中包含4

25、种灯光类型，分别为平行光、聚光、点光和环境光，不同的灯光类型可以营造出不同的灯光效果。第3章 使用After Effects中的图层与时间线摄像机层摄像机层是用于控制合成最后的显示角度，也可以通过对摄像机层创建动画来完成一些特殊的效果。想要通过摄像机层制作特殊效果就需要3D 图层的配合，因此必须将图层上的3D 开关打开。空对象层空对象层是没有任何特殊效果的层，它主要用于辅助动画制作的图层，通过新建虚空对象层并以该层建立父子对象控制多个图层的运动或移动。也可以通过修改虚拟物体层上的参数而同时修改多个子对象参数，控制子对象的合成效果。第3章 使用After Effects中的图层与时间线形状图层形

26、状图层用于快速绘制矢量图形的图层，通过预设的图形可以快速地绘制出想要的形状，如矩形、圆形、多边形等，也可以通过使用“钢笔工具”绘制出其他形状的图形。调整图层调整图层是用于调节影片中的色彩或者特效的图层，在该层上制作效果可对该层以下所有图层应用该效果，因此调整图层对控制影片的整体色调具有很重要的作用。Photoshop 文件层执行“图层 新建Adobe Photoshop 文件”命令，弹出“另存为”对话框。单击“保存”按钮，完成Adobe Photoshop 文件层的新建。第3章 使用After Effects中的图层与时间线形状图层形状图层用于快速绘制矢量图形的图层，通过预设的图形可以快速地绘

27、制出想要的形状，如矩形、圆形、多边形等，也可以通过使用“钢笔工具”绘制出其他形状的图形。调整图层调整图层是用于调节影片中的色彩或者特效的图层，在该层上制作效果可对该层以下所有图层应用该效果，因此调整图层对控制影片的整体色调具有很重要的作用。Photoshop 文件层执行“图层 新建Adobe Photoshop 文件”命令，弹出“另存为”对话框。单击“保存”按钮，完成Adobe Photoshop 文件层的新建。第3章 使用After Effects中的图层与时间线创建层可以通过将“项目”面板中的素材拖曳至“时间轴”面板直接生成素材层，也可以通过在“时间轴”面板中单击鼠标右键，选择需要的图层进

28、行创建。选择层通过在层上单击鼠标左键即可选中该层，如果需要选择多个层可以在按住Ctrl 键或Shift 键的情况下单击需要选择的层，也可以通过执行“编辑 全选”命令选择全部图层。Photoshop 文件层选中需要删除的层，按Delete 键即可删除所选层，或者执行“编辑 清除”命令也可以实现。第3章 使用After Effects中的图层与时间线改变层上下顺序在“时间线”面板中，在需要调整的层上单击鼠标左键并按住鼠标左键不放，移动鼠标将其拖入到合适的位置即可。在调整层的时候也可以通过快捷键控制，按快捷键Ctrl+Shift+，可以使选中的图层移到最上方；按快捷键Ctrl+，可以使选中的图层上移

29、一层；按快捷键Ctrl+，可以使选中的图层下移一层；按快捷键Ctrl+Shift+，可以使选中的图层移到最下方。复制替换层复制替换层包括复制层和替换层，而复制层的同时往往伴随着粘贴层，下面有两种操作方式。一、复制粘贴层，二、替换层。第3章 使用After Effects中的图层与时间线序列层序列层就是将选择的多个层按照一定的排列顺序进行自动排序，并根据需要设置排序的重叠方式，也可以通过持续时间来设置重叠时间。图层与图层对齐和自动分布功能在对图层执行对齐操作的时候，图层是以中心点为标准对齐的，因此在对齐前调整好图层中图像或者视频的中心点是很有必要的。当需要让图层对齐或者自动分布的时候只要选中所要

30、对齐的图层然后单击对齐按钮即可。第3章 使用After Effects中的图层与时间线为图层添加标记标记功能是使用标记点记录影视制作中的一些关键部分或者需要关注的变化部分，以便于以后制作过程中更容易了解和制作视频。例如，在某个重要变化点位置设置层标记，在整个创作过程中，可以快速而准确地了解某个时间位置发生了什么。在使用After Effects 制作交互动画时也将使用到标记，接下来在本节中对图层的标记进行讲解，首先了解图层的图层标记有几种，其实图层标记有两种一种是合成时间标记，另外一种是图层时间标记两种方式。第3章 使用After Effects中的图层与时间线锚点“锚点”属性主要用来控制素材

31、的中心点位置。默认情况下，中心点在层的正中央位置。按快捷键A，可以直接打开“锚点”属性，如果需要修改定位点只需要修改“锚点”属性后的坐标参数即可。或者在“合成”窗口中双击素材进入“图层”窗口，使用“选择工具”直接移动锚点即可。位置“位置”属性用来控制素材在“合成”窗口中的相对位置，按快捷键【P】，可直接打开“位置”属性。当修改“位置”属性后的坐标参数或者在“合成”窗口中直接用“选择工具”移动位置都是以定位点为基准进行移动。第3章 使用After Effects中的图层与时间线缩放“缩放”属性是用来控制素材的大小。选中需要调整的层，按快捷键S，可以直接打开“缩放”属性。素材的大小同样以定位点的位

32、置为基准，修改“缩放”属性中的参数。旋转“旋转”属性是用来控制素材的旋转角度的。选中需要调整的层，按快捷键R，可以直接打开“旋转”属性。素材的旋转同样以定位点的位置为基准，修改“旋转”属性中的参数或者使用“旋转工具”可以直接对素材进行旋转操作。第3章 使用After Effects中的图层与时间线不透明“不透明度”属性是用来调节图层的不透明度的。当不透明度值为0%时，图像完全透明，当数值为100%时，图像完全不透明。选中需要调整的层，按快捷键T，打开“不透明度”属性，修改“不透明度”参数可以调整图像的不透明度。完成修改观看“合成”窗口中的效果。第3章 使用After Effects中的图层与时

33、间线图层混合模式的使用方法在“时间轴”面板中单击展开或折叠转移控制面板按钮，在“时间轴”面板中显示出“模式”控制选项。在“模式”选项的下拉列表中可以设置图层的混合模式。图层混合模式的类型“混合模式”菜单中有如下选项。正常、溶解、动态抖动溶解、变暗、相乘、颜色加深、经典颜色加深、线性加深、较深的颜色、相加、变亮、屏幕、颜色减淡、经典颜色减淡、线性减淡、线性减淡、较浅的颜色、叠加、柔光、强光、线性光、亮光、点光、纯色混合、差值、经典差值、排除、相减、相除、色调、饱和度、颜色、发光度、模板Alpha、模板亮度、轮廓Alpha、轮廓亮度、Alpha 添加、冷光预乘。第3章 使用After Effect

34、s中的图层与时间线“音频/视频”控制选项通过在“时间轴”面板上的“视频/音频”控制区中进行相应的操作，可以隐藏视频或音频。通过设置，可以只显示单独一个层中的内容或者锁定相应的层。“图层”控制选项在“时间线”面板上的图层控制区域可以显示标签、编号和图层名称。“转换面板”控制选项在“时间线”面板上的“转换面板”控制选项包括层的隐藏、抗锯齿、帧融合、运动模糊等。第3章 使用After Effects中的图层与时间线“模式”控制选项在标准情况下是不显示Mode(模式)控制选项的，在“时间轴”面板中单击“展开或折叠转移控制面板”按钮或者“拨动开关/模式”按钮，可以在“时间轴”面板中显示“模式”控制选项。

35、Parent(父子链接)控制选项父子链接是让层与层之间建立从属关系的一种功能，当对父对象进行操作的时候子对象也会执行相应的操作，但子对象执行操作的时候父对象不会发生变化。在“时间轴”面板中有两种设置父子链接的方式。一种是拖动一个层的图标到目标层，这样原层就成为目标层的父对象；另一种方法是在该选项的下拉列表中选择一个层作为对象。第3章 使用After Effects中的图层与时间线“时间拉伸”控制选项在“时间轴”面板上的“时间拉伸”选项用于控制层的入点/出点、速度、关键帧等。单击“时间轴”面板上的按钮，可以在“时间轴”面板中显示“时间拉伸”的控制选项。第3章 使用After Effects中的图

36、层与时间线颠倒时间视频节目中有时会出现时光倒流特殊效果，After Effects CC 中通过颠倒时间的方式就可以轻松实现，通过这种方法也可以实现很多其他效果。使用入点和出点控制面板使用“入点”和“出点”可以很容易地控制动画的播放起始点，通过修改“入点”和“出点”位置也可以控制影片的时间长短。应用重置时间命令时间重置命令可以改变视频的播放速度，在不影响视频内容的情况下加快或者减慢视频的播放速度。第3章 使用After Effects中的图层与时间线倒退播放倒退播放的效果类似于时间颠倒，倒退播放是通过对图层进行反转播放达到目的的，而时间颠倒也是通过颠倒图层前后顺序实现倒退播放的。延长时间在动画

37、中有时为了给某一个动作特写往往会通过延长时间的方式让动作变得缓慢，或者影片的节奏太快想要放慢速度播放也可以通过延长时间实现。停止时间在动画制作过程中有时需要从视频中截取出想要的画面，通过对视频进行停止时间的处理可以轻松达到这一目的。第3章 使用After Effects中的图层与时间线本章主要介绍了“时间线”面板和图层，通过对“时间线”面板和图层的描述，向读者详细地介绍了它们的功能作用。通过简单的实例生动地展示了动画制作中所需的知识，让读者能够更加容易掌握新知识。通过时间线特效的应用会更容易把握动画制作中的时间控制，结合合成中对素材调整的空间感觉，会更容易制作出精美的动画作品。时间线特效是平时

38、比较常用的特效，熟练掌握时间线特效的制作对于动画制作有很大帮助。第4章 制作关键帧动画第4章 制作关键帧动画什么是关键帧关键帧动画是场景中有运动变化和属性变化的实体的动画制作方法，其原理是记录序列中较为关键的动画帧的物理形态，两个关键帧之间的其他帧可以用各种插值计算方法得到，从而达到比较流畅的效果。创建关键帧在After Effects 中，基本上每一个特效或属性都有一个对应的码表，如果用户想要创建关键帧，则可以将该属性左侧的码表按钮激活，这样，在“Timeline(时间轴)”面板中的“当前时间指示器”位置将会创建一个关键帧，取消码表的激活状态，将取消该属性所有的关键帧。第4章 制作关键帧动画

39、选择关键帧在创建关键帧后，有时还需要对关键帧进行修改操作，这时就需要重新编辑关键帧，编辑首先要选择关键帧。移动关键帧在After Effects 中，为了更好地控制动画效果，关键帧的位置是可以随意移动的，可以单独移动一个关键帧，也可以同时移动多个关键帧。复制关键帧在After Effects 中进行合成制作时，经常会需要重复设置参数，因此需要对关键帧进行复制粘贴的操作，这样可以大大提高创作效率，避免一些重复性的操作。第4章 制作关键帧动画删除关键帧在制作项目文件的过程中，有时需要将多余的或者不需要的关键帧进行删除，删除关键帧的方法很简单。选中多余的单个或多个关键帧，执行“编辑 清除”命令，可将

40、选中的关键帧删除。也可以选中多余的关键帧，直接按键盘上的Delete 键，即可将所选中的关键帧删除；还可以将“当前时间指示器”调整到需要删除的关键帧位置，可以看到该属性左侧的“在当前时间添加或移除关键帧”按钮呈蓝色的激活状态。单击该按钮，即可将当前时间的关键帧删除。第4章 制作关键帧动画变换选项“变换”选项设置是After Effects 中最基本的图层参数设置。在“时间轴”面板中，打开层效果面板，单击展开“变换”选项，可以看到该选项下所包括的5 个属性，分别是：锚点、位置、缩放、旋转和不透明度。位移关键帧动画如果要在显示变化属性的同时自动添加关键帧，可以配合Alt+Shift 键和显示属性的

41、快捷键，例如选中图层后，按快捷键Alt+Shift+P，可以在显示位置属性的同时，在当前位置添加一个关键帧。第4章 制作关键帧动画缩放关键帧对关键帧进行缩放操作，也可以将原本静态的画面变为动态，实现动画的效果，这是也是最基本的动画制作技术。翻转关键帧在交互动画制作中关键帧是也必不可或缺的一部分，所以要对关键帧进行精心制作。After Effects CC 中关键帧动画的制作是通过位移、旋转和缩放特效来完成的，下面将通过对翻转关键帧的简单运用来制作动画。旋转关键帧旋转关键帧也是交互设计动画制作中比较常见的一种制作方法，通关对关键帧旋转，实现原本静态的画面便成为动态。第4章 制作关键帧动画淡入淡出

42、动画淡入淡出动画时动画制作中常见的一种效果，通过对“变换”选项下“不透明度”属性的参数进行设置，能够制作出图层淡入淡出的动画效果。第4章 制作关键帧动画“曲线编辑器”是After Effects CC 在整合了以往版本的速率图表的基础上，提供的更强大、更丰富的动画控制全新功能模块，使用该功能，可以更方便地查看和操作属性值、关键帧、关键帧插值和速率等。第4章 制作关键帧动画交互动画中的制作手势动画是比较常见的一种动画效果，在交互设计中人机交互主要是通过手势，在目前市场上的APP 软件中大部分主要以手势的交互为核心。After Effects CC 中主要通过创建关键帧来控制动画，通过对图层“变换

43、”属性的参数进行设置，可以制作出许多精美、丰富的动画效果。因此在制作一些关键帧动画的过程中，会经常对“变换”属性的参数进行设置，After Effects 中提供了许多快捷的显示方法，掌握这些快捷方法，会大大提高工作效率。第4章 制作关键帧动画在After Effects CC 中，关键帧是所有动画效果的制作基础，也是组成动画的基本元素，关键帧动画至少要通过两个关键帧来完成，后期各种特效的添加与修改也离不开关键帧，可以说，掌握了关键帧的应用，也就掌握了动画制作的基础和关键。本章主要讲解了关键帧的基本概念、关键帧的创建和选择，以及关于关键帧的编辑操作方法，详细介绍了图层的各个“变换”属性和通过“

44、变换”属性制作出的关键帧的各种动画效果，另外还介绍了After Effects CC 中的曲线编辑器的使用方法。通过本章的学习，相信读者已经对关键帧动画有了更加深入的了解，为后期制作更丰富精彩的动画效果打下了坚实的基础。第5章 使用AfterEffects中的蒙版第5章 使用AfterEffects中的蒙版使用矩形工具创建矩形蒙版通过蒙版的使用，使得交互动画的效果更加完美，更加能够展现出交互设计师的设计理念，同时可以很好的为软件研发人员展示交互效果。使用椭圆工具创建椭圆形蒙版使用“椭圆工具”创建蒙版方法与使用“矩形工具”创建蒙版方法基本相同。通过创建椭圆蒙版，掌握交互动画制作过程中椭圆蒙版的创

45、建过程，与此同时使得用户掌握了交互设计动画制作中椭圆蒙版的使用使得动画效果更加完美。第5章 使用AfterEffects中的蒙版使用钢笔工具创建自由形状蒙版钢笔工具是After Effects CC 中最有效最灵活的蒙版创建工具，利用该工具可以创建任意形状的曲线路径蒙版，因此利用该功能，可以为素材图像换一个漂亮、有创意的背景。使用橡皮擦工具创建自由形状蒙版使用“橡皮擦工具”，操作起来类似于橡皮擦擦除效果，因此使用起来比较自由随意，擦除结束后，只能看到擦除的部分。第5章 使用AfterEffects中的蒙版选择节点在创建蒙版时，有时候也许不能一步到位，或者对创建出的蒙版形状不满意，这时就需要对已

46、经创建好的蒙版形状进行修改操作，以得到更精确适合的蒙版轮廓形状。移动节点移动节点，其实就是修改蒙版的形状，通过选择不同的节点并移动，可以将椭圆或矩形改变成不规则形状。使用钢笔工具进行修改绘制好的蒙版形状，可以通过后期的节点添加或删除操作来改变形状的结构。第5章 使用AfterEffects中的蒙版锁定蒙版后期在制作项目的过程中，为了避免操作中不必要的失误，After Effects CC 提供了将蒙版锁定的功能，锁定后的蒙版不能够进行任何的编辑和操作，因此为用户在制作的过程中提供了很大的帮助。变换蒙版在蒙版的路径上双击，则会显示一个蒙版调节框，将光标移动至边框周围的任意位置，将出现旋转光标，拖

47、动鼠标即可对整个蒙版图形进行旋转操作。第5章 使用AfterEffects中的蒙版设置蒙版的属性绘制好蒙版的形状后，在“时间轴”面板中，展开蒙版列表选项，可以在其中设置蒙版的各个属性，还可以对这些属性设定动画关键帧，选中图层，展开图层的蒙版属性。制作淡入动画效果在制作过程中当新建一个项目并打开某张素材后，将该素材直接拖入到“时间线”面板中，系统会自动创建一个与该素材大小相同的合成，因此可以省去新建合成的步骤，更为方便、快捷。第5章 使用AfterEffects中的蒙版App 的动画效果是很多App 设计研发中比较重视的，那么其动画效果的制作也是目前比较流行的，在本节中将带领读者实现微信交互设计

48、动画效果的制作。第5章 使用AfterEffects中的蒙版本章主要针对蒙版的相关知识进行了详细的讲解，包含蒙版的原理介绍、蒙版的修改与编辑方法、蒙版的混合模式，并通过应用案例的方式介绍了如何使用遮罩工具创建蒙版的方法。另外，通过对蒙版属性的不同设置，还可以制作出简单的淡入动画效果等。通过本章的学习，相信读者对蒙版的使用方法已经有了更进一步的了解，为后期制作更丰富、绚丽多彩的动画效果奠定了基础。第6章 制作文字动画第6章 制作文字动画通过文字层创建点文字点文字的每一行文字都是独立的，在进行文字的编辑时，长度会随着文本的长度随时变长或者缩短，但是不会出现与下一行文字重叠的情况。通过文字工具创建点

49、文字直接创建点文字的方法除了通过文字层创建外，还可以直接通过文字工具创建点文字，用户可以选择其中一种即可。创建段落文字创建段落文字与创建点文字的操作方法基本相同，对于创建文字的诸多方法，读者都应该熟练掌握，在后期的制作中就能够大大提高工作效率。第6章 制作文字动画点文字与段落文字相互转换在Affect Effects CC 中，所创建的点文字和段落文字是可以相互转换的，点文字可以快速转换为段落文字文字，段落文字也可以快速地转换为点文字。按快捷键Ctrl+T，可以选择文字工具，反复按该快捷键，可以在“横排文字工具”和“直排文字工具”之间进行切换。第6章 制作文字动画设置字符属性在“Charact

50、er（字符）”面板中，用户可以对文字的字体、字形、字号及颜色等属性进行修改，从而制作出需要的满意效果。设置段落属性段落是指在输入文字时，末尾带有回车符的任何范围的文字，对于点文字来说，也许一行就是一个单独的段落；而对于段落文字来说，一段可能有多行。在这里，用户可以通过“段落”面板设置段落对齐、段落缩进等选项。总之，段落格式的设置主要是通过“段落”面板来实现的。第6章 制作文字动画动画单击“时间轴”面板中“文字”选项右侧的“动画”按钮，即可弹出有关该选项的下拉菜单，该菜单中包含了文字的动画制作命令，执行某个命令后，即可将该命令的动画选项添加到“文字”属性中。通过该菜单选项，用户能够制作出更加丰富