http://www.c4dcn.com

AE视频特效教程:制作手机演示界面,真是太炫酷

AE视频特效教程:制作手机演示界面,真是太炫酷了

这是一个非常非常基础的动画教程,针对刚接触交互动画的新设计师。

设计1+1(www.sjoneone.com)专业设计师教程网,查看更多设计教程

辅导效果

AE视频特效教程:制作手机演示界面,真是太炫酷了

课前准备

你需要准备一个Ae或者principle制作的视频文件。

你需要一个用于iPhoneX样机的PSD源文件

AE视频特效教程:制作手机演示界面,真是太炫酷了

注意:iPhoneX文件至少需要两层:一个iPhoneX模型层和一个遮罩层(我们在使用mockup时通常需要替换自己的设计稿的层),图层格式可以转换为智能对象。

AE视频特效教程:制作手机演示界面,真是太炫酷了

开始教程。

第一步

导入视频文件和iPhoneX型号

注意:导入psd时,需要选择复合保持大小选项,这样所有层都不会合并。

AE视频特效教程:制作手机演示界面,真是太炫酷了

第二步

新建一个构图,根据自己的需要设置构图的名称、大小、时长、背景色。

AE视频特效教程:制作手机演示界面,真是太炫酷了

第三步

将课前准备好的两个文件拖到新的作文中,根据需要调整大小。

AE视频特效教程:制作手机演示界面,真是太炫酷了

第四步

选择视频图层,使用效果-扭曲-角点定位效果,将四个角点与屏幕的四个角点对齐。

AE视频特效教程:制作手机演示界面,真是太炫酷了

提示:圆角没有对齐。您可以将视频的边缘与遮罩的边缘对齐。

知识点:角点定位是我们把动态放入展示模型时最常用的效果之一。

第五步

方法一

将遮罩层移动到视频层的顶部,并在TrkMat列中单击“AlphaMaskMask”。绝配!

AE视频特效教程:制作手机演示界面,真是太炫酷了

提示:如果面板栏没有“TrkMat”,检查左下角的“转换控制”按钮是否点亮。

知识点:面膜面膜-TrkMat

Mask-TrkMat类似于ps中的切割蒙版,这个知识点可以用在:侧边栏的划线和划片效果,长页面的滚动效果等。通过对ps中切割蒙版可以做的效果举一反三,可以做类似的ae蒙版。

介绍简单maskmask-TrkMat的四个选项:

Alpha:显示上层的范围;

反转Alpha蒙版:不显示上层显示的范围;

亮度遮罩:显示上层的范围,根据上层的黑、白、灰决定显示程度,随灰度变化,白色完全显示,黑色完全不显示;

亮度反转遮罩:不显示上层的显示范围,根据上层的黑、白、灰决定显示程度。它随灰度变化,白色完全不显示,黑色完全显示;

下图中四种模式的比较:

AE视频特效教程:制作手机演示界面,真是太炫酷了

方法二(方法不是重点,主要讲知识点)

选择视频层-右键-新建预合成-选择“移动所有属性到新合成”

AE视频特效教程:制作手机演示界面,真是太炫酷了

为了讲这个知识点,我给自己挖了个坑。我发现直接在原图层蒙版就不对了。

所以有了以上操作,欢迎知道原因的朋友留言,教程继续。下图显示了出现的问题。

AE视频特效教程:制作手机演示界面,真是太炫酷了

用钢笔工具对照iPhonex的屏幕范围画出路径,完成蒙版,完美匹配。

AE视频特效教程:制作手机演示界面,真是太炫酷了

知识点:路径绘制蒙版-蒙版

与maskmask-TrkMat相比,通过路径绘制遮罩更加方便,易于自由控制。

介绍简单路径绘制蒙版的基本参数(绘制蒙版需要选择相应的图层)。

添加:在路径区域显示图像。

减法:不显示路径区域中的图像。

相交、变暗、变亮、差不常用。你自己试试。

反转:像ps一样反转

一些效果:

AE视频特效教程:制作手机演示界面,真是太炫酷了

遮罩路径:制作遮罩更改动画

遮罩羽化:模糊边缘,使过渡更加自然。

蒙版不透明度:调整蒙版的不透明度。

遮罩扩展:放大和缩小路径的区域。

使用遮罩路径变化的侧边栏动画;

AE视频特效教程:制作手机演示界面,真是太炫酷了

版权声明:本文原创自“UIDEKKO”,感谢“UIDEKKO”分享原创教程!

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。