AE操作实例-智能界面交互动画

Recommand
北京/UI设计师/5年前/3718浏览
AE操作实例-智能界面交互动画Recommand

AE操作实例-智能界面交互动画

今天米醋给大家打来了一款AE实操案例,智能界面交互动画,跟着米醋一步步进行学习吧!


我们先来看一下最终的动态效果图

undefined


点击视频即可观看


在软件PS中观察了解案例图层,如图所示。

undefined

打开软件AE,把【PSD】素材文件拽入到AE中,选择【合成-保持图层大小】-【可编辑图层样式到素材】,双击合文件观察图层,如图所示。

undefined


选择【状态栏】图层,在10F的【位置】打上一个关键帧,选择关键帧,添加【F9】缓动缓出,调整【曲线】,输入【文字内容】调整【填充色】,如图所示。


选择文字输入位置,选择【效果】-【文本】-【编号】,调整【编号】字体,如图所示。


修改项目视图中的编号参数,在1秒钟位置添加关键帧,调整【数值】为244.按【空格键】进行预览观察,如图所示。


在1秒关键帧修改【编号】参数的【填充颜色】,按【空格键】进行预览观察,如图所示。


选择【开关按钮】图层,添加【S】缩放在20f添加关键,后移打上关键,调整【缩放】为【110】,再后移添加关键帧,添加【F9】缓动换入,调整【编辑速率图标】曲线,如图所示。

undefined



双击【首页】,选择【状态栏】在10F打上关键帧,把【状态栏】移动至上方,添加【F9】缓动缓出,调整曲线,如图所示。


选择【大圆】在10F打上【缩放】关键帧,在开始关键帧【缩放】调整为【0%】,如图所示。


把【点光】选择【大圆】为【父级】,调整【点光】中心点位置为大圆中心,如图所示。


选择【点光】图层,添加【旋转】,在1秒钟添加一个关键帧,【旋转】参数调整为【1】,按【空格键】进行预览观察,如图所示。


选择【点光】图层,旋转添加【F9】缓动缓入,在3秒钟添加关键帧,修改【旋转】为【4】,按【空格键】进行预览观察,如图所示。

undefined


选择【tab】在10f添加【位置】关键帧,把【tab】移动至下方,把【开关】的父级设置为【tab】,添加【F9】缓入缓出,调整【曲线】,如图所示。


选择【数据信息】和【功能按钮】图层,添加【T】不透明度开始关键帧为【0%】,按【空格键】进行预览观察,如图所示。


选择【首页】图层,在1秒添加关键帧,调整【T】不透明度,如图所示。


双击进入【浮层】,把【滑动按钮】、【进度完成】、【进度】、【组1】设置父级为【背景】,在10F【P】位置添加一个关键帧,移动【背景】到下方,如图所示。


选择【背景】图层的【蒙版路径】,使用【钢笔工具】通过【锚点】,调整【背景】图层的形状,如图所示。

undefined


选择【首页】图层,调整关键帧位置,添加【U】模糊,【Ctrl+C】复制模糊第一帧,【Ctrl+V】粘贴到结束关键帧,如图所示。


添加【亮度和对比度】,调整关键帧位置,【Ctrl+C】复制亮度第一帧,【Ctrl+V】粘贴到结束关键帧,如图所示。


修改【高斯模糊】,调整【合成设置】,修改【持续时间】,添加素材【手机壳】,如图所示。


拖拽【空气净化器】到素材,【S】缩放图层,点击【效果】-【扭曲】-【边角定位】,通过【顶点】调整【工期净化器】的位置,如图所示。


选择【Ctrl+M】渲染图层,导出【avi】格式素材文件,打开PS软件,添加【avi】格式素材文件,【Ctrl+Shift+Atl+S】存储为Web所用格式保存为【GIF】文件,参数如图所示。

undefined


完成制作,最终效果如图所示。


最后完成的动画效果


undefined



好啦!今天就分享到这里!你学会了吗?!


回复【AE教程】获取全套AE动效视频课程

42
Report
|
64
Share
相关推荐
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
AI可视化动效设计合集
Homepage recommendation
AI机器 AI Machines
Homepage recommendation
相关收藏夹
app 小程序规范
app 小程序规范
app 小程序规范
app 小程序规范
作品收藏夹
动效
动效
动效
动效
作品收藏夹
设计
设计
设计
设计
作品收藏夹
设计知识
设计知识
设计知识
设计知识
作品收藏夹
设计文章
设计文章
设计文章
设计文章
作品收藏夹
UI界面设计学习
UI界面设计学习
UI界面设计学习
UI界面设计学习
作品收藏夹
大家都在看
Log in