通过按快捷键【Ctrl+Alt+N】或执行【文件→新建→新建项目】命令均可新建一个项目。如果当前已经打开某个项目,执行以上命令就会直接替换当前的项目,打开一个新的项目。
按快捷键【Ctrl+Shift+Alt+K】或执行【文件→项目设置】命令,会弹出【项目设置】对话框,如图1-80所示。【项目设置】对话框中共有4个标签,分别为【视频渲染和效果】标签、【时间显示样式】标签、【颜色设置】标签和【音频设置】标签。
图 1-80
这里主要介绍【时间显示样式】标签的设置。如果选中【时间码】单选按钮,就以传统的“时/分/秒”单位格式显示时间;如果选中【帧数】单选按钮,就以帧数显示时间。笔者认为设置为【帧数】比较方便,因为对动画设计而言,论及时间时大都是以“帧”为单位的。其余3个标签的设置项在一般动效设计中基本不用修改。
通过按快捷键【Ctrl+N】或执行【合成→新建合成】命令均可新建一个合成。【合成设置】对话框如图1-81所示。
图 1-81
在【合成设置】对话框中,重点设置以下几项。
(1)合成名称(红色矩形1框选的区域)。
(2)合成的【宽度】和【高度】(红色矩形2框选的区域)。
合成的【宽度】和【高度】即最终输出视频的画幅尺寸。主流视频的宽度和高度分别为1920像素和1080像素、1280像素和720像素,主流移动设备屏幕的尺寸为1080像素×1920像素,iPhone屏幕的尺寸为1125像素×2436像素(iPhone X)、1170像素×2532像素(iPhone 12)等。
(3)合成的【帧速率】(红色矩形3框选的区域)。
合成的【帧速率】关系到最终渲染输出动效的流畅性。After Effects预设了多种帧速率类型(红色矩形4框选的区域),笔者建议设置为48帧/秒或60帧/秒。
(4)合成的【开始帧】与【持续时间】(红色矩形5框选的区域)。
合成的【开始帧】与【持续时间】决定了一段合成的持续时长,也就是动画视频的持续时长,开始帧一般可以设置为0或1。
其余的设置项在实际动效设计制作中采用默认属性即可,不必修改。
每个合成都有属于自己的时间轴,在【时间轴】面板上就是一个个的合成标签。而合成在自己的【时间轴】面板中的基本组成单元就是一个个的图层。除了个别类型的灯光图层,其他图层都有一组默认的通用属性,如【锚点】属性、【位置】属性、【缩放】属性、【旋转】属性和【不透明度】属性,如图1-82所示。
图 1-82
普通2D图层的【位置】属性、【缩放】属性和【旋转】属性均有 X 、 Y 两个维度,而3D图层多了一个纵深维度 Z (单击打开图层的3D开关 即可切换为3D图层)。
另外,在实际操作中,可以使用一些快捷键单独展开某个属性,这样可以大大提高工作效率:按快捷键【A】可以单独展开【锚点】属性;按快捷键【P】可以单独展开【位置】属性;按快捷键【S】可以单独展开【缩放】属性;按快捷键【R】可以单独展开【旋转】属性;按快捷键【T】可以单独展开【不透明度】属性;如果同时按【Shift】键加以上几个快捷键,就可以同时展开【锚点】属性、【位置】属性、【缩放】属性、【旋转】属性和【不透明度】属性。其中的【锚点】属性可以理解为物体的运动轴心和缩放轴心。
3D图层除了有 X 轴、 Y 轴和 Z 轴的旋转,还有一个【方向】属性。从实际调整的效果来看,调整【方向】属性和调整【旋转】属性的结果看起来是一样的。不过两者还是有所不同,直观来看,在调整3D图层的【方向】属性时,最大值就是360°(转1圈),再继续转就会归零,要从头开始;而调整【X轴旋转】属性、【Y轴旋转】属性和【Z轴旋转】属性时,转到360°继续转属性值就变成【1x+n°】,如图1-83所示,计数为【n圈+n°】,即圈数可以无限多。使用【旋转】属性进行动画制作可以使图层转动多次。调整【方向】属性进行动画制作通常能更好地实现自然平滑运动,而调整【旋转】属性进行动画制作可以提供更精确的控制。
图 1-83
【位置】属性、【缩放】属性和【旋转】属性均可以在【合成】面板上直接使用相应的工具进行手动调整,如图1-84所示。
单击图层属性前面的图标 即可创建一个关键帧,再次单击则取消该关键帧。
图 1-84
图 1-85
After Effects的图层样式与Photoshop的图层样式基本一致,在【时间轴】面板上选中图层并右击,可以在弹出的菜单中选择【图层样式】命令的二级菜单,如图1-85所示。
【渐变叠加】样式、【颜色叠加】样式、【描边】样式和【外发光】样式在After Effects中也可以通过类似功能的效果实现,如【描边】效果、【梯度渐变】效果(After Effects的【梯度渐变】只有两种颜色,图层样式的渐变颜色可以有很多种)、【填充】效果和【发光】效果。两种途径均可以,用户可以根据自己的习惯进行选择。
图 1-86
After Effects的图层类型如图1-86所示。
1.文本图层
单击工具栏中的【横排文字工具】 ,或者按快捷键【Ctrl+T】,或者执行【图层→新建→文本】命令,均可在【合成】面板中单击直接输入文字,并在【时间轴】面板中创建一个文本图层,如图1-87所示。
下面介绍文本图层在一般UI动效设计中经常涉及的几大要点:字体样式与段落样式、文本图层特有属性、文本动画。
图 1-87
1)字体样式与段落样式
在创建文本图层之后,在右侧的【字符】面板中可以调整字体、字重(细体或粗体)、字号和字间距等属性,如图1-88所示;在【段落】面板中可以调整文字段落的对齐方式、缩进等。这些操作和Photoshop等其他设计软件、文本处理软件的操作基本相同。
图 1-88
2)文本图层特有属性
在【时间轴】面板上展开文本图层,可以看到有一组名称为【文本】的属性,如图1-89所示。
图 1-89
图 1-90
(1)【源文本】属性:可以用来设置文字内容变化的关键帧。
例如,单击前面的图标 ,创建一个关键帧,将时间指示器拖曳到第50帧,使用【横排文字工具】在【合成】面板上单击该文本图层,将文字内容设置为【Motion Design】,即创建了在第50帧文字内容由【After Effects】变为【Motion Design】的动画,但文字内容的变化动画只能是定格类型的,如图1-90所示。
图 1-91
(2)【路径选项】属性:可以用来创建沿特定路径排列的文字。
先选中新创建的文本图层【After Effects】,再选择【钢笔工具】 ,在【合成】面板上绘制一条路径,如图1-91所示。展开【路径选项】属性下方【路径】右侧的下拉菜单,选择【蒙版1】命令(也就是刚才绘制的蒙版路径),此时【After Effects】沿着刚刚绘制的路径排列。
图 1-92
当设为路径文字之后,可以看到【路径选项】属性下方又新增了一组属性设置(见图1-91中的图4),如果将【反转路径】设置为【开】,文字就会从路径上方切换到路径下方,如图1-92所示。
如果将【垂直于路径】属性设置为【开】,那么每个文字的方向都垂直于路径;如果将【垂直于路径】属性设置为【关】,那么始终保持原来的方向。二者的对比效果如图1-93所示。
图 1-93
如果将【强制对齐】属性设置为【开】,那么字符会与路径两端对齐。【强制对齐】属性为【关】和【开】的对比效果如图1-94所示。
图 1-94
在【强制对齐】属性为【关】的情况下,调整【首字边距】属性和【末字边距】属性的值的最终效果是一样的,都等同于调整段前缩进距离。如果【强制对齐】属性为【开】,那么调整【首字边距】属性和【末字边距】属性的值的对比效果就出来了:增加【首字边距】属性的值是增加第一个字符离路径起点的距离,整段文字会被压缩;而增加【末字边距】属性的值则是增加最后一个字符离路径终点的距离,使整段文字被拉伸。二者的对比效果如图1-95所示。
图 1-95
文字的其他特有属性(如【锚点分组】属性和【分组对齐】属性等)在动效设计中很少用到,这里就不再展开介绍。下面重点介绍文本动画。
图 1-96
3)文本动画
在【时间轴】面板上展开文本图层,单击右侧的图标 (图1-96的左图中红色矩形1框选的区域),弹出的菜单中显示了多种文本动画样式类型,如图1-96所示。选择菜单中的任意一种类型,即可为文本动画图层添加一种动画样式,一个文本图层可以添加多种相同或不同的动画样式。
文字动效的关键并不在于动画样式(动画大多都是基本样式的,如缩放、不透明度、移动和旋转等),重点在于【范围选择器】(图1-96的右图中红色矩形2框选的区域),也就是范围选择器内的文字部分。对范围选择器手柄的移动添加动效,就可以产生各种各样的文字的变化、生成、消失动效。下面以【缩放】文本动画、【字符位移】文本动画和【模糊】文本动画为例讲解文字动效。其他动效样式的调试操作步骤的基本原理是相通的,此处不再赘述。
图 1-97
(1)【缩放】文本动画。
单击图标 ,在弹出的菜单中选择【缩放】命令,此时会自动新增一组名为【缩放】的属性,下面的两个属性为【范围选择1】和【缩放】,此处将【缩放】属性设置为【150.0,150.0%】,如图1-97所示。
图 1-98
可以看到,每个字符都变大了。此时调整【范围选择器1】的两个手柄,如图1-98所示。此时只有两个范围选择手柄内的字符变大,范围选择器之外的字符没有变化。调整【偏移】属性的值就可以整体移动这个字符变大的影响区域。
通过对【缩放】属性的值、【偏移】属性的值,以及【范围选择器1】的【起始】手柄、【结束】手柄添加关键帧,可以创建一个从左到右、从小到大或从大到小等样式的文字缩放动画。
(2)【字符位移】文本动画。
【字符位移】最常见的用途是制作数字的跳动,如数字时钟的走动效果。为文本图层添加一个【字符位移】动画,如图1-99所示,会新增一组名为【动画制作工具3】的属性及若干属性。
图 1-99
需要注意的是:如果在选中了一个已有的【动画制作工具】的情况下添加新的文本动画,那么新添加的文本动画共享同一个【动画制作工具】的【范围选择器】,如图1-99中的红色矩形A部分所示;如果在未选中已有的【动画制作工具】的情况下添加新的文本动画,那么新添加的文本动画有一个新的自己所属的动画制作工具,如图1-99中的红色矩形B部分所示。
首先将新增的【动画制作工具3】的范围选择器的【起始】手柄和【结束】手柄分别移动到如图1-100所示的位置(黄色矩形框选区域),也就是将动画范围限定在最后一个字符(数字1)上,这样【字符位移】的动画效果(也就是将要制作的数字跳动动画)就仅限于文字的数字部分。
图 1-100
然后在时间线的第0帧单击【字符位移】属性前面的码表图标,设置一个关键帧(拥有独立的范围选择器的动画制作工具)。将时间指示器拖曳到第100帧,将【字符位移】属性设置为【9】,拖曳时间指示器或按空格键进行播放预览,可以看到从第0~100帧,数字字符从1一直增大到9,之后又跳到0。如果尝试将【字符位移】属性的值继续调大,那么数字又会逐渐增大到9再跳到0,【字符位移】属性的值持续增大,如此不断循环数字从1到9再到0的动画,如图1-101所示。
图 1-101
图 1-102
(3)【模糊】文本动画。
先为文本图层新增一个【模糊】动画,再将范围选择器的手柄移动到【Aft】3个字母所在的区域,最后将【模糊】属性设置为【21.0,21.0】,如图1-102所示。
在第0帧,将【范围选择器1】的【偏移】属性设置【-100%】,并设置一个关键帧。将时间指示器拖曳到第100帧,将【偏移】属性设置为【100%】,如图1-103所示,此时可以得到一个【文字上方从左到右移过一段模糊滤镜】的动画效果。
图 1-103
稍加修饰一下,为范围选择器的【结束】属性也添加关键帧。返回第0帧,为当前的【结束】属性设置一个关键帧;在第60帧,将【结束】属性设置为【80%】,此时会自动生成一个新的关键帧。这样便得到了一个【一小段模糊滤镜一边从左到右移动,一边扩大模糊影响区】的动画效果,如图1-104所示。
图 1-104
2.纯色图层
纯色图层在After Effects中具有重要作用,许多效果都需要添加到纯色图层上才能发挥作用,如粒子特效插件效果Particular和Form、描边插件效果3D Stroke,以及After Effects自带的【描边】效果等。可以说,纯色图层是一种重要的效果媒介及蒙版路径绘制的画布。
按快捷键【Ctrl+Y】或执行【图层→新建→纯色】命令可以新建一个纯色图层。除此之外,在【时间轴】面板的图层区的空白处右击,在弹出的菜单中选择【新建→纯色】命令也可以新建一个纯色图层,如图1-105所示。
图 1-105
图 1-106
【纯色设置】对话框如图1-106所示。
【纯色设置】对话框中的关键设置参数有【宽度】、【高度】、【制作合成大小】和【颜色】等。
(1)宽度和高度:类似于合成的宽度和高度设置,勾选【将长宽比锁定为……】复选框可以保持固定的长宽比,只需修改宽度或高度其中一个属性即可。
(2)制作合成大小:很多时候要新建的合成大小都需要和合成大小保持一致,单击这个按钮可以使操作非常方便。
(3)颜色:单击【颜色】下方的色框,在弹出的色盘中可以选择任意颜色,也可以单击右侧的图标 ,取当前界面上的任意一种颜色作为新建纯色图层的颜色。
新建一个纯色图层之后,在【时间轴】面板中选中该图层,按快捷键【Ctrl+Shift+Y】或执行【图层→纯色设置】命令就可以重新打开【纯色设置】对话框,在该对话框中可以对新建的纯色图层进行修改。
3.灯光图层
1)灯光图层的类型、创建与设置
灯光图层就是一个3D灯光对象,可以为3D图层提供模拟真实灯光的照明和阴影效果。执行【图层→新建→灯光】命令,或者在【时间轴】面板的图层区的空白处右击,在弹出的菜单中选择【图层→新建→灯光】命令,即可新建灯光图层,如图1-107所示。
图 1-107
灯光共有平行光、聚光、点光和环境光4种类型。不同类型的灯光的照明效果如图1-108所示。
图 1-108
4种灯光类型的【灯光设置】对话框如图1-109所示。【灯光设置】对话框中各种灯光类型共有的通用设置属性主要是【灯光类型】、【颜色】和【强度】。
图 1-109
部分灯光类型有其专属设置属性。
(1)平行光、点光和聚光3种类型具有【衰减】属性和【投影】属性,环境光没有这两个属性。
(2)聚光特有属性为【锥形角度】和【锥形羽化】。其中,【锥形角度】属性用来设置聚光的锥形罩开口大小,而【锥形羽化】属性用于设置聚光照到物体上时光斑的边缘羽化值。
图 1-110
2)【时间轴】面板中的灯光图层
在【时间轴】面板上,展开灯光图层的属性,如图1-110所示,和【灯光设置】对话框中设置的参数是一一对应的。特别需要注意的是灯光的【变换】属性组。
(1)只有平行光和聚光的【变换】属性组中多了【目标点】属性,这个属性会影响灯光的照射方向(图1-110中红色矩形A和红色矩形B框选的区域)。
(2)聚光多了【方向】属性和【旋转】属性(图1-110中红色矩形C框选的区域),点光与平行光都没有【方向】属性和【旋转】属性。
(3)环境光可以照亮整个3D场景,其位置不影响照明效果,所以没有【位置】属性(图1-110中红色矩形D框选的区域)。
关于灯光的投影和阴影的相关属性,在介绍3D图层时与3D图层的【材质选项】一起讲解。
图 1-111
4.3D图层
3D图层的【位置】属性和【旋转】属性在前面介绍图层通用属性时已经讲解过,此处不再赘述,而是重点讲解3D图层的【材质选项】。
1)投影
如图1-111所示,灯光带有投影的3D场景效果。
当打开灯光的【投影】开关时,将投射阴影的3D图层(图层名为【投射阴影平板】)的【材质选项】中的【投影】开关、接受投影的3D图层(图层名为【地板平面】)的【材质选项】中的【接受阴影】开关,以及所有接受灯光照明的3D图层【材质选项】中的【接受灯光】开关都打开(默认是打开的,若关闭则不受灯光照明的影响,完全显示原本的颜色),这样便可得到一个带有阴影且写实的3D照明场景,如图1-112所示。
图 1-112
通过调整【阴影深度】属性和【阴影扩散】属性可以分别调整投影的透明度(即强度)和阴影边缘的羽化模糊度,如图1-113所示。
图 1-113
2)材质属性(漫射、镜面反光和质感等)
After Effects的3D图层材质属性与主流3D软件(如Maya、C4D等)的材质球属性类似。
(1)环境:图层的非定向环境反射。若值为100%,则指定最多的反射;若值为0%,则指定没有环境反射。从实际操作来看,当有环境光时,该属性值的变化带来的效果对比比较明显。
(2)漫射:即全向漫反射。将漫反射应用于3D图层,就像在它上面放一层暗色塑料片。从直观效果来看,如果接受灯光照明,那么当值为100%时图层最亮,反射最大限度的光线,当值为0%时完全不接受灯光照明,完全不反射光线(全黑)。
(3)镜面强度:图层的定向镜面反射。就好像从镜子反射一样,当值为100%时指定最多的反射,当值为0%时指定无镜面反射。从直观来看,镜面强度越高图层越明亮,镜面强度越低图层越暗淡。
(4)镜面反光度:镜面高光的大小。只有将【镜面】属性设置为大于0%,此时才处于活动状态。若设置为100%,则指定具有小镜面高光的反射;若设置为0%,则指定具有大镜面高光的反射。从直观来看,镜面反光度越高图层越暗淡,镜面反光度越低图层越明亮。
(5)金属质感:可以理解为图层自身颜色对镜面高光颜色的影响,以及灯光颜色带来的影响。若值为100%,则高光颜色就是图层的颜色。如果将【金属质感】属性设置为100%,以橙色的图层为例,那么其反光就呈现与图层相同的橙色,并且不受灯光颜色的影响;如果将【金属质感】属性设置为0%,照亮橙色图层的灯光若为紫色,那么灯光的紫色就会对图层的反光产生相对明显的影响。
【镜面强度】、【镜面反光度】和【金属质感】这几个属性在一般的平面片状3D图层上,值的大小带来的效果变化不是很明显。在实际的动效设计中,很少使用这几个属性。
图 1-114
5.摄像机图层
After Effects的摄像机仅在合成中有3D图层时才有意义。与前面的灯光图层一样,可以采用两种方式创建摄像机图层,即在菜单栏中选择【图层→新建→摄像机】命令,或者在【时间轴】面板的图层区的空白处右击,在弹出的菜单中选择【图层→新建→摄像机】命令。【摄像机设置】对话框如图1-114所示,在日常设计中只需关注摄像机的【类型】、【焦距】和【启用景深】3个设置参数即可。
图 1-115
1)摄像机的类型
After Effects中的摄像机有单节点摄像机和双节点摄像机两类。前者就是普通的摄像机;后者比较特殊,带有一个目标点,类似于聚光灯,当移动目标点时,摄像机位置不动,但会旋转镜头,相当于“摇镜头”,如图1-115所示。
2)摄像机的焦距
图 1-116
从直接的效果来看,可以简单地理解为焦距的大小决定了可视距离和可视角度。焦距越大,可视距离越近,可视角度越小;焦距越小,可视距离越远,可视角度越大,即常说的“广角镜头”,如图1-116所示。
一般来说,在实际的动效设计中,使用28~35毫米的焦距即可。
3)摄像机的【启用景深】及景深的相关参数
在【摄像机设置】对话框和摄像机图层的属性组中都可以打开/关闭【启用景深】开关。在启用景深之后,一般还需要适当地调整焦距和光圈,这样才能产生合适的景深效果,如图1-117所示。
图 1-117
从直观效果来看:如果焦距设置得很小,那么整个场景看上去都是模糊未对焦的感觉;如果焦距设置得过大,那么景深效果几乎不起作用。对于光圈来说,直观效果就是光圈越大,模糊值越大。
6.空对象图层
1)空对象图层的常见应用
空对象图层,顾名思义,就是一个什么都没有,并且不对合成的最终效果产生任何影响的全空白图层。空对象图层有什么作用呢?笔者认为空对象图层有以下两种应用。
(1)用作带领多个图层一起运动的父物体。
(2)添加【滑块控制】效果,用【滑块控制】属性通过表达式控制其他图层的一些属性。
第一种应用很好理解。例如,当一个对象由非常多的图层组合而成,而这些图层又需要共同运动时,可以用一个空对象图层控制它们,这样图层的管理会比较清晰。某个立方体盒子由6个3D图层拼成,将这6个3D图层都链接给同一个【空对象】作为子物体(空对象也需要设置为3D图层),由这个空对象控制这些图层的旋转,也就相当于控制这个立方体盒子的旋转。
下面结合案例介绍第二种应用。
2)应用案例:使用空对象图层分别控制【缩放】的 X 值和 Y 值
按快捷键【Ctrl+N】,新建一个宽度和高度分别为1920像素和1080像素的合成;按快捷键【Ctrl+Y】新建一个宽度和高度均为600像素的纯色图层,并命名为test。
在【时间轴】面板中展开纯色图层的【缩放】属性(按快捷键【S】),在按住【Alt】键的同时单击【缩放】属性前面的码表图标 ,为【缩放】属性创建一个表达式,如图1-118所示。
图 1-118
图 1-119
【缩放】属性的 X 值和 Y 值无法分离,但是如果想分别对其进行控制,那么应该怎么办呢?
在【时间轴】面板的图层区的空白处右击,在弹出的菜单中选择【新建→空对象】命令,创建一个【空对象】图层。在【效果和预设】面板中搜索【滑块控制】效果,双击两次,为新建的【空对象】图层添加两个【滑块控制】效果,并分别将它们重命名为【X】和【Y】(为效果重命名的方法是选中效果并按【Enter】键进行输入),如图1-119所示。另外,还需要将两个【滑块控制】效果的值均设置为100.0%。
图 1-120
返回纯色图层test的【缩放】属性,拖曳该属性的螺旋状图标 ,可以拖出来一条直线,将这条直线拖曳到【空对象】图层的【X】效果的【滑块】属性上,这样便可在空对象的【X】效果的【滑块】属性和纯色图层test的【缩放】属性之间产生表达式链接,此时调整【X】效果的【滑块】属性,即可同步调整纯色图层test的大小,如图1-120所示。
下一步分开控制【缩放】属性的 X 值和 Y 值,需要手动编辑纯色图层test的【缩放】属性的表达式。此时纯色图层test的【缩放】属性的表达式如下:
需要把temp改为空对象滑块效果的名称【X】和【Y】。
单击时间线区的表达式就可以激活手动编辑模式,将表达式编辑为如下形式(见图1-121):
此时再分别调整【X】效果的【滑块】属性和【Y】效果的【滑块】属性,发现可以分别控制纯色图层test的【缩放】属性的 X 值和 Y 值,如图1-122所示。
图 1-121
7.形状图层
After Effects的形状图层类似于Photoshop的矢量形状图层。在【时间轴】面板上未选中任意图层的情况下,使用工具栏中的【钢笔工具】、【矩形工具】和【椭圆工具】等可以直接在【合成】面板上绘制图形,【时间轴】面板的图层区会自动生成一个形状图层,如图1-123所示。
图 1-122
除了一些通用属性,形状图层还有其特有的属性,这里以矩形形状图层为例展开介绍。如图1-124所示,展开【内容】下的【矩形1】属性,可以看到下面还有【矩形路径1】属性、【描边1】属性、【填充1】属性,以及矢量形状自身的【变换:矩形1】属性。需要特别说明的是,形状自身的【变换】属性是以矩形路径自身中心点为初始轴心锚点的,而形状图层的【变换】路径则是图层自身的变换属性,以图层的中心点为初始轴心锚点。其实读者尝试调整【变换:矩形1】属性下的【比例】属性的值,以及图层【变换】属性下的【缩放】属性的值,就可以看出区别。
图 1-123
图 1-124
图 1-125
此外,还可以通过单击右侧的【添加】按钮来添加更多的扩展属性,如图1-125所示。
图 1-126
8.调整图层
在After Effects中,创建调整图层有两种方法:一是执行【图层→新建→调整图层】命令;二是在【时间轴】面板的图层区的空白处右击,在弹出的菜单中选择【新建→调整图层】命令。
After Effects的调整图层与Photoshop的调整图层的作用类似,通过添加效果或滤镜对下面的图层产生影响,并且可以通过添加蒙版路径对下面的图层产生局部的影响。例如,为调整图层添加【模糊度】为【100.0】的【高斯模糊】滤镜,并添加圆形蒙版路径的效果,如图1-126所示。