APP界面动效_AE制作APP界面动效

效果图

素材

伦敦背景图一张

手机透视效果模板一张

一、基本构建创建转场效果合成

步骤1

打开AE，合成>新建合成(Cmd+N)，尺寸为640*1136，帧数29，持续6s。

步骤2

导入伦敦背景图像，将图像丢入合成1，调整背景图像尺寸，使其适合画布。

步骤3

创建3个蓝色框(用形状图层)，这些蓝色框将从屏幕上方下落到屏幕底部，宽度213、214、213px。三个方框上方的方框宽度640px,输入相应文本。

步骤4

用钢笔勾勒出云朵和6片雪花空心圆。

步骤5

保存一下。

展示合成

步骤1

创建合成2，尺寸1280 x 720帧数29，时间6s。

步骤 2

导入iPhone背景,调整尺寸。

步骤3

把合成1拖到合成2里面，加一层背景层。

步骤4

选中合成1，效果>扭曲>边角定位，让合成1的4个角对上模板中屏幕的4个角。

二、动效制作

3个蓝色方框变长，不同时的落下。

三个蓝色框，打开合成1，选中三个蓝色框。

透明框的运动，开始以很快的速度移动了大部分位移，后来速度减慢，缓缓移动到原位。

三个蓝色框，当蓝色框触及到底部时，文字快速弹出，不透明度从0->100%,比例从0->100%。

透明框中的文字随透明框一起运动，但是，左侧的文字先到，右侧的-4度后到，注意时间轴中得设置。

云朵

当透明框的文本开始出现时，云朵出现，先是透明度从0-100%。

而比例开始时是60%，当透明度到了100%时，从60%->100%

雪花小圆点

当云朵动效完成后，雪花小圆点开始逐个出现。

Snowy文字效果

这里运用了蒙版运动，来打造Snowy文本逐渐出现的效果，注意Snowy不透明度也要变化。

三、导出方法

1.保存后，AE中合成>添加到渲染队列。

完成设置后，点渲染。

2.用PS打开渲染出来的.mov(文件>导入>视频帧到图层)。

3.Cmd+Shift+S 或者 文件>储存为Web可用格式。